@lobehub/chat 1.2.1 → 1.2.2

package/CHANGELOG.md

@@ -2,6 +2,31 @@
 
 # Changelog
 
+### [Version 1.2.2](https://github.com/lobehub/lobe-chat/compare/v1.2.1...v1.2.2)
+
+<sup>Released on **2024-07-01**</sup>
+
+#### 🐛 Bug Fixes
+
+- **misc**: Display issue when select default model in System Agent.
+
+<br/>
+
+<details>
+<summary><kbd>Improvements and Fixes</kbd></summary>
+
+#### What's fixed
+
+- **misc**: Display issue when select default model in System Agent, closes [#3095](https://github.com/lobehub/lobe-chat/issues/3095) ([49f7f33](https://github.com/lobehub/lobe-chat/commit/49f7f33))
+
+</details>
+
+<div align="right">
+
+[![](https://img.shields.io/badge/-BACK_TO_TOP-151515?style=flat-square)](#readme-top)
+
+</div>
+
 ### [Version 1.2.1](https://github.com/lobehub/lobe-chat/compare/v1.2.0...v1.2.1)
 
 <sup>Released on **2024-07-01**</sup>

package/package.json

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

package/src/app/(main)/settings/system-agent/features/{AgentMeta.tsx → createForm.tsx}

@@ -10,19 +10,20 @@ import { FORM_STYLE } from '@/const/layoutTokens';
 import ModelSelect from '@/features/ModelSelect';
 import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
+import { type UserSystemAgentConfigKey } from '@/types/user/settings';
 
 import { useSyncSystemAgent } from './useSync';
 
 type SettingItemGroup = ItemGroup;
 
-const systemAgentKey = 'agentMeta';
-const AgentMeta = memo(() => {
+const SystemAgentForm = memo(({ systemAgentKey }: { systemAgentKey: UserSystemAgentConfigKey }) => {
   const { t } = useTranslation('setting');
-  const [form] = AntForm.useForm();
 
   const settings = useUserStore(settingsSelectors.currentSystemAgent, isEqual);
   const [updateSystemAgent] = useUserStore((s) => [s.updateSystemAgent]);
 
+  const [form] = AntForm.useForm();
+
   const systemAgentSettings: SettingItemGroup = {
     children: [
       {
@@ -42,7 +43,7 @@ const AgentMeta = memo(() => {
     title: t(`systemAgent.${systemAgentKey}.title`),
   };
 
-  useSyncSystemAgent(form);
+  useSyncSystemAgent(form, settings);
 
   return (
     <Form
@@ -55,4 +56,4 @@ const AgentMeta = memo(() => {
   );
 });
 
-export default AgentMeta;
+export default SystemAgentForm;

package/src/app/(main)/settings/system-agent/features/useSync.ts

@@ -3,21 +3,21 @@ import { useLayoutEffect } from 'react';
 
 import { useUserStore } from '@/store/user';
 
-export const useSyncSystemAgent = (form: FormInstance) => {
+export const useSyncSystemAgent = (form: FormInstance, settings: any) => {
   useLayoutEffect(() => {
-    // set the first time
-    form.setFieldsValue(useUserStore.getState().settings.systemAgent);
+    // Set initial form values
+    form.setFieldsValue(settings);
 
-    // sync with later updated settings
+    // Sync form values with updated settings
     const unsubscribe = useUserStore.subscribe(
       (s) => s.settings.systemAgent,
-      (settings) => {
-        form.setFieldsValue(settings);
+      (newSettings) => {
+        form.setFieldsValue(newSettings);
       },
     );
 
     return () => {
       unsubscribe();
     };
-  }, []);
+  }, [form, settings]);
 };

package/src/app/(main)/settings/system-agent/index.tsx

@@ -1,13 +1,11 @@
-import AgentMeta from './features/AgentMeta';
-import Topic from './features/Topic';
-import Translation from './features/Translation';
+import SystemAgentForm from './features/createForm';
 
 const Page = () => {
   return (
     <>
-      <Topic />
-      <Translation />
-      <AgentMeta />
+      <SystemAgentForm systemAgentKey="topic" />
+      <SystemAgentForm systemAgentKey="translation" />
+      <SystemAgentForm systemAgentKey="agentMeta" />
     </>
   );
 };

package/src/app/(main)/settings/system-agent/features/Topic.tsx

@@ -1,57 +0,0 @@
-'use client';
-
-import { Form, type ItemGroup } from '@lobehub/ui';
-import { Form as AntForm } from 'antd';
-import isEqual from 'fast-deep-equal';
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { FORM_STYLE } from '@/const/layoutTokens';
-import ModelSelect from '@/features/ModelSelect';
-import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
-
-import { useSyncSystemAgent } from './useSync';
-
-type SettingItemGroup = ItemGroup;
-
-const Topic = memo(() => {
-  const { t } = useTranslation('setting');
-  const [form] = AntForm.useForm();
-
-  const settings = useUserStore(settingsSelectors.currentSystemAgent, isEqual);
-  const [updateSystemAgent] = useUserStore((s) => [s.updateSystemAgent]);
-
-  const systemAgentSettings: SettingItemGroup = {
-    children: [
-      {
-        children: (
-          <ModelSelect
-            onChange={(props) => {
-              updateSystemAgent('topic', props);
-            }}
-            showAbility={false}
-          />
-        ),
-        desc: t('systemAgent.topic.modelDesc'),
-        label: t('systemAgent.topic.label'),
-        name: ['topic', 'model'],
-      },
-    ],
-    title: t('systemAgent.topic.title'),
-  };
-
-  useSyncSystemAgent(form);
-
-  return (
-    <Form
-      form={form}
-      initialValues={settings}
-      items={[systemAgentSettings]}
-      variant={'pure'}
-      {...FORM_STYLE}
-    />
-  );
-});
-
-export default Topic;

package/src/app/(main)/settings/system-agent/features/Translation.tsx

@@ -1,57 +0,0 @@
-'use client';
-
-import { Form, type ItemGroup } from '@lobehub/ui';
-import { Form as AntForm } from 'antd';
-import isEqual from 'fast-deep-equal';
-import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
-
-import { FORM_STYLE } from '@/const/layoutTokens';
-import ModelSelect from '@/features/ModelSelect';
-import { useUserStore } from '@/store/user';
-import { settingsSelectors } from '@/store/user/selectors';
-
-import { useSyncSystemAgent } from './useSync';
-
-type SettingItemGroup = ItemGroup;
-
-const Translation = memo(() => {
-  const { t } = useTranslation('setting');
-  const [form] = AntForm.useForm();
-
-  const settings = useUserStore(settingsSelectors.currentSystemAgent, isEqual);
-  const [updateSystemAgent] = useUserStore((s) => [s.updateSystemAgent]);
-
-  const systemAgentSettings: SettingItemGroup = {
-    children: [
-      {
-        children: (
-          <ModelSelect
-            onChange={(props) => {
-              updateSystemAgent('translation', props);
-            }}
-            showAbility={false}
-          />
-        ),
-        desc: t('systemAgent.translation.modelDesc'),
-        label: t('systemAgent.translation.label'),
-        name: ['translation', 'model'],
-      },
-    ],
-    title: t('systemAgent.translation.title'),
-  };
-
-  useSyncSystemAgent(form);
-
-  return (
-    <Form
-      form={form}
-      initialValues={settings}
-      items={[systemAgentSettings]}
-      variant={'pure'}
-      {...FORM_STYLE}
-    />
-  );
-});
-
-export default Translation;