@lobehub/chat 1.33.4 → 1.34.0

package/src/store/chat/slices/thread/action.ts

@@ -0,0 +1,326 @@
+/* eslint-disable sort-keys-fix/sort-keys-fix, typescript-sort-keys/interface */
+// Disable the auto sort key eslint rule to make the code more logic and readable
+import isEqual from 'fast-deep-equal';
+import { SWRResponse, mutate } from 'swr';
+import { StateCreator } from 'zustand/vanilla';
+
+import { chainSummaryTitle } from '@/chains/summaryTitle';
+import { LOADING_FLAT, THREAD_DRAFT_ID } from '@/const/message';
+import { isServerMode } from '@/const/version';
+import { useClientDataSWR } from '@/libs/swr';
+import { chatService } from '@/services/chat';
+import { threadService } from '@/services/thread';
+import { threadSelectors } from '@/store/chat/selectors';
+import { ChatStore } from '@/store/chat/store';
+import { useSessionStore } from '@/store/session';
+import { useUserStore } from '@/store/user';
+import { systemAgentSelectors } from '@/store/user/selectors';
+import { ChatMessage, CreateMessageParams, SendThreadMessageParams } from '@/types/message';
+import { ThreadItem, ThreadType } from '@/types/topic';
+import { merge } from '@/utils/merge';
+import { setNamespace } from '@/utils/storeDebug';
+
+import { ThreadDispatch, threadReducer } from './reducer';
+
+const n = setNamespace('thd');
+const SWR_USE_FETCH_THREADS = 'SWR_USE_FETCH_THREADS';
+
+export interface ChatThreadAction {
+  // update
+  updateThreadInputMessage: (message: string) => void;
+  refreshThreads: () => Promise<void>;
+  /**
+   * Sends a new thread message to the AI chat system
+   */
+  sendThreadMessage: (params: SendThreadMessageParams) => Promise<void>;
+  resendThreadMessage: (messageId: string) => Promise<void>;
+  delAndResendThreadMessage: (messageId: string) => Promise<void>;
+  createThread: (params: {
+    message: CreateMessageParams;
+    sourceMessageId: string;
+    topicId: string;
+    type: ThreadType;
+  }) => Promise<{ threadId: string; messageId: string }>;
+  openThreadCreator: (messageId: string) => void;
+  openThreadInPortal: (threadId: string, sourceMessageId: string) => void;
+  closeThreadPortal: () => void;
+  useFetchThreads: (topicId?: string) => SWRResponse<ThreadItem[]>;
+  summaryThreadTitle: (threadId: string, messages: ChatMessage[]) => Promise<void>;
+  updateThreadTitle: (id: string, title: string) => Promise<void>;
+  removeThread: (id: string) => Promise<void>;
+  switchThread: (id: string) => void;
+
+  internal_updateThreadTitleInSummary: (id: string, title: string) => void;
+  internal_updateThreadLoading: (id: string, loading: boolean) => void;
+  internal_updateThread: (id: string, data: Partial<ThreadItem>) => Promise<void>;
+  internal_dispatchThread: (payload: ThreadDispatch, action?: any) => void;
+}
+
+export const chatThreadMessage: StateCreator<
+  ChatStore,
+  [['zustand/devtools', never]],
+  [],
+  ChatThreadAction
+> = (set, get) => ({
+  updateThreadInputMessage: (message) => {
+    if (isEqual(message, get().threadInputMessage)) return;
+
+    set({ threadInputMessage: message }, false, n(`updateThreadInputMessage`, message));
+  },
+
+  openThreadCreator: (messageId) => {
+    set(
+      { threadStartMessageId: messageId, portalThreadId: undefined, startToForkThread: true },
+      false,
+      'openThreadCreator',
+    );
+    get().togglePortal(true);
+  },
+  openThreadInPortal: (threadId, sourceMessageId) => {
+    set(
+      { portalThreadId: threadId, threadStartMessageId: sourceMessageId, startToForkThread: false },
+      false,
+      'openThreadInPortal',
+    );
+    get().togglePortal(true);
+  },
+
+  closeThreadPortal: () => {
+    set(
+      { threadStartMessageId: undefined, portalThreadId: undefined, startToForkThread: undefined },
+      false,
+      'closeThreadPortal',
+    );
+    get().togglePortal(false);
+  },
+  sendThreadMessage: async ({ message }) => {
+    const {
+      internal_coreProcessMessage,
+      activeTopicId,
+      activeId,
+      threadStartMessageId,
+      newThreadMode,
+      portalThreadId,
+    } = get();
+    if (!activeId || !activeTopicId) return;
+
+    // if message is empty or no files, then stop
+    if (!message) return;
+
+    set({ isCreatingThreadMessage: true }, false, n('creatingThreadMessage/start'));
+
+    const newMessage: CreateMessageParams = {
+      content: message,
+      // if message has attached with files, then add files to message and the agent
+      // files: fileIdList,
+      role: 'user',
+      sessionId: activeId,
+      // if there is activeTopicId，then add topicId to message
+      topicId: activeTopicId,
+      threadId: portalThreadId,
+    };
+
+    let parentMessageId: string | undefined = undefined;
+    let tempMessageId: string | undefined = undefined;
+
+    // if there is no portalThreadId, then create a thread and then append message
+    if (!portalThreadId) {
+      if (!threadStartMessageId) return;
+      // we need to create a temp message for optimistic update
+      tempMessageId = get().internal_createTmpMessage({
+        ...newMessage,
+        threadId: THREAD_DRAFT_ID,
+      });
+      get().internal_toggleMessageLoading(true, tempMessageId);
+
+      const { threadId, messageId } = await get().createThread({
+        message: newMessage,
+        sourceMessageId: threadStartMessageId,
+        topicId: activeTopicId,
+        type: newThreadMode,
+      });
+
+      parentMessageId = messageId;
+
+      // mark the portal in thread mode
+      await get().refreshThreads();
+      await get().refreshMessages();
+
+      get().openThreadInPortal(threadId, threadStartMessageId);
+    } else {
+      // if there is a thread, just append message
+      // we need to create a temp message for optimistic update
+      tempMessageId = get().internal_createTmpMessage(newMessage);
+      get().internal_toggleMessageLoading(true, tempMessageId);
+
+      parentMessageId = await get().internal_createMessage(newMessage, { tempMessageId });
+    }
+
+    get().internal_toggleMessageLoading(false, tempMessageId);
+
+    //  update assistant update to make it rerank
+    useSessionStore.getState().triggerSessionUpdate(get().activeId);
+
+    // Get the current messages to generate AI response
+    const messages = threadSelectors.portalAIChats(get());
+
+    await internal_coreProcessMessage(messages, parentMessageId, {
+      ragQuery: get().internal_shouldUseRAG() ? message : undefined,
+      threadId: get().portalThreadId,
+      inPortalThread: true,
+    });
+
+    set({ isCreatingThreadMessage: false }, false, n('creatingThreadMessage/stop'));
+
+    // 说明是在新建 thread，需要自动总结标题
+    if (!portalThreadId) {
+      const portalThread = threadSelectors.currentPortalThread(get());
+
+      if (!portalThread) return;
+
+      const chats = threadSelectors.portalAIChats(get());
+      await get().summaryThreadTitle(portalThread.id, chats);
+    }
+  },
+  resendThreadMessage: async (messageId) => {
+    const chats = threadSelectors.portalAIChats(get());
+
+    await get().internal_resendMessage(messageId, {
+      messages: chats,
+      threadId: get().portalThreadId,
+      inPortalThread: true,
+    });
+  },
+  delAndResendThreadMessage: async (id) => {
+    get().resendThreadMessage(id);
+    get().deleteMessage(id);
+  },
+  createThread: async ({ message, sourceMessageId, topicId, type }) => {
+    set({ isCreatingThread: true }, false, n('creatingThread/start'));
+
+    const data = await threadService.createThreadWithMessage({
+      topicId,
+      sourceMessageId,
+      type,
+      message,
+    });
+    set({ isCreatingThread: false }, false, n('creatingThread/end'));
+
+    return data;
+  },
+
+  useFetchThreads: (topicId) =>
+    useClientDataSWR<ThreadItem[]>(
+      !!topicId && isServerMode ? [SWR_USE_FETCH_THREADS, topicId] : null,
+      async ([, topicId]: [string, string]) => threadService.getThreads(topicId),
+      {
+        suspense: true,
+        fallbackData: [],
+        onSuccess: (threads) => {
+          const nextMap = { ...get().threadMaps, [topicId!]: threads };
+
+          // no need to update map if the topics have been init and the map is the same
+          if (get().topicsInit && isEqual(nextMap, get().topicMaps)) return;
+
+          set(
+            { threadMaps: nextMap, threadsInit: true },
+            false,
+            n('useFetchThreads(success)', { topicId }),
+          );
+        },
+      },
+    ),
+
+  refreshThreads: async () => {
+    const topicId = get().activeTopicId;
+    if (!topicId) return;
+
+    return mutate([SWR_USE_FETCH_THREADS, topicId]);
+  },
+  removeThread: async (id) => {
+    await threadService.removeThread(id);
+    await get().refreshThreads();
+
+    if (get().activeThreadId === id) {
+      set({ activeThreadId: undefined });
+    }
+  },
+  switchThread: async (id) => {
+    set({ activeThreadId: id }, false, n('toggleTopic'));
+  },
+  updateThreadTitle: async (id, title) => {
+    await get().internal_updateThread(id, { title });
+  },
+
+  summaryThreadTitle: async (threadId, messages) => {
+    const { internal_updateThreadTitleInSummary, internal_updateThreadLoading } = get();
+    const portalThread = threadSelectors.currentPortalThread(get());
+    if (!portalThread) return;
+
+    internal_updateThreadTitleInSummary(threadId, LOADING_FLAT);
+
+    let output = '';
+    const threadConfig = systemAgentSelectors.thread(useUserStore.getState());
+
+    await chatService.fetchPresetTaskResult({
+      onError: () => {
+        internal_updateThreadTitleInSummary(threadId, portalThread.title);
+      },
+      onFinish: async (text) => {
+        await get().internal_updateThread(threadId, { title: text });
+      },
+      onLoadingChange: (loading) => {
+        internal_updateThreadLoading(threadId, loading);
+      },
+      onMessageHandle: (chunk) => {
+        switch (chunk.type) {
+          case 'text': {
+            output += chunk.text;
+          }
+        }
+
+        internal_updateThreadTitleInSummary(threadId, output);
+      },
+      params: merge(threadConfig, chainSummaryTitle(messages)),
+    });
+  },
+
+  // Internal process method of the topics
+  internal_updateThreadTitleInSummary: (id, title) => {
+    get().internal_dispatchThread(
+      { type: 'updateThread', id, value: { title } },
+      'updateThreadTitleInSummary',
+    );
+  },
+
+  internal_updateThreadLoading: (id, loading) => {
+    set(
+      (state) => {
+        if (loading) return { threadLoadingIds: [...state.threadLoadingIds, id] };
+
+        return { threadLoadingIds: state.threadLoadingIds.filter((i) => i !== id) };
+      },
+      false,
+      n('updateThreadLoading'),
+    );
+  },
+
+  internal_updateThread: async (id, data) => {
+    get().internal_dispatchThread({ type: 'updateThread', id, value: data });
+
+    get().internal_updateThreadLoading(id, true);
+    await threadService.updateThread(id, data);
+    await get().refreshThreads();
+    get().internal_updateThreadLoading(id, false);
+  },
+
+  internal_dispatchThread: (payload, action) => {
+    const nextThreads = threadReducer(threadSelectors.currentTopicThreads(get()), payload);
+    const nextMap = { ...get().threadMaps, [get().activeTopicId!]: nextThreads };
+
+    // no need to update map if is the same
+    if (isEqual(nextMap, get().threadMaps)) return;
+
+    set({ threadMaps: nextMap }, false, action ?? n(`dispatchThread/${payload.type}`));
+  },
+});

package/src/store/chat/slices/thread/initialState.ts

@@ -0,0 +1,34 @@
+import { ThreadItem, ThreadType } from '@/types/topic';
+
+export interface ChatThreadState {
+  activeThreadId?: string;
+  /**
+   * is creating thread with service call
+   */
+  isCreatingThread?: boolean;
+  isCreatingThreadMessage?: boolean;
+  newThreadMode: ThreadType;
+  /**
+   * if true it mean to start to fork a new thread
+   */
+  startToForkThread?: boolean;
+
+  threadInputMessage: string;
+  threadLoadingIds: string[];
+  threadMaps: Record<string, ThreadItem[]>;
+  threadRenamingId?: string;
+  /**
+   * when open thread creator, set the message id to it
+   */
+  threadStartMessageId?: string;
+  threadsInit?: boolean;
+}
+
+export const initialThreadState: ChatThreadState = {
+  isCreatingThread: false,
+  newThreadMode: ThreadType.Continuation,
+  threadInputMessage: '',
+  threadLoadingIds: [],
+  threadMaps: {},
+  threadsInit: false,
+};

package/src/store/chat/slices/thread/reducer.ts

@@ -0,0 +1,48 @@
+import { produce } from 'immer';
+
+import { ThreadItem } from '@/types/topic';
+
+interface UpdateThreadAction {
+  id: string;
+  type: 'updateThread';
+  value: Partial<ThreadItem>;
+}
+
+interface DeleteThreadAction {
+  id: string;
+  type: 'deleteThread';
+}
+
+export type ThreadDispatch = UpdateThreadAction | DeleteThreadAction;
+
+export const threadReducer = (state: ThreadItem[] = [], payload: ThreadDispatch): ThreadItem[] => {
+  switch (payload.type) {
+    case 'updateThread': {
+      return produce(state, (draftState) => {
+        const { value, id } = payload;
+        const threadIndex = draftState.findIndex((thread) => thread.id === id);
+
+        if (threadIndex !== -1) {
+          draftState[threadIndex] = {
+            ...draftState[threadIndex],
+            ...value,
+            updatedAt: new Date(),
+          };
+        }
+      });
+    }
+
+    case 'deleteThread': {
+      return produce(state, (draftState) => {
+        const threadIndex = draftState.findIndex((thread) => thread.id === payload.id);
+        if (threadIndex !== -1) {
+          draftState.splice(threadIndex, 1);
+        }
+      });
+    }
+
+    default: {
+      return state;
+    }
+  }
+};

package/src/store/chat/slices/thread/selectors/index.ts

@@ -0,0 +1,202 @@
+import { THREAD_DRAFT_ID } from '@/const/message';
+import { useAgentStore } from '@/store/agent';
+import { agentSelectors } from '@/store/agent/selectors';
+import type { ChatStoreState } from '@/store/chat';
+import { chatHelpers } from '@/store/chat/helpers';
+import { ChatMessage } from '@/types/message';
+import { ThreadItem } from '@/types/topic';
+
+import { chatSelectors } from '../../message/selectors';
+import { genMessage } from './util';
+
+const currentTopicThreads = (s: ChatStoreState) => {
+  if (!s.activeTopicId) return [];
+
+  return s.threadMaps[s.activeTopicId] || [];
+};
+
+const currentPortalThread = (s: ChatStoreState): ThreadItem | undefined => {
+  if (!s.portalThreadId) return undefined;
+
+  const threads = currentTopicThreads(s);
+
+  return threads.find((t) => t.id === s.portalThreadId);
+};
+
+const threadStartMessageId = (s: ChatStoreState) => s.threadStartMessageId;
+
+const threadSourceMessageId = (s: ChatStoreState) => {
+  if (s.startToForkThread) return threadStartMessageId(s);
+
+  const portalThread = currentPortalThread(s);
+  return portalThread?.sourceMessageId;
+};
+
+const getTheadParentMessages = (s: ChatStoreState, data: ChatMessage[]) => {
+  if (s.startToForkThread) {
+    const startMessageId = threadStartMessageId(s)!;
+
+    // 存在 threadId 的消息是子消息，在创建付消息时需要忽略
+    const messages = data.filter((m) => !m.threadId);
+    return genMessage(messages, startMessageId, s.newThreadMode);
+  }
+
+  const portalThread = currentPortalThread(s);
+  return genMessage(data, portalThread?.sourceMessageId, portalThread?.type);
+};
+
+// ======= Portal Thread Display Chats ======= //
+// =========================================== //
+
+/**
+ * 获取当前 thread 的父级消息
+ */
+const portalDisplayParentMessages = (s: ChatStoreState): ChatMessage[] => {
+  const data = chatSelectors.activeBaseChatsWithoutTool(s);
+
+  return getTheadParentMessages(s, data);
+};
+
+/**
+ * these messages are the messages that are in the thread
+ *
+ */
+const portalDisplayChildChatsByThreadId =
+  (id?: string) =>
+  (s: ChatStoreState): ChatMessage[] => {
+    // skip tool message
+    const data = chatSelectors.activeBaseChatsWithoutTool(s);
+
+    return data.filter((m) => !!id && m.threadId === id);
+  };
+
+const portalDisplayChats = (s: ChatStoreState) => {
+  const parentMessages = portalDisplayParentMessages(s);
+  const afterMessages = portalDisplayChildChatsByThreadId(s.portalThreadId)(s);
+  // use for optimistic update
+  const draftMessage = chatSelectors.activeBaseChats(s).find((m) => m.threadId === THREAD_DRAFT_ID);
+
+  return [...parentMessages, draftMessage, ...afterMessages].filter(Boolean) as ChatMessage[];
+};
+
+const portalDisplayChatsLength = (s: ChatStoreState) => {
+  // history length include a thread divider
+  return portalDisplayChats(s).length;
+};
+const portalDisplayChatsString = (s: ChatStoreState) => {
+  const messages = portalDisplayChats(s);
+
+  return messages.map((m) => m.content).join('');
+};
+
+const portalDisplayChatIDs = (s: ChatStoreState): string[] =>
+  portalDisplayChats(s).map((i) => i.id);
+
+// ========= Portal Thread AI Chats ========= //
+// ========================================== //
+
+const portalAIParentMessages = (s: ChatStoreState): ChatMessage[] => {
+  const data = chatSelectors.activeBaseChats(s);
+
+  return getTheadParentMessages(s, data);
+};
+
+const portalAIChildChatsByThreadId =
+  (id?: string) =>
+  (s: ChatStoreState): ChatMessage[] => {
+    // skip tool message
+    const data = chatSelectors.activeBaseChats(s);
+
+    return data.filter((m) => !!id && m.threadId === id);
+  };
+
+const portalAIChats = (s: ChatStoreState) => {
+  const parentMessages = portalAIParentMessages(s);
+  const afterMessages = portalAIChildChatsByThreadId(s.portalThreadId)(s);
+
+  return [...parentMessages, ...afterMessages].filter(Boolean) as ChatMessage[];
+};
+
+const portalAIChatsWithHistoryConfig = (s: ChatStoreState) => {
+  const parentMessages = portalAIParentMessages(s);
+  const afterMessages = portalAIChildChatsByThreadId(s.portalThreadId)(s);
+
+  const messages = [...parentMessages, ...afterMessages].filter(Boolean) as ChatMessage[];
+
+  const config = agentSelectors.currentAgentChatConfig(useAgentStore.getState());
+
+  return chatHelpers.getSlicedMessagesWithConfig(messages, config);
+};
+
+const threadSourceMessageIndex = (s: ChatStoreState) => {
+  const theadMessageId = threadSourceMessageId(s);
+  const data = portalDisplayChats(s);
+
+  return !theadMessageId ? -1 : data.findIndex((d) => d.id === theadMessageId);
+};
+const getThreadsByTopic = (topicId?: string) => (s: ChatStoreState) => {
+  if (!topicId) return;
+
+  return s.threadMaps[topicId];
+};
+
+const getFirstThreadBySourceMsgId = (id: string) => (s: ChatStoreState) => {
+  const threads = currentTopicThreads(s);
+
+  return threads.find((t) => t.sourceMessageId === id);
+};
+
+const getThreadsBySourceMsgId = (id: string) => (s: ChatStoreState) => {
+  const threads = currentTopicThreads(s);
+
+  return threads.filter((t) => t.sourceMessageId === id);
+};
+
+const hasThreadBySourceMsgId = (id: string) => (s: ChatStoreState) => {
+  const threads = currentTopicThreads(s);
+
+  return threads.some((t) => t.sourceMessageId === id);
+};
+
+const isThreadAIGenerating = (s: ChatStoreState) =>
+  s.chatLoadingIds.some((id) => portalDisplayChatIDs(s).includes(id));
+
+const isInRAGFlow = (s: ChatStoreState) =>
+  s.messageRAGLoadingIds.some((id) => portalDisplayChatIDs(s).includes(id));
+const isCreatingMessage = (s: ChatStoreState) => s.isCreatingThreadMessage;
+const isHasMessageLoading = (s: ChatStoreState) =>
+  s.messageLoadingIds.some((id) => portalDisplayChatIDs(s).includes(id));
+
+/**
+ * this function is used to determine whether the send button should be disabled
+ */
+const isSendButtonDisabledByMessage = (s: ChatStoreState) =>
+  // 1. when there is message loading
+  isHasMessageLoading(s) ||
+  // 2. when is creating the topic
+  s.isCreatingThread ||
+  // 3. when is creating the message
+  isCreatingMessage(s) ||
+  // 4. when the message is in RAG flow
+  isInRAGFlow(s);
+
+export const threadSelectors = {
+  currentPortalThread,
+  currentTopicThreads,
+  getFirstThreadBySourceMsgId,
+  getThreadsBySourceMsgId,
+  getThreadsByTopic,
+  hasThreadBySourceMsgId,
+  isSendButtonDisabledByMessage,
+  isThreadAIGenerating,
+  portalAIChats,
+  portalAIChatsWithHistoryConfig,
+  portalDisplayChatIDs,
+  portalDisplayChats,
+  portalDisplayChatsLength,
+  portalDisplayChatsString,
+  portalDisplayChildChatsByThreadId,
+  threadSourceMessageId,
+  threadSourceMessageIndex,
+  threadStartMessageId,
+};

package/src/store/chat/slices/thread/selectors/util.ts

@@ -0,0 +1,22 @@
+import { ChatMessage } from '@/types/message';
+import { ThreadType } from '@/types/topic';
+
+export const genMessage = (
+  messages: ChatMessage[],
+  startMessageId: string | undefined,
+  threadMode?: ThreadType,
+) => {
+  if (!startMessageId) return [];
+
+  // 如果是独立话题模式，则只显示话题开始消息
+  if (threadMode === ThreadType.Standalone) {
+    return messages.filter((m) => m.id === startMessageId);
+  }
+
+  // 如果是连续模式下，那么只显示话题开始消息和话题分割线
+  const targetIndex = messages.findIndex((item) => item.id === startMessageId);
+
+  if (targetIndex < 0) return [];
+
+  return messages.slice(0, targetIndex + 1);
+};

package/src/store/chat/slices/topic/action.ts

@@ -223,7 +223,11 @@ export const chatTopic: StateCreator<
       },
     ),
   switchTopic: async (id, skipRefreshMessage) => {
-    set({ activeTopicId: !id ? (null as any) : id }, false, n('toggleTopic'));
+    set(
+      { activeTopicId: !id ? (null as any) : id, activeThreadId: undefined },
+      false,
+      n('toggleTopic'),
+    );
 
     if (skipRefreshMessage) return;
     await get().refreshMessages();

package/src/store/chat/store.ts

@@ -13,11 +13,13 @@ import { ChatMessageAction, chatMessage } from './slices/message/action';
 import { ChatPluginAction, chatPlugin } from './slices/plugin/action';
 import { ShareAction, chatShare } from './slices/share/action';
 import { ChatTopicAction, chatTopic } from './slices/topic/action';
-import { chatAiChat, ChatAIChatAction } from './slices/aiChat/actions';
-import { chatTTS, ChatTTSAction } from './slices/tts/action';
+import { ChatAIChatAction, chatAiChat } from './slices/aiChat/actions';
+import { ChatTTSAction, chatTTS } from './slices/tts/action';
+import { ChatThreadAction, chatThreadMessage } from './slices/thread/action';
 
 export interface ChatStoreAction
   extends ChatMessageAction,
+    ChatThreadAction,
     ChatAIChatAction,
     ChatTopicAction,
     ShareAction,
@@ -35,6 +37,7 @@ const createStore: StateCreator<ChatStore, [['zustand/devtools', never]]> = (...
   ...initialState,
 
   ...chatMessage(...params),
+  ...chatThreadMessage(...params),
   ...chatAiChat(...params),
   ...chatTopic(...params),
   ...chatShare(...params),