@lobehub/chat 0.105.2 → 0.107.0

package/src/store/chat/selectors/chat.ts

@@ -0,0 +1,119 @@
+import { LobePluginType } from '@lobehub/chat-plugin-sdk';
+import { t } from 'i18next';
+
+import { DEFAULT_INBOX_AVATAR, DEFAULT_USER_AVATAR } from '@/const/meta';
+import { INBOX_SESSION_ID } from '@/const/session';
+import { chatHelpers } from '@/store/chat/helpers';
+import { useGlobalStore } from '@/store/global';
+import { useSessionStore } from '@/store/session';
+import { agentSelectors } from '@/store/session/selectors';
+import { ChatMessage } from '@/types/chatMessage';
+import { merge } from '@/utils/merge';
+
+import type { ChatStore } from '../store';
+
+const getMeta = (message: ChatMessage) => {
+  switch (message.role) {
+    case 'user': {
+      return {
+        avatar: useGlobalStore.getState().settings.avatar || DEFAULT_USER_AVATAR,
+      };
+    }
+
+    case 'system': {
+      return message.meta;
+    }
+
+    case 'assistant': {
+      return agentSelectors.currentAgentMeta(useSessionStore.getState());
+    }
+
+    case 'function': {
+      // TODO: 后续改成将 plugin metadata 写入 message metadata 的方案
+      return {
+        avatar: '🧩',
+        title: 'plugin-unknown',
+      };
+    }
+  }
+};
+
+// 当前激活的消息列表
+const currentChats = (s: ChatStore): ChatMessage[] => {
+  if (!s.activeId) return [];
+
+  return s.messages.map((i) => ({ ...i, meta: getMeta(i) }));
+};
+
+const initTime = Date.now();
+// 针对新助手添加初始化时的自定义消息
+const currentChatsWithGuideMessage = (s: ChatStore): ChatMessage[] => {
+  const data = currentChats(s);
+
+  const isBrandNewChat = data.length === 0;
+
+  if (!isBrandNewChat) return data;
+
+  const [activeId, isInbox] = [s.activeId, s.activeId === INBOX_SESSION_ID];
+  const meta = agentSelectors.currentAgentMeta(useSessionStore.getState());
+
+  const inboxMsg = t('inbox.defaultMessage', { ns: 'chat' });
+  const agentSystemRoleMsg = t('agentDefaultMessageWithSystemRole', {
+    name: meta.title || t('defaultAgent'),
+    ns: 'chat',
+    systemRole: meta.description,
+  });
+  const agentMsg = t('agentDefaultMessage', {
+    id: activeId,
+    name: meta.title || t('defaultAgent'),
+    ns: 'chat',
+  });
+
+  const emptyInboxGuideMessage = {
+    content: isInbox ? inboxMsg : !!meta.description ? agentSystemRoleMsg : agentMsg,
+    createdAt: initTime,
+    extra: {},
+    id: 'default',
+    meta: merge({ avatar: DEFAULT_INBOX_AVATAR }, meta),
+    role: 'assistant',
+    updatedAt: initTime,
+  } as ChatMessage;
+
+  return [emptyInboxGuideMessage];
+};
+
+const currentChatsWithHistoryConfig = (s: ChatStore): ChatMessage[] => {
+  const chats = currentChats(s);
+  const config = agentSelectors.currentAgentConfig(useSessionStore.getState());
+
+  return chatHelpers.getSlicedMessagesWithConfig(chats, config);
+};
+
+const chatsMessageString = (s: ChatStore): string => {
+  const chats = currentChatsWithHistoryConfig(s);
+  return chats.map((m) => m.content).join('');
+};
+
+const getFunctionMessageProps =
+  ({ plugin, content, id }: Pick<ChatMessage, 'plugin' | 'content' | 'id'>) =>
+  (s: ChatStore) => ({
+    arguments: plugin?.arguments,
+    command: plugin,
+    content,
+    id: plugin?.identifier,
+    loading: id === s.chatLoadingId,
+    type: plugin?.type as LobePluginType,
+  });
+
+const getMessageById = (id: string) => (s: ChatStore) => {
+  return s.messages.find((m) => m.id === id);
+};
+
+export const chatSelectors = {
+  chatsMessageString,
+  currentChats,
+  currentChatsWithGuideMessage,
+  currentChatsWithHistoryConfig,
+  getFunctionMessageProps,
+  getMessageById,
+};

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

@@ -0,0 +1,2 @@
+export { chatSelectors } from './chat';
+export { topicSelectors } from './topic';

package/src/store/chat/selectors/topic.ts

@@ -0,0 +1,28 @@
+import { ChatTopic } from '@/types/topic';
+
+import { ChatStore } from '../store';
+
+const currentTopics = (s: ChatStore): ChatTopic[] => s.topics;
+
+const searchTopics = (s: ChatStore): ChatTopic[] => s.searchTopics;
+
+const displayTopics = (s: ChatStore): ChatTopic[] =>
+  s.isSearchingTopic ? searchTopics(s) : currentTopics(s);
+
+const currentUnFavTopics = (s: ChatStore): ChatTopic[] => s.topics.filter((s) => !s.favorite);
+
+const currentTopicLength = (s: ChatStore): number => currentTopics(s).length;
+
+const getTopicById =
+  (id: string) =>
+  (s: ChatStore): ChatTopic | undefined =>
+    currentTopics(s).find((topic) => topic.id === id);
+
+export const topicSelectors = {
+  currentTopicLength,
+  currentTopics,
+  currentUnFavTopics,
+  displayTopics,
+  getTopicById,
+  searchTopics,
+};

package/src/store/chat/store.ts

@@ -0,0 +1,63 @@
+import { PersistOptions, devtools, persist } from 'zustand/middleware';
+import { shallow } from 'zustand/shallow';
+import { createWithEqualityFn } from 'zustand/traditional';
+import { StateCreator } from 'zustand/vanilla';
+
+import { createHyperStorage } from '@/store/middleware/createHyperStorage';
+import { isDev } from '@/utils/env';
+
+import { ChatEnhanceAction, chatEnhance } from './actions/enhance';
+import { ChatMessageAction, chatMessage } from './actions/message';
+import { ChatPluginAction, chatPlugin } from './actions/plugin';
+import { ShareAction, chatShare } from './actions/share';
+import { ChatTopicAction, chatTopic } from './actions/topic';
+import { ChatStoreState, initialState } from './initialState';
+
+export interface ChatStoreAction
+  extends ChatMessageAction,
+    ChatTopicAction,
+    ShareAction,
+    ChatEnhanceAction,
+    ChatPluginAction {}
+
+export type ChatStore = ChatStoreAction & ChatStoreState;
+
+//  ===============  聚合 createStoreFn ============ //
+
+const createStore: StateCreator<ChatStore, [['zustand/devtools', never]]> = (...params) => ({
+  ...initialState,
+
+  ...chatMessage(...params),
+  ...chatTopic(...params),
+  ...chatShare(...params),
+  ...chatEnhance(...params),
+  ...chatPlugin(...params),
+});
+
+const persistOptions: PersistOptions<ChatStore> = {
+  name: 'LobeChat_Chat',
+
+  // 手动控制 Hydration ，避免 ssr 报错
+  skipHydration: true,
+
+  storage: createHyperStorage({
+    localStorage: false,
+    url: {
+      mode: 'hash',
+      selectors: [{ activeTopicId: 'topic' }],
+    },
+  }),
+  version: 0,
+};
+
+//  ===============  实装 useStore ============ //
+
+export const useChatStore = createWithEqualityFn<ChatStore>()(
+  persist(
+    devtools(createStore, {
+      name: 'LobeChat_Chat' + (isDev ? '_DEV' : ''),
+    }),
+    persistOptions,
+  ),
+  shallow,
+);

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

@@ -8,14 +8,13 @@ import { setNamespace } from '@/utils/storeDebug';
 
 import { FileStore } from '../../store';
 
-const t = setNamespace('files/image');
+const t = setNamespace('image');
 
-/**
- * 代理行为接口
- */
 export interface FileAction {
   clearImageList: () => void;
+  removeAllFiles: () => Promise<void>;
   removeFile: (id: string) => Promise<void>;
+
   setImageMapItem: (id: string, item: FilePreview) => void;
   uploadFile: (file: File) => Promise<void>;
 
@@ -31,6 +30,9 @@ export const createFileSlice: StateCreator<
   clearImageList: () => {
     set({ inputFilesList: [] }, false, t('clearImageList'));
   },
+  removeAllFiles: async () => {
+    await fileService.removeAllFiles();
+  },
   removeFile: async (id) => {
     await fileService.removeFile(id);
 

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

@@ -1,5 +1,104 @@
 // Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
 
+exports[`settingsSelectors > CUSTOM_MODELS > custom deletion, addition, and renaming of models 1`] = `
+[
+  {
+    "displayName": "llama",
+    "name": "llama",
+  },
+  {
+    "displayName": "claude-2",
+    "name": "claude-2",
+  },
+  {
+    "displayName": "gpt-4-32k",
+    "name": "gpt-4-1106-preview",
+  },
+]
+`;
+
+exports[`settingsSelectors > CUSTOM_MODELS > duplicate naming model 1`] = `
+[
+  {
+    "displayName": "gpt-3.5-turbo",
+    "name": "gpt-3.5-turbo",
+  },
+  {
+    "displayName": "gpt-3.5-turbo-1106",
+    "name": "gpt-3.5-turbo-1106",
+  },
+  {
+    "displayName": "gpt-3.5-turbo-16k",
+    "name": "gpt-3.5-turbo-16k",
+  },
+  {
+    "displayName": "gpt-4",
+    "name": "gpt-4",
+  },
+  {
+    "displayName": "gpt-4-32k",
+    "name": "gpt-4-32k",
+  },
+  {
+    "displayName": "gpt-4-vision-preview",
+    "name": "gpt-4-vision-preview",
+  },
+  {
+    "displayName": "gpt-4-32k",
+    "name": "gpt-4-1106-preview",
+  },
+]
+`;
+
+exports[`settingsSelectors > CUSTOM_MODELS > only add the model 1`] = `
+[
+  {
+    "displayName": "gpt-3.5-turbo",
+    "name": "gpt-3.5-turbo",
+  },
+  {
+    "displayName": "gpt-3.5-turbo-1106",
+    "name": "gpt-3.5-turbo-1106",
+  },
+  {
+    "displayName": "gpt-3.5-turbo-16k",
+    "name": "gpt-3.5-turbo-16k",
+  },
+  {
+    "displayName": "gpt-4",
+    "name": "gpt-4",
+  },
+  {
+    "displayName": "gpt-4-32k",
+    "name": "gpt-4-32k",
+  },
+  {
+    "displayName": "gpt-4-1106-preview",
+    "name": "gpt-4-1106-preview",
+  },
+  {
+    "displayName": "gpt-4-vision-preview",
+    "name": "gpt-4-vision-preview",
+  },
+  {
+    "displayName": "model1",
+    "name": "model1",
+  },
+  {
+    "displayName": "model2",
+    "name": "model2",
+  },
+  {
+    "displayName": "model3",
+    "name": "model3",
+  },
+  {
+    "displayName": "model4",
+    "name": "model4",
+  },
+]
+`;
+
 exports[`settingsSelectors > currentSettings > should merge DEFAULT_SETTINGS and s.settings correctly 1`] = `
 {
   "avatar": "avatar.jpg",

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

@@ -58,6 +58,57 @@ describe('settingsSelectors', () => {
     });
   });
 
+  describe('CUSTOM_MODELS', () => {
+    it('custom deletion, addition, and renaming of models', () => {
+      const s = {
+        settings: {
+          languageModel: {
+            openAI: {
+              customModelName:
+                '-all,+llama,+claude-2，-gpt-3.5-turbo,gpt-4-1106-preview=gpt-4-turbo,gpt-4-1106-preview=gpt-4-32k',
+            },
+          },
+        },
+      } as unknown as GlobalStore;
+
+      const result = settingsSelectors.modelList(s);
+
+      expect(result).toMatchSnapshot();
+    });
+
+    it('duplicate naming model', () => {
+      const s = {
+        settings: {
+          languageModel: {
+            openAI: {
+              customModelName: 'gpt-4-1106-preview=gpt-4-turbo，gpt-4-1106-preview=gpt-4-32k',
+            },
+          },
+        },
+      } as unknown as GlobalStore;
+
+      const result = settingsSelectors.modelList(s);
+
+      expect(result).toMatchSnapshot();
+    });
+
+    it('only add the model', () => {
+      const s = {
+        settings: {
+          languageModel: {
+            openAI: {
+              customModelName: 'model1,model2,model3，model4',
+            },
+          },
+        },
+      } as unknown as GlobalStore;
+
+      const result = settingsSelectors.modelList(s);
+
+      expect(result).toMatchSnapshot();
+    });
+  });
+
   // describe('defaultAgent', () => {
   //   it('should merge DEFAULT_AGENT and s.settings.defaultAgent correctly', () => {
   //     const s: GlobalStore = {

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

@@ -8,7 +8,7 @@ import {
   DEFAULT_TTS_CONFIG,
 } from '@/const/settings';
 import { Locales } from '@/locales/resources';
-import { GlobalSettings } from '@/types/settings';
+import { CustomModels, GlobalSettings } from '@/types/settings';
 import { isOnServerSide } from '@/utils/env';
 import { merge } from '@/utils/merge';
 
@@ -29,10 +29,41 @@ const openAIAPIKeySelectors = (s: GlobalStore) =>
 
 const openAIProxyUrlSelectors = (s: GlobalStore) => s.settings.languageModel.openAI.endpoint;
 
-const modelListSelectors = (s: GlobalStore) => [
-  ...DEFAULT_OPENAI_MODEL_LIST,
-  ...(s.settings.languageModel.openAI.customModelName || '').split(',').filter(Boolean),
-];
+const modelListSelectors = (s: GlobalStore) => {
+  let models: CustomModels = [];
+
+  const modelNames = [
+    ...DEFAULT_OPENAI_MODEL_LIST,
+    ...(s.settings.languageModel.openAI.customModelName || '').split(/[,，]/).filter(Boolean),
+  ];
+
+  for (const item of modelNames) {
+    const disable = item.startsWith('-');
+    const nameConfig = item.startsWith('+') || item.startsWith('-') ? item.slice(1) : item;
+    const [name, displayName] = nameConfig.split('=');
+
+    if (disable) {
+      // Disable all models.
+      if (name === 'all') {
+        models = [];
+      }
+      continue;
+    }
+
+    // Remove duplicate model entries.
+    const existingIndex = models.findIndex(({ name: n }) => n === name);
+    if (existingIndex !== -1) {
+      models.splice(existingIndex, 1);
+    }
+
+    models.push({
+      displayName: displayName || name,
+      name,
+    });
+  }
+
+  return models;
+};
 
 export const exportSettings = (s: GlobalStore) => {
   // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/src/store/global/store.ts

@@ -77,7 +77,7 @@ const persistOptions: PersistOptions<GlobalStore, GlobalPersist> = {
 export const useGlobalStore = createWithEqualityFn<GlobalStore>()(
   persist(
     devtools(createStore, {
-      name: 'LOBE_GLOBAL' + (isDev ? '_DEV' : ''),
+      name: 'LobeChat_Global' + (isDev ? '_DEV' : ''),
     }),
     persistOptions,
   ),

package/src/store/middleware/createHyperStorage/index.ts

@@ -10,9 +10,20 @@ import { creatUrlStorage } from './urlStorage';
 export const createHyperStorage = <T extends object>(
   options: HyperStorageOptions,
 ): PersistStorage<T> => {
+  const getLocalStorageConfig = () => {
+    if (options.localStorage === false) {
+      return { dbName: '', skipLocalStorage: true, useIndexedDB: false };
+    }
+
+    const useIndexedDB = options.localStorage?.mode === 'indexedDB';
+    const dbName = options.localStorage?.dbName || 'indexedDB';
+
+    return { dbName, skipLocalStorage: false, useIndexedDB };
+  };
+
   const hasUrl = !!options.url;
-  const useIndexedDB = options.localStorage?.mode === 'indexedDB';
-  const dbName = options.localStorage?.dbName || 'indexedDB';
+
+  const { skipLocalStorage, useIndexedDB, dbName } = getLocalStorageConfig();
 
   const { mapStateKeyToStorageKey, getStateKeyFromStorageKey } = createKeyMapper(options);
 
@@ -25,20 +36,22 @@ export const createHyperStorage = <T extends object>(
       let version: number | undefined;
 
       // ============== 处理 Local Storage  ============== //
-      let localState: StorageValue<T> | undefined;
+      if (!skipLocalStorage) {
+        let localState: StorageValue<T> | undefined;
 
-      // 如果使用 indexedDB，优先从 indexedDB 中获取
-      if (useIndexedDB) {
-        localState = await indexedDB.getItem(name);
-      }
-      // 如果 indexedDB 中不存在，则再试试 localStorage
-      if (!localState) localState = localStorage.getItem(name);
-
-      if (localState) {
-        version = localState.version;
-        for (const [k, v] of Object.entries(localState.state)) {
-          const key = getStateKeyFromStorageKey(k, 'localStorage');
-          if (key) state[key] = v;
+        // 如果使用 indexedDB，优先从 indexedDB 中获取
+        if (useIndexedDB) {
+          localState = await indexedDB.getItem(name);
+        }
+        // 如果 indexedDB 中不存在，则再试试 localStorage
+        if (!localState) localState = localStorage.getItem(name);
+
+        if (localState) {
+          version = localState.version;
+          for (const [k, v] of Object.entries(localState.state)) {
+            const key = getStateKeyFromStorageKey(k, 'localStorage');
+            if (key) state[key] = v;
+          }
         }
       }
 
@@ -62,11 +75,12 @@ export const createHyperStorage = <T extends object>(
     },
     removeItem: async (key) => {
       // ============== 处理 Local Storage  ============== //
-
-      if (useIndexedDB) {
-        await indexedDB.removeItem(key);
-      } else {
-        localStorage.removeItem(key);
+      if (!skipLocalStorage) {
+        if (useIndexedDB) {
+          await indexedDB.removeItem(key);
+        } else {
+          localStorage.removeItem(key);
+        }
       }
 
       // ============== 处理 URL Storage  ============== //
@@ -85,10 +99,12 @@ export const createHyperStorage = <T extends object>(
         if (localKey) localState[localKey] = v;
       }
 
-      if (useIndexedDB) {
-        await indexedDB.setItem(name, localState, newValue.version);
-      } else {
-        localStorage.setItem(name, localState, newValue.version);
+      if (!skipLocalStorage) {
+        if (useIndexedDB) {
+          await indexedDB.setItem(name, localState, newValue.version);
+        } else {
+          localStorage.setItem(name, localState, newValue.version);
+        }
       }
 
       // ============== 处理 URL Storage  ============== //

package/src/store/middleware/createHyperStorage/keyMapper.ts

@@ -5,7 +5,10 @@ export const createKeyMapper = (options: HyperStorageOptions) => {
     key: string,
     mode: keyof HyperStorageOptions = 'localStorage',
   ) => {
-    const selectors = options[mode]?.selectors;
+    const media = options[mode];
+    if (media === false) return key;
+
+    const selectors = media?.selectors;
     if (!selectors) return key;
 
     let storageKey: string | undefined;
@@ -27,7 +30,10 @@ export const createKeyMapper = (options: HyperStorageOptions) => {
     key: string,
     mode: keyof HyperStorageOptions = 'localStorage',
   ) => {
-    const selectors = options[mode]?.selectors;
+    const media = options[mode];
+    if (media === false) return key;
+
+    const selectors = media?.selectors;
     if (!selectors) return key;
 
     let stateKey: string | undefined;

package/src/store/middleware/createHyperStorage/type.ts

@@ -1,14 +1,16 @@
 export type StorageSelector = string | Record<string, string>;
 
+export interface LocalStorageOptions {
+  dbName?: string;
+  /**
+   * @default 'localStorage'
+   */
+  mode?: 'indexedDB' | 'localStorage';
+  selectors: StorageSelector[];
+}
+
 export interface HyperStorageOptions {
-  localStorage?: {
-    dbName?: string;
-    /**
-     * @default 'localStorage'
-     */
-    mode?: 'indexedDB' | 'localStorage';
-    selectors: StorageSelector[];
-  };
+  localStorage?: LocalStorageOptions | false;
   url?: {
     /**
      * @default 'hash'

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

@@ -48,7 +48,7 @@ export const createPluginSlice: StateCreator<
 
     let enabledPlugins: string[] = [];
 
-    for (const session of Object.values(sessions)) {
+    for (const session of sessions) {
       const plugins = session.config.plugins;
       if (!plugins || plugins.length === 0) continue;
 

package/src/store/plugin/store.ts

@@ -26,10 +26,8 @@ type SessionPersist = Pick<
   'pluginList' | 'pluginManifestMap' | 'pluginsSettings' | 'customPluginList'
 >;
 
-const storeName = 'LOBE_PLUGIN';
-
 const persistOptions: PersistOptions<PluginStore, SessionPersist> = {
-  name: storeName,
+  name: 'LOBE_PLUGIN',
 
   partialize: (s) => ({
     customPluginList: s.customPluginList,
@@ -48,7 +46,7 @@ const persistOptions: PersistOptions<PluginStore, SessionPersist> = {
 export const usePluginStore = createWithEqualityFn<PluginStore>()(
   persist(
     devtools(createStore, {
-      name: storeName + (isDev ? '_DEV' : ''),
+      name: 'LobeChat_Plugin' + (isDev ? '_DEV' : ''),
     }),
     persistOptions,
   ),

package/src/store/session/helpers.ts

@@ -1 +1 @@
-export * from './slices/chat/helpers';
+export * from './slices/session/helpers';

package/src/store/session/hooks/useSessionHydrated.ts

@@ -1,17 +1,13 @@
-import { useState } from 'react';
-
-import { sessionSelectors } from '../selectors';
 import { useSessionStore } from '../store';
-import { useEffectAfterSessionHydrated } from './useEffectAfterHydrated';
 
 export const useSessionHydrated = () => {
-  const hasInited = sessionSelectors.hasConversion(useSessionStore.getState());
+  const [fetchSessionsLoading, useFetchSessions] = useSessionStore((s) => [
+    s.fetchSessionsLoading,
 
-  const [isInit, setInit] = useState(hasInited);
+    s.useFetchSessions,
+  ]);
 
-  useEffectAfterSessionHydrated(() => {
-    if (!isInit) setInit(true);
-  }, []);
+  const { isLoading } = useFetchSessions();
 
-  return isInit;
+  return !(isLoading || fetchSessionsLoading);
 };