@lobehub/chat 0.120.1 → 0.120.2

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+### [Version 0.120.2](https://github.com/lobehub/lobe-chat/compare/v0.120.1...v0.120.2)
+
+<sup>Released on **2024-01-17**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Fix setPluginMessage can not stop create ai message.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Fix setPluginMessage can not stop create ai message, closes [#1078](https://github.com/lobehub/lobe-chat/issues/1078) ([67de28d](https://github.com/lobehub/lobe-chat/commit/67de28d))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 0.120.1](https://github.com/lobehub/lobe-chat/compare/v0.120.0...v0.120.1)
 
 <sup>Released on **2024-01-16**</sup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "0.120.1",
+  "version": "0.120.2",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",
@@ -76,6 +76,7 @@
   },
   "dependencies": {
     "@ant-design/icons": "^5",
+    "@cfworker/json-schema": "^1",
     "@icons-pack/react-simple-icons": "^9",
     "@lobehub/chat-plugin-sdk": "latest",
     "@lobehub/chat-plugins-gateway": "latest",

package/src/features/Conversation/Plugins/Render/StandaloneType/Iframe.tsx

@@ -77,8 +77,8 @@ const IFrameRender = memo<IFrameRenderProps>(({ url, id, payload, width = 600, h
 
   // when plugin try to send back message, we should fill it to the message content
   const fillPluginContent = useChatStore((s) => s.fillPluginMessageContent);
-  useOnPluginFillContent((content) => {
-    fillPluginContent(id, content);
+  useOnPluginFillContent((content, triggerAiMessage) => {
+    fillPluginContent(id, content, triggerAiMessage);
   });
 
   // when plugin wants to get plugin state, send it to plugin

package/src/features/Conversation/Plugins/Render/utils/listenToPlugin.test.ts

@@ -72,7 +72,7 @@ describe('useOnPluginFillContent', () => {
 
     window.dispatchEvent(event);
 
-    expect(mockCallback).toHaveBeenCalledWith(testContent);
+    expect(mockCallback).toHaveBeenCalledWith(testContent, undefined);
   });
 
   it('calls callback with JSON stringified content if content is not a string', () => {
@@ -86,7 +86,7 @@ describe('useOnPluginFillContent', () => {
 
     window.dispatchEvent(event);
 
-    expect(mockCallback).toHaveBeenCalledWith(JSON.stringify(testContent));
+    expect(mockCallback).toHaveBeenCalledWith(JSON.stringify(testContent), undefined);
   });
 });
 

package/src/features/Conversation/Plugins/Render/utils/listenToPlugin.ts

@@ -31,14 +31,17 @@ export const useOnPluginFetchPluginState = (onRequest: (key: string) => void) =>
   }, []);
 };
 
-export const useOnPluginFillContent = (callback: (content: string) => void) => {
+export const useOnPluginFillContent = (
+  callback: (content: string, triggerAiMessage?: boolean) => void,
+) => {
   useEffect(() => {
     const fn = (e: MessageEvent) => {
       if (e.data.type === PluginChannel.fillStandalonePluginContent) {
         const data = e.data.content;
+        const triggerAiMessage = e.data.triggerAiMessage;
         const content = typeof data !== 'string' ? JSON.stringify(data) : data;
 
-        callback(content);
+        callback(content, triggerAiMessage);
       }
     };
 

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

@@ -12,6 +12,8 @@ import { pluginSelectors } from '@/store/tool/selectors';
 import { ChatPluginPayload } from '@/types/message';
 import { LobeTool } from '@/types/tool';
 
+const invokeStandaloneTypePlugin = useChatStore.getState().invokeStandaloneTypePlugin;
+
 // Mock messageService 和 chatSelectors
 vi.mock('@/services/message', () => ({
   messageService: {
@@ -41,7 +43,7 @@ beforeEach(() => {
 
 describe('ChatPluginAction', () => {
   describe('fillPluginMessageContent', () => {
-    it('should update message content and process the message', async () => {
+    it('should update message content and trigger the ai message', async () => {
       // 设置模拟函数的返回值
       const mockCurrentChats: any[] = [];
       (chatSelectors.currentChats as Mock).mockReturnValue(mockCurrentChats);
@@ -60,7 +62,7 @@ describe('ChatPluginAction', () => {
       const newContent = 'Updated content';
 
       await act(async () => {
-        await result.current.fillPluginMessageContent(messageId, newContent);
+        await result.current.fillPluginMessageContent(messageId, newContent, true);
       });
 
       // 验证 messageService.updateMessageContent 是否被正确调用
@@ -72,6 +74,37 @@ describe('ChatPluginAction', () => {
       // 验证 coreProcessMessage 是否被正确调用
       expect(result.current.coreProcessMessage).toHaveBeenCalledWith(mockCurrentChats, messageId);
     });
+    it('should update message content and not trigger ai message', async () => {
+      // 设置模拟函数的返回值
+      const mockCurrentChats: any[] = [];
+      (chatSelectors.currentChats as Mock).mockReturnValue(mockCurrentChats);
+
+      // 设置初始状态
+      const initialState = {
+        messages: [],
+        coreProcessMessage: vi.fn(),
+        refreshMessages: vi.fn(),
+      };
+      useChatStore.setState(initialState);
+
+      const { result } = renderHook(() => useChatStore());
+
+      const messageId = 'message-id';
+      const newContent = 'Updated content';
+
+      await act(async () => {
+        await result.current.fillPluginMessageContent(messageId, newContent);
+      });
+
+      // 验证 messageService.updateMessageContent 是否被正确调用
+      expect(messageService.updateMessage).toHaveBeenCalledWith(messageId, { content: newContent });
+
+      // 验证 refreshMessages 是否被调用
+      expect(result.current.refreshMessages).toHaveBeenCalled();
+
+      // 验证 coreProcessMessage 没有被正确调用
+      expect(result.current.coreProcessMessage).not.toHaveBeenCalled();
+    });
   });
 
   describe('runPluginDefaultType', () => {
@@ -259,9 +292,92 @@ describe('ChatPluginAction', () => {
         ],
       });
 
+      const invokeStandaloneTypePlugin = useChatStore.getState().invokeStandaloneTypePlugin;
+
+      act(() => {
+        useChatStore.setState({
+          refreshMessages: vi.fn(),
+          invokeStandaloneTypePlugin: vi.fn(),
+        });
+      });
+
+      (chatSelectors.getMessageById as Mock).mockImplementation(() => () => ({
+        id: messageId,
+        content: messageContent,
+      }));
+
+      const { result } = renderHook(() => useChatStore());
+
+      await act(async () => {
+        await result.current.triggerFunctionCall(messageId);
+      });
+
+      // 验证 refreshMessages 是否被调用
+      expect(result.current.refreshMessages).toHaveBeenCalled();
+
+      // 验证 invokeDefaultTypePlugin 是否没有被调用，因为类型是 standalone
+      expect(result.current.invokeDefaultTypePlugin).not.toHaveBeenCalled();
+      expect(result.current.invokeStandaloneTypePlugin).toHaveBeenCalled();
+
+      useChatStore.setState({ invokeStandaloneTypePlugin });
+    });
+
+    it('should handle builtin plugin type', async () => {
+      const messageId = 'message-id';
+      const messageContent = JSON.stringify({
+        tool_calls: [
+          {
+            id: 'call_scv',
+            function: {
+              name: `pluginName${PLUGIN_SCHEMA_SEPARATOR}apiName${PLUGIN_SCHEMA_SEPARATOR}builtin`,
+              arguments: {},
+            },
+          },
+        ],
+      });
+
+      const invokeBuiltinTool = useChatStore.getState().invokeBuiltinTool;
+      useChatStore.setState({ refreshMessages: vi.fn(), invokeBuiltinTool: vi.fn() });
+
+      (chatSelectors.getMessageById as Mock).mockImplementation(() => () => ({
+        id: messageId,
+        content: messageContent,
+      }));
+
+      const { result } = renderHook(() => useChatStore());
+
+      await act(async () => {
+        await result.current.triggerFunctionCall(messageId);
+      });
+
+      // 验证 refreshMessages 是否被调用
+      expect(result.current.refreshMessages).toHaveBeenCalled();
+
+      // 验证 invokeDefaultTypePlugin 是否没有被调用，因为类型是 standalone
+      expect(result.current.invokeDefaultTypePlugin).not.toHaveBeenCalled();
+      expect(result.current.invokeBuiltinTool).toHaveBeenCalled();
+
+      useChatStore.setState({ invokeBuiltinTool });
+    });
+
+    it('should handle markdown plugin type', async () => {
+      const messageId = 'message-id';
+      const messageContent = JSON.stringify({
+        tool_calls: [
+          {
+            id: 'call_scv',
+            function: {
+              name: `pluginName${PLUGIN_SCHEMA_SEPARATOR}apiName${PLUGIN_SCHEMA_SEPARATOR}markdown`,
+              arguments: {},
+            },
+          },
+        ],
+      });
+
+      const invokeMarkdownTypePlugin = useChatStore.getState().invokeMarkdownTypePlugin;
       useChatStore.setState({
         refreshMessages: vi.fn(),
-        invokeDefaultTypePlugin: vi.fn(),
+        invokeMarkdownTypePlugin: vi.fn(),
       });
 
       (chatSelectors.getMessageById as Mock).mockImplementation(() => () => ({
@@ -278,8 +394,10 @@ describe('ChatPluginAction', () => {
       // 验证 refreshMessages 是否被调用
       expect(result.current.refreshMessages).toHaveBeenCalled();
 
-      // 验证 invokeDefaultTypePlugin 是否没有被调用，因为类型是 standalone
       expect(result.current.invokeDefaultTypePlugin).not.toHaveBeenCalled();
+      expect(result.current.invokeMarkdownTypePlugin).toHaveBeenCalled();
+
+      useChatStore.setState({ invokeMarkdownTypePlugin });
     });
   });
 
@@ -472,6 +590,7 @@ describe('ChatPluginAction', () => {
       expect(result.current.toggleChatLoading).toHaveBeenCalledWith(false);
       expect(useChatStore.getState().text2image).not.toHaveBeenCalled();
     });
+
     it('should handle errors when invoking a builtin tool fails', async () => {
       const payload = {
         apiName: 'builtinApi',
@@ -525,8 +644,10 @@ describe('ChatPluginAction', () => {
       } as ChatPluginPayload;
       const messageId = 'message-id';
 
-      useChatStore.setState({
-        runPluginApi: vi.fn().mockResolvedValue('Markdown response'),
+      const runPluginApiMock = vi.fn();
+
+      act(() => {
+        useChatStore.setState({ runPluginApi: runPluginApiMock });
       });
 
       const { result } = renderHook(() => useChatStore());
@@ -536,7 +657,46 @@ describe('ChatPluginAction', () => {
       });
 
       // Verify that the markdown type plugin was invoked
-      expect(result.current.runPluginApi).toHaveBeenCalledWith(messageId, payload);
+      expect(runPluginApiMock).toHaveBeenCalledWith(messageId, payload);
+    });
+  });
+
+  describe('invokeStandaloneTypePlugin', () => {
+    it('should update message with error and refresh messages if plugin settings are invalid', async () => {
+      const messageId = 'message-id';
+
+      const payload = {
+        identifier: 'pluginName',
+      } as ChatPluginPayload;
+
+      act(() => {
+        useToolStore.setState({
+          validatePluginSettings: vi
+            .fn()
+            .mockResolvedValue({ valid: false, errors: ['Invalid setting'] }),
+        });
+
+        useChatStore.setState({ refreshMessages: vi.fn(), invokeStandaloneTypePlugin });
+      });
+
+      const { result } = renderHook(() => useChatStore());
+
+      await act(async () => {
+        await result.current.invokeStandaloneTypePlugin(messageId, payload);
+      });
+
+      const call = vi.mocked(messageService.updateMessageError).mock.calls[0];
+
+      expect(call[1]).toEqual({
+        body: {
+          error: ['Invalid setting'],
+          message: '[plugin] your settings is invalid with plugin manifest setting schema',
+        },
+        message: undefined,
+        type: 'PluginSettingsInvalid',
+      });
+
+      expect(result.current.refreshMessages).toHaveBeenCalled();
     });
   });
 });

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

@@ -1,3 +1,5 @@
+import { PluginErrorType } from '@lobehub/chat-plugin-sdk';
+import { t } from 'i18next';
 import { Md5 } from 'ts-md5';
 import { StateCreator } from 'zustand/vanilla';
 
@@ -18,10 +20,15 @@ const n = setNamespace('plugin');
 
 export interface ChatPluginAction {
   createAssistantMessageByPlugin: (content: string, parentId: string) => Promise<void>;
-  fillPluginMessageContent: (id: string, content: string) => Promise<void>;
+  fillPluginMessageContent: (
+    id: string,
+    content: string,
+    triggerAiMessage?: boolean,
+  ) => Promise<void>;
   invokeBuiltinTool: (id: string, payload: ChatPluginPayload) => Promise<void>;
   invokeDefaultTypePlugin: (id: string, payload: any) => Promise<void>;
   invokeMarkdownTypePlugin: (id: string, payload: ChatPluginPayload) => Promise<void>;
+  invokeStandaloneTypePlugin: (id: string, payload: ChatPluginPayload) => Promise<void>;
   runPluginApi: (id: string, payload: ChatPluginPayload) => Promise<string | undefined>;
   triggerAIMessage: (id: string) => Promise<void>;
   triggerFunctionCall: (id: string) => Promise<void>;
@@ -47,12 +54,12 @@ export const chatPlugin: StateCreator<
     await get().refreshMessages();
   },
 
-  fillPluginMessageContent: async (id, content) => {
+  fillPluginMessageContent: async (id, content, triggerAiMessage) => {
     const { triggerAIMessage, updateMessageContent } = get();
 
     await updateMessageContent(id, content);
 
-    await triggerAIMessage(id);
+    if (triggerAiMessage) await triggerAIMessage(id);
   },
 
   invokeBuiltinTool: async (id, payload) => {
@@ -103,6 +110,29 @@ export const chatPlugin: StateCreator<
     await runPluginApi(id, payload);
   },
 
+  invokeStandaloneTypePlugin: async (id, payload) => {
+    const result = await useToolStore.getState().validatePluginSettings(payload.identifier);
+    console.log('------------------');
+    console.log(result);
+    console.log('------------------');
+    if (!result) return;
+
+    // if the plugin settings is not valid, then set the message with error type
+    if (!result.valid) {
+      await messageService.updateMessageError(id, {
+        body: {
+          error: result.errors,
+          message: '[plugin] your settings is invalid with plugin manifest setting schema',
+        },
+        message: t('response.PluginSettingsInvalid', { ns: 'error' }),
+        type: PluginErrorType.PluginSettingsInvalid as any,
+      });
+
+      await get().refreshMessages();
+      return;
+    }
+  },
+
   runPluginApi: async (id, payload) => {
     const { updateMessageContent, refreshMessages, toggleChatLoading } = get();
     let data: string;
@@ -144,6 +174,7 @@ export const chatPlugin: StateCreator<
     const {
       invokeDefaultTypePlugin,
       invokeMarkdownTypePlugin,
+      invokeStandaloneTypePlugin,
       invokeBuiltinTool,
       refreshMessages,
     } = get();
@@ -192,9 +223,10 @@ export const chatPlugin: StateCreator<
 
     switch (payload.type) {
       case 'standalone': {
-        // TODO: need to auth user's settings
+        await invokeStandaloneTypePlugin(id, payload);
         break;
       }
+
       case 'markdown': {
         await invokeMarkdownTypePlugin(id, payload);
         break;

package/src/store/tool/slices/plugin/__snapshots__/action.test.ts.snap

@@ -0,0 +1,15 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`useToolStore:plugin > validatePluginSettings > should return invalid result if settings do not match the schema 1`] = `
+{
+  "errors": [
+    {
+      "error": "Instance does not have required property "abc".",
+      "instanceLocation": "#",
+      "keyword": "required",
+      "keywordLocation": "#/required",
+    },
+  ],
+  "valid": false,
+}
+`;

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

@@ -1,7 +1,9 @@
+import { LobeChatPluginMeta } from '@lobehub/chat-plugin-sdk';
 import { act, renderHook } from '@testing-library/react';
 import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { pluginService } from '@/services/plugin';
+import { LobeTool } from '@/types/tool';
 
 import { useToolStore } from '../../store';
 
@@ -18,6 +20,64 @@ beforeEach(() => {
 });
 
 describe('useToolStore:plugin', () => {
+  describe('checkPluginsIsInstalled', () => {
+    it('should not perform any operations if the plugin list is empty', async () => {
+      const installPluginsMock = vi.fn();
+      useToolStore.setState({
+        loadPluginStore: vi.fn(),
+        installPlugins: installPluginsMock,
+      });
+
+      const { result } = renderHook(() => useToolStore());
+
+      await act(async () => {
+        await result.current.checkPluginsIsInstalled([]);
+      });
+
+      expect(installPluginsMock).not.toHaveBeenCalled();
+    });
+
+    it('should load the plugin store and install plugins if necessary', async () => {
+      const plugins = ['plugin1', 'plugin2'];
+      const loadPluginStoreMock = vi.fn();
+      const installPluginsMock = vi.fn();
+      useToolStore.setState({
+        loadPluginStore: loadPluginStoreMock,
+        installPlugins: installPluginsMock,
+      });
+
+      const { result } = renderHook(() => useToolStore());
+
+      await act(async () => {
+        await result.current.checkPluginsIsInstalled(plugins);
+      });
+
+      expect(loadPluginStoreMock).toHaveBeenCalled();
+      expect(installPluginsMock).toHaveBeenCalledWith(plugins);
+    });
+
+    it('should not load the plugin store and install plugins', async () => {
+      const plugins = ['plugin1', 'plugin2'];
+      const loadPluginStoreMock = vi.fn();
+      const installPluginsMock = vi.fn();
+      useToolStore.setState({
+        loadPluginStore: loadPluginStoreMock,
+        installPlugins: installPluginsMock,
+        installedPlugins: [{ identifier: 'abc' }] as LobeTool[],
+        pluginStoreList: [{ identifier: 'abc' }] as LobeChatPluginMeta[],
+      });
+
+      const { result } = renderHook(() => useToolStore());
+
+      await act(async () => {
+        await result.current.checkPluginsIsInstalled(plugins);
+      });
+
+      expect(loadPluginStoreMock).not.toHaveBeenCalled();
+      expect(installPluginsMock).toHaveBeenCalledWith(plugins);
+    });
+  });
+
   describe('updatePluginSettings', () => {
     it('should update settings for a given plugin', async () => {
       const pluginId = 'test-plugin';
@@ -44,4 +104,66 @@ describe('useToolStore:plugin', () => {
       expect(pluginService.removeAllPlugins).toBeCalled();
     });
   });
+
+  describe('validatePluginSettings', () => {
+    // 模拟插件数据
+    const testPluginId = 'test-plugin';
+    // 定义测试用的 schema 和模拟的验证结果
+    const testSchema = {
+      properties: { abc: { type: 'string' } },
+      required: ['abc'],
+      type: 'object',
+    };
+
+    const testPluginSettings = { abc: 'valid-string' };
+
+    const testPlugin = {
+      type: 'plugin',
+      identifier: testPluginId,
+      manifest: {
+        identifier: testPluginId,
+        settings: testSchema,
+      },
+      settings: testPluginSettings,
+    } as unknown as LobeTool;
+
+    it('should validate settings against the schema and return valid result', async () => {
+      const { result } = renderHook(() => useToolStore());
+
+      act(() => {
+        useToolStore.setState({
+          installedPlugins: [testPlugin],
+        });
+      });
+
+      const validationResult = await result.current.validatePluginSettings(testPluginId);
+
+      expect(validationResult).toEqual({ valid: true, errors: [] });
+    });
+
+    it('should return invalid result if settings do not match the schema', async () => {
+      const { result } = renderHook(() => useToolStore());
+      act(() => {
+        useToolStore.setState({
+          installedPlugins: [{ ...testPlugin, settings: {} }] as any,
+        });
+      });
+
+      const validationResult = await result.current.validatePluginSettings(testPluginId);
+
+      expect(validationResult).toMatchSnapshot();
+    });
+
+    it('should return undefined if manifest or settings are not found', async () => {
+      useToolStore.setState({
+        installedPlugins: [],
+      });
+
+      const { result } = renderHook(() => useToolStore());
+
+      const validationResult = await result.current.validatePluginSettings(testPluginId);
+
+      expect(validationResult).toBeUndefined();
+    });
+  });
 });

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

@@ -1,10 +1,12 @@
+import { Schema, ValidationResult } from '@cfworker/json-schema';
 import useSWR, { SWRResponse } from 'swr';
 import { StateCreator } from 'zustand/vanilla';
 
 import { pluginService } from '@/services/plugin';
-import { pluginStoreSelectors } from '@/store/tool/selectors';
 
 import { ToolStore } from '../../store';
+import { pluginStoreSelectors } from '../store/selectors';
+import { pluginSelectors } from './selectors';
 
 /**
  * 插件接口
@@ -14,6 +16,7 @@ export interface PluginAction {
   removeAllPlugins: () => Promise<void>;
   updatePluginSettings: <T>(id: string, settings: Partial<T>) => Promise<void>;
   useCheckPluginsIsInstalled: (plugins: string[]) => SWRResponse;
+  validatePluginSettings: (identifier: string) => Promise<ValidationResult | undefined>;
 }
 
 export const createPluginSlice: StateCreator<
@@ -45,4 +48,18 @@ export const createPluginSlice: StateCreator<
     await get().refreshPlugins();
   },
   useCheckPluginsIsInstalled: (plugins) => useSWR(plugins, get().checkPluginsIsInstalled),
+  validatePluginSettings: async (identifier) => {
+    const manifest = pluginSelectors.getPluginManifestById(identifier)(get());
+    if (!manifest || !manifest.settings) return;
+    const settings = pluginSelectors.getPluginSettingsById(identifier)(get());
+
+    // validate the settings
+    const { Validator } = await import('@cfworker/json-schema');
+    const validator = new Validator(manifest.settings as Schema);
+    const result = validator.validate(settings);
+
+    if (!result.valid) return { errors: result.errors, valid: false };
+
+    return { errors: [], valid: true };
+  },
 });