botrun-horse 2.29.2 → 2.31.0

package/botrun-c/web/hooks/useClaudeModel.ts

@@ -0,0 +1,118 @@
+/**
+ * useClaudeModel - Claude 模型選擇 Hook
+ *
+ * 功能：
+ * - 從 localStorage 載入使用者偏好的模型
+ * - 提供切換模型的方法
+ * - 自動持久化到 localStorage
+ */
+import { useState, useEffect, useCallback } from 'react';
+
+// 模型類型定義（與後端 ClaudeModelId 一致）
+export type ClaudeModelId = 'claude-haiku-4-5' | 'claude-sonnet-4';
+
+// 模型資訊
+export interface ClaudeModelInfo {
+  id: ClaudeModelId;
+  name: string;
+  description: string;
+}
+
+// 可用模型列表
+export const CLAUDE_MODELS: ClaudeModelInfo[] = [
+  {
+    id: 'claude-haiku-4-5',
+    name: 'Haiku 4.5',
+    description: '快速回應，適合一般對話',
+  },
+  {
+    id: 'claude-sonnet-4',
+    name: 'Sonnet 4',
+    description: '更強推理，適合複雜任務',
+  },
+];
+
+// 預設模型
+export const DEFAULT_CLAUDE_MODEL: ClaudeModelId = 'claude-sonnet-4';
+
+// localStorage key
+const STORAGE_KEY = 'botrun-c:claude-model';
+
+/**
+ * 驗證模型 ID 是否有效
+ */
+function isValidModel(modelId: string): modelId is ClaudeModelId {
+  return CLAUDE_MODELS.some(m => m.id === modelId);
+}
+
+/**
+ * 從 localStorage 讀取模型設定
+ */
+function loadModelFromStorage(): ClaudeModelId {
+  if (typeof window === 'undefined') {
+    return DEFAULT_CLAUDE_MODEL;
+  }
+  try {
+    const saved = localStorage.getItem(STORAGE_KEY);
+    if (saved && isValidModel(saved)) {
+      return saved;
+    }
+  } catch (e) {
+    console.warn('[useClaudeModel] Failed to load from localStorage:', e);
+  }
+  return DEFAULT_CLAUDE_MODEL;
+}
+
+/**
+ * 儲存模型設定到 localStorage
+ */
+function saveModelToStorage(modelId: ClaudeModelId): void {
+  if (typeof window === 'undefined') return;
+  try {
+    localStorage.setItem(STORAGE_KEY, modelId);
+    console.log(`[useClaudeModel] Model saved: ${modelId}`);
+  } catch (e) {
+    console.warn('[useClaudeModel] Failed to save to localStorage:', e);
+  }
+}
+
+/**
+ * Claude 模型選擇 Hook
+ */
+export function useClaudeModel() {
+  const [currentModel, setCurrentModel] = useState<ClaudeModelId>(DEFAULT_CLAUDE_MODEL);
+  const [isLoaded, setIsLoaded] = useState(false);
+
+  // 初始化：從 localStorage 載入
+  useEffect(() => {
+    const savedModel = loadModelFromStorage();
+    setCurrentModel(savedModel);
+    setIsLoaded(true);
+    console.log(`[useClaudeModel] Initialized with model: ${savedModel}`);
+  }, []);
+
+  // 切換模型
+  const setModel = useCallback((modelId: ClaudeModelId) => {
+    if (!isValidModel(modelId)) {
+      console.warn(`[useClaudeModel] Invalid model ID: ${modelId}`);
+      return;
+    }
+    setCurrentModel(modelId);
+    saveModelToStorage(modelId);
+    console.log(`[useClaudeModel] Model switched to: ${modelId}`);
+  }, []);
+
+  // 取得模型資訊
+  const getModelInfo = useCallback((modelId?: ClaudeModelId): ClaudeModelInfo | undefined => {
+    const id = modelId || currentModel;
+    return CLAUDE_MODELS.find(m => m.id === id);
+  }, [currentModel]);
+
+  return {
+    currentModel,
+    setModel,
+    models: CLAUDE_MODELS,
+    getModelInfo,
+    isLoaded,
+  };
+}

package/botrun-c/web/hooks/useConversation.ts

@@ -0,0 +1,115 @@
+/**
+ * useConversation - 單一對話管理 Hook
+ */
+
+import { useState, useEffect, useCallback } from 'react';
+import { getApiUrl } from '@/lib/api-url';
+import type {
+  Conversation,
+  ConversationMessage,
+  ConversationDetailResponse,
+} from '@/types/conversation';
+
+export interface UseConversationReturn {
+  /** 對話資訊 */
+  conversation: Conversation | null;
+  /** 訊息列表 */
+  messages: ConversationMessage[];
+  /** 是否正在載入 */
+  isLoading: boolean;
+  /** 錯誤訊息 */
+  error: Error | null;
+  /** 重新載入對話 */
+  refetch: () => Promise<void>;
+  /** 清除對話（重設狀態） */
+  clear: () => void;
+}
+
+/**
+ * 單一對話管理 Hook
+ *
+ * @param authToken - Firebase ID Token
+ * @param conversationId - 對話 ID（為 null 時不載入）
+ * @param messageLimit - 最大訊息載入數量（預設 100）
+ */
+export function useConversation(
+  authToken?: string,
+  conversationId?: string | null,
+  messageLimit = 100
+): UseConversationReturn {
+  const [conversation, setConversation] = useState<Conversation | null>(null);
+  const [messages, setMessages] = useState<ConversationMessage[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const apiUrl = getApiUrl();
+
+  const getHeaders = useCallback(() => {
+    const headers: Record<string, string> = {
+      'Content-Type': 'application/json',
+    };
+    if (authToken) {
+      headers['Authorization'] = `Bearer ${authToken}`;
+    }
+    return headers;
+  }, [authToken]);
+
+  // 載入對話詳情
+  const refetch = useCallback(async () => {
+    if (!authToken || !conversationId) {
+      setConversation(null);
+      setMessages([]);
+      return;
+    }
+
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(
+        `${apiUrl}/api/conversations/${conversationId}?messageLimit=${messageLimit}`,
+        { headers: getHeaders() }
+      );
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.message || '無法載入對話');
+      }
+
+      const data: ConversationDetailResponse = await response.json();
+      setConversation(data.conversation);
+      setMessages(data.messages || []);
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error('未知錯誤');
+      setError(error);
+      console.error('[useConversation] Failed to fetch:', error);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, authToken, conversationId, getHeaders, messageLimit]);
+
+  // 清除對話
+  const clear = useCallback(() => {
+    setConversation(null);
+    setMessages([]);
+    setError(null);
+  }, []);
+
+  // 當 conversationId 變更時重新載入
+  useEffect(() => {
+    if (conversationId) {
+      refetch();
+    } else {
+      clear();
+    }
+  }, [conversationId, refetch, clear]);
+
+  return {
+    conversation,
+    messages,
+    isLoading,
+    error,
+    refetch,
+    clear,
+  };
+}

package/botrun-c/web/hooks/useConversations.ts

@@ -0,0 +1,235 @@
+/**
+ * useConversations - 對話列表管理 Hook
+ */
+
+import { useState, useEffect, useCallback } from 'react';
+import { getApiUrl } from '@/lib/api-url';
+import type {
+  Conversation,
+  ConversationsListResponse,
+  CreateConversationResponse,
+  UpdateConversationResponse,
+} from '@/types/conversation';
+
+export interface UseConversationsReturn {
+  /** 對話列表 */
+  conversations: Conversation[];
+  /** 對話總數 */
+  total: number;
+  /** 是否正在載入 */
+  isLoading: boolean;
+  /** 錯誤訊息 */
+  error: Error | null;
+  /** 重新載入對話列表 */
+  refetch: () => Promise<void>;
+  /** 建立新對話 */
+  createConversation: (sessionId?: string) => Promise<Conversation>;
+  /** 更新對話標題 */
+  updateTitle: (conversationId: string, title: string) => Promise<Conversation>;
+  /** 刪除對話 */
+  deleteConversation: (conversationId: string) => Promise<void>;
+}
+
+/**
+ * 對話列表管理 Hook
+ *
+ * @param authToken - Firebase ID Token
+ * @param limit - 最大載入數量（預設 20）
+ */
+export function useConversations(
+  authToken?: string,
+  limit = 20
+): UseConversationsReturn {
+  const [conversations, setConversations] = useState<Conversation[]>([]);
+  const [total, setTotal] = useState(0);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const apiUrl = getApiUrl();
+
+  const getHeaders = useCallback(() => {
+    const headers: Record<string, string> = {
+      'Content-Type': 'application/json',
+    };
+    if (authToken) {
+      headers['Authorization'] = `Bearer ${authToken}`;
+    }
+    return headers;
+  }, [authToken]);
+
+  // 取得對話列表
+  const refetch = useCallback(async () => {
+    if (!authToken) return;
+
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(
+        `${apiUrl}/api/conversations?limit=${limit}`,
+        { headers: getHeaders() }
+      );
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.message || '無法載入對話列表');
+      }
+
+      const data: ConversationsListResponse = await response.json();
+      setConversations(data.conversations || []);
+      setTotal(data.total || 0);
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error('未知錯誤');
+      setError(error);
+      console.error('[useConversations] Failed to fetch:', error);
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, authToken, getHeaders, limit]);
+
+  // 建立新對話
+  const createConversation = useCallback(
+    async (sessionId?: string): Promise<Conversation> => {
+      if (!authToken) {
+        throw new Error('請先登入');
+      }
+
+      setIsLoading(true);
+      setError(null);
+
+      try {
+        const response = await fetch(`${apiUrl}/api/conversations`, {
+          method: 'POST',
+          headers: getHeaders(),
+          body: JSON.stringify({ sessionId }),
+        });
+
+        if (!response.ok) {
+          const data = await response.json();
+          throw new Error(data.message || '無法建立對話');
+        }
+
+        const data: CreateConversationResponse = await response.json();
+        const newConversation = data.conversation;
+
+        // 更新本地狀態（新對話放在最前面）
+        setConversations((prev) => [newConversation, ...prev]);
+        setTotal((prev) => prev + 1);
+
+        return newConversation;
+      } catch (err) {
+        const error = err instanceof Error ? err : new Error('未知錯誤');
+        setError(error);
+        throw error;
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [apiUrl, authToken, getHeaders]
+  );
+
+  // 更新對話標題
+  const updateTitle = useCallback(
+    async (conversationId: string, title: string): Promise<Conversation> => {
+      if (!authToken) {
+        throw new Error('請先登入');
+      }
+
+      setIsLoading(true);
+      setError(null);
+
+      try {
+        const response = await fetch(
+          `${apiUrl}/api/conversations/${conversationId}`,
+          {
+            method: 'PATCH',
+            headers: getHeaders(),
+            body: JSON.stringify({ title }),
+          }
+        );
+
+        if (!response.ok) {
+          const data = await response.json();
+          throw new Error(data.message || '無法更新標題');
+        }
+
+        const data: UpdateConversationResponse = await response.json();
+        const updatedConversation = data.conversation;
+
+        // 更新本地狀態
+        setConversations((prev) =>
+          prev.map((c) =>
+            c.id === conversationId ? updatedConversation : c
+          )
+        );
+
+        return updatedConversation;
+      } catch (err) {
+        const error = err instanceof Error ? err : new Error('未知錯誤');
+        setError(error);
+        throw error;
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [apiUrl, authToken, getHeaders]
+  );
+
+  // 刪除對話
+  const deleteConversation = useCallback(
+    async (conversationId: string): Promise<void> => {
+      if (!authToken) {
+        throw new Error('請先登入');
+      }
+
+      setIsLoading(true);
+      setError(null);
+
+      try {
+        const response = await fetch(
+          `${apiUrl}/api/conversations/${conversationId}`,
+          {
+            method: 'DELETE',
+            headers: getHeaders(),
+          }
+        );
+
+        if (!response.ok) {
+          const data = await response.json();
+          throw new Error(data.message || '無法刪除對話');
+        }
+
+        // 更新本地狀態
+        setConversations((prev) =>
+          prev.filter((c) => c.id !== conversationId)
+        );
+        setTotal((prev) => Math.max(0, prev - 1));
+      } catch (err) {
+        const error = err instanceof Error ? err : new Error('未知錯誤');
+        setError(error);
+        throw error;
+      } finally {
+        setIsLoading(false);
+      }
+    },
+    [apiUrl, authToken, getHeaders]
+  );
+
+  // 初始載入
+  useEffect(() => {
+    if (authToken) {
+      refetch();
+    }
+  }, [authToken, refetch]);
+
+  return {
+    conversations,
+    total,
+    isLoading,
+    error,
+    refetch,
+    createConversation,
+    updateTitle,
+    deleteConversation,
+  };
+}

package/botrun-c/web/hooks/useGdriveFolders.ts

@@ -0,0 +1,199 @@
+/**
+ * useGdriveFolders - Google Drive 資料夾管理 Hook
+ */
+
+import { useState, useEffect, useCallback } from 'react';
+import { getApiUrl } from '@/lib/api-url';
+
+export interface GdriveFolder {
+  id: string;
+  url: string;
+  alias: string;
+  type: 'public' | 'service-account';
+  lastSync: string | null;
+  fileCount: number;
+  totalSize: string;
+  selected: boolean;
+  syncStatus: 'synced' | 'syncing' | 'error' | 'pending';
+  folderName: string;
+}
+
+export interface UseGdriveFoldersReturn {
+  folders: GdriveFolder[];
+  history: string[];
+  isLoading: boolean;
+  error: Error | null;
+  addFolder: (url: string, alias?: string, type?: 'public' | 'service-account') => Promise<void>;
+  removeFolder: (id: string) => Promise<void>;
+  updateFolder: (id: string, updates: Partial<GdriveFolder>) => Promise<void>;
+  toggleSelect: (id: string) => Promise<void>;
+  refetch: () => Promise<void>;
+}
+
+export function useGdriveFolders(authToken?: string): UseGdriveFoldersReturn {
+  const [folders, setFolders] = useState<GdriveFolder[]>([]);
+  const [history, setHistory] = useState<string[]>([]);
+  const [isLoading, setIsLoading] = useState(false);
+  const [error, setError] = useState<Error | null>(null);
+
+  const apiUrl = getApiUrl();
+
+  const getHeaders = useCallback(() => {
+    const headers: Record<string, string> = {
+      'Content-Type': 'application/json',
+    };
+    if (authToken) {
+      headers['Authorization'] = `Bearer ${authToken}`;
+    }
+    return headers;
+  }, [authToken]);
+
+  // 取得資料夾列表
+  const refetch = useCallback(async () => {
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(`${apiUrl}/api/gdrive/folders`, {
+        headers: getHeaders(),
+      });
+
+      if (!response.ok) {
+        throw new Error('Failed to fetch folders');
+      }
+
+      const data = await response.json();
+      setFolders(data.folders || []);
+      setHistory(data.history || []);
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error('Unknown error'));
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, getHeaders]);
+
+  // 新增資料夾
+  const addFolder = useCallback(async (
+    url: string,
+    alias?: string,
+    type: 'public' | 'service-account' = 'public'
+  ) => {
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(`${apiUrl}/api/gdrive/folders`, {
+        method: 'POST',
+        headers: getHeaders(),
+        body: JSON.stringify({ url, alias, type }),
+      });
+
+      const data = await response.json();
+
+      if (!response.ok) {
+        throw new Error(data.error || 'Failed to add folder');
+      }
+
+      // 更新本地狀態
+      if (data.folder) {
+        setFolders(prev => [...prev, data.folder]);
+      }
+
+      // 更新歷史
+      setHistory(prev => {
+        const filtered = prev.filter(h => h !== url);
+        return [url, ...filtered].slice(0, 10);
+      });
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error('Unknown error'));
+      throw err;
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, getHeaders]);
+
+  // 移除資料夾
+  const removeFolder = useCallback(async (id: string) => {
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(`${apiUrl}/api/gdrive/folders/${id}`, {
+        method: 'DELETE',
+        headers: getHeaders(),
+      });
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.error || 'Failed to remove folder');
+      }
+
+      // 更新本地狀態
+      setFolders(prev => prev.filter(f => f.id !== id));
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error('Unknown error'));
+      throw err;
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, getHeaders]);
+
+  // 更新資料夾
+  const updateFolder = useCallback(async (
+    id: string,
+    updates: Partial<GdriveFolder>
+  ) => {
+    setIsLoading(true);
+    setError(null);
+
+    try {
+      const response = await fetch(`${apiUrl}/api/gdrive/folders/${id}`, {
+        method: 'PUT',
+        headers: getHeaders(),
+        body: JSON.stringify(updates),
+      });
+
+      if (!response.ok) {
+        const data = await response.json();
+        throw new Error(data.error || 'Failed to update folder');
+      }
+
+      // 更新本地狀態
+      setFolders(prev => prev.map(f =>
+        f.id === id ? { ...f, ...updates } : f
+      ));
+    } catch (err) {
+      setError(err instanceof Error ? err : new Error('Unknown error'));
+      throw err;
+    } finally {
+      setIsLoading(false);
+    }
+  }, [apiUrl, getHeaders]);
+
+  // 切換選中狀態
+  const toggleSelect = useCallback(async (id: string) => {
+    const folder = folders.find(f => f.id === id);
+    if (folder) {
+      await updateFolder(id, { selected: !folder.selected });
+    }
+  }, [folders, updateFolder]);
+
+  // 初始載入
+  useEffect(() => {
+    if (authToken) {
+      refetch();
+    }
+  }, [authToken, refetch]);
+
+  return {
+    folders,
+    history,
+    isLoading,
+    error,
+    addFolder,
+    removeFolder,
+    updateFolder,
+    toggleSelect,
+    refetch,
+  };
+}