@lobehub/chat 0.92.0 → 0.94.0

package/src/app/chat/settings/features/SubmitAgentButton/style.ts

@@ -0,0 +1,46 @@
+import { createStyles } from 'antd-style';
+
+export const useStyles = createStyles(({ css, token, prefixCls }) => ({
+  author: css`
+    font-size: 12px;
+  `,
+
+  avatar: css`
+    flex: none;
+  `,
+  container: css`
+    position: relative;
+    padding: 16px 16px 24px;
+    border-bottom: 1px solid ${token.colorBorderSecondary};
+  `,
+  date: css`
+    font-size: 12px;
+    color: ${token.colorTextDescription};
+  `,
+  desc: css`
+    color: ${token.colorTextDescription};
+    text-align: center;
+  `,
+  loading: css`
+    .${prefixCls}-skeleton-content {
+      display: flex;
+      flex-direction: column;
+    }
+  `,
+  nav: css`
+    padding-top: 4px;
+
+    .${prefixCls}-tabs-tab {
+      margin: 4px !important;
+
+      + .${prefixCls}-tabs-tab {
+        margin: 4px !important;
+      }
+    }
+  `,
+  title: css`
+    font-size: 20px;
+    font-weight: 600;
+    text-align: center;
+  `,
+}));

package/src/app/market/features/AgentSearchBar/index.tsx

@@ -1,6 +1,6 @@
 import { SearchBar } from '@lobehub/ui';
 import { useResponsive } from 'antd-style';
-import { memo } from 'react';
+import { memo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { useMarketStore } from '@/store/market';
@@ -8,17 +8,20 @@ import { useMarketStore } from '@/store/market';
 const AgentSearchBar = memo(() => {
   const { t } = useTranslation('market');
   const keywords = useMarketStore((s) => s.searchKeywords);
+  const [value, setValue] = useState(keywords);
   const { mobile } = useResponsive();
   return (
     <SearchBar
       allowClear
       enableShortKey={!mobile}
-      onChange={(e) => useMarketStore.setState({ searchKeywords: e.target.value })}
+      onChange={(e) => setValue(e.target.value)}
+      onPressEnter={() => useMarketStore.setState({ searchKeywords: value })}
+      onSubmit={() => useMarketStore.setState({ searchKeywords: value })}
       placeholder={t('search.placeholder')}
       shortKey={'k'}
       spotlight={!mobile}
       type={mobile ? 'block' : 'ghost'}
-      value={keywords}
+      value={value}
     />
   );
 });

package/src/chains/langDetect.ts

@@ -0,0 +1,31 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+export const chainLangDetect = (content: string): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content:
+        '你是一名精通全世界语言的语言专家，你需要识别用户输入的内容，以国际标准 locale 进行输出',
+      role: 'system',
+    },
+    {
+      content: '{你好}',
+      role: 'user',
+    },
+    {
+      content: 'zh-CN',
+      role: 'assistant',
+    },
+    {
+      content: '{hello}',
+      role: 'user',
+    },
+    {
+      content: 'en-US',
+      role: 'assistant',
+    },
+    {
+      content: `{${content}}`,
+      role: 'user',
+    },
+  ],
+});

package/src/chains/pickEmoji.ts

@@ -0,0 +1,31 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+/**
+ * pick emoji for user prompt
+ * @param content
+ */
+export const chainPickEmoji = (content: string): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content:
+        '你是一名擅长进行概念抽象的设计师与 Emoji 专家，你需要根据角色能力的描述抽象出一个表达物理实体的概念 Emoji 作为角色头像, 格式要求如下：\n输入: {文本作为JSON引用字符串}\n输出: {一个Emoji}',
+      role: 'system',
+    },
+    {
+      content: `输入: {你是一名文案大师，帮我为一些设计 / 艺术作品起名，名字需要有文学内涵，注重精炼和赋子意境，表达作品的情景氛国，使名称既简洁又富有诗意。}`,
+      role: 'user',
+    },
+    { content: '✒️', role: 'assistant' },
+    {
+      content: `输入: {你是一名代码巫师，请将下面的代码转成 ts，不要修改实现。如果原本 js 中没有定义的全局变量，需要补充 declare 的类型声明。}`,
+      role: 'user',
+    },
+    { content: '🧙‍♂️', role: 'assistant' },
+    {
+      content: `输入: {你是一名创业计划撰写专家，可以提供包括创意名称、简短的标语、目标用户画像、用户痛点、主要价值主张、销售/营销渠道、收入流、成本结构等计划生成。}`,
+      role: 'user',
+    },
+    { content: '🚀', role: 'assistant' },
+    { content: `输入: {${content}}`, role: 'user' },
+  ],
+});

package/src/chains/summaryAgentName.ts

@@ -0,0 +1,30 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+/**
+ * summary agent name for user prompt
+ * @param content
+ */
+export const chainSummaryAgentName = (content: string): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content: `你是一名擅长起名的起名大师，名字需要有文学内涵，注重精炼和赋子意境，你需要将用户的描述总结为 20 个字以内的角色, 格式要求如下：\n输入: {文本作为JSON引用字符串}\n输出: {角色名}`,
+      role: 'system',
+    },
+    {
+      content: `输入: {你是一名文案大师，帮我为一些设计 / 艺术作品起名，名字需要有文学内涵，注重精炼和赋子意境，表达作品的情景氛国，使名称既简洁又富有诗意。}`,
+      role: 'user',
+    },
+    { content: '创意命名师', role: 'assistant' },
+    {
+      content: `输入: {你是一名前端代码专家，请将下面的代码转成 ts，不要修改实现。如果原本 js 中没有定义的全局变量，需要补充 declare 的类型声明。}`,
+      role: 'user',
+    },
+    { content: 'ts转换魔术师', role: 'assistant' },
+    {
+      content: `输入: {你是一名创业计划撰写专家，可以提供包括创意名称、简短的标语、目标用户画像、用户痛点、主要价值主张、销售/营销渠道、收入流、成本结构等计划生成。}`,
+      role: 'user',
+    },
+    { content: '创业咨询专家', role: 'assistant' },
+    { content: `输入: {${content}}`, role: 'user' },
+  ],
+});

package/src/chains/summaryDescription.ts

@@ -0,0 +1,26 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+export const chainSummaryDescription = (content: string): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content: `你是一名擅长技能总结的助理，你需要将用户的输入的内容总结为一个角色技能简介，确保信息清晰、逻辑清晰，并有效地传达角色的技能和经验，不超过 20 个字, 格式要求如下：\n输入: {文本作为JSON引用字符串}\n输出: {角色技能简介}`,
+      role: 'system',
+    },
+    {
+      content: `输入: {你是一名文案大师，帮我为一些设计 / 艺术作品起名，名字需要有文学内涵，注重精炼和赋子意境，表达作品的情景氛国，使名称既简洁又富有诗意。}`,
+      role: 'user',
+    },
+    { content: '擅长文创艺术作品起名', role: 'assistant' },
+    {
+      content: `输入: {你是一名前端代码专家，请将下面的代码转成 ts，不要修改实现。如果原本 js 中没有定义的全局变量，需要补充 declare 的类型声明。}`,
+      role: 'user',
+    },
+    { content: '擅长 ts 转换和补充类型声明', role: 'assistant' },
+    {
+      content: `输入: {你是一名创业计划撰写专家，可以提供包括创意名称、简短的标语、目标用户画像、用户痛点、主要价值主张、销售/营销渠道、收入流、成本结构等计划生成。}`,
+      role: 'user',
+    },
+    { content: '擅长创业计划撰写与咨询', role: 'assistant' },
+    { content: `输入: {${content}}`, role: 'user' },
+  ],
+});

package/src/chains/summaryTags.ts

@@ -0,0 +1,27 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+export const chainSummaryTags = (content: string): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content:
+        '你是一名擅长会话标签总结的助理，你需要将用户的输入的内容提炼出分类标签，使用`,`分隔，不超过 5 个标签, 格式要求如下：\n输入: {文本作为JSON引用字符串}\n输出: {角色名}',
+      role: 'system',
+    },
+    {
+      content: `输入: {你是一名文案大师，帮我为一些设计 / 艺术作品起名，名字需要有文学内涵，注重精炼和赋子意境，表达作品的情景氛国，使名称既简洁又富有诗意。}`,
+      role: 'user',
+    },
+    { content: '起名,写作,创意', role: 'assistant' },
+    {
+      content: `输入: {你是一名前端专家，请将下面的代码转成 ts，不要修改实现。如果原本 js 中没有定义的全局变量，需要补充 declare 的类型声明。}`,
+      role: 'user',
+    },
+    { content: '代码,软件开发,效率', role: 'assistant' },
+    {
+      content: `输入: {你是一名创业计划撰写专家，可以提供包括创意名称、简短的标语、目标用户画像、用户痛点、主要价值主张、销售/营销渠道、收入流、成本结构等计划生成。}`,
+      role: 'user',
+    },
+    { content: '创业,计划,咨询', role: 'assistant' },
+    { content: `输入: {${content}}`, role: 'user' },
+  ],
+});

package/src/chains/summaryTitle.ts

@@ -0,0 +1,32 @@
+import { chatHelpers } from '@/store/session/slices/chat/helpers';
+import { LanguageModel } from '@/types/llm';
+import { OpenAIChatMessage, OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+export const chainSummaryTitle = async (
+  messages: OpenAIChatMessage[],
+): Promise<Partial<OpenAIChatStreamPayload>> => {
+  const finalMessages: OpenAIChatMessage[] = [
+    {
+      content:
+        '你是一名擅长会话的助理，你需要将用户的会话总结为 10 个字以内的标题，不需要包含标点符号',
+      role: 'system',
+    },
+    {
+      content: `${messages.map((message) => `${message.role}: ${message.content}`).join('\n')}
+
+请总结上述对话为10个字以内的标题，不需要包含标点符号`,
+      role: 'user',
+    },
+  ];
+  // 如果超过 4k，则使用 GPT3.5 16K 模型
+  const tokens = await chatHelpers.getMessagesTokenCount(finalMessages);
+  let model: LanguageModel | undefined = undefined;
+  if (tokens > 4000) {
+    model = LanguageModel.GPT3_5_16K;
+  }
+
+  return {
+    messages: finalMessages,
+    model,
+  };
+};

package/src/chains/translate.ts

@@ -0,0 +1,17 @@
+import { OpenAIChatStreamPayload } from '@/types/openai/chat';
+
+export const chainTranslate = (
+  content: string,
+  targetLang: string,
+): Partial<OpenAIChatStreamPayload> => ({
+  messages: [
+    {
+      content: '你是一名擅长翻译的助理，你需要将输入的语言翻译为目标语言',
+      role: 'system',
+    },
+    {
+      content: `请将以下内容 ${content}，翻译为 ${targetLang} `,
+      role: 'user',
+    },
+  ],
+});

package/src/components/HotKeys/index.tsx

@@ -47,9 +47,9 @@ const HotKeys = memo<HotKeysProps>(({ keys, desc }) => {
 
   if (!desc) return content;
   return (
-    <Flexbox align={'center'} gap={8} horizontal>
-      {content}
+    <Flexbox align={'center'} style={{ textAlign: 'center' }}>
       {desc}
+      {content}
     </Flexbox>
   );
 });

package/src/components/ResponsiveIndex/index.tsx

@@ -14,10 +14,12 @@ const ResponsiveIndex = ({ children, Mobile }: ResponsiveIndexProps) => {
   const { t } = useTranslation();
   const mobile = useIsMobile();
 
-  return (
+  return mobile ? (
     <Suspense fallback={<FullscreenLoading title={t('layoutInitializing', { ns: 'common' })} />}>
-      {mobile ? <Mobile /> : children}
+      <Mobile />
     </Suspense>
+  ) : (
+    children
   );
 };
 

package/src/const/url.ts

@@ -43,6 +43,7 @@ export const getAgentJSON = (
 };
 
 export const AGENTS_INDEX_GITHUB = 'https://github.com/lobehub/lobe-chat-agents';
+export const AGENTS_INDEX_GITHUB_ISSUE = urlJoin(AGENTS_INDEX_GITHUB, 'issues/new');
 
 export const SESSION_CHAT_URL = (id: string = INBOX_SESSION_ID, mobile?: boolean) =>
   mobile ? `/chat/mobile#session=${id}` : `/chat#session=${id}`;

package/src/features/AgentInfo/index.tsx

@@ -0,0 +1,69 @@
+import { Avatar, Markdown, Tag } from '@lobehub/ui';
+import { Divider } from 'antd';
+import { createStyles } from 'antd-style';
+import { startCase } from 'lodash-es';
+import { CSSProperties, memo } from 'react';
+import { Center } from 'react-layout-kit';
+
+import { MetaData } from '@/types/meta';
+
+const useStyles = createStyles(({ css, token }) => ({
+  avatar: css`
+    flex: none;
+  `,
+  desc: css`
+    color: ${token.colorTextDescription};
+    text-align: center;
+  `,
+
+  title: css`
+    font-size: 20px;
+    font-weight: 600;
+    text-align: center;
+  `,
+}));
+
+export interface AgentInfoProps {
+  meta?: MetaData;
+  style?: CSSProperties;
+  systemRole?: string;
+}
+
+const AgentInfo = memo<AgentInfoProps>(({ systemRole, style, meta }) => {
+  const { styles, theme } = useStyles();
+
+  if (!meta) return;
+
+  return (
+    <Center gap={16} style={style}>
+      {meta.avatar && (
+        <Avatar
+          animation
+          avatar={meta.avatar}
+          background={meta.backgroundColor || theme.colorFillTertiary}
+          className={styles.avatar}
+          size={100}
+        />
+      )}
+      {meta.title && <div className={styles.title}>{meta.title}</div>}
+      {(meta?.tags as string[])?.length > 0 && (
+        <Center gap={6} horizontal style={{ flexWrap: 'wrap' }}>
+          {(meta.tags as string[]).map((tag: string, index) => (
+            <Tag key={index} style={{ margin: 0 }}>
+              {startCase(tag).trim()}
+            </Tag>
+          ))}
+        </Center>
+      )}
+      {meta.description && <div className={styles.desc}>{meta.description}</div>}
+      {systemRole && (
+        <>
+          <Divider style={{ margin: '8px 0' }} />
+          <Markdown>{systemRole}</Markdown>
+        </>
+      )}
+    </Center>
+  );
+});
+
+export default AgentInfo;

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

@@ -0,0 +1,48 @@
+import { ActionIcon } from '@lobehub/ui';
+import { Select, SelectProps } from 'antd';
+import { useTheme } from 'antd-style';
+import { isString } from 'lodash-es';
+import { Wand2 } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+export interface AutoGenerateInputProps extends SelectProps {
+  loading?: boolean;
+  onGenerate?: () => void;
+}
+
+const AutoGenerateSelect = memo<AutoGenerateInputProps>(
+  ({ loading, onGenerate, value, ...props }) => {
+    const { t } = useTranslation('common');
+    const theme = useTheme();
+
+    return (
+      <Select
+        mode="tags"
+        open={false}
+        style={{ width: '100%' }}
+        suffixIcon={
+          onGenerate && (
+            <ActionIcon
+              active
+              icon={Wand2}
+              loading={loading}
+              onClick={onGenerate}
+              size={'small'}
+              style={{
+                color: theme.colorInfo,
+                marginRight: -4,
+              }}
+              title={t('autoGenerate')}
+            />
+          )
+        }
+        tokenSeparators={[',', '，', ' ']}
+        value={isString(value) ? value.split(',') : value}
+        {...props}
+      />
+    );
+  },
+);
+
+export default AutoGenerateSelect;

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

@@ -1,6 +1,7 @@
 import { Form, type FormItemProps, Icon, type ItemGroup, Tooltip } from '@lobehub/ui';
 import { Button } from 'antd';
 import isEqual from 'fast-deep-equal';
+import { isString } from 'lodash-es';
 import { UserCircle, Wand2 } from 'lucide-react';
 import dynamic from 'next/dynamic';
 import { memo, useMemo } from 'react';
@@ -11,6 +12,7 @@ import { FORM_STYLE } from '@/const/layoutTokens';
 import { useStore } from '../store';
 import { SessionLoadingState } from '../store/initialState';
 import AutoGenerateInput from './AutoGenerateInput';
+import AutoGenerateSelect from './AutoGenerateSelect';
 import BackgroundSwatches from './BackgroundSwatches';
 
 const EmojiPicker = dynamic(() => import('@/components/EmojiPicker'), { ssr: false });
@@ -28,26 +30,35 @@ const AgentMeta = memo(() => {
 
   const basic = [
     {
+      Render: AutoGenerateInput,
       key: 'title',
       label: t('settingAgent.name.title'),
+      onChange: (e: any) => updateMeta({ title: e.target.value }),
       placeholder: t('settingAgent.name.placeholder'),
     },
     {
+      Render: AutoGenerateInput,
       key: 'description',
       label: t('settingAgent.description.title'),
+      onChange: (e: any) => updateMeta({ description: e.target.value }),
       placeholder: t('settingAgent.description.placeholder'),
     },
-    // { key: 'tag', label: t('agentTag'), placeholder: t('agentTagPlaceholder') },
+    {
+      Render: AutoGenerateSelect,
+      key: 'tags',
+      label: t('settingAgent.tag.title'),
+      onChange: (e: any) => updateMeta({ tags: isString(e) ? e.split(',') : e }),
+      placeholder: t('settingAgent.tag.placeholder'),
+    },
   ];
 
   const autocompleteItems: FormItemProps[] = basic.map((item) => {
+    const AutoGenerate = item.Render;
     return {
       children: (
-        <AutoGenerateInput
+        <AutoGenerate
           loading={loading[item.key as keyof SessionLoadingState]}
-          onChange={(e) => {
-            updateMeta({ [item.key]: e.target.value });
-          }}
+          onChange={item.onChange}
           onGenerate={() => {
             autocompleteMeta(item.key as keyof typeof meta);
           }}

package/src/features/AgentSetting/store/action.ts

@@ -1,6 +1,9 @@
 import { StateCreator } from 'zustand/vanilla';
 
-import { promptPickEmoji, promptSummaryAgentName, promptSummaryDescription } from '@/chains/agent';
+import { chainPickEmoji } from '@/chains/pickEmoji';
+import { chainSummaryAgentName } from '@/chains/summaryAgentName';
+import { chainSummaryDescription } from '@/chains/summaryDescription';
+import { chainSummaryTags } from '@/chains/summaryTags';
 import { MetaData } from '@/types/meta';
 import { LobeAgentConfig } from '@/types/session';
 import { fetchPresetTaskResult } from '@/utils/fetch';
@@ -26,6 +29,7 @@ export interface Action {
    * @returns 一个 Promise，用于异步操作完成后的处理
    */
   autocompleteAgentDescription: () => Promise<void>;
+  autocompleteAgentTags: () => Promise<void>;
   /**
    * 自动完成代理标题
    * @param id - 代理的 ID
@@ -47,7 +51,8 @@ export interface Action {
   setAgentConfig: (config: Partial<LobeAgentConfig>) => void;
 
   setAgentMeta: (meta: Partial<MetaData>) => void;
-  streamUpdateMeta: (key: keyof MetaData) => any;
+  streamUpdateMetaArray: (key: keyof MetaData) => any;
+  streamUpdateMetaString: (key: keyof MetaData) => any;
   toggleAgentPlugin: (pluginId: string, state?: boolean) => void;
   /**
    * 更新加载状态
@@ -65,7 +70,7 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
   ...initialState,
 
   autoPickEmoji: async () => {
-    const { config, dispatchMeta } = get();
+    const { config, meta, dispatchMeta } = get();
 
     const systemRole = config.systemRole;
 
@@ -73,7 +78,7 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
       onLoadingChange: (loading) => {
         get().updateLoadingState('avatar', loading);
       },
-      params: promptPickEmoji(systemRole),
+      params: chainPickEmoji([meta.title, meta.description, systemRole].filter(Boolean).join(',')),
     });
 
     if (emoji) {
@@ -81,7 +86,7 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
     }
   },
   autocompleteAgentDescription: async () => {
-    const { dispatchMeta, config, meta, updateLoadingState, streamUpdateMeta } = get();
+    const { dispatchMeta, config, meta, updateLoadingState, streamUpdateMetaString } = get();
 
     const systemRole = config.systemRole;
 
@@ -99,12 +104,37 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
       onLoadingChange: (loading) => {
         updateLoadingState('description', loading);
       },
-      onMessageHandle: streamUpdateMeta('description'),
-      params: promptSummaryDescription(systemRole),
+      onMessageHandle: streamUpdateMetaString('description'),
+      params: chainSummaryDescription(systemRole),
+    });
+  },
+  autocompleteAgentTags: async () => {
+    const { dispatchMeta, config, meta, updateLoadingState, streamUpdateMetaArray } = get();
+
+    const systemRole = config.systemRole;
+
+    if (!systemRole) return;
+
+    const preValue = meta.tags;
+
+    // 替换为 ...
+    dispatchMeta({ type: 'update', value: { tags: ['...'] } });
+
+    fetchPresetTaskResult({
+      onError: () => {
+        dispatchMeta({ type: 'update', value: { tags: preValue } });
+      },
+      onLoadingChange: (loading) => {
+        updateLoadingState('tags', loading);
+      },
+      onMessageHandle: streamUpdateMetaArray('tags'),
+      params: chainSummaryTags(
+        [meta.title, meta.description, systemRole].filter(Boolean).join(','),
+      ),
     });
   },
   autocompleteAgentTitle: async () => {
-    const { dispatchMeta, config, meta, updateLoadingState, streamUpdateMeta } = get();
+    const { dispatchMeta, config, meta, updateLoadingState, streamUpdateMetaString } = get();
 
     const systemRole = config.systemRole;
 
@@ -122,8 +152,8 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
       onLoadingChange: (loading) => {
         updateLoadingState('title', loading);
       },
-      onMessageHandle: streamUpdateMeta('title'),
-      params: promptSummaryAgentName(systemRole),
+      onMessageHandle: streamUpdateMetaString('title'),
+      params: chainSummaryAgentName([meta.description, systemRole].filter(Boolean).join(',')),
     });
   },
   autocompleteAllMeta: (replace) => {
@@ -140,9 +170,18 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
     if (!meta.avatar || replace) {
       get().autoPickEmoji();
     }
+
+    if (!meta.tags || replace) {
+      get().autocompleteAgentTags();
+    }
   },
   autocompleteMeta: (key) => {
-    const { autoPickEmoji, autocompleteAgentTitle, autocompleteAgentDescription } = get();
+    const {
+      autoPickEmoji,
+      autocompleteAgentTitle,
+      autocompleteAgentDescription,
+      autocompleteAgentTags,
+    } = get();
 
     switch (key) {
       case 'avatar': {
@@ -157,6 +196,12 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
 
       case 'title': {
         autocompleteAgentTitle();
+        return;
+      }
+
+      case 'tags': {
+        autocompleteAgentTags();
+        return;
       }
     }
   },
@@ -187,10 +232,19 @@ export const store: StateCreator<Store, [['zustand/devtools', never]]> = (set, g
     get().dispatchConfig({ config, type: 'update' });
   },
   setAgentMeta: (meta) => {
+    console.log(meta);
     get().dispatchMeta({ type: 'update', value: meta });
   },
 
-  streamUpdateMeta: (key: keyof MetaData) => {
+  streamUpdateMetaArray: (key: keyof MetaData) => {
+    let value = '';
+    return (text: string) => {
+      value += text;
+      get().dispatchMeta({ type: 'update', value: { [key]: value.split(',') } });
+    };
+  },
+
+  streamUpdateMetaString: (key: keyof MetaData) => {
     let value = '';
     return (text: string) => {
       value += text;

package/src/locales/default/chat.ts

@@ -36,7 +36,6 @@ export default {
     withSystemRole: '包含助手角色设定',
   },
   stop: '停止',
-
   temp: '临时',
   tokenDetail: '角色设定: {{systemRoleToken}} · 历史消息: {{chatsToken}}',
   tokenTag: {