@lobehub/chat 1.2.5 → 1.2.7

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

@@ -2,7 +2,7 @@ import isEqual from 'fast-deep-equal';
 import { produce } from 'immer';
 
 import { CreateMessageParams } from '@/services/message';
-import { ChatMessage, ChatPluginPayload } from '@/types/message';
+import { ChatMessage, ChatPluginPayload, ChatToolPayload } from '@/types/message';
 import { merge } from '@/utils/merge';
 
 interface UpdateMessages {
@@ -16,11 +16,17 @@ interface CreateMessage {
   type: 'createMessage';
   value: CreateMessageParams;
 }
+
 interface DeleteMessage {
   id: string;
   type: 'deleteMessage';
 }
 
+interface DeleteMessages {
+  ids: string[];
+  type: 'deleteMessages';
+}
+
 interface UpdatePluginState {
   id: string;
   key: string;
@@ -41,6 +47,17 @@ interface UpdateMessageTools {
   value: Partial<ChatPluginPayload>;
 }
 
+interface AddMessageTool {
+  id: string;
+  type: 'addMessageTool';
+  value: ChatToolPayload;
+}
+interface DeleteMessageTool {
+  id: string;
+  tool_call_id: string;
+  type: 'deleteMessageTool';
+}
+
 interface UpdateMessageExtra {
   id: string;
   key: string;
@@ -55,7 +72,10 @@ export type MessageDispatch =
   | UpdateMessageExtra
   | DeleteMessage
   | UpdateMessagePlugin
-  | UpdateMessageTools;
+  | UpdateMessageTools
+  | AddMessageTool
+  | DeleteMessageTool
+  | DeleteMessages;
 
 export const messagesReducer = (state: ChatMessage[], payload: MessageDispatch): ChatMessage[] => {
   switch (payload.type) {
@@ -116,6 +136,37 @@ export const messagesReducer = (state: ChatMessage[], payload: MessageDispatch):
       });
     }
 
+    case 'addMessageTool': {
+      return produce(state, (draftState) => {
+        const { id, value } = payload;
+        const message = draftState.find((i) => i.id === id);
+        if (!message || message.role !== 'assistant') return;
+
+        if (!message.tools) {
+          message.tools = [value];
+        } else {
+          const index = message.tools.findIndex((tool) => tool.id === value.id);
+
+          if (index > 0) return;
+          message.tools.push(value);
+        }
+
+        message.updatedAt = Date.now();
+      });
+    }
+
+    case 'deleteMessageTool': {
+      return produce(state, (draftState) => {
+        const { id, tool_call_id } = payload;
+        const message = draftState.find((i) => i.id === id);
+        if (!message || message.role !== 'assistant' || !message.tools) return;
+
+        message.tools = message.tools.filter((tool) => tool.id !== tool_call_id);
+
+        message.updatedAt = Date.now();
+      });
+    }
+
     case 'updateMessageTools': {
       return produce(state, (draftState) => {
         const { id, value, tool_call_id } = payload;
@@ -147,6 +198,15 @@ export const messagesReducer = (state: ChatMessage[], payload: MessageDispatch):
         if (index >= 0) draft.splice(index, 1);
       });
     }
+    case 'deleteMessages': {
+      return produce(state, (draft) => {
+        const { ids } = payload;
+
+        return draft.filter((item) => {
+          return !ids.includes(item.id);
+        });
+      });
+    }
     default: {
       throw new Error('暂未实现的 type，请检查 reducer');
     }

package/src/store/chat/slices/plugin/action.test.ts

@@ -964,4 +964,46 @@ describe('ChatPluginAction', () => {
       expect(result.current.refreshMessages).toHaveBeenCalled();
     });
   });
+
+  describe('internal_addToolToAssistantMessage', () => {
+    it('should add too to assistant messages', async () => {
+      const { result } = renderHook(() => useChatStore());
+
+      const messageId = 'message-id';
+      const toolCallId = 'tool-call-id';
+      const identifier = 'plugin';
+
+      const refreshToUpdateMessageToolsSpy = vi.spyOn(
+        result.current,
+        'internal_refreshToUpdateMessageTools',
+      );
+
+      const assistantMessage = {
+        id: messageId,
+        role: 'assistant',
+        content: 'Assistant content',
+        tools: [{ identifier: identifier, arguments: '{"oldKey":"oldValue"}', id: toolCallId }],
+      } as ChatMessage;
+
+      act(() => {
+        useChatStore.setState({
+          activeId: 'anbccfdd',
+          messagesMap: { [messageMapKey('anbccfdd')]: [assistantMessage] },
+          refreshMessages: vi.fn(),
+        });
+      });
+
+      await act(async () => {
+        await result.current.internal_addToolToAssistantMessage(messageId, {
+          identifier,
+          arguments: '{"oldKey":"oldValue"}',
+          id: 'newId',
+          apiName: 'test',
+          type: 'default',
+        });
+      });
+
+      expect(refreshToUpdateMessageToolsSpy).toHaveBeenCalledWith(messageId);
+    });
+  });
 });

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

@@ -43,6 +43,13 @@ export interface ChatPluginAction {
   updatePluginState: (id: string, value: any) => Promise<void>;
   updatePluginArguments: <T = any>(id: string, value: T) => Promise<void>;
 
+  internal_addToolToAssistantMessage: (id: string, tool: ChatToolPayload) => Promise<void>;
+  internal_removeToolToAssistantMessage: (id: string, tool_call_id?: string) => Promise<void>;
+  /**
+   * use the optimistic update value to update the message tools to database
+   */
+  internal_refreshToUpdateMessageTools: (id: string) => Promise<void>;
+
   internal_callPluginApi: (id: string, payload: ChatToolPayload) => Promise<string | undefined>;
   internal_invokeDifferentTypePlugin: (id: string, payload: ChatToolPayload) => Promise<any>;
   internal_togglePluginApiCalling: (
@@ -281,6 +288,45 @@ export const chatPlugin: StateCreator<
     await refreshMessages();
   },
 
+  internal_addToolToAssistantMessage: async (id, tool) => {
+    const assistantMessage = chatSelectors.getMessageById(id)(get());
+    if (!assistantMessage) return;
+
+    const { internal_dispatchMessage, internal_refreshToUpdateMessageTools } = get();
+    internal_dispatchMessage({
+      type: 'addMessageTool',
+      value: tool,
+      id: assistantMessage.id,
+    });
+
+    await internal_refreshToUpdateMessageTools(id);
+  },
+
+  internal_removeToolToAssistantMessage: async (id, tool_call_id) => {
+    const message = chatSelectors.getMessageById(id)(get());
+    if (!message || !tool_call_id) return;
+
+    const { internal_dispatchMessage, internal_refreshToUpdateMessageTools } = get();
+
+    // optimistic update
+    internal_dispatchMessage({ type: 'deleteMessageTool', tool_call_id, id: message.id });
+
+    // update the message tools
+    await internal_refreshToUpdateMessageTools(id);
+  },
+  internal_refreshToUpdateMessageTools: async (id) => {
+    const message = chatSelectors.getMessageById(id)(get());
+    if (!message || !message.tools) return;
+
+    const { internal_toggleMessageLoading, refreshMessages } = get();
+
+    internal_toggleMessageLoading(true, id);
+    await messageService.updateMessage(id, { tools: message.tools });
+    internal_toggleMessageLoading(false, id);
+
+    await refreshMessages();
+  },
+
   internal_callPluginApi: async (id, payload) => {
     const { internal_updateMessageContent, refreshMessages, internal_togglePluginApiCalling } =
       get();

package/src/store/chat/slices/portal/action.test.ts

@@ -48,7 +48,7 @@ describe('chatDockSlice', () => {
       const { result } = renderHook(() => useChatStore());
 
       act(() => {
-        result.current.toggleDock(true);
+        result.current.togglePortal(true);
       });
 
       expect(result.current.showPortal).toBe(true);
@@ -72,13 +72,13 @@ describe('chatDockSlice', () => {
       expect(result.current.showPortal).toBe(false);
 
       act(() => {
-        result.current.toggleDock();
+        result.current.togglePortal();
       });
 
       expect(result.current.showPortal).toBe(true);
 
       act(() => {
-        result.current.toggleDock();
+        result.current.togglePortal();
       });
 
       expect(result.current.showPortal).toBe(false);
@@ -88,19 +88,19 @@ describe('chatDockSlice', () => {
       const { result } = renderHook(() => useChatStore());
 
       act(() => {
-        result.current.toggleDock(true);
+        result.current.togglePortal(true);
       });
 
       expect(result.current.showPortal).toBe(true);
 
       act(() => {
-        result.current.toggleDock(false);
+        result.current.togglePortal(false);
       });
 
       expect(result.current.showPortal).toBe(false);
 
       act(() => {
-        result.current.toggleDock(true);
+        result.current.togglePortal(true);
       });
 
       expect(result.current.showPortal).toBe(true);

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

@@ -5,7 +5,7 @@ import { ChatStore } from '@/store/chat/store';
 export interface ChatPortalAction {
   closeToolUI: () => void;
   openToolUI: (messageId: string, identifier: string) => void;
-  toggleDock: (open?: boolean) => void;
+  togglePortal: (open?: boolean) => void;
 }
 
 export const chatPortalSlice: StateCreator<
@@ -19,12 +19,12 @@ export const chatPortalSlice: StateCreator<
   },
   openToolUI: (id, identifier) => {
     if (!get().showPortal) {
-      get().toggleDock(true);
+      get().togglePortal(true);
     }
 
     set({ portalToolMessage: { id, identifier } }, false, 'openToolUI');
   },
-  toggleDock: (open) => {
+  togglePortal: (open) => {
     const showInspector = open === undefined ? !get().showPortal : open;
     set({ showPortal: showInspector }, false, 'toggleInspector');
   },

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

@@ -33,6 +33,7 @@ vi.mock('@/services/topic', () => ({
 vi.mock('@/services/message', () => ({
   messageService: {
     removeMessages: vi.fn(),
+    removeMessagesByAssistant: vi.fn(),
     getMessages: vi.fn(),
   },
 }));
@@ -351,7 +352,7 @@ describe('topic action', () => {
         await result.current.removeTopic(topicId);
       });
 
-      expect(messageService.removeMessages).toHaveBeenCalledWith(activeId, topicId);
+      expect(messageService.removeMessagesByAssistant).toHaveBeenCalledWith(activeId, topicId);
       expect(topicService.removeTopic).toHaveBeenCalledWith(topicId);
       expect(refreshTopicSpy).toHaveBeenCalled();
       expect(switchTopicSpy).toHaveBeenCalled();
@@ -372,7 +373,7 @@ describe('topic action', () => {
         await result.current.removeTopic(topicId);
       });
 
-      expect(messageService.removeMessages).toHaveBeenCalledWith(activeId, topicId);
+      expect(messageService.removeMessagesByAssistant).toHaveBeenCalledWith(activeId, topicId);
       expect(topicService.removeTopic).toHaveBeenCalledWith(topicId);
       expect(refreshTopicSpy).toHaveBeenCalled();
       expect(switchTopicSpy).not.toHaveBeenCalled();

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

@@ -249,7 +249,7 @@ export const chatTopic: StateCreator<
 
     // remove messages in the topic
     // TODO: Need to remove because server service don't need to call it
-    await messageService.removeMessages(activeId, id);
+    await messageService.removeMessagesByAssistant(activeId, id);
 
     // remove topic
     await topicService.removeTopic(id);

package/src/store/global/action.test.ts

@@ -69,6 +69,19 @@ describe('createPreferenceSlice', () => {
     });
   });
 
+  describe('toggleMobilePortal', () => {
+    it('should toggle mobile topic', () => {
+      const { result } = renderHook(() => useGlobalStore());
+
+      act(() => {
+        useGlobalStore.setState({ isStatusInit: true });
+        result.current.toggleMobilePortal();
+      });
+
+      expect(result.current.status.mobileShowPortal).toBe(true);
+    });
+  });
+
   describe('toggleSystemRole', () => {
     it('should toggle system role', () => {
       const { result } = renderHook(() => useGlobalStore());

package/src/store/global/action.ts

@@ -24,6 +24,7 @@ export interface GlobalStoreAction {
   switchBackToChat: (sessionId?: string) => void;
   toggleChatSideBar: (visible?: boolean) => void;
   toggleExpandSessionGroup: (id: string, expand: boolean) => void;
+  toggleMobilePortal: (visible?: boolean) => void;
   toggleMobileTopic: (visible?: boolean) => void;
   toggleSystemRole: (visible?: boolean) => void;
   updateSystemStatus: (status: Partial<SystemStatus>, action?: any) => void;
@@ -59,6 +60,12 @@ export const globalActionSlice: StateCreator<
     });
     get().updateSystemStatus({ expandSessionGroupKeys: nextExpandSessionGroup });
   },
+  toggleMobilePortal: (newValue) => {
+    const mobileShowPortal =
+      typeof newValue === 'boolean' ? newValue : !get().status.mobileShowPortal;
+
+    get().updateSystemStatus({ mobileShowPortal }, n('toggleMobilePortal', newValue));
+  },
   toggleMobileTopic: (newValue) => {
     const mobileShowTopic =
       typeof newValue === 'boolean' ? newValue : !get().status.mobileShowTopic;

package/src/store/global/initialState.ts

@@ -34,6 +34,7 @@ export interface SystemStatus {
   expandSessionGroupKeys: string[];
   hidePWAInstaller?: boolean;
   inputHeight: number;
+  mobileShowPortal?: boolean;
   mobileShowTopic?: boolean;
   sessionsWidth: number;
   showChatSideBar?: boolean;

package/src/store/global/selectors.ts

@@ -7,6 +7,7 @@ const sessionGroupKeys = (s: GlobalStore): string[] =>
 
 const showSystemRole = (s: GlobalStore) => s.status.showSystemRole;
 const mobileShowTopic = (s: GlobalStore) => s.status.mobileShowTopic;
+const mobileShowPortal = (s: GlobalStore) => s.status.mobileShowPortal;
 const showChatSideBar = (s: GlobalStore) => s.status.showChatSideBar;
 const showSessionPanel = (s: GlobalStore) => s.status.showSessionPanel;
 const hidePWAInstaller = (s: GlobalStore) => s.status.hidePWAInstaller;
@@ -17,6 +18,7 @@ const inputHeight = (s: GlobalStore) => s.status.inputHeight;
 export const systemStatusSelectors = {
   hidePWAInstaller,
   inputHeight,
+  mobileShowPortal,
   mobileShowTopic,
   sessionGroupKeys,
   sessionWidth,