@lobehub/chat 0.100.5 → 0.101.1

package/src/services/__tests__/file.test.ts

@@ -0,0 +1,88 @@
+import { Mock, beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { FileModel } from '@/database/models/file';
+import { LocalFile } from '@/types/database/files';
+
+import { fileService } from '../file';
+
+// Mocks for the FileModel
+vi.mock('@/database/models/file', () => ({
+  FileModel: {
+    create: vi.fn(),
+    delete: vi.fn(),
+    findById: vi.fn(),
+  },
+}));
+
+// Mocks for the URL and Blob objects
+global.URL.createObjectURL = vi.fn();
+global.Blob = vi.fn();
+
+describe('FileService', () => {
+  beforeEach(() => {
+    // Reset all mocks before each test
+    vi.resetAllMocks();
+  });
+
+  it('uploadFile should save the file to the database', async () => {
+    const localFile: LocalFile = {
+      name: 'test',
+      data: new ArrayBuffer(1),
+      fileType: 'image/png',
+      saveMode: 'local',
+      size: 1,
+    };
+
+    (FileModel.create as Mock).mockResolvedValue(localFile);
+
+    const result = await fileService.uploadFile(localFile);
+
+    expect(FileModel.create).toHaveBeenCalledWith(localFile);
+    expect(result).toEqual(localFile);
+  });
+
+  it('removeFile should delete the file from the database', async () => {
+    const fileId = '1';
+    (FileModel.delete as Mock).mockResolvedValue(true);
+
+    const result = await fileService.removeFile(fileId);
+
+    expect(FileModel.delete).toHaveBeenCalledWith(fileId);
+    expect(result).toBe(true);
+  });
+
+  it('getFile should retrieve and convert file info to FilePreview', async () => {
+    const fileId = '1';
+    const fileData: LocalFile = {
+      name: 'test',
+      data: new ArrayBuffer(1),
+      fileType: 'image/png',
+      saveMode: 'local',
+      size: 1,
+    };
+
+    (FileModel.findById as Mock).mockResolvedValue(fileData);
+    (global.URL.createObjectURL as Mock).mockReturnValue('blob:test');
+    (global.Blob as Mock).mockImplementation(() => ['test']);
+
+    const result = await fileService.getFile(fileId);
+
+    expect(FileModel.findById).toHaveBeenCalledWith(fileId);
+    expect(result).toEqual({
+      base64Url: 'data:image/png;base64,AA==',
+      fileType: 'image/png',
+      name: 'test',
+      saveMode: 'local',
+      url: 'blob:test',
+    });
+  });
+
+  it('getFile should throw an error when the file is not found', async () => {
+    const fileId = 'non-existent';
+    (FileModel.findById as Mock).mockResolvedValue(null);
+
+    const getFilePromise = fileService.getFile(fileId);
+
+    await expect(getFilePromise).rejects.toThrow('file not found');
+  });
+});

package/src/services/chatModel.ts

@@ -1,8 +1,9 @@
 import { merge } from 'lodash-es';
 
+import { VISION_MODEL_WHITE_LIST } from '@/const/llm';
 import { pluginSelectors, usePluginStore } from '@/store/plugin';
 import { initialLobeAgentConfig } from '@/store/session/initialState';
-import type { ChatCompletionFunctions, OpenAIChatStreamPayload } from '@/types/openai/chat';
+import type { OpenAIChatStreamPayload } from '@/types/openai/chat';
 
 import { createHeaderWithOpenAI } from './_header';
 import { OPENAI_URLS } from './_url';
@@ -26,13 +27,17 @@ export const fetchChatModel = (
     },
     params,
   );
-  // ============  1. 前置处理 functions   ============ //
+  // ============   preprocess tools   ============ //
 
-  const filterFunctions: ChatCompletionFunctions[] = pluginSelectors.enabledSchema(enabledPlugins)(
-    usePluginStore.getState(),
-  );
+  const filterTools = pluginSelectors.enabledSchema(enabledPlugins)(usePluginStore.getState());
+
+  // the rule that model can use tools:
+  // 1. tools is not empty
+  // 2. model is not in vision white list, because vision model can't use tools
+  // TODO: we need to find some method to let vision model use tools
+  const shouldUseTools = filterTools.length > 0 && !VISION_MODEL_WHITE_LIST.includes(payload.model);
 
-  const functions = filterFunctions.length === 0 ? undefined : filterFunctions;
+  const functions = shouldUseTools ? filterTools : undefined;
 
   return fetch(OPENAI_URLS.chat, {
     body: JSON.stringify({ ...payload, functions }),

package/src/services/file.ts

@@ -0,0 +1,36 @@
+import { FileModel } from '@/database/models/file';
+import { LocalFile } from '@/types/database/files';
+import { FilePreview } from '@/types/files';
+
+class FileService {
+  async uploadFile(file: LocalFile) {
+    // save to local storage
+    // we may want to save to a remote server later
+    return FileModel.create(file);
+  }
+
+  async removeFile(id: string) {
+    return FileModel.delete(id);
+  }
+
+  async getFile(id: string): Promise<FilePreview> {
+    const item = await FileModel.findById(id);
+    if (!item) {
+      throw new Error('file not found');
+    }
+
+    // arrayBuffer to url
+    const url = URL.createObjectURL(new Blob([item.data]));
+    const base64 = Buffer.from(item.data).toString('base64');
+
+    return {
+      base64Url: `data:${item.fileType};base64,${base64}`,
+      fileType: item.fileType,
+      name: item.name,
+      saveMode: 'local',
+      url,
+    };
+  }
+}
+
+export const fileService = new FileService();

package/src/store/files/index.ts

@@ -0,0 +1,2 @@
+export * from './selectors';
+export { useFileStore } from './store';

package/src/store/files/initialState.ts

@@ -0,0 +1,7 @@
+import { ImageFileState, initialImageFileState } from './slices/images';
+
+export type FilesStoreState = ImageFileState;
+
+export const initialState: FilesStoreState = {
+  ...initialImageFileState,
+};

package/src/store/files/selectors.test.ts

@@ -0,0 +1,75 @@
+import { beforeEach, describe, expect, it } from 'vitest';
+
+import { FilesStoreState } from './initialState';
+import { filesSelectors } from './selectors';
+
+describe('filesSelectors', () => {
+  let state: FilesStoreState;
+
+  beforeEach(() => {
+    // 创建并初始化 state 的模拟实例
+    state = {
+      imagesMap: {
+        '1': {
+          name: 'a',
+          fileType: 'image/png',
+          saveMode: 'local',
+          base64Url: 'base64string1',
+          url: 'blob:abc',
+        },
+        '2': {
+          name: 'b',
+          fileType: 'image/png',
+          saveMode: 'url',
+          base64Url: 'base64string2',
+          url: 'url2',
+        },
+      },
+      // 假设 '3' 是不存在的 ID
+      inputFilesList: ['1', '2', '3'],
+    };
+  });
+
+  it('getImageDetailByList should return details for the provided list of image IDs', () => {
+    const list = ['1', '2'];
+    const details = filesSelectors.getImageDetailByList(list)(state);
+    expect(details.length).toBe(2);
+    expect(details[0].name).toBe('a');
+    expect(details[1].name).toBe('b');
+  });
+
+  it('imageDetailList should return details for the images in the inputFilesList', () => {
+    const details = filesSelectors.imageDetailList(state);
+    // '3' should be filtered due to not exist in map
+    expect(details.length).toBe(2);
+  });
+
+  it('getImageUrlOrBase64ById should return the correct URL or Base64 based on saveMode', () => {
+    const localImage = filesSelectors.getImageUrlOrBase64ById('1')(state);
+    expect(localImage).toEqual({ id: '1', url: 'base64string1' });
+
+    const serverImage = filesSelectors.getImageUrlOrBase64ById('2')(state);
+    expect(serverImage).toEqual({ id: '2', url: 'url2' });
+
+    const nonExistentImage = filesSelectors.getImageUrlOrBase64ById('3')(state);
+    expect(nonExistentImage).toBeUndefined();
+  });
+
+  it('getImageUrlOrBase64ByList should return the correct list of URLs or Base64 strings', () => {
+    const list = ['1', '2', '3'];
+    const urlsOrBase64s = filesSelectors.getImageUrlOrBase64ByList(list)(state);
+    expect(urlsOrBase64s.length).toBe(2); // '3' 应该被过滤掉，因为它不存在
+    expect(urlsOrBase64s[0].url).toBe('base64string1');
+    expect(urlsOrBase64s[1].url).toBe('url2');
+  });
+
+  it('imageUrlOrBase64List should return a list of image URLs or Base64 strings for all images in inputFilesList', () => {
+    const urlsOrBase64s = filesSelectors.imageUrlOrBase64List(state);
+    expect(urlsOrBase64s.length).toBe(2); // '3' 是不存在的 ID，所以应该被过滤掉
+
+    expect(urlsOrBase64s).toEqual([
+      { id: '1', url: 'base64string1' }, // 本地保存的图像应该使用 base64 URL
+      { id: '2', url: 'url2' }, // 服务器保存的图像应该使用普通 URL
+    ]);
+  });
+});

package/src/store/files/selectors.ts

@@ -0,0 +1,34 @@
+import { FilesStoreState } from './initialState';
+
+const getImageDetailByList = (list: string[]) => (s: FilesStoreState) =>
+  list.map((i) => s.imagesMap[i]).filter(Boolean);
+
+const imageDetailList = (s: FilesStoreState) => getImageDetailByList(s.inputFilesList)(s);
+
+const getImageUrlOrBase64ById =
+  (id: string) =>
+  (s: FilesStoreState): { id: string; url: string } | undefined => {
+    const preview = s.imagesMap[id];
+
+    if (!preview) return undefined;
+
+    const url = preview.saveMode === 'local' ? (preview.base64Url as string) : preview.url;
+
+    return { id, url: url };
+  };
+
+const getImageUrlOrBase64ByList = (idList: string[]) => (s: FilesStoreState) =>
+  idList.map((i) => getImageUrlOrBase64ById(i)(s)).filter(Boolean) as {
+    id: string;
+    url: string;
+  }[];
+
+const imageUrlOrBase64List = (s: FilesStoreState) => getImageUrlOrBase64ByList(s.inputFilesList)(s);
+
+export const filesSelectors = {
+  getImageDetailByList,
+  getImageUrlOrBase64ById,
+  getImageUrlOrBase64ByList,
+  imageDetailList,
+  imageUrlOrBase64List,
+};

package/src/store/files/slices/images/action.test.ts

@@ -0,0 +1,186 @@
+import { act, renderHook } from '@testing-library/react';
+import useSWR from 'swr';
+import { Mock, afterEach, beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
+
+import { fileService } from '@/services/file';
+
+import { useFileStore as useStore } from '../../store';
+
+vi.mock('zustand/traditional');
+
+// Mocks for fileService
+vi.mock('@/services/file', () => ({
+  fileService: {
+    removeFile: vi.fn(),
+    uploadFile: vi.fn(),
+    getFile: vi.fn(),
+  },
+}));
+
+// Mock for useSWR
+vi.mock('swr', () => ({
+  default: vi.fn(),
+}));
+
+//  mock the arrayBuffer
+beforeAll(() => {
+  Object.defineProperty(File.prototype, 'arrayBuffer', {
+    writable: true,
+    value: function () {
+      return new Promise((resolve) => {
+        const reader = new FileReader();
+        reader.onloadend = () => {
+          resolve(reader.result);
+        };
+        reader.readAsArrayBuffer(this);
+      });
+    },
+  });
+});
+
+beforeEach(() => {
+  // Reset all mocks before each test
+  vi.resetAllMocks();
+});
+
+describe('useFileStore:images', () => {
+  it('clearImageList should clear the inputFilesList', () => {
+    const { result } = renderHook(() => useStore());
+
+    // Populate the list to clear it later
+    act(() => {
+      useStore.setState({ inputFilesList: ['test-id'] });
+    });
+
+    expect(result.current.inputFilesList).toEqual(['test-id']);
+
+    act(() => {
+      result.current.clearImageList();
+    });
+
+    expect(result.current.inputFilesList).toEqual([]);
+  });
+
+  it('removeFile should call fileService.removeFile and update the store', async () => {
+    const { result } = renderHook(() => useStore());
+
+    const fileId = 'test-id';
+
+    // Mock the fileService.removeFile to resolve
+    (fileService.removeFile as Mock).mockResolvedValue(undefined);
+
+    // Populate the list to remove an item later
+    act(() => {
+      useStore.setState(({ inputFilesList }) => ({ inputFilesList: [...inputFilesList, fileId] }));
+      //   // result.current.inputFilesList.push(fileId);
+    });
+
+    await act(async () => {
+      await result.current.removeFile(fileId);
+    });
+
+    expect(fileService.removeFile).toHaveBeenCalledWith(fileId);
+    expect(result.current.inputFilesList).toEqual([]);
+  });
+
+  // Test for useFetchFile
+  it('useFetchFile should call useSWR and update the store', async () => {
+    const fileId = 'test-id';
+    const fileData = {
+      id: fileId,
+      name: 'test',
+      url: 'blob:test',
+      fileType: 'image/png',
+      base64Url: '',
+      saveMode: 'local',
+    };
+
+    // Mock the fileService.getFile to resolve with fileData
+    (fileService.getFile as Mock).mockResolvedValue(fileData);
+
+    // Mock useSWR to call the fetcher function immediately
+    const useSWRMock = vi.mocked(useSWR);
+    useSWRMock.mockImplementation(((key: string, fetcher: any) => {
+      const data = fetcher(key);
+      return { data, error: undefined, isValidating: false, mutate: vi.fn() };
+    }) as any);
+
+    const { result } = renderHook(() => useStore().useFetchFile(fileId));
+
+    await act(async () => {
+      await result.current.data;
+    });
+
+    expect(fileService.getFile).toHaveBeenCalledWith(fileId);
+
+    // Since we are not rendering a component with the hook, we cannot test the state update here
+    // Instead, we would need to use a test renderer that can work with hooks, like @testing-library/react
+  });
+
+  describe('uploadFile', () => {
+    it('uploadFile should handle errors', async () => {
+      const { result } = renderHook(() => useStore());
+      const testFile = new File(['content'], 'test.png', { type: 'image/png' });
+
+      // 模拟 fileService.uploadFile 抛出错误
+      const errorMessage = 'Upload failed';
+      (fileService.uploadFile as Mock).mockRejectedValue(new Error(errorMessage));
+
+      // Mock console.error for testing
+      const consoleErrorMock = vi.spyOn(console, 'error').mockImplementation(() => {});
+
+      await act(async () => {
+        await result.current.uploadFile(testFile);
+      });
+
+      expect(fileService.uploadFile).toHaveBeenCalledWith({
+        createdAt: testFile.lastModified,
+        data: await testFile.arrayBuffer(),
+        fileType: testFile.type,
+        name: testFile.name,
+        saveMode: 'local',
+        size: testFile.size,
+      });
+      // 由于上传失败，inputFilesList 应该没有变化
+      expect(result.current.inputFilesList).toEqual([]);
+      // 确保错误被正确记录
+      expect(consoleErrorMock).toHaveBeenCalledWith('upload error:', expect.any(Error));
+
+      // Cleanup mock
+      consoleErrorMock.mockRestore();
+    });
+
+    it('uploadFile should upload the file and update inputFilesList', async () => {
+      const { result } = renderHook(() => useStore());
+      const testFile = new File(['content'], 'test.png', { type: 'image/png' });
+
+      // 模拟 fileService.uploadFile 返回的数据
+      const uploadedFileData = {
+        id: 'new-file-id',
+        createdAt: testFile.lastModified,
+        data: await testFile.arrayBuffer(),
+        fileType: testFile.type,
+        name: testFile.name,
+        saveMode: 'local',
+        size: testFile.size,
+      };
+
+      // Mock the fileService.uploadFile to resolve with uploadedFileData
+      (fileService.uploadFile as Mock).mockResolvedValue(uploadedFileData);
+
+      await act(async () => {
+        await result.current.uploadFile(testFile);
+      });
+
+      expect(fileService.uploadFile).toHaveBeenCalledWith({
+        createdAt: testFile.lastModified,
+        data: await testFile.arrayBuffer(),
+        fileType: testFile.type,
+        name: testFile.name,
+        saveMode: 'local',
+        size: testFile.size,
+      });
+      expect(result.current.inputFilesList).toContain(uploadedFileData.id);
+    });
+  });
+});

package/src/store/files/slices/images/action.ts

@@ -0,0 +1,83 @@
+import { produce } from 'immer';
+import useSWR, { SWRResponse } from 'swr';
+import { StateCreator } from 'zustand/vanilla';
+
+import { fileService } from '@/services/file';
+import { FilePreview } from '@/types/files';
+import { setNamespace } from '@/utils/storeDebug';
+
+import { FileStore } from '../../store';
+
+const t = setNamespace('files/image');
+
+/**
+ * 代理行为接口
+ */
+export interface FileAction {
+  clearImageList: () => void;
+  removeFile: (id: string) => Promise<void>;
+  setImageMapItem: (id: string, item: FilePreview) => void;
+  uploadFile: (file: File) => Promise<void>;
+
+  useFetchFile: (id: string) => SWRResponse<FilePreview>;
+}
+
+export const createFileSlice: StateCreator<
+  FileStore,
+  [['zustand/devtools', never]],
+  [],
+  FileAction
+> = (set, get) => ({
+  clearImageList: () => {
+    set({ inputFilesList: [] }, false, t('clearImageList'));
+  },
+  removeFile: async (id) => {
+    await fileService.removeFile(id);
+
+    set(
+      ({ inputFilesList }) => ({ inputFilesList: inputFilesList.filter((i) => i !== id) }),
+      false,
+      t('removeFile'),
+    );
+  },
+  setImageMapItem: (id, item) => {
+    set(
+      produce((draft) => {
+        if (draft.imagesMap[id]) return;
+
+        draft.imagesMap[id] = item;
+      }),
+      false,
+      t('setImageMapItem'),
+    );
+  },
+  uploadFile: async (file) => {
+    try {
+      const data = await fileService.uploadFile({
+        createdAt: file.lastModified,
+        data: await file.arrayBuffer(),
+        fileType: file.type,
+        name: file.name,
+        saveMode: 'local',
+        size: file.size,
+      });
+
+      set(
+        ({ inputFilesList }) => ({ inputFilesList: [...inputFilesList, data.id] }),
+        false,
+        t('uploadFile'),
+      );
+    } catch (error) {
+      // 提示用户上传失败
+      console.error('upload error:', error);
+    }
+  },
+  useFetchFile: (id) =>
+    useSWR(id, async (id) => {
+      const item = await fileService.getFile(id);
+
+      get().setImageMapItem(id, item);
+
+      return item;
+    }),
+});

package/src/store/files/slices/images/index.ts

@@ -0,0 +1,3 @@
+export * from './action';
+export * from './initialState';
+// export * from './selectors';

package/src/store/files/slices/images/initialState.ts

@@ -0,0 +1,11 @@
+import { FilePreview } from '@/types/files';
+
+export interface ImageFileState {
+  imagesMap: Record<string, FilePreview>;
+  inputFilesList: string[];
+}
+
+export const initialImageFileState: ImageFileState = {
+  imagesMap: {},
+  inputFilesList: [],
+};

package/src/store/files/store.ts

@@ -0,0 +1,27 @@
+import { devtools } from 'zustand/middleware';
+import { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { StateCreator } from 'zustand/vanilla';
+
+import { isDev } from '@/utils/env';
+
+import { FilesStoreState, initialState } from './initialState';
+import { FileAction, createFileSlice } from './slices/images';
+
+//  ===============  聚合 createStoreFn ============ //
+
+export type FileStore = FilesStoreState & FileAction;
+
+const createStore: StateCreator<FileStore, [['zustand/devtools', never]]> = (...parameters) => ({
+  ...initialState,
+  ...createFileSlice(...parameters),
+});
+
+//  ===============  实装 useStore ============ //
+
+export const useFileStore = createWithEqualityFn<FileStore>()(
+  devtools(createStore, {
+    name: 'LobeChat_File' + (isDev ? '_DEV' : ''),
+  }),
+  shallow,
+);

package/src/store/global/selectors/settings.test.ts

@@ -75,7 +75,7 @@ describe('settingsSelectors', () => {
       });
     });
   });
-  //
+
   // describe('defaultAgent', () => {
   //   it('should merge DEFAULT_AGENT and s.settings.defaultAgent correctly', () => {
   //     const s: GlobalStore = {
@@ -95,8 +95,6 @@ describe('settingsSelectors', () => {
   //
   //     const result = settingsSelectors.defaultAgent(s);
   //
-  //
-  //
   //     expect(result).toEqual(expected);
   //   });
   // });

package/src/store/market/action.ts

@@ -12,6 +12,7 @@ import type { Store } from './store';
 export interface StoreAction {
   activateAgent: (identifier: string) => void;
   deactivateAgent: () => void;
+  setSearchKeywords: (keywords: string) => void;
   updateAgentMap: (key: string, value: AgentsMarketItem) => void;
   useFetchAgent: (identifier: string) => SWRResponse<AgentsMarketItem>;
   useFetchAgentList: () => SWRResponse<LobeChatAgentsMarketIndex>;
@@ -29,6 +30,9 @@ export const createMarketAction: StateCreator<
   deactivateAgent: () => {
     set({ currentIdentifier: undefined }, false, 'deactivateAgent');
   },
+  setSearchKeywords: (keywords) => {
+    set({ searchKeywords: keywords });
+  },
   updateAgentMap: (key, value) => {
     const { agentMap } = get();
 
@@ -56,7 +60,11 @@ export const createMarketAction: StateCreator<
   useFetchAgentList: () =>
     useSWR<LobeChatAgentsMarketIndex>(getCurrentLanguage(), getAgentList, {
       onSuccess: (agentMarketIndex) => {
-        set({ agentList: agentMarketIndex.agents }, false, 'useFetchAgentList');
+        set(
+          { agentList: agentMarketIndex.agents, tagList: agentMarketIndex.tags },
+          false,
+          'useFetchAgentList',
+        );
       },
     }),
 });

package/src/store/market/initialState.ts

@@ -7,6 +7,7 @@ export interface StoreState {
   agentMap: MarketAgentMap;
   currentIdentifier: string;
   searchKeywords: string;
+  tagList: string[];
 }
 
 export const initialState: StoreState = {
@@ -14,4 +15,5 @@ export const initialState: StoreState = {
   agentMap: {},
   currentIdentifier: '',
   searchKeywords: '',
+  tagList: [],
 };