@lobehub/chat 0.161.22 → 0.161.23

package/CHANGELOG.md

@@ -2,6 +2,39 @@
 
 # Changelog
 
+### [Version 0.161.23](https://github.com/lobehub/lobe-chat/compare/v0.161.22...v0.161.23)
+
+<sup>Released on **2024-05-27**</sup>
+
+#### ♻ Code Refactoring
+
+- **misc**: Refactor `keyVaults` and rename `endpoint` to `baseURL`.
+
+#### 💄 Styles
+
+- **misc**: Fix PluginStore layout.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### Code refactoring
+
+- **misc**: Refactor `keyVaults` and rename `endpoint` to `baseURL`, closes [#2673](https://github.com/lobehub/lobe-chat/issues/2673) ([4049bc7](https://github.com/lobehub/lobe-chat/commit/4049bc7))
+
+#### Styles
+
+- **misc**: Fix PluginStore layout, closes [#2590](https://github.com/lobehub/lobe-chat/issues/2590) [#2511](https://github.com/lobehub/lobe-chat/issues/2511) ([e1ae39b](https://github.com/lobehub/lobe-chat/commit/e1ae39b))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 0.161.22](https://github.com/lobehub/lobe-chat/compare/v0.161.21...v0.161.22)
 
 <sup>Released on **2024-05-26**</sup>

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "0.161.22",
+  "version": "0.161.23",
   "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",

package/src/app/(main)/chat/settings/features/SubmitAgentButton/SubmitAgentModal.tsx

@@ -17,7 +17,7 @@ import { agentSelectors } from '@/store/agent/selectors';
 import { useSessionStore } from '@/store/session';
 import { sessionMetaSelectors } from '@/store/session/selectors';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { userGeneralSettingsSelectors } from '@/store/user/selectors';
 
 const SubmitAgentModal = memo<ModalProps>(({ open, onCancel }) => {
   const { t } = useTranslation('setting');
@@ -25,7 +25,7 @@ const SubmitAgentModal = memo<ModalProps>(({ open, onCancel }) => {
   const systemRole = useAgentStore(agentSelectors.currentAgentSystemRole);
   const theme = useTheme();
   const meta = useSessionStore(sessionMetaSelectors.currentAgentMeta, isEqual);
-  const language = useUserStore((s) => settingsSelectors.currentSettings(s).language);
+  const language = useUserStore((s) => userGeneralSettingsSelectors.currentLanguage(s));
 
   const isMetaPass = Boolean(
     meta && meta.title && meta.description && (meta.tags as string[])?.length > 0 && meta.avatar,
@@ -46,7 +46,7 @@ const SubmitAgentModal = memo<ModalProps>(({ open, onCancel }) => {
       '### tags',
       (meta.tags as string[]).join(', '),
       '### locale',
-      language === 'auto' ? navigator.language : language,
+      language,
     ].join('\n\n');
 
     const url = qs.stringifyUrl({

package/src/app/(main)/settings/common/features/Common.tsx

@@ -110,7 +110,7 @@ const Common = memo(() => {
         desc: t('settingSystem.accessCode.desc'),
         hidden: !showAccessCodeConfig,
         label: t('settingSystem.accessCode.title'),
-        name: 'password',
+        name: ['keyVaults', 'password'],
       },
       {
         children: isSignedIn ? (

package/src/app/(main)/settings/common/features/Theme/ThemeSwatches/ThemeSwatchesNeutral.tsx

@@ -8,17 +8,17 @@ import {
 import { memo } from 'react';
 
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { userGeneralSettingsSelectors } from '@/store/user/selectors';
 
 const ThemeSwatchesNeutral = memo(() => {
-  const [neutralColor, setSettings] = useUserStore((s) => [
-    settingsSelectors.currentSettings(s).neutralColor,
-    s.setSettings,
+  const [neutralColor, updateGeneralConfig] = useUserStore((s) => [
+    userGeneralSettingsSelectors.neutralColor(s),
+    s.updateGeneralConfig,
   ]);
 
   const handleSelect = (v: any) => {
     const name = findCustomThemeName('neutral', v) as NeutralColors;
-    setSettings({ neutralColor: name || '' });
+    updateGeneralConfig({ neutralColor: name || '' });
   };
 
   return (

package/src/app/(main)/settings/common/features/Theme/ThemeSwatches/ThemeSwatchesPrimary.tsx

@@ -8,17 +8,17 @@ import {
 import { memo } from 'react';
 
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { userGeneralSettingsSelectors } from '@/store/user/selectors';
 
 const ThemeSwatchesPrimary = memo(() => {
-  const [primaryColor, setSettings] = useUserStore((s) => [
-    settingsSelectors.currentSettings(s).primaryColor,
-    s.setSettings,
+  const [primaryColor, updateGeneralConfig] = useUserStore((s) => [
+    userGeneralSettingsSelectors.primaryColor(s),
+    s.updateGeneralConfig,
   ]);
 
   const handleSelect = (v: any) => {
     const name = findCustomThemeName('primary', v) as PrimaryColors;
-    setSettings({ primaryColor: name || '' });
+    updateGeneralConfig({ primaryColor: name || '' });
   };
 
   return (

package/src/app/(main)/settings/common/features/Theme/index.tsx

@@ -14,7 +14,7 @@ import { imageUrl } from '@/const/url';
 import AvatarWithUpload from '@/features/AvatarWithUpload';
 import { localeOptions } from '@/locales/resources';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { settingsSelectors, userGeneralSettingsSelectors } from '@/store/user/selectors';
 import { switchLang } from '@/utils/client/switchLang';
 
 import { ThemeSwatchesNeutral, ThemeSwatchesPrimary } from './ThemeSwatches';
@@ -25,6 +25,7 @@ const Theme = memo(() => {
   const { t } = useTranslation('setting');
   const [form] = Form.useForm();
   const settings = useUserStore(settingsSelectors.currentSettings, isEqual);
+  const themeMode = useUserStore(userGeneralSettingsSelectors.currentThemeMode);
   const [setThemeMode, setSettings] = useUserStore((s) => [s.switchThemeMode, s.setSettings]);
 
   useSyncSettings(form);
@@ -40,7 +41,7 @@ const Theme = memo(() => {
       {
         children: (
           <SelectWithImg
-            defaultValue={settings.themeMode}
+            defaultValue={themeMode}
             height={60}
             onChange={setThemeMode}
             options={[
@@ -78,7 +79,7 @@ const Theme = memo(() => {
           />
         ),
         label: t('settingTheme.lang.title'),
-        name: 'language',
+        name: ['general', 'language'],
       },
       {
         children: (
@@ -113,7 +114,7 @@ const Theme = memo(() => {
         ),
         desc: t('settingTheme.fontSize.desc'),
         label: t('settingTheme.fontSize.title'),
-        name: 'fontSize',
+        name: ['general', 'fontSize'],
       },
       {
         children: <ThemeSwatchesPrimary />,

package/src/app/(main)/settings/llm/Azure/index.tsx

@@ -13,7 +13,7 @@ import { useUserStore } from '@/store/user';
 import { modelProviderSelectors } from '@/store/user/selectors';
 
 import ProviderConfig from '../components/ProviderConfig';
-import { LLMProviderApiTokenKey, LLMProviderBaseUrlKey, LLMProviderConfigKey } from '../const';
+import { KeyVaultsConfigKey, LLMProviderApiTokenKey } from '../const';
 
 const useStyles = createStyles(({ css, token }) => ({
   markdown: css`
@@ -57,13 +57,13 @@ const AzureOpenAIProvider = memo(() => {
           ),
           desc: t('azure.token.desc'),
           label: t('azure.token.title'),
-          name: [LLMProviderConfigKey, providerKey, LLMProviderApiTokenKey],
+          name: [KeyVaultsConfigKey, providerKey, LLMProviderApiTokenKey],
         },
         {
           children: <Input allowClear placeholder={t('azure.endpoint.placeholder')} />,
           desc: t('azure.endpoint.desc'),
           label: t('azure.endpoint.title'),
-          name: [LLMProviderConfigKey, providerKey, LLMProviderBaseUrlKey],
+          name: [KeyVaultsConfigKey, providerKey, 'endpoint'],
         },
         {
           children: (
@@ -85,7 +85,7 @@ const AzureOpenAIProvider = memo(() => {
             </Markdown>
           ),
           label: t('azure.azureApiVersion.title'),
-          name: [LLMProviderConfigKey, providerKey, 'apiVersion'],
+          name: [KeyVaultsConfigKey, providerKey, 'apiVersion'],
         },
       ]}
       checkModel={checkModel}

package/src/app/(main)/settings/llm/Bedrock/index.tsx

@@ -10,7 +10,7 @@ import { ModelProvider } from '@/libs/agent-runtime';
 import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import ProviderConfig from '../components/ProviderConfig';
-import { LLMProviderConfigKey } from '../const';
+import { KeyVaultsConfigKey } from '../const';
 
 const providerKey: GlobalLLMProviderKey = 'bedrock';
 
@@ -29,7 +29,7 @@ const BedrockProvider = memo(() => {
           ),
           desc: t(`${providerKey}.accessKeyId.desc`),
           label: t(`${providerKey}.accessKeyId.title`),
-          name: [LLMProviderConfigKey, providerKey, 'accessKeyId'],
+          name: [KeyVaultsConfigKey, providerKey, 'accessKeyId'],
         },
         {
           children: (
@@ -40,7 +40,7 @@ const BedrockProvider = memo(() => {
           ),
           desc: t(`${providerKey}.secretAccessKey.desc`),
           label: t(`${providerKey}.secretAccessKey.title`),
-          name: [LLMProviderConfigKey, providerKey, 'secretAccessKey'],
+          name: [KeyVaultsConfigKey, providerKey, 'secretAccessKey'],
         },
         {
           children: (
@@ -55,7 +55,7 @@ const BedrockProvider = memo(() => {
           ),
           desc: t(`${providerKey}.region.desc`),
           label: t(`${providerKey}.region.title`),
-          name: [LLMProviderConfigKey, providerKey, 'region'],
+          name: [KeyVaultsConfigKey, providerKey, 'region'],
         },
       ]}
       checkModel={'anthropic.claude-instant-v1'}

package/src/app/(main)/settings/llm/Ollama/Checker.tsx

@@ -27,7 +27,7 @@ const OllamaChecker = memo(() => {
   );
 
   const checkConnection = () => {
-    mutate();
+    mutate().catch();
   };
 
   const isMobile = useIsMobile();

package/src/app/(main)/settings/llm/components/ProviderConfig/index.tsx

@@ -10,6 +10,7 @@ import { Flexbox } from 'react-layout-kit';
 
 import { useSyncSettings } from '@/app/(main)/settings/hooks/useSyncSettings';
 import {
+  KeyVaultsConfigKey,
   LLMProviderApiTokenKey,
   LLMProviderBaseUrlKey,
   LLMProviderConfigKey,
@@ -17,7 +18,7 @@ import {
 } from '@/app/(main)/settings/llm/const';
 import { FORM_STYLE } from '@/const/layoutTokens';
 import { useUserStore } from '@/store/user';
-import { modelConfigSelectors } from '@/store/user/selectors';
+import { keyVaultsConfigSelectors, modelConfigSelectors } from '@/store/user/selectors';
 import { GlobalLLMProviderKey } from '@/types/user/settings';
 
 import Checker from '../Checker';
@@ -100,7 +101,7 @@ const ProviderConfig = memo<ProviderConfigProps>(
       s.setSettings,
       modelConfigSelectors.isProviderEnabled(provider)(s),
       modelConfigSelectors.isProviderFetchOnClient(provider)(s),
-      modelConfigSelectors.isProviderEndpointNotEmpty(provider)(s),
+      keyVaultsConfigSelectors.isProviderEndpointNotEmpty(provider)(s),
     ]);
 
     useSyncSettings(form);
@@ -117,7 +118,7 @@ const ProviderConfig = memo<ProviderConfigProps>(
             ),
             desc: modelT(`${provider}.token.desc` as any),
             label: modelT(`${provider}.token.title` as any),
-            name: [LLMProviderConfigKey, provider, LLMProviderApiTokenKey],
+            name: [KeyVaultsConfigKey, provider, LLMProviderApiTokenKey],
           },
         ];
 
@@ -128,7 +129,7 @@ const ProviderConfig = memo<ProviderConfigProps>(
         children: <Input allowClear placeholder={proxyUrl?.placeholder} />,
         desc: proxyUrl?.desc || t('llm.proxyUrl.desc'),
         label: proxyUrl?.title || t('llm.proxyUrl.title'),
-        name: [LLMProviderConfigKey, provider, LLMProviderBaseUrlKey],
+        name: [KeyVaultsConfigKey, provider, LLMProviderBaseUrlKey],
       },
       (showBrowserRequest || (showEndpoint && isProviderEndpointNotEmpty)) && {
         children: (

package/src/app/(main)/settings/llm/const.ts

@@ -1,4 +1,5 @@
 export const LLMProviderConfigKey = 'languageModel';
+export const KeyVaultsConfigKey = 'keyVaults';
 
 /**
  * we use this key to define default api key
@@ -10,7 +11,7 @@ export const LLMProviderApiTokenKey = 'apiKey';
  * we use this key to define the baseURL
  * equal OPENAI_PROXY_URL
  */
-export const LLMProviderBaseUrlKey = 'endpoint';
+export const LLMProviderBaseUrlKey = 'baseURL';
 
 /**
  * we use this key to define the custom model name

package/src/const/settings/common.ts

@@ -1,6 +1,6 @@
-import { UserGeneralSettings } from '@/types/user/settings';
+import { UserGeneralConfig } from '@/types/user/settings';
 
-export const DEFAULT_COMMON_SETTINGS: UserGeneralSettings = {
+export const DEFAULT_COMMON_SETTINGS: UserGeneralConfig = {
   fontSize: 14,
   language: 'auto',
   password: '',

package/src/const/settings/index.ts

@@ -18,10 +18,11 @@ export * from './tts';
 
 export const DEFAULT_SETTINGS: UserSettings = {
   defaultAgent: DEFAULT_AGENT,
+  general: DEFAULT_COMMON_SETTINGS,
+  keyVaults: {},
   languageModel: DEFAULT_LLM_CONFIG,
   sync: DEFAULT_SYNC_CONFIG,
   systemAgent: DEFAULT_SYSTEM_AGENT_CONFIG,
   tool: DEFAULT_TOOL_CONFIG,
   tts: DEFAULT_TTS_CONFIG,
-  ...DEFAULT_COMMON_SETTINGS,
 };

package/src/const/settings/llm.ts

@@ -21,85 +21,66 @@ import { UserModelProviderConfig } from '@/types/user/settings';
 
 export const DEFAULT_LLM_CONFIG: UserModelProviderConfig = {
   anthropic: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(AnthropicProviderCard),
   },
   azure: {
-    apiKey: '',
     enabled: false,
-    endpoint: '',
   },
   bedrock: {
-    accessKeyId: '',
     enabled: false,
     enabledModels: filterEnabledModels(BedrockProviderCard),
-    region: 'us-east-1',
-    secretAccessKey: '',
   },
   deepseek: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(DeepSeekProviderCard),
   },
   google: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(GoogleProviderCard),
   },
   groq: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(GroqProviderCard),
   },
   minimax: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(MinimaxProviderCard),
   },
   mistral: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(MistralProviderCard),
   },
   moonshot: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(MoonshotProviderCard),
   },
   ollama: {
     enabled: true,
     enabledModels: filterEnabledModels(OllamaProviderCard),
-    endpoint: '',
     fetchOnClient: true,
   },
   openai: {
-    apiKey: '',
     enabled: true,
     enabledModels: filterEnabledModels(OpenAIProviderCard),
   },
   openrouter: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(OpenRouterProviderCard),
   },
   perplexity: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(PerplexityProviderCard),
   },
   togetherai: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(TogetherAIProviderCard),
   },
   zeroone: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(ZeroOneProviderCard),
   },
   zhipu: {
-    apiKey: '',
     enabled: false,
     enabledModels: filterEnabledModels(ZhiPuProviderCard),
   },

package/src/database/client/core/db.ts

@@ -2,6 +2,7 @@ import Dexie, { Transaction } from 'dexie';
 
 import { MigrationLLMSettings } from '@/migrations/FromV3ToV4';
 import { MigrationAgentChatConfig } from '@/migrations/FromV5ToV6';
+import { MigrationKeyValueSettings } from '@/migrations/FromV6ToV7';
 import { uuid } from '@/utils/uuid';
 
 import { DB_File } from '../schemas/files';
@@ -77,6 +78,10 @@ export class BrowserDB extends Dexie {
       .stores(dbSchemaV9)
       .upgrade((trans) => this.upgradeToV10(trans));
 
+    this.version(11)
+      .stores(dbSchemaV9)
+      .upgrade((trans) => this.upgradeToV11(trans));
+
     this.files = this.table('files');
     this.sessions = this.table('sessions');
     this.messages = this.table('messages');
@@ -207,6 +212,20 @@ export class BrowserDB extends Dexie {
         session.config = MigrationAgentChatConfig.migrateChatConfig(session.config as any);
     });
   };
+
+  /**
+   * 2024.05.27
+   * migrate apiKey in languageModel to keyVaults
+   */
+  upgradeToV11 = async (trans: Transaction) => {
+    const users = trans.table('users');
+
+    await users.toCollection().modify((user: DB_User) => {
+      if (user.settings) {
+        user.settings = MigrationKeyValueSettings.migrateSettings(user.settings as any);
+      }
+    });
+  };
 }
 
 export const browserDB = new BrowserDB();

package/src/database/client/core/schemas.ts

@@ -76,10 +76,11 @@ export const dbSchemaV7 = {
   plugins:
     '&identifier, id, type, manifest.type, manifest.meta.title, manifest.meta.description, manifest.meta.author, createdAt, updatedAt',
 };
+
 // ************************************** //
-// ******* Version 9 - 2024-03-14 ******* //
+// ******* Version 9 - 2024-05-11 ******* //
 // ************************************** //
-// - Added id to `plugins` table
+// - Added tool_call_id to `messages` table
 export const dbSchemaV9 = {
   ...dbSchemaV7,
   messages:

package/src/database/client/models/__tests__/user.test.ts

@@ -1,7 +1,5 @@
 import { afterEach, beforeEach, describe, expect, it } from 'vitest';
 
-import { UserSettings } from '@/types/user/settings';
-
 import { UserModel } from '../user';
 
 describe('UserModel', () => {
@@ -51,17 +49,19 @@ describe('UserModel', () => {
   it('should update user settings', async () => {
     await UserModel.create(userData);
 
-    await UserModel.updateSettings({ themeMode: 'dark' });
+    await UserModel.updateSettings({ general: { themeMode: 'dark' } });
 
     const userInDb = await UserModel.getUser();
 
-    expect(userInDb).toHaveProperty('settings', { themeMode: 'dark' });
+    expect(userInDb).toHaveProperty('settings', {
+      general: { themeMode: 'dark' },
+    });
   });
 
   it('should reset user settings', async () => {
     await UserModel.create(userData);
 
-    await UserModel.updateSettings({ themeMode: 'dark' });
+    await UserModel.updateSettings({ general: { themeMode: 'dark' } });
 
     await UserModel.resetSettings();
 

package/src/database/client/models/user.ts

@@ -2,10 +2,9 @@ import { DeepPartial } from 'utility-types';
 
 import { BaseModel } from '@/database/client/core';
 import { LobeAgentConfig } from '@/types/agent';
-import { UserSettings } from '@/types/user/settings';
 import { uuid } from '@/utils/uuid';
 
-import { DB_User, DB_UserSchema } from '../schemas/user';
+import { DB_Settings, DB_User, DB_UserSchema } from '../schemas/user';
 
 class _UserModel extends BaseModel {
   constructor() {
@@ -42,7 +41,7 @@ class _UserModel extends BaseModel {
 
   // **************** Update *************** //
 
-  async updateSettings(settings: DeepPartial<UserSettings>) {
+  async updateSettings(settings: DeepPartial<DB_Settings>) {
     const user = await this.getUser();
 
     return this.update(user.id, { settings: settings as any });

package/src/database/client/schemas/user.ts

@@ -3,16 +3,22 @@ import { z } from 'zod';
 import { AgentSchema } from '@/database/client/schemas/session';
 import { LobeMetaDataSchema } from '@/types/meta';
 
+const generalSechma = z.object({
+  fontSize: z.number().default(14),
+  language: z.string(),
+  neutralColor: z.string().optional(),
+  password: z.string(),
+  themeMode: z.string(),
+});
+
 const settingsSchema = z.object({
   defaultAgent: z.object({
     config: AgentSchema,
     meta: LobeMetaDataSchema,
   }),
-  fontSize: z.number().default(14),
-  language: z.string(),
+  general: generalSechma.partial().optional(),
+  keyVaults: z.any().optional(),
   languageModel: z.any().optional(),
-  password: z.string(),
-  themeMode: z.string(),
   tts: z.object({
     openAI: z.object({
       sttModel: z.string(),

package/src/features/AgentSetting/AgentMeta/index.tsx

@@ -11,7 +11,7 @@ import { useTranslation } from 'react-i18next';
 
 import { FORM_STYLE } from '@/const/layoutTokens';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { userGeneralSettingsSelectors } from '@/store/user/selectors';
 
 import { useStore } from '../store';
 import { SessionLoadingState } from '../store/initialState';
@@ -30,7 +30,7 @@ const AgentMeta = memo(() => {
     s.autocompleteMeta,
     s.autocompleteAllMeta,
   ]);
-  const locale = useUserStore(settingsSelectors.currentLanguage);
+  const locale = useUserStore(userGeneralSettingsSelectors.currentLanguage);
   const loading = useStore((s) => s.autocompleteLoading);
   const meta = useStore((s) => s.meta, isEqual);
 
@@ -132,4 +132,4 @@ const AgentMeta = memo(() => {
   return <Form items={[metaData]} itemsType={'group'} variant={'pure'} {...FORM_STYLE} />;
 });
 
-export default AgentMeta;
+export default AgentMeta;

package/src/features/AgentSetting/AgentTTS/index.tsx

@@ -10,7 +10,7 @@ import { useTranslation } from 'react-i18next';
 
 import { FORM_STYLE } from '@/const/layoutTokens';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { userGeneralSettingsSelectors } from '@/store/user/selectors';
 
 import { useStore } from '../store';
 import { useAgentSyncSettings } from '../useSyncAgemtSettings';
@@ -24,7 +24,7 @@ const AgentTTS = memo(() => {
   const { t } = useTranslation('setting');
   const [form] = Form.useForm();
   const voiceList = useUserStore((s) => {
-    const locale = settingsSelectors.currentLanguage(s);
+    const locale = userGeneralSettingsSelectors.currentLanguage(s);
     return (all?: boolean) => new VoiceList(all ? undefined : locale);
   });
   const [showAllLocaleVoice, ttsService, updateConfig] = useStore((s) => [

package/src/features/ChatInput/STT/browser.tsx

@@ -9,7 +9,7 @@ import { agentSelectors } from '@/store/agent/slices/chat';
 import { useChatStore } from '@/store/chat';
 import { chatSelectors } from '@/store/chat/selectors';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { settingsSelectors, userGeneralSettingsSelectors } from '@/store/user/selectors';
 import { ChatMessageError } from '@/types/message';
 import { getMessageError } from '@/utils/fetch';
 
@@ -22,7 +22,7 @@ interface STTConfig extends SWRConfiguration {
 const useBrowserSTT = (config: STTConfig) => {
   const ttsSettings = useUserStore(settingsSelectors.currentTTS, isEqual);
   const ttsAgentSettings = useAgentStore(agentSelectors.currentAgentTTS, isEqual);
-  const locale = useUserStore(settingsSelectors.currentLanguage);
+  const locale = useUserStore(userGeneralSettingsSelectors.currentLanguage);
 
   const autoStop = ttsSettings.sttAutoStop;
   const sttLocale =

package/src/features/ChatInput/STT/openai.tsx

@@ -12,7 +12,7 @@ import { agentSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
 import { chatSelectors } from '@/store/chat/slices/message/selectors';
 import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
+import { settingsSelectors, userGeneralSettingsSelectors } from '@/store/user/selectors';
 import { ChatMessageError } from '@/types/message';
 import { getMessageError } from '@/utils/fetch';
 
@@ -25,7 +25,7 @@ interface STTConfig extends SWRConfiguration {
 const useOpenaiSTT = (config: STTConfig) => {
   const ttsSettings = useUserStore(settingsSelectors.currentTTS, isEqual);
   const ttsAgentSettings = useAgentStore(agentSelectors.currentAgentTTS, isEqual);
-  const locale = useUserStore(settingsSelectors.currentLanguage);
+  const locale = useUserStore(userGeneralSettingsSelectors.currentLanguage);
 
   const autoStop = ttsSettings.sttAutoStop;
   const sttLocale =