fix：修复 RoleList 不可展开，关闭不了的问题

src/app/role/RoleEdit/actions/ToogleRoleList.tsx

@@ -0,0 +1,20 @@
+import { ActionIcon } from '@lobehub/ui';
+import { ChevronsLeft, List } from 'lucide-react';
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { DESKTOP_HEADER_ICON_SIZE } from '@/constants/token';
+import { useGlobalStore } from '@/store/global';
+
+export default () => {
+  const [showRoleList, toggleRoleList] = useGlobalStore((s) => [s.showRoleList, s.toggleRoleList]);
+  const { t } = useTranslation('chat');
+  return (
+    <ActionIcon
+      icon={showRoleList ? ChevronsLeft : List}
+      onClick={() => toggleRoleList()}
+      title={t('roleList')}
+      size={DESKTOP_HEADER_ICON_SIZE}
+    />
+  );
+};

src/app/role/RoleEdit/index.tsx

@@ -14,6 +14,7 @@ import Shell from './Shell';
 import Voice from './Voice';
 import RoleBookButton from './actions/RoleBook';
 import SubmitAgentButton from './actions/SubmitAgentButton';
+import ToogleRoleList from './actions/ToogleRoleList';
 import { useStyles } from './style';
 
 interface RolePanelProps {
@@ -54,12 +55,15 @@ const RolePanel = (props: RolePanelProps) => {
             label: t('nav.llm'),
           },
         ]}
-        tabBarExtraContent={
-          <Flexbox horizontal gap={8}>
-            <RoleBookButton modal={md} />
-            <SubmitAgentButton modal={md} />
-          </Flexbox>
-        }
+        tabBarExtraContent={{
+          left: <ToogleRoleList />,
+          right: (
+            <Flexbox horizontal gap={8}>
+              <RoleBookButton modal={md} />
+              <SubmitAgentButton modal={md} />
+            </Flexbox>
+          ),
+        }}
         onChange={(key) => {
           setTab(key);
         }}

src/constants/token.ts

@@ -19,8 +19,8 @@ export const CHAT_INPUT_MIN_HEIGHT = 90;
 export const HEADER_HEIGHT = 64;
 export const SIDEBAR_WIDTH = 280;
 export const SIDEBAR_MAX_WIDTH = 400;
-export const CHAT_INFO_WIDTH = 480;
-export const CHAT_INFO_MAX_WIDTH = 640;
+export const CHAT_INFO_WIDTH = 360;
+export const CHAT_INFO_MAX_WIDTH = 420;
 export const CHAT_HEADER_HEIGHT = 64;
 export const CHAT_INPUT_WIDTH = '48rem';
 export const LIST_GRID_WIDTH = 108;