🐛 fix: plugins with multiple settings cannot be correctly configured (#…

…1991)

* 🐛 fix: plugins with multiple settings cannot be correctly configured

* ♻️ refactor: merge plugin setting in the action layer instead of UI

* ✅ test: add a test to ensure plugin settings are correctly merged

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

@@ -4,6 +4,7 @@ import { beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { pluginService } from '@/services/plugin';
 import { LobeTool } from '@/types/tool';
+import { merge } from '@/utils/merge';
 
 import { useToolStore } from '../../store';
 
@@ -91,6 +92,24 @@ describe('useToolStore:plugin', () => {
 
       expect(pluginService.updatePluginSettings).toBeCalledWith(pluginId, newSettings);
     });
+
+    it('should merge settings for a plugin with existing settings', async () => {
+      const pluginId = 'test-plugin';
+      const existingSettings = { setting1: 'old-value', setting2: 'old-value' };
+      const newSettings = { setting1: 'new-value' };
+      const mergedSettings = merge(existingSettings, newSettings);
+      useToolStore.setState({
+        installedPlugins: [{ identifier: pluginId, settings: existingSettings }] as LobeTool[],
+      });
+
+      const { result } = renderHook(() => useToolStore());
+
+      await act(async () => {
+        await result.current.updatePluginSettings(pluginId, newSettings);
+      });
+
+      expect(pluginService.updatePluginSettings).toBeCalledWith(pluginId, mergedSettings);
+    });
   });
 
   describe('removeAllPlugins', () => {

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

@@ -3,6 +3,7 @@ import useSWR, { SWRResponse } from 'swr';
 import { StateCreator } from 'zustand/vanilla';
 
 import { pluginService } from '@/services/plugin';
+import { merge } from '@/utils/merge';
 
 import { ToolStore } from '../../store';
 import { pluginStoreSelectors } from '../store/selectors';
@@ -44,7 +45,11 @@ export const createPluginSlice: StateCreator<
     await get().refreshPlugins();
   },
   updatePluginSettings: async (id, settings) => {
-    await pluginService.updatePluginSettings(id, settings);
+    const previousSettings = pluginSelectors.getPluginSettingsById(id)(get());
+
+    const nextSettings = merge(previousSettings, settings);
+    await pluginService.updatePluginSettings(id, nextSettings);
+
     await get().refreshPlugins();
   },
   useCheckPluginsIsInstalled: (plugins) => useSWR(plugins, get().checkPluginsIsInstalled),