Merge pull request #155 from lobehub/fix/platform-bugs

Fix/platform bugs

locales/bg-BG/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Системни настройки на ролята",
     "uploadSize": "Поддържа качване на един файл, препоръчителният размер е кратно на {{width}} * {{height}}"
   },
+  "roleBook": "Ролевата книга",
   "roleList": "Списък с роли",
   "shareToMarket": "Сподели в помощния пазар",
   "startChat": "Започнете чат",

locales/de-DE/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Systemeinstellungen des Charakters",
     "uploadSize": "Unterstützt den Upload von Einzeldateien, empfohlen wird eine Größe, die ein Vielfaches von {{width}} * {{height}} ist"
   },
+  "roleBook": "Charakterbuch",
   "roleList": "Rollenliste",
   "shareToMarket": "In den Assistentenmarkt teilen",
   "startChat": "Chat starten",

locales/en-US/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "System Role Settings",
     "uploadSize": "Supports single file uploads, recommended dimensions are multiples of {{width}} * {{height}}"
   },
+  "roleBook": "Character Book",
   "roleList": "Role List",
   "shareToMarket": "Share to Assistant Market",
   "startChat": "Start Chat",

locales/es-ES/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Configuración del rol del sistema",
     "uploadSize": "Soporta la carga de un solo archivo, se recomienda que las dimensiones sean múltiplos de {{width}} * {{height}}"
   },
+  "roleBook": "Libro de Roles",
   "roleList": "Lista de roles",
   "shareToMarket": "Compartir en el mercado de asistentes",
   "startChat": "Iniciar chat",

locales/fr-FR/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Paramètres système du personnage",
     "uploadSize": "Prise en charge du téléchargement de fichiers uniques, taille recommandée étant un multiple de {{width}} * {{height}}"
   },
+  "roleBook": "Livre de rôle",
   "roleList": "Liste des rôles",
   "shareToMarket": "Partager sur le marché des assistants",
   "startChat": "Commencer le chat",

locales/it-IT/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Impostazioni del ruolo di sistema",
     "uploadSize": "Supporta il caricamento di un singolo file, si consiglia una dimensione che sia un multiplo di {{width}} * {{height}}"
   },
+  "roleBook": "Libro dei Ruoli",
   "roleList": "Elenco dei ruoli",
   "shareToMarket": "Condividi nel mercato degli assistenti",
   "startChat": "Inizia chat",

locales/ja-JP/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "システムキャラクター設定",
     "uploadSize": "単一ファイルのアップロードをサポートしています。推奨サイズは {{width}} * {{height}} の倍数です。"
   },
+  "roleBook": "キャラクターシート",
   "roleList": "ロールリスト",
   "shareToMarket": "アシスタントマーケットに共有",
   "startChat": "チャットを開始",

locales/ko-KR/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "시스템 캐릭터 설정",
     "uploadSize": "단일 파일 업로드를 지원하며, 추천 크기는 {{width}} * {{height}}의 배수입니다."
   },
+  "roleBook": "역할 책",
   "roleList": "역할 목록",
   "shareToMarket": "도우미 마켓에 공유하기",
   "startChat": "채팅 시작",

locales/nl-NL/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Systeemrolinstellingen",
     "uploadSize": "Ondersteunt het uploaden van een enkel bestand, aanbevolen afmetingen zijn een veelvoud van {{width}} * {{height}}"
   },
+  "roleBook": "Rolboek",
   "roleList": "Rollijst",
   "shareToMarket": "Delen met de assistentmarkt",
   "startChat": "Begin chat",

locales/pl-PL/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Ustawienia systemowe postaci",
     "uploadSize": "Obsługuje przesyłanie pojedynczych plików, zalecany rozmiar to wielokrotność {{width}} * {{height}}"
   },
+  "roleBook": "Księga postaci",
   "roleList": "Lista ról",
   "shareToMarket": "Udostępnij na rynku asystentów",
   "startChat": "Rozpocznij czat",

locales/pt-BR/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Configurações do personagem do sistema",
     "uploadSize": "Suporta o upload de um único arquivo, recomendado em múltiplos de {{width}} * {{height}}"
   },
+  "roleBook": "Livro de Personagens",
   "roleList": "Lista de Papéis",
   "shareToMarket": "Compartilhar no mercado de assistentes",
   "startChat": "Iniciar chat",

locales/ru-RU/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Системные настройки роли",
     "uploadSize": "Поддерживается загрузка одного файла, рекомендуется размер, кратный {{width}} * {{height}}"
   },
+  "roleBook": "Книга персонажей",
   "roleList": "Список ролей",
   "shareToMarket": "Поделиться на рынке помощников",
   "startChat": "Начать чат",

locales/tr-TR/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Sistem rol ayarı",
     "uploadSize": "Tek bir dosya yüklemeyi destekler, önerilen boyut {{width}} * {{height}} katlarıdır"
   },
+  "roleBook": "Karakter Kitabı",
   "roleList": "Rol Listesi",
   "shareToMarket": "Yardımcı Pazarına Paylaş",
   "startChat": "Sohbete Başla",

locales/vi-VN/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "Cài đặt nhân vật hệ thống",
     "uploadSize": "Hỗ trợ tải lên tệp đơn, kích thước khuyến nghị là bội số của {{width}} * {{height}}"
   },
+  "roleBook": "Sách vai trò",
   "roleList": "Danh sách vai trò",
   "shareToMarket": "Chia sẻ đến thị trường trợ lý",
   "startChat": "Bắt đầu trò chuyện",

locales/zh-CN/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "系统角色设定",
     "roleSettingDescription": "角色的背景设定，在与角色聊天时会发送给模型"
   },
+  "roleBook": "角色书",
   "roleList": "角色列表",
   "shareToMarket": "分享到助手市场",
   "startChat": "开始聊天",

locales/zh-TW/role.json

@@ -87,6 +87,7 @@
     "roleSettingLabel": "系統角色設定",
     "uploadSize": "支持單個檔案上傳，推薦尺寸為 {{width}} * {{height}} 的倍數"
   },
+  "roleBook": "角色書",
   "roleList": "角色列表",
   "shareToMarket": "分享到助手市場",
   "startChat": "開始聊天",

src/app/chat/ChatInfo/index.tsx

@@ -1,8 +1,7 @@
 'use client';
 
-import { ActionIcon, DraggablePanel, TabsNav } from '@lobehub/ui';
+import { DraggablePanel, TabsNav } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
-import { X } from 'lucide-react';
 import dynamic from 'next/dynamic';
 import { rgba } from 'polished';
 import React, { useState } from 'react';
@@ -85,7 +84,7 @@ export default () => {
       classNames={{ content: styles.content }}
       minWidth={CHAT_INFO_WIDTH}
       maxWidth={CHAT_INFO_MAX_WIDTH}
-      mode={'float'}
+      mode={'fixed'}
       onExpandChange={(expand) => {
         setChatSidebar(expand);
       }}
@@ -125,9 +124,8 @@ export default () => {
             setTab(key as Tab);
           }}
         />
-        <ActionIcon icon={X} onClick={() => setChatSidebar(false)} style={{ marginRight: 16 }} />
       </Flexbox>
-      <Flexbox height={'100vh'}>
+      <Flexbox height={'calc(100vh - 128px)'}>
         {tab === Tab.ChatList && <ChatList />}
         {tab === Tab.DanceList && <DanceList />}
         {tab === Tab.Motions && <MotionList />}

src/app/chat/ViewerMode/style.ts

@@ -21,10 +21,11 @@ export const useStyles = createStyles(({ css, token }) => ({
     }
   `,
   dialog: css`
-    z-index: 1;
+    z-index: 2;
     margin: ${CHAT_HEADER_HEIGHT}px auto 0;
   `,
   docker: css`
+    z-index: 2;
     width: 100%;
     padding: ${token.paddingSM}px;
   `,

src/app/role/RoleEdit/index.tsx

@@ -1,14 +1,15 @@
 'use client';
 
+import { BookOutlined } from '@ant-design/icons';
 import { TabsNav } from '@lobehub/ui';
+import { Button } from 'antd';
 import classNames from 'classnames';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
 import { Flexbox } from 'react-layout-kit';
 
 import Info from './Info';
 import LangModel from './LangModel';
-import Model from './Model';
 import Role from './Role';
 import Touch from './Touch';
 import Voice from './Voice';
@@ -20,6 +21,10 @@ interface RolePanelProps {
   style?: React.CSSProperties;
 }
 
+const handleOpenDocs = () => {
+  window.open('https://docs.vidol.chat/role-manual/quickstart/introduction', '_blank');
+};
+
 const RolePanel = (props: RolePanelProps) => {
   const { styles } = useStyles();
   const { className, style } = props;
@@ -55,7 +60,14 @@ const RolePanel = (props: RolePanelProps) => {
                   label: t('nav.llm'),
                 },
               ]}
-              tabBarExtraContent={<SubmitAgentButton modal />}
+              tabBarExtraContent={
+                <Flexbox horizontal gap={8}>
+                  <Button icon={<BookOutlined />} onClick={handleOpenDocs}>
+                    {t('roleBook')} {/* 需要在翻译文件中添加对应的翻译 */}
+                  </Button>
+                  <SubmitAgentButton modal />
+                </Flexbox>
+              }
               onChange={(key) => {
                 setTab(key);
               }}
@@ -69,9 +81,6 @@ const RolePanel = (props: RolePanelProps) => {
             {tab === 'llm' ? <LangModel /> : null}
           </div>
         </Flexbox>
-        <Flexbox flex={1}>
-          <Model />
-        </Flexbox>
       </Flexbox>
     </div>
   );

src/app/role/RoleEdit/Model/ViewerWithUpload/index.tsx → src/app/role/ViewerWithUpload/index.tsx

@@ -1,22 +1,27 @@
+import { InboxOutlined } from '@ant-design/icons';
 import { Upload } from 'antd';
 import React, { CSSProperties, memo } from 'react';
 import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
 
-import EmptyGuide from '@/components/EmptyGuide';
-import { ROLE_VIEWER_HEIGHT, ROLE_VIEWER_WIDTH } from '@/constants/common';
+import { HEADER_HEIGHT } from '@/constants/token';
 import AgentViewer from '@/features/AgentViewer';
 import { agentSelectors, useAgentStore } from '@/store/agent';
 import { useGlobalStore } from '@/store/global';
 import { getModelPathByAgentId } from '@/utils/file';
 import { cacheStorage } from '@/utils/storage';
 
+import { useStyles } from './style';
+
 interface ViewerWithUploadProps {
   style?: CSSProperties;
 }
 
 const ViewerWithUpload = memo<ViewerWithUploadProps>(({ style }) => {
   const viewer = useGlobalStore((s) => s.viewer);
   const { t } = useTranslation('role');
+  const { styles } = useStyles();
+
   const [currentAgentId, currentAgentModel, updateAgentConfig] = useAgentStore((s) => [
     agentSelectors.currentAgentId(s),
     agentSelectors.currentAgentModel(s),
@@ -35,7 +40,14 @@ const ViewerWithUpload = memo<ViewerWithUploadProps>(({ style }) => {
     });
   };
 
-  return (
+  return currentAgentModel && currentAgentId ? (
+    <AgentViewer
+      height={`calc(100vh - ${HEADER_HEIGHT}px)`}
+      agentId={currentAgentId}
+      interactive={false}
+      toolbar={false}
+    />
+  ) : (
     <Upload
       beforeUpload={handleUploadAvatar}
       itemRender={() => void 0}
@@ -44,20 +56,11 @@ const ViewerWithUpload = memo<ViewerWithUploadProps>(({ style }) => {
       style={style}
       openFileDialogOnClick={!currentAgentModel}
     >
-      {currentAgentModel && currentAgentId ? (
-        <AgentViewer
-          height={ROLE_VIEWER_HEIGHT}
-          agentId={currentAgentId}
-          width={ROLE_VIEWER_WIDTH}
-          interactive={false}
-          toolbar={false}
-        />
-      ) : (
-        <EmptyGuide
-          size={{ height: ROLE_VIEWER_HEIGHT, width: ROLE_VIEWER_WIDTH }}
-          extra={t('upload.support')}
-        />
-      )}
+      <Flexbox className={styles.guide} align="center" justify={'center'} width={'100%'}>
+        <InboxOutlined className={styles.icon} />
+        <p className={styles.info}>{t('uploadTip', { ns: 'common' })}</p>
+        <p className={styles.extra}>{t('upload.support')}</p>
+      </Flexbox>
     </Upload>
   );
 });

src/components/EmptyGuide/style.ts → src/app/role/ViewerWithUpload/style.ts

@@ -1,16 +1,14 @@
 import { createStyles } from 'antd-style';
 
+import { ROLE_VIEWER_WIDTH } from '@/constants/common';
+import { HEADER_HEIGHT } from '@/constants/token';
+
 export const useStyles = createStyles(({ css, token }) => ({
   guide: css`
     cursor: pointer;
-
-    display: flex;
-
-    width: 100%;
-    height: 100%;
-
-    border: 1px dashed ${token.colorBorder};
-    border-radius: ${token.borderRadius}px;
+    width: ${ROLE_VIEWER_WIDTH}px;
+    height: calc(100vh - ${HEADER_HEIGHT}px);
+    border: 1px dashed ${token.colorBorderSecondary};
   `,
   icon: css`
     font-size: 48px;