@lobehub/chat 1.141.6 → 1.141.8

package/src/features/ChatInput/ActionBar/Params/Controls.tsx

@@ -1,7 +1,10 @@
 import { Form, type FormItemProps, Tag } from '@lobehub/ui';
+import { Form as AntdForm, Checkbox } from 'antd';
+import { createStyles } from 'antd-style';
 import isEqual from 'fast-deep-equal';
 import { debounce } from 'lodash-es';
-import { memo } from 'react';
+import { memo, useCallback, useEffect, useRef } from 'react';
+import type { ComponentType } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
@@ -20,75 +23,283 @@ interface ControlsProps {
   setUpdating: (updating: boolean) => void;
   updating: boolean;
 }
+
+type ParamKey = 'temperature' | 'top_p' | 'presence_penalty' | 'frequency_penalty';
+
+type ParamLabelKey =
+  | 'settingModel.temperature.title'
+  | 'settingModel.topP.title'
+  | 'settingModel.presencePenalty.title'
+  | 'settingModel.frequencyPenalty.title';
+
+type ParamDescKey =
+  | 'settingModel.temperature.desc'
+  | 'settingModel.topP.desc'
+  | 'settingModel.presencePenalty.desc'
+  | 'settingModel.frequencyPenalty.desc';
+
+const useStyles = createStyles(({ css, token }) => ({
+  checkbox: css`
+    .ant-checkbox-inner {
+      border-radius: 4px;
+    }
+
+    &:hover .ant-checkbox-inner {
+      border-color: ${token.colorPrimary};
+    }
+  `,
+  label: css`
+    user-select: none;
+  `,
+  sliderWrapper: css`
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    width: 100%;
+  `,
+}));
+
+// Wrapper component to handle checkbox + slider
+interface ParamControlWrapperProps {
+  Component: ComponentType<any>;
+  checked: boolean;
+  disabled: boolean;
+  onChange?: (value: number) => void;
+  onToggle: (checked: boolean) => void;
+  styles: any;
+  value?: number;
+}
+
+const ParamControlWrapper = memo<ParamControlWrapperProps>(
+  ({ Component, value, onChange, disabled, checked, onToggle, styles }) => {
+    return (
+      <div className={styles.sliderWrapper}>
+        <Checkbox
+          checked={checked}
+          className={styles.checkbox}
+          onChange={(e) => {
+            e.stopPropagation();
+            onToggle(e.target.checked);
+          }}
+        />
+        <div style={{ flex: 1 }}>
+          <Component disabled={disabled} onChange={onChange} value={value} />
+        </div>
+      </div>
+    );
+  },
+);
+
+const PARAM_NAME_MAP: Record<ParamKey, (string | number)[]> = {
+  frequency_penalty: ['params', 'frequency_penalty'],
+  presence_penalty: ['params', 'presence_penalty'],
+  temperature: ['params', 'temperature'],
+  top_p: ['params', 'top_p'],
+};
+
+const PARAM_DEFAULTS: Record<ParamKey, number> = {
+  frequency_penalty: 0,
+  presence_penalty: 0,
+  temperature: 0.7,
+  top_p: 1,
+};
+
+const PARAM_CONFIG = {
+  frequency_penalty: {
+    Component: FrequencyPenalty,
+    descKey: 'settingModel.frequencyPenalty.desc',
+    labelKey: 'settingModel.frequencyPenalty.title',
+    tag: 'frequency_penalty',
+  },
+  presence_penalty: {
+    Component: PresencePenalty,
+    descKey: 'settingModel.presencePenalty.desc',
+    labelKey: 'settingModel.presencePenalty.title',
+    tag: 'presence_penalty',
+  },
+  temperature: {
+    Component: Temperature,
+    descKey: 'settingModel.temperature.desc',
+    labelKey: 'settingModel.temperature.title',
+    tag: 'temperature',
+  },
+  top_p: {
+    Component: TopP,
+    descKey: 'settingModel.topP.desc',
+    labelKey: 'settingModel.topP.title',
+    tag: 'top_p',
+  },
+} satisfies Record<
+  ParamKey,
+  {
+    Component: ComponentType<any>;
+    descKey: ParamDescKey;
+    labelKey: ParamLabelKey;
+    tag: string;
+  }
+>;
+
 const Controls = memo<ControlsProps>(({ setUpdating }) => {
   const { t } = useTranslation('setting');
   const mobile = useServerConfigStore((s) => s.isMobile);
   const updateAgentConfig = useAgentStore((s) => s.updateAgentConfig);
+  const { styles } = useStyles();
 
   const config = useAgentStore(agentSelectors.currentAgentConfig, isEqual);
+  const [form] = Form.useForm();
 
-  const items: FormItemProps[] = [
-    {
-      children: <Temperature />,
-      label: (
-        <Flexbox align={'center'} gap={8} horizontal justify={'space-between'}>
-          {t('settingModel.temperature.title')}
-          <InfoTooltip title={t('settingModel.temperature.desc')} />
-        </Flexbox>
-      ),
-      name: ['params', 'temperature'],
-      tag: 'temperature',
-    },
-    {
-      children: <TopP />,
-      label: (
-        <Flexbox gap={8} horizontal>
-          {t('settingModel.topP.title')}
-          <InfoTooltip title={t('settingModel.topP.desc')} />
-        </Flexbox>
-      ),
-      name: ['params', 'top_p'],
-      tag: 'top_p',
+  const { frequency_penalty, presence_penalty, temperature, top_p } = config.params ?? {};
+
+  const lastValuesRef = useRef<Record<ParamKey, number | undefined>>({
+    frequency_penalty,
+    presence_penalty,
+    temperature,
+    top_p,
+  });
+
+  useEffect(() => {
+    form.setFieldsValue(config);
+
+    if (typeof temperature === 'number') lastValuesRef.current.temperature = temperature;
+    if (typeof top_p === 'number') lastValuesRef.current.top_p = top_p;
+    if (typeof presence_penalty === 'number') {
+      lastValuesRef.current.presence_penalty = presence_penalty;
+    }
+    if (typeof frequency_penalty === 'number') {
+      lastValuesRef.current.frequency_penalty = frequency_penalty;
+    }
+  }, [config, form, frequency_penalty, presence_penalty, temperature, top_p]);
+
+  const temperatureValue = AntdForm.useWatch(PARAM_NAME_MAP.temperature, form);
+  const topPValue = AntdForm.useWatch(PARAM_NAME_MAP.top_p, form);
+  const presencePenaltyValue = AntdForm.useWatch(PARAM_NAME_MAP.presence_penalty, form);
+  const frequencyPenaltyValue = AntdForm.useWatch(PARAM_NAME_MAP.frequency_penalty, form);
+
+  useEffect(() => {
+    if (typeof temperatureValue === 'number') lastValuesRef.current.temperature = temperatureValue;
+  }, [temperatureValue]);
+
+  useEffect(() => {
+    if (typeof topPValue === 'number') lastValuesRef.current.top_p = topPValue;
+  }, [topPValue]);
+
+  useEffect(() => {
+    if (typeof presencePenaltyValue === 'number') {
+      lastValuesRef.current.presence_penalty = presencePenaltyValue;
+    }
+  }, [presencePenaltyValue]);
+
+  useEffect(() => {
+    if (typeof frequencyPenaltyValue === 'number') {
+      lastValuesRef.current.frequency_penalty = frequencyPenaltyValue;
+    }
+  }, [frequencyPenaltyValue]);
+
+  const enabledMap: Record<ParamKey, boolean> = {
+    frequency_penalty: typeof frequencyPenaltyValue === 'number',
+    presence_penalty: typeof presencePenaltyValue === 'number',
+    temperature: typeof temperatureValue === 'number',
+    top_p: typeof topPValue === 'number',
+  };
+
+  const handleToggle = useCallback(
+    async (key: ParamKey, enabled: boolean) => {
+      const namePath = PARAM_NAME_MAP[key];
+      let newValue: number | undefined;
+
+      if (!enabled) {
+        const currentValue = form.getFieldValue(namePath);
+        if (typeof currentValue === 'number') {
+          lastValuesRef.current[key] = currentValue;
+        }
+        newValue = undefined;
+        form.setFieldValue(namePath, undefined);
+      } else {
+        const fallback = lastValuesRef.current[key];
+        const nextValue = typeof fallback === 'number' ? fallback : PARAM_DEFAULTS[key];
+        lastValuesRef.current[key] = nextValue;
+        newValue = nextValue;
+        form.setFieldValue(namePath, nextValue);
+      }
+
+      // 立即保存变更 - 手动构造配置对象确保使用最新值
+      setUpdating(true);
+      const currentValues = form.getFieldsValue();
+      const prevParams = (currentValues.params ?? {}) as Record<ParamKey, number | undefined>;
+      const currentParams: Record<ParamKey, number | undefined> = { ...prevParams };
+
+      if (newValue === undefined) {
+        // 显式删除该属性，而不是设置为 undefined
+        // 这样可以确保 Form 表单状态同步
+        delete currentParams[key];
+        // 使用 null 作为禁用标记（数据库会保留 null，前端据此判断复选框状态）
+        currentParams[key] = null as any;
+      } else {
+        currentParams[key] = newValue;
+      }
+
+      const updatedConfig = {
+        ...currentValues,
+        params: currentParams,
+      };
+
+      await updateAgentConfig(updatedConfig);
+      setUpdating(false);
     },
-    {
-      children: <PresencePenalty />,
-      label: (
-        <Flexbox gap={8} horizontal>
-          {t('settingModel.presencePenalty.title')}
-          <InfoTooltip title={t('settingModel.presencePenalty.desc')} />
-        </Flexbox>
+    [form, setUpdating, updateAgentConfig],
+  );
+
+  // 使用 useMemo 确保防抖函数只创建一次
+  const handleValuesChange = useCallback(
+    debounce(async (values) => {
+      setUpdating(true);
+      await updateAgentConfig(values);
+      setUpdating(false);
+    }, 500),
+    [updateAgentConfig, setUpdating],
+  );
+
+  const baseItems: FormItemProps[] = (Object.keys(PARAM_CONFIG) as ParamKey[]).map((key) => {
+    const meta = PARAM_CONFIG[key];
+    const Component = meta.Component;
+    const enabled = enabledMap[key];
+
+    return {
+      children: (
+        <ParamControlWrapper
+          Component={Component}
+          checked={enabled}
+          disabled={!enabled}
+          onToggle={(checked) => handleToggle(key, checked)}
+          styles={styles}
+        />
       ),
-      name: ['params', 'presence_penalty'],
-      tag: 'presence_penalty',
-    },
-    {
-      children: <FrequencyPenalty />,
       label: (
-        <Flexbox gap={8} horizontal>
-          {t('settingModel.frequencyPenalty.title')}
-          <InfoTooltip title={t('settingModel.frequencyPenalty.desc')} />
+        <Flexbox align={'center'} className={styles.label} gap={8} horizontal>
+          {t(meta.labelKey)}
+          <InfoTooltip title={t(meta.descKey)} />
         </Flexbox>
       ),
-      name: ['params', 'frequency_penalty'],
-      tag: 'frequency_penalty',
-    },
-  ];
+      name: PARAM_NAME_MAP[key],
+      tag: meta.tag,
+    } satisfies FormItemProps;
+  });
 
   return (
     <Form
+      form={form}
       initialValues={config}
-      itemMinWidth={200}
+      itemMinWidth={220}
       items={
         mobile
-          ? items
-          : items.map(({ tag, ...item }) => ({ ...item, desc: <Tag size={'small'}>{tag}</Tag> }))
+          ? baseItems
+          : baseItems.map(({ tag, ...item }) => ({
+              ...item,
+              desc: <Tag size={'small'}>{tag}</Tag>,
+            }))
       }
       itemsType={'flat'}
-      onValuesChange={debounce(async (values) => {
-        setUpdating(true);
-        await updateAgentConfig(values);
-        setUpdating(false);
-      }, 500)}
+      onValuesChange={handleValuesChange}
       styles={{
         group: {
           background: 'transparent',

package/src/features/Conversation/Messages/Assistant/Actions/index.tsx

@@ -8,6 +8,8 @@ import ShareMessageModal from '@/features/Conversation/components/ShareMessageMo
 import { VirtuosoContext } from '@/features/Conversation/components/VirtualizedList/VirtuosoContext';
 import { useChatStore } from '@/store/chat';
 import { threadSelectors } from '@/store/chat/selectors';
+import { useSessionStore } from '@/store/session';
+import { sessionSelectors } from '@/store/session/selectors';
 import { ChatMessage } from '@/types/message';
 
 import { InPortalThreadContext } from '../../../context/InPortalThreadContext';
@@ -25,6 +27,7 @@ export const AssistantActionsBar = memo<AssistantActionsProps>(({ id, data, inde
     !!s.activeThreadId,
     threadSelectors.hasThreadBySourceMsgId(id)(s),
   ]);
+  const isGroupSession = useSessionStore(sessionSelectors.isCurrentSessionGroupSession);
   const [showShareModal, setShareModal] = useState(false);
 
   const {
@@ -49,8 +52,10 @@ export const AssistantActionsBar = memo<AssistantActionsProps>(({ id, data, inde
   const items = useMemo(() => {
     if (hasTools) return [delAndRegenerate, copy];
 
-    return [edit, copy, inThread ? null : branching].filter(Boolean) as ActionIconGroupItemType[];
-  }, [inThread, hasTools]);
+    return [edit, copy, inThread || isGroupSession ? null : branching].filter(
+      Boolean,
+    ) as ActionIconGroupItemType[];
+  }, [inThread, hasTools, isGroupSession]);
 
   const { t } = useTranslation('common');
   const searchParams = useSearchParams();

package/src/features/Conversation/Messages/User/Actions.tsx

@@ -9,6 +9,8 @@ import { useTranslation } from 'react-i18next';
 
 import { useChatStore } from '@/store/chat';
 import { threadSelectors } from '@/store/chat/selectors';
+import { useSessionStore } from '@/store/session';
+import { sessionSelectors } from '@/store/session/selectors';
 
 import { VirtuosoContext } from '../../components/VirtualizedList/VirtuosoContext';
 import { InPortalThreadContext } from '../../context/InPortalThreadContext';
@@ -54,6 +56,8 @@ export const UserActionsBar = memo<UserActionsProps>(({ id, data, index }) => {
     s.delAndResendThreadMessage,
   ]);
 
+  const isGroupSession = useSessionStore(sessionSelectors.isCurrentSessionGroupSession);
+
   const { regenerate, edit, copy, divider, del, branching, tts, translate } = useChatListActionsBar(
     { hasThread },
   );
@@ -63,8 +67,10 @@ export const UserActionsBar = memo<UserActionsProps>(({ id, data, index }) => {
 
   const items = useMemo(
     () =>
-      [regenerate, edit, inThread ? null : branching].filter(Boolean) as ActionIconGroupItemType[],
-    [inThread],
+      [regenerate, edit, inThread || isGroupSession ? null : branching].filter(
+        Boolean,
+      ) as ActionIconGroupItemType[],
+    [inThread, isGroupSession],
   );
 
   const { message } = App.useApp();

package/src/features/GroupChatSettings/{ChatGroupSettings.tsx → AgentTeamChatSettings.tsx}

@@ -22,9 +22,9 @@ import { selectors, useStore } from './store';
 const { TextArea } = Input;
 
 /**
- * Chat Settings for Group Chat
+ * Chat Settings for Agent Team (Group Chat)
  */
-const ChatGroupSettings = memo(() => {
+const AgentTeamChatSettings = memo(() => {
   const { t } = useTranslation(['setting', 'common']);
   const [form] = Form.useForm();
   const updateConfig = useStore((s) => s.updateGroupConfig);
@@ -171,8 +171,9 @@ const ChatGroupSettings = memo(() => {
       itemsType={'group'}
       onFinish={async ({ _modelConfig, ...rest }) => {
         await updateConfig({
-          orchestratorModel: _modelConfig?.model,
-          orchestratorProvider: _modelConfig?.provider,
+          // Preserve existing values when _modelConfig is undefined (enableSupervisor is false)
+          orchestratorModel: _modelConfig?.model ?? config?.orchestratorModel,
+          orchestratorProvider: _modelConfig?.provider ?? config?.orchestratorProvider,
           ...rest,
         });
 
@@ -184,4 +185,4 @@ const ChatGroupSettings = memo(() => {
   );
 });
 
-export default ChatGroupSettings;
+export default AgentTeamChatSettings;

package/src/features/GroupChatSettings/{GroupMembers.tsx → AgentTeamMembersSettings.tsx}

@@ -1,11 +1,13 @@
 'use client';
 
-import { Grid, Tag, Text } from '@lobehub/ui';
+import { ActionIcon, Grid, Tag, Text } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
+import { Plus } from 'lucide-react';
 import { memo, useMemo, useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
+import { DEFAULT_AVATAR } from '@/const/meta';
 import { useChatGroupStore } from '@/store/chatGroup';
 import { chatGroupSelectors } from '@/store/chatGroup/selectors';
 import { useSessionStore } from '@/store/session';
@@ -23,10 +25,11 @@ const useStyles = createStyles(({ css }) => ({
 
 const HOST_MEMBER_ID = 'supervisor';
 
-const GroupMembers = memo(() => {
+const AgentTeamMembersSettings = memo(() => {
   const { t } = useTranslation('setting');
   const { styles } = useStyles();
   const [loadingAgentId, setLoadingAgentId] = useState<string | null>(null);
+  const [isCreatingMember, setIsCreatingMember] = useState(false);
 
   const activeGroupId = useSessionStore((s) => s.activeId);
   const currentSession = useSessionStore(sessionSelectors.currentSession) as LobeGroupSession;
@@ -36,6 +39,7 @@ const GroupMembers = memo(() => {
   const removeAgentFromGroup = useChatGroupStore((s) => s.removeAgentFromGroup);
   const updateGroupConfig = useChatGroupStore((s) => s.updateGroupConfig);
   const refreshSessions = useSessionStore((s) => s.refreshSessions);
+  const createSession = useSessionStore((s) => s.createSession);
 
   // Get all agent sessions
   const agentSessions = useSessionStore((s) => {
@@ -79,8 +83,6 @@ const GroupMembers = memo(() => {
       return;
     }
 
-    console.log(`Attempting to ${action} agent:`, { action, activeGroupId, agentId });
-
     // Check if this is the host member
     const isHostMember = agentId === HOST_MEMBER_ID;
 
@@ -92,19 +94,15 @@ const GroupMembers = memo(() => {
         if (isHostMember) {
           // Host toggle updates supervisor flag instead of modifying members
           await updateGroupConfig({ enableSupervisor: true });
-          console.log('Enabled supervisor');
         } else {
           await addAgentsToGroup(activeGroupId, [agentId]);
-          console.log(`Successfully added agent ${agentId} to group ${activeGroupId}`);
         }
       } else {
         if (isHostMember) {
           // Host toggle updates supervisor flag instead of modifying members
           await updateGroupConfig({ enableSupervisor: false });
-          console.log('Disabled supervisor');
         } else {
           await removeAgentFromGroup(activeGroupId, agentId);
-          console.log(`Successfully removed agent ${agentId} from group ${activeGroupId}`);
         }
       }
 
@@ -124,6 +122,49 @@ const GroupMembers = memo(() => {
     handleAgentAction(HOST_MEMBER_ID, checked ? 'add' : 'remove');
   };
 
+  const handleCreateMember = async () => {
+    if (!activeGroupId || isCreatingMember) return;
+
+    setIsCreatingMember(true);
+
+    try {
+      // Create a virtual assistant
+      const sessionId = await createSession(
+        {
+          config: {
+            virtual: true,
+          },
+          meta: {
+            avatar: DEFAULT_AVATAR,
+            description: '',
+            title: t('settingGroupMembers.defaultAgent'),
+          },
+        },
+        false, // Don't switch to the new session
+      );
+
+      // Refresh sessions to get the latest data
+      await refreshSessions();
+
+      // Get the agent ID from the created session
+      const session = sessionSelectors.getSessionById(sessionId)(useSessionStore.getState());
+      if (session && session.type === LobeSessionType.Agent) {
+        const agentSession = session as LobeAgentSession;
+        const agentId = agentSession.config?.id;
+
+        if (agentId) {
+          // Add the agent to the current group
+          await addAgentsToGroup(activeGroupId, [agentId]);
+          await refreshSessions();
+        }
+      }
+    } catch (error) {
+      console.error('Failed to create virtual member:', error);
+    } finally {
+      setIsCreatingMember(false);
+    }
+  };
+
   const groupMemberCount = agentsInGroup.length + (isSupervisorEnabled ? 1 : 0);
   const availableAgentCount = agentsNotInGroup.length + (isSupervisorEnabled ? 0 : 1);
 
@@ -131,19 +172,23 @@ const GroupMembers = memo(() => {
     <Flexbox className={styles.container} gap={40}>
       {/* Agents in Group Section */}
       <Flexbox gap={24}>
-        <Flexbox align={'center'} gap={8} horizontal>
-          <Text strong style={{ fontSize: 18 }}>
-            {t('settingGroupMembers.groupMembers')}
-          </Text>
-          <Tag>{groupMemberCount}</Tag>
+        <Flexbox align={'center'} gap={8} horizontal justify="space-between">
+          <Flexbox align={'center'} gap={8} horizontal>
+            <Text strong style={{ fontSize: 18 }}>
+              {t('settingGroupMembers.groupMembers')}
+            </Text>
+            <Tag>{groupMemberCount}</Tag>
+          </Flexbox>
+          <ActionIcon
+            icon={Plus}
+            loading={isCreatingMember}
+            onClick={handleCreateMember}
+            title={t('settingGroupMembers.createMember')}
+          />
         </Flexbox>
         <Grid gap={16} rows={3}>
           {isSupervisorEnabled && (
-            <HostMemberCard
-              checked
-              loading={hostOperationLoading}
-              onToggle={handleHostToggle}
-            />
+            <HostMemberCard checked loading={hostOperationLoading} onToggle={handleHostToggle} />
           )}
           {agentsInGroup.map((agent) => (
             <AgentCard
@@ -198,4 +243,4 @@ const GroupMembers = memo(() => {
   );
 });
 
-export default GroupMembers;
+export default AgentTeamMembersSettings;

package/src/features/GroupChatSettings/{ChatGroupMeta.tsx → AgentTeamMetaSettings.tsx}

@@ -14,7 +14,7 @@ import { selectors, useStore } from './store';
 
 const { TextArea } = Input;
 
-const ChatGroupMeta = memo(() => {
+const AgentTeamMetaSettings = memo(() => {
   const { t } = useTranslation(['setting', 'common']);
   const [form] = Form.useForm();
 
@@ -100,4 +100,4 @@ const ChatGroupMeta = memo(() => {
   );
 });
 
-export default ChatGroupMeta;
+export default AgentTeamMetaSettings;

package/src/features/GroupChatSettings/AgentTeamSettings.tsx

@@ -0,0 +1,54 @@
+import { Skeleton } from 'antd';
+import { ReactNode, Suspense, memo } from 'react';
+
+import { GroupSettingsTabs } from '@/store/global/initialState';
+import { useServerConfigStore } from '@/store/serverConfig';
+
+import AgentTeamChatSettings from './AgentTeamChatSettings';
+import AgentTeamMembersSettings from './AgentTeamMembersSettings';
+import AgentTeamMetaSettings from './AgentTeamMetaSettings';
+import { GroupChatSettingsProvider } from './GroupChatSettingsProvider';
+import { StoreUpdaterProps } from './StoreUpdater';
+
+export interface AgentTeamSettingsProps extends StoreUpdaterProps {
+  tab?: GroupSettingsTabs;
+}
+
+export interface AgentTeamSettingsContentProps {
+  loadingSkeleton?: ReactNode;
+  tab: GroupSettingsTabs;
+}
+
+const AgentTeamSettingsContent = memo<AgentTeamSettingsContentProps>(({ tab }) => {
+  return (
+    <>
+      {tab === GroupSettingsTabs.Settings && <AgentTeamMetaSettings />}
+      {tab === GroupSettingsTabs.Members && <AgentTeamMembersSettings />}
+      {tab === GroupSettingsTabs.Chat && <AgentTeamChatSettings />}
+    </>
+  );
+});
+
+const AgentTeamSettings = memo<AgentTeamSettingsProps>(
+  ({ tab = GroupSettingsTabs.Settings, ...rest }) => {
+    const isMobile = useServerConfigStore((s) => s.isMobile);
+    const loadingSkeleton = (
+      <Skeleton
+        active
+        paragraph={{ rows: 6 }}
+        style={{ padding: isMobile ? 16 : 0 }}
+        title={false}
+      />
+    );
+
+    return (
+      <GroupChatSettingsProvider {...rest}>
+        <Suspense fallback={loadingSkeleton}>
+          <AgentTeamSettingsContent tab={tab} />
+        </Suspense>
+      </GroupChatSettingsProvider>
+    );
+  },
+);
+
+export default AgentTeamSettings;

package/src/features/GroupChatSettings/index.ts

@@ -1,10 +1,9 @@
-export { default as ChatGroupMeta } from './ChatGroupMeta';
-export { default as ChatGroupSettings } from './ChatGroupSettings';
+export { default as AgentTeamChatSettings } from './AgentTeamChatSettings';
+export { default as GroupMembersConfig } from './AgentTeamMembersSettings';
+export { default as ChatGroupMeta } from './AgentTeamMetaSettings';
+export { default as AgentTeamSettings } from './AgentTeamSettings';
 export { default as GroupCategory } from './GroupCategory';
 export { GroupChatSettingsProvider } from './GroupChatSettingsProvider';
-export { default as GroupMembers } from './GroupMembers';
-export { default as GroupSettings } from './GroupSettings';
-export { default as GroupSettingsContent } from './GroupSettingsContent';
 
 // Hooks
 export type { GroupChatSettingsInstance } from './hooks/useGroupChatSettings';