@lobehub/chat 1.68.11 → 1.69.1

package/src/app/[variants]/(main)/chat/(workspace)/@conversation/features/ChatList/WelcomeChatItem/WelcomeMessage.tsx

@@ -4,7 +4,7 @@ import React from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { useAgentStore } from '@/store/agent';
-import { agentSelectors } from '@/store/agent/selectors';
+import { agentChatConfigSelectors } from '@/store/agent/selectors';
 import { useChatStore } from '@/store/chat';
 import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
 import { useSessionStore } from '@/store/session';
@@ -12,10 +12,7 @@ import { sessionMetaSelectors } from '@/store/session/selectors';
 
 const WelcomeMessage = () => {
   const { t } = useTranslation('chat');
-  const [type = 'chat'] = useAgentStore((s) => {
-    const config = agentSelectors.currentAgentChatConfig(s);
-    return [config.displayMode];
-  });
+  const type = useAgentStore(agentChatConfigSelectors.displayMode);
 
   const meta = useSessionStore(sessionMetaSelectors.currentAgentMeta, isEqual);
   const { isAgentEditable } = useServerConfigStore(featureFlagsSelectors);

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/HeaderAction.tsx

@@ -4,6 +4,7 @@ import { ActionIcon } from '@lobehub/ui';
 import { PanelRightClose, PanelRightOpen } from 'lucide-react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
 
 import { DESKTOP_HEADER_ICON_SIZE } from '@/const/layoutTokens';
 import { useGlobalStore } from '@/store/global';
@@ -24,7 +25,7 @@ const HeaderAction = memo(() => {
   const { isAgentEditable } = useServerConfigStore(featureFlagsSelectors);
 
   return (
-    <>
+    <Flexbox gap={4} horizontal>
       <ShareButton />
       <ActionIcon
         icon={showAgentSettings ? PanelRightClose : PanelRightOpen}
@@ -33,7 +34,7 @@ const HeaderAction = memo(() => {
         title={t('roleAndArchive')}
       />
       {isAgentEditable && <SettingButton />}
-    </>
+    </Flexbox>
   );
 });
 

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/Main.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import { ActionIcon, Avatar } from '@lobehub/ui';
-import { ChatHeaderTitle } from '@lobehub/ui/chat';
 import { Skeleton } from 'antd';
+import { createStyles } from 'antd-style';
 import { PanelLeftClose, PanelLeftOpen } from 'lucide-react';
 import { parseAsBoolean, useQueryState } from 'nuqs';
 import { Suspense, memo } from 'react';
@@ -19,17 +19,38 @@ import { sessionMetaSelectors, sessionSelectors } from '@/store/session/selector
 
 import Tags from './Tags';
 
+const useStyles = createStyles(({ css }) => ({
+  container: css`
+    position: relative;
+    overflow: hidden;
+    flex: 1;
+    max-width: 100%;
+  `,
+  tag: css`
+    flex: none;
+    align-items: baseline;
+  `,
+  title: css`
+    overflow: hidden;
+
+    font-size: 14px;
+    font-weight: bold;
+    line-height: 1;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  `,
+}));
+
 const Main = memo(() => {
   const { t } = useTranslation('chat');
-
+  const { styles } = useStyles();
   useInitAgentConfig();
   const [isPinned] = useQueryState('pinned', parseAsBoolean);
 
-  const [init, isInbox, title, description, avatar, backgroundColor] = useSessionStore((s) => [
+  const [init, isInbox, title, avatar, backgroundColor] = useSessionStore((s) => [
     sessionSelectors.isSomeSessionActive(s),
     sessionSelectors.isInboxSession(s),
     sessionMetaSelectors.currentAgentTitle(s),
-    sessionMetaSelectors.currentAgentDescription(s),
     sessionMetaSelectors.currentAgentAvatar(s),
     sessionMetaSelectors.currentAgentBackgroundColor(s),
   ]);
@@ -37,34 +58,36 @@ const Main = memo(() => {
   const openChatSettings = useOpenChatSettings();
 
   const displayTitle = isInbox ? t('inbox.title') : title;
-  const displayDesc = isInbox ? t('inbox.desc') : description;
   const showSessionPanel = useGlobalStore(systemStatusSelectors.showSessionPanel);
   const updateSystemStatus = useGlobalStore((s) => s.updateSystemStatus);
 
-  return !init ? (
-    <Flexbox gap={4} horizontal>
-      {!isPinned && (
-        <ActionIcon
-          aria-label={t('agents')}
-          icon={showSessionPanel ? PanelLeftClose : PanelLeftOpen}
-          onClick={() => {
-            updateSystemStatus({
-              sessionsWidth: showSessionPanel ? 0 : 320,
-              showSessionPanel: !showSessionPanel,
-            });
-          }}
-          size={DESKTOP_HEADER_ICON_SIZE}
-          title={t('agents')}
+  if (!init)
+    return (
+      <Flexbox align={'center'} gap={8} horizontal>
+        {!isPinned && (
+          <ActionIcon
+            aria-label={t('agents')}
+            icon={showSessionPanel ? PanelLeftClose : PanelLeftOpen}
+            onClick={() => {
+              updateSystemStatus({
+                sessionsWidth: showSessionPanel ? 0 : 320,
+                showSessionPanel: !showSessionPanel,
+              });
+            }}
+            size={DESKTOP_HEADER_ICON_SIZE}
+            title={t('agents')}
+          />
+        )}
+        <Skeleton
+          active
+          avatar={{ shape: 'circle', size: 28 }}
+          paragraph={false}
+          title={{ style: { margin: 0, marginTop: 4 }, width: 200 }}
         />
-      )}
-      <Skeleton
-        active
-        avatar={{ shape: 'circle', size: 'default' }}
-        paragraph={false}
-        title={{ style: { margin: 0, marginTop: 8 }, width: 200 }}
-      />
-    </Flexbox>
-  ) : (
+      </Flexbox>
+    );
+
+  return (
     <Flexbox align={'center'} gap={4} horizontal>
       {!isPinned && (
         <ActionIcon
@@ -84,10 +107,13 @@ const Main = memo(() => {
         avatar={avatar}
         background={backgroundColor}
         onClick={() => openChatSettings()}
-        size={40}
+        size={32}
         title={title}
       />
-      <ChatHeaderTitle desc={displayDesc} tag={<Tags />} title={displayTitle} />
+      <Flexbox align={'center'} className={styles.container} gap={8} horizontal>
+        <div className={styles.title}>{displayTitle}</div>
+        <Tags />
+      </Flexbox>
     </Flexbox>
   );
 });

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/Tags/HistoryLimitTags.tsx

@@ -0,0 +1,26 @@
+import { Icon, Tag, Tooltip } from '@lobehub/ui';
+import { HistoryIcon } from 'lucide-react';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
+
+import { useAgentStore } from '@/store/agent';
+import { agentChatConfigSelectors } from '@/store/agent/selectors';
+
+const SearchTag = memo(() => {
+  const { t } = useTranslation('chat');
+  const historyCount = useAgentStore(agentChatConfigSelectors.historyCount);
+
+  return (
+    <Tooltip title={t('history.title', { count: historyCount })}>
+      <Flexbox height={22}>
+        <Tag>
+          <Icon icon={HistoryIcon} />
+          <span>{historyCount}</span>
+        </Tag>
+      </Flexbox>
+    </Tooltip>
+  );
+});
+
+export default SearchTag;

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/{SearchTags.tsx → Tags/SearchTags.tsx}

@@ -2,15 +2,18 @@ import { Icon, Tag } from '@lobehub/ui';
 import { Globe } from 'lucide-react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
 
 const SearchTag = memo(() => {
   const { t } = useTranslation('chat');
 
   return (
-    <Tag>
-      {<Icon icon={Globe} />}
-      <div>{t('search.title')}</div>
-    </Tag>
+    <Flexbox height={22}>
+      <Tag>
+        {<Icon icon={Globe} />}
+        <div>{t('search.title')}</div>
+      </Tag>
+    </Flexbox>
   );
 });
 

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/{Tags.tsx → Tags/index.tsx}

@@ -9,12 +9,13 @@ import PluginTag from '@/features/PluginTag';
 import { useAgentEnableSearch } from '@/hooks/useAgentEnableSearch';
 import { useModelSupportToolUse } from '@/hooks/useModelSupportToolUse';
 import { useAgentStore } from '@/store/agent';
-import { agentSelectors } from '@/store/agent/selectors';
+import { agentChatConfigSelectors, agentSelectors } from '@/store/agent/selectors';
 import { useUserStore } from '@/store/user';
 import { authSelectors } from '@/store/user/selectors';
 
 import KnowledgeTag from './KnowledgeTag';
 import SearchTags from './SearchTags';
+import HistoryLimitTags from './HistoryLimitTags';
 
 const TitleTags = memo(() => {
   const [model, provider, hasKnowledge, isLoading] = useAgentStore((s) => [
@@ -26,6 +27,7 @@ const TitleTags = memo(() => {
 
   const plugins = useAgentStore(agentSelectors.currentAgentPlugins, isEqual);
   const enabledKnowledge = useAgentStore(agentSelectors.currentEnabledKnowledge, isEqual);
+  const enableHistoryCount = useAgentStore(agentChatConfigSelectors.enableHistoryCount);
 
   const showPlugin = useModelSupportToolUse(model, provider);
   const isLogin = useUserStore(authSelectors.isLogin);
@@ -42,6 +44,7 @@ const TitleTags = memo(() => {
       {isAgentEnableSearch && <SearchTags />}
       {showPlugin && plugins?.length > 0 && <PluginTag plugins={plugins} />}
       {hasKnowledge && <KnowledgeTag data={enabledKnowledge} />}
+      {enableHistoryCount && <HistoryLimitTags />}
     </Flexbox>
   );
 });

package/src/app/[variants]/(main)/chat/(workspace)/_layout/Desktop/ChatHeader/index.tsx

@@ -16,7 +16,7 @@ const Header = () => {
       <ChatHeader
         left={<Main />}
         right={<HeaderAction />}
-        style={{ minHeight: 64, position: 'initial', zIndex: 11 }}
+        style={{ height: 48, minHeight: 48, paddingInline: 8, position: 'initial', zIndex: 11 }}
       />
     )
   );

package/src/config/aiModels/anthropic.ts

@@ -22,7 +22,7 @@ const anthropicChatModels: AIChatModelCard[] = [
     },
     releasedAt: '2025-02-24',
     settings: {
-      extendParams: ['enableReasoning', 'reasoningBudgetToken'],
+      extendParams: ['disableContextCaching', 'enableReasoning', 'reasoningBudgetToken'],
     },
     type: 'chat',
   },
@@ -45,6 +45,9 @@ const anthropicChatModels: AIChatModelCard[] = [
       writeCacheInput: 1.25,
     },
     releasedAt: '2024-11-05',
+    settings: {
+      extendParams: ['disableContextCaching'],
+    },
     type: 'chat',
   },
   {
@@ -66,6 +69,9 @@ const anthropicChatModels: AIChatModelCard[] = [
       writeCacheInput: 3.75,
     },
     releasedAt: '2024-10-22',
+    settings: {
+      extendParams: ['disableContextCaching'],
+    },
     type: 'chat',
   },
   {
@@ -86,6 +92,9 @@ const anthropicChatModels: AIChatModelCard[] = [
       writeCacheInput: 3.75,
     },
     releasedAt: '2024-06-20',
+    settings: {
+      extendParams: ['disableContextCaching'],
+    },
     type: 'chat',
   },
   {
@@ -104,6 +113,9 @@ const anthropicChatModels: AIChatModelCard[] = [
       output: 1.25,
     },
     releasedAt: '2024-03-07',
+    settings: {
+      extendParams: ['disableContextCaching'],
+    },
     type: 'chat',
   },
   {
@@ -141,6 +153,9 @@ const anthropicChatModels: AIChatModelCard[] = [
       output: 75,
     },
     releasedAt: '2024-02-29',
+    settings: {
+      extendParams: ['disableContextCaching'],
+    },
     type: 'chat',
   },
   {

package/src/config/aiModels/google.ts

@@ -118,7 +118,6 @@ const googleChatModels: AIChatModelCard[] = [
     description:
       'Gemini 2.0 Flash Thinking Exp 是 Google 的实验性多模态推理AI模型，能对复杂问题进行推理，拥有新的思维能力。',
     displayName: 'Gemini 2.0 Flash Thinking Experimental',
-    enabled: true,
     id: 'gemini-2.0-flash-thinking-exp',
     maxOutput: 65_536,
     pricing: {

package/src/config/aiModels/groq.ts

@@ -4,6 +4,20 @@ import { AIChatModelCard } from '@/types/aiModel';
 // https://console.groq.com/docs/models
 
 const groqChatModels: AIChatModelCard[] = [
+  {
+    abilities: {
+      functionCall: true,
+      reasoning: true,
+    },
+    contextWindowTokens: 131_072,
+    displayName: 'Qwen QwQ 32B',
+    id: 'qwen-qwq-32b',
+    pricing: {
+      input: 0.29,
+      output: 0.39,
+    },
+    type: 'chat',
+  },
   {
     abilities: {
       functionCall: true,

package/src/config/aiModels/novita.ts

@@ -150,6 +150,29 @@ const novitaChatModels: AIChatModelCard[] = [
     },
     type: 'chat',
   },
+  {
+    contextWindowTokens: 64_000,
+    displayName: 'Deepseek V3 Turbo',
+    id: 'deepseek/deepseek-v3-turbo',
+    pricing: {
+      input: 0.4,
+      output: 1.3,
+    },
+    type: 'chat',
+  },
+  {
+    abilities: {
+      reasoning: true,
+    },
+    contextWindowTokens: 64_000,
+    displayName: 'Deepseek R1 Turbo',
+    id: 'deepseek/deepseek-r1-turbo',
+    pricing: {
+      input: 0.7,
+      output: 2.5,
+    },
+    type: 'chat',
+  },
   {
     abilities: {
       reasoning: true,
@@ -378,6 +401,19 @@ const novitaChatModels: AIChatModelCard[] = [
     },
     type: 'chat',
   },
+  {
+    abilities: {
+      reasoning: true,
+    },
+    contextWindowTokens: 32_768,
+    displayName: 'QwQ 32B',
+    id: 'qwen/qwq-32b',
+    pricing: {
+      input: 0.18,
+      output: 0.2,
+    },
+    type: 'chat',
+  },
 ];
 
 export const allModels = [...novitaChatModels];

package/src/config/aiModels/siliconcloud.ts

@@ -226,9 +226,25 @@ const siliconcloudChatModels: AIChatModelCard[] = [
     },
     contextWindowTokens: 32_768,
     description:
-      'QwQ-32B-Preview是Qwen 最新的实验性研究模型，专注于提升AI推理能力。通过探索语言混合、递归推理等复杂机制，主要优势包括强大的推理分析能力、数学和编程能力。与此同时，也存在语言切换问题、推理循环、安全性考虑、其他能力方面的差异。',
-    displayName: 'QwQ 32B Preview',
+      'QwQ 是 Qwen 系列的推理模型。与传统的指令调优模型相比，QwQ 具备思考和推理能力，能够在下游任务中实现显著增强的性能，尤其是在解决困难问题方面。QwQ-32B 是中型推理模型，能够在与最先进的推理模型（如 DeepSeek-R1、o1-mini）的对比中取得有竞争力的性能。该模型采用 RoPE、SwiGLU、RMSNorm 和 Attention QKV bias 等技术，具有 64 层网络结构和 40 个 Q 注意力头（GQA 架构中 KV 为 8 个）。',
+    displayName: 'QwQ 32B',
     enabled: true,
+    id: 'Qwen/QwQ-32B',
+    pricing: {
+      currency: 'CNY',
+      input: 1,
+      output: 4,
+    },
+    type: 'chat',
+  },
+  {
+    abilities: {
+      reasoning: true,
+    },
+    contextWindowTokens: 32_768,
+    description:
+      'QwQ-32B-Preview 是 Qwen 最新的实验性研究模型，专注于提升AI推理能力。通过探索语言混合、递归推理等复杂机制，主要优势包括强大的推理分析能力、数学和编程能力。与此同时，也存在语言切换问题、推理循环、安全性考虑、其他能力方面的差异。',
+    displayName: 'QwQ 32B Preview',
     id: 'Qwen/QwQ-32B-Preview',
     pricing: {
       currency: 'CNY',

package/src/config/modelProviders/anthropic.ts

@@ -180,12 +180,10 @@ const Anthropic: ModelProviderCard = {
     sdkType: 'anthropic',
     showModelFetcher: true,
     smoothing: {
-      speed: 5,
       text: true,
     },
   },
   smoothing: {
-    speed: 5,
     text: true,
   },
   url: 'https://anthropic.com',

package/src/const/layoutTokens.test.ts

@@ -6,6 +6,6 @@ describe('HEADER_ICON_SIZE', () => {
   });
 
   it('desktop', () => {
-    expect(HEADER_ICON_SIZE(false)).toEqual({ fontSize: 24 });
+    expect(HEADER_ICON_SIZE(false)).toEqual({ blockSize: 32, fontSize: 20 });
   });
 });

package/src/const/layoutTokens.ts

@@ -20,7 +20,7 @@ export const FORM_STYLE: FormProps = {
   style: { maxWidth: MAX_WIDTH, width: '100%' },
 };
 export const MOBILE_HEADER_ICON_SIZE = { blockSize: 36, fontSize: 22 };
-export const DESKTOP_HEADER_ICON_SIZE = { fontSize: 24 };
+export const DESKTOP_HEADER_ICON_SIZE = { blockSize: 32, fontSize: 20 };
 export const HEADER_ICON_SIZE = (mobile?: boolean) =>
   mobile ? MOBILE_HEADER_ICON_SIZE : DESKTOP_HEADER_ICON_SIZE;
 export const PWA_INSTALL_ID = 'pwa-install';

package/src/const/models.ts

@@ -0,0 +1,27 @@
+export const systemToUserModels = new Set([
+  'o1-preview',
+  'o1-preview-2024-09-12',
+  'o1-mini',
+  'o1-mini-2024-09-12',
+]);
+
+// TODO: 临时写法，后续要重构成 model card 展示配置
+export const disableStreamModels = new Set(['o1', 'o1-2024-12-17']);
+
+/**
+ * models support context caching
+ */
+export const contextCachingModels = new Set([
+  'claude-3-7-sonnet-latest',
+  'claude-3-7-sonnet-20250219',
+  'claude-3-5-sonnet-latest',
+  'claude-3-5-sonnet-20241022',
+  'claude-3-5-sonnet-20240620',
+  'claude-3-5-haiku-latest',
+  'claude-3-5-haiku-20241022',
+]);
+
+export const thinkingWithToolClaudeModels = new Set([
+  'claude-3-7-sonnet-latest',
+  'claude-3-7-sonnet-20250219',
+]);

package/src/features/ChatInput/ActionBar/History.tsx

@@ -7,15 +7,18 @@ import { Flexbox } from 'react-layout-kit';
 
 import { useIsMobile } from '@/hooks/useIsMobile';
 import { useAgentStore } from '@/store/agent';
-import { agentSelectors } from '@/store/agent/selectors';
+import { agentChatConfigSelectors } from '@/store/agent/selectors';
 
 const History = memo(() => {
   const { t } = useTranslation('setting');
   const [popoverOpen, setPopoverOpen] = useState(false);
 
   const [historyCount, enableHistoryCount, updateAgentConfig] = useAgentStore((s) => {
-    const config = agentSelectors.currentAgentChatConfig(s);
-    return [config.historyCount, config.enableHistoryCount, s.updateAgentChatConfig];
+    return [
+      agentChatConfigSelectors.historyCount(s),
+      agentChatConfigSelectors.enableHistoryCount(s),
+      s.updateAgentChatConfig,
+    ];
   });
 
   const title = t(

package/src/features/ChatInput/ActionBar/Model/ContextCachingSwitch.tsx

@@ -0,0 +1,20 @@
+import { Switch } from 'antd';
+import { memo } from 'react';
+
+interface ContextCachingSwitchProps {
+  onChange?: (value: boolean) => void;
+  value?: boolean;
+}
+
+const ContextCachingSwitch = memo<ContextCachingSwitchProps>(({ value, onChange }) => {
+  return (
+    <Switch
+      onChange={(checked) => {
+        onChange?.(!checked);
+      }}
+      value={!value}
+    />
+  );
+});
+
+export default ContextCachingSwitch;

package/src/features/ChatInput/ActionBar/Model/ControlsForm.tsx

@@ -1,14 +1,16 @@
 import { Form } from '@lobehub/ui';
 import type { FormItemProps } from '@lobehub/ui';
-import { Switch } from 'antd';
+import { Form as AntdForm, Switch } from 'antd';
 import isEqual from 'fast-deep-equal';
+import Link from 'next/link';
 import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
+import { Trans, useTranslation } from 'react-i18next';
 
 import { useAgentStore } from '@/store/agent';
-import { agentSelectors } from '@/store/agent/slices/chat';
+import { agentChatConfigSelectors, agentSelectors } from '@/store/agent/selectors';
 import { aiModelSelectors, useAiInfraStore } from '@/store/aiInfra';
 
+import ContextCachingSwitch from './ContextCachingSwitch';
 import ReasoningTokenSlider from './ReasoningTokenSlider';
 
 const ControlsForm = memo(() => {
@@ -18,18 +20,57 @@ const ControlsForm = memo(() => {
     agentSelectors.currentAgentModelProvider(s),
     s.updateAgentChatConfig,
   ]);
-  const config = useAgentStore(agentSelectors.currentAgentChatConfig, isEqual);
+  const [form] = Form.useForm();
+  const enableReasoning = AntdForm.useWatch(['enableReasoning'], form);
+
+  const config = useAgentStore(agentChatConfigSelectors.currentChatConfig, isEqual);
 
   const modelExtendParams = useAiInfraStore(aiModelSelectors.modelExtendParams(model, provider));
 
-  const items: FormItemProps[] = [
+  const items = [
+    {
+      children: <ContextCachingSwitch />,
+      desc: (
+        <span style={{ display: 'inline-block', width: 300 }}>
+          <Trans i18nKey={'extendParams.disableContextCaching.desc'} ns={'chat'}>
+            单条对话生成成本最高可降低 90%，响应速度提升 4 倍（
+            <Link
+              href={'https://www.anthropic.com/news/prompt-caching?utm_source=lobechat'}
+              rel={'nofollow'}
+            >
+              了解更多
+            </Link>
+            ）。开启后将自动禁用历史记录限制
+          </Trans>
+        </span>
+      ),
+      label: t('extendParams.disableContextCaching.title'),
+      minWidth: undefined,
+      name: 'disableContextCaching',
+    },
     {
       children: <Switch />,
+      desc: (
+        <span style={{ display: 'inline-block', width: 300 }}>
+          <Trans i18nKey={'extendParams.enableReasoning.desc'} ns={'chat'}>
+            基于 Claude Thinking 机制限制（
+            <Link
+              href={
+                'https://docs.anthropic.com/en/docs/build-with-claude/extended-thinking?utm_source=lobechat#why-thinking-blocks-must-be-preserved'
+              }
+              rel={'nofollow'}
+            >
+              了解更多
+            </Link>
+            ），开启后将自动禁用历史消息数限制
+          </Trans>
+        </span>
+      ),
       label: t('extendParams.enableReasoning.title'),
       minWidth: undefined,
       name: 'enableReasoning',
     },
-    {
+    enableReasoning && {
       children: <ReasoningTokenSlider />,
       label: t('extendParams.reasoningBudgetToken.title'),
       layout: 'vertical',
@@ -39,10 +80,11 @@ const ControlsForm = memo(() => {
         paddingBottom: 0,
       },
     },
-  ];
+  ].filter(Boolean) as FormItemProps[];
 
   return (
     <Form
+      form={form}
       initialValues={config}
       items={
         (modelExtendParams || [])