💄 style: Add guide to market page

locales/en_US/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "Create New Agent",
   "noDescription": "No description available",
+  "pin": "Pin",
+  "pinOff": "Unpin",
   "regenerate": "Regenerate",
   "roleAndArchive": "Roles and Archives",
   "searchAgentPlaceholder": "Search agents and conversations...",
   "send": "Send",
   "sendPlaceholder": "Enter chat content...",
+  "sessionList": "Assistant List",
   "shareModal": {
     "download": "Download Screenshot",
     "imageType": "Image Format",

locales/en_US/error.json

@@ -1,7 +1,7 @@
 {
   "pluginSettings": {
     "desc": "Complete the following configuration to start using this plugin",
-    "title": "{{name}} Plugin Configuration"
+    "title": "{{name}} Plugin Settings"
   },
   "response": {
     "400": "Sorry, the server does not understand your request. Please make sure your request parameters are correct.",

locales/en_US/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "Add Agent",
+  "guide": {
+    "func1": {
+      "desc1": "Enter the settings page you want to submit to the assistant by clicking on the settings icon in the upper right corner of the chat window.",
+      "desc2": "Click on the 'Submit to Assistant Market' button in the upper right corner.",
+      "tag": "Method 1",
+      "title": "Submit via LobeChat"
+    },
+    "func2": {
+      "button": "Go to Github Assistant Repository",
+      "desc": "If you want to add the assistant to the index, create an entry in the plugins directory using agent-template.json or agent-template-full.json, write a brief description and appropriate tags, and then create a pull request.",
+      "tag": "Method 2",
+      "title": "Submit via Github"
+    }
+  },
   "search": {
     "placeholder": "Search agent name, description or keywords..."
   },

locales/en_US/plugin.json

@@ -2,7 +2,9 @@
   "debug": {
     "arguments": "Arguments",
     "function_call": "Function Call",
-    "response": "Response"
+    "response": "Response",
+    "off": "Turn off debug",
+    "on": "View plugin invocation information"
   },
   "dev": {
     "confirmDeleteDevPlugin": "Are you sure you want to delete this local plugin? Once deleted, it cannot be recovered.",
@@ -89,8 +91,8 @@
     }
   },
   "loading": {
-    "content": "Loading...",
-    "plugin": "Plugin is running..."
+    "plugin": "Plugin is running...",
+    "content": "Calling plugin..."
   },
   "pluginList": "Plugin List",
   "plugins": {

locales/ja_JP/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "新しいエージェントを作成",
   "noDescription": "説明はありません",
+  "pin": "ピン留め",
+  "pinOff": "ピン留め解除",
   "regenerate": "再生成",
   "roleAndArchive": "役割とアーカイブ",
   "searchAgentPlaceholder": "エージェントと会話を検索...",
   "send": "送信",
   "sendPlaceholder": "チャット内容を入力...",
+  "sessionList": "セッションリスト",
   "shareModal": {
     "download": "スクリーンショットをダウンロード",
     "imageType": "画像形式",

locales/ja_JP/error.json

@@ -1,7 +1,7 @@
 {
   "pluginSettings": {
     "desc": "以下の設定を完了すると、プラグインを使用することができます",
-    "title": "{{name}}プラグインの設定"
+    "title": "{{name}} プラグイン設定"
   },
   "response": {
     "400": "申し訳ありませんが、サーバーはリクエストを理解できません。リクエストパラメータが正しいかどうか確認してください",

locales/ja_JP/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "助手を追加する",
+  "guide": {
+    "func1": {
+      "desc1": "セッションウィンドウで右上隅の設定にアクセスして、アシスタントの設定ページに移動します。",
+      "desc2": "右上隅の「アシスタントマーケットに送信」ボタンをクリックします。",
+      "tag": "方法1",
+      "title": "LobeChatを使用して送信する"
+    },
+    "func2": {
+      "button": "GitHubのアシスタントリポジトリに移動する",
+      "desc": "アシスタントをインデックスに追加したい場合は、agent-template.jsonまたはagent-template-full.jsonを使用して、pluginsディレクトリにエントリを作成し、簡単な説明と適切なタグを付けてプルリクエストを作成します。",
+      "tag": "方法2",
+      "title": "GitHubを使用して送信する"
+    }
+  },
   "search": {
     "placeholder": "助手の名前、説明、またはキーワードを検索..."
   },

locales/ja_JP/plugin.json

@@ -2,7 +2,9 @@
   "debug": {
     "arguments": "引数",
     "function_call": "関数呼び出し",
-    "response": "レスポンス"
+    "response": "レスポンス",
+    "off": "デバッグをオフにする",
+    "on": "プラグイン呼び出し情報を表示する"
   },
   "dev": {
     "confirmDeleteDevPlugin": "このローカルプラグインを削除しますか？削除後は元に戻せません。",
@@ -88,8 +90,8 @@
     }
   },
   "loading": {
-    "content": "データの取得中...",
-    "plugin": "プラグインの実行中..."
+    "plugin": "プラグインの実行中...",
+    "content": "プラグインを呼び出しています..."
   },
   "pluginList": "プラグインリスト",
   "plugins": {

locales/ko_KR/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "새 도우미 만들기",
   "noDescription": "설명 없음",
+  "pin": "고정",
+  "pinOff": "고정 해제",
   "regenerate": "재생성",
   "roleAndArchive": "역할 및 아카이브",
   "searchAgentPlaceholder": "도우미 및 대화 검색...",
   "send": "보내기",
   "sendPlaceholder": "대화 내용 입력...",
+  "sessionList": "도우미 목록",
   "shareModal": {
     "download": "스크린샷 다운로드",
     "imageType": "이미지 형식",

locales/ko_KR/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "보조 프로그램 추가",
+  "guide": {
+    "func1": {
+      "desc1": "세션 창에서 오른쪽 상단 설정으로 이동하여 도우미를 제출할 설정 페이지로 이동합니다.",
+      "desc2": "도우미 마켓에 제출 버튼을 클릭합니다.",
+      "tag": "방법 1",
+      "title": "LobeChat을 통해 제출하기"
+    },
+    "func2": {
+      "button": "Github 도우미 저장소로 이동",
+      "desc": "도우미를 색인에 추가하려면 agent-template.json 또는 agent-template-full.json을 사용하여 plugins 디렉토리에 항목을 작성하고 간단한 설명과 적절한 태그를 추가한 다음 풀 리퀘스트를 생성하십시오.",
+      "tag": "방법 2",
+      "title": "Github을 통해 제출하기"
+    }
+  },
   "search": {
     "placeholder": "보조 프로그램 이름, 설명 또는 키워드 검색..."
   },

locales/ko_KR/plugin.json

@@ -2,7 +2,9 @@
   "debug": {
     "arguments": "함수 호출 인수",
     "function_call": "함수 호출",
-    "response": "응답"
+    "response": "응답",
+    "off": "디버그 끄기",
+    "on": "플러그인 호출 정보 보기"
   },
   "dev": {
     "confirmDeleteDevPlugin": "로컬 플러그인을 삭제하시겠습니까? 삭제 후에는 복구할 수 없습니다.",
@@ -88,8 +90,8 @@
     }
   },
   "loading": {
-    "content": "데이터 가져오는 중...",
-    "plugin": "플러그인 실행 중..."
+    "plugin": "플러그인 실행 중...",
+    "content": "플러그인 호출 중..."
   },
   "pluginList": "플러그인 목록",
   "plugins": {

locales/ru_RU/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "Создать помощника",
   "noDescription": "Нет описания",
+  "pin": "Закрепить",
+  "pinOff": "Открепить",
   "regenerate": "Сгенерировать заново",
   "roleAndArchive": "Роль и архив",
   "searchAgentPlaceholder": "Поиск помощников и разговоров...",
   "send": "Отправить",
   "sendPlaceholder": "Введите текст сообщения...",
+  "sessionList": "Список помощников",
   "shareModal": {
     "download": "Скачать скриншот",
     "imageType": "Тип изображения",

locales/ru_RU/error.json

@@ -1,7 +1,7 @@
 {
   "pluginSettings": {
     "desc": "Чтобы начать использовать этот плагин, выполните следующую конфигурацию",
-    "title": "{{name}} Конфигурация плагина"
+    "title": "{{name}} Настройки плагина"
   },
   "response": {
     "400": "Извините, сервер не понимает ваш запрос. Убедитесь в правильности параметров запроса",

locales/ru_RU/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "Добавить агента",
+  "guide": {
+    "func1": {
+      "desc1": "Перейдите на страницу настроек, нажав на значок в правом верхнем углу окна сеанса.",
+      "desc2": "Нажмите кнопку \"Отправить в магазин помощников\" в правом верхнем углу.",
+      "tag": "Метод 1",
+      "title": "Отправка через LobeChat"
+    },
+    "func2": {
+      "button": "Перейти в репозиторий помощника на Github",
+      "desc": "Если вы хотите добавить помощник в индекс, создайте запись в файле agent-template.json или agent-template-full.json в каталоге плагинов, напишите краткое описание и соответствующие теги, а затем создайте запрос на извлечение.",
+      "tag": "Метод 2",
+      "title": "Отправка через Github"
+    }
+  },
   "search": {
     "placeholder": "Введите название или ключевое слово помощника..."
   },

locales/ru_RU/plugin.json

@@ -2,7 +2,9 @@
   "debug": {
     "arguments": "Аргументы вызова",
     "function_call": "Вызов функции",
-    "response": "Ответ"
+    "response": "Ответ",
+    "off": "Выключить отладку",
+    "on": "Просмотр информации о вызове плагина"
   },
   "dev": {
     "confirmDeleteDevPlugin": "Вы собираетесь удалить этот локальный плагин. После удаления его будет невозможно восстановить. Вы уверены, что хотите удалить этот плагин?",
@@ -88,8 +90,8 @@
     }
   },
   "loading": {
-    "content": "Получение данных...",
-    "plugin": "Выполнение плагина..."
+    "plugin": "Выполнение плагина...",
+    "content": "Вызов плагина..."
   },
   "pluginList": "Список плагинов",
   "plugins": {

locales/zh_CN/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "新建助手",
   "noDescription": "暂无描述",
+  "pin": "置顶",
+  "pinOff": "取消置顶",
   "regenerate": "重新生成",
   "roleAndArchive": "角色与记录",
   "searchAgentPlaceholder": "搜索助手和对话...",
   "send": "发送",
   "sendPlaceholder": "输入聊天内容...",
+  "sessionList": "助手列表",
   "shareModal": {
     "download": "下载截图",
     "imageType": "图片格式",

locales/zh_CN/common.json

@@ -51,7 +51,6 @@
   "reset": "重置",
   "retry": "重试",
   "send": "发送",
-  "sessionList": "助手列表",
   "setting": "设置",
   "share": "分享",
   "stop": "停止",

locales/zh_CN/error.json

@@ -1,7 +1,7 @@
 {
   "pluginSettings": {
     "desc": "完成以下配置，即可开始使用该插件",
-    "title": "{{name}}插件配置"
+    "title": "{{name}} 插件配置"
   },
   "response": {
     "400": "很抱歉，服务器不明白您的请求，请确认您的请求参数是否正确",

locales/zh_CN/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "添加助手",
+  "guide": {
+    "func1": {
+      "desc1": "在会话窗口中通过右上角设置进入你想提交助手的设置页面;",
+      "desc2": "点击右上角提交到助手市场按钮。",
+      "tag": "方法一",
+      "title": "通过 LobeChat 提交"
+    },
+    "func2": {
+      "button": "前往 Github 助手仓库",
+      "desc": "如果您想将助手添加到索引中，请使用 agent-template.json 或 agent-template-full.json 在 plugins 目录中创建一个条目，编写简短的描述并适当标记，然后创建一个拉取请求。",
+      "tag": "方法二",
+      "title": "通过 Github 提交"
+    }
+  },
   "search": {
     "placeholder": "搜索助手名称介绍或关键词..."
   },

locales/zh_CN/plugin.json

@@ -2,6 +2,8 @@
   "debug": {
     "arguments": "调用参数",
     "function_call": "函数调用",
+    "off": "关闭调试",
+    "on": "查看插件调用信息",
     "response": "返回结果"
   },
   "dev": {
@@ -88,7 +90,7 @@
     }
   },
   "loading": {
-    "content": "数据获取中...",
+    "content": "调用插件中...",
     "plugin": "插件运行中..."
   },
   "pluginList": "插件列表",

locales/zh_TW/chat.json

@@ -15,11 +15,14 @@
   },
   "newAgent": "新建助手",
   "noDescription": "暫無描述",
+  "pin": "置頂",
+  "pinOff": "取消置頂",
   "regenerate": "重新生成",
   "roleAndArchive": "角色與記錄",
   "searchAgentPlaceholder": "搜索助手和對話...",
   "send": "發送",
   "sendPlaceholder": "輸入聊天內容...",
+  "sessionList": "助手列表",
   "shareModal": {
     "download": "下載截圖",
     "imageType": "圖片格式",

locales/zh_TW/error.json

@@ -1,7 +1,7 @@
 {
   "pluginSettings": {
     "desc": "完成以下設定後，即可開始使用此外掛",
-    "title": "{{name}} 外掛設定"
+    "title": "{{name}} 插件設定"
   },
   "response": {
     "400": "抱歉，伺服器無法理解您的請求。請確認您的請求參數是否正確。",

locales/zh_TW/market.json

@@ -1,5 +1,19 @@
 {
   "addAgent": "新增助理",
+  "guide": {
+    "func1": {
+      "desc1": "在會話視窗中通過右上角設置進入你想提交助手的設置頁面;",
+      "desc2": "點擊右上角提交到助手市場按鈕。",
+      "tag": "方法一",
+      "title": "通過 LobeChat 提交"
+    },
+    "func2": {
+      "button": "前往 Github 助手倉庫",
+      "desc": "如果您想將助手添加到索引中，請使用 agent-template.json 或 agent-template-full.json 在 plugins 目錄中創建一個條目，編寫簡短的描述並適當標記，然後創建一個拉取請求。",
+      "tag": "方法二",
+      "title": "通過 Github 提交"
+    }
+  },
   "search": {
     "placeholder": "搜尋助理名稱、描述或關鍵字..."
   },

locales/zh_TW/plugin.json

@@ -2,7 +2,9 @@
   "debug": {
     "arguments": "參數",
     "function_call": "函式呼叫",
-    "response": "回應"
+    "response": "回應",
+    "off": "關閉偵錯",
+    "on": "查看插件呼叫資訊"
   },
   "dev": {
     "confirmDeleteDevPlugin": "您確定要刪除此本機外掛嗎？一旦刪除，將無法復原。",
@@ -89,8 +91,8 @@
     }
   },
   "loading": {
-    "content": "載入中...",
-    "plugin": "外掛執行中..."
+    "plugin": "外掛執行中...",
+    "content": "呼叫插件中..."
   },
   "pluginList": "外掛清單",
   "plugins": {

src/app/chat/features/ChatHeader/ShareButton/Preview.tsx

@@ -130,7 +130,7 @@ const Preview = memo<PreviewProps>(({ withSystemRole, imageType, withBackground,
               </Flexbox>
               {withSystemRole && systemRole && (
                 <div className={styles.role}>
-                  <Markdown>{systemRole}</Markdown>
+                  <Markdown className={styles.markdown}>{systemRole}</Markdown>
                 </div>
               )}
             </div>

src/app/chat/features/ChatHeader/ShareButton/style.ts

@@ -31,6 +31,7 @@ export const useStyles = createStyles(({ css, token, stylish, cx }, withBackgrou
     background: ${token.colorBgContainer};
     border-bottom: 1px solid ${token.colorBorder};
   `,
+  markdown: stylish.markdownInChat,
   preview: cx(
     stylish.noScrollbar,
     css`

src/app/chat/features/Conversation/ChatList/Extras/Translate.tsx

@@ -12,10 +12,8 @@ import { ChatTranslate } from '@/types/chatMessage';
 
 import BubblesLoading from '../Loading';
 
-const useStyles = createStyles(({ css }) => ({
-  container: css`
-    margin-top: 8px;
-  `,
+const useStyles = createStyles(({ stylish }) => ({
+  markdown: stylish.markdownInChat,
 }));
 
 interface TranslateProps extends ChatTranslate {
@@ -24,7 +22,7 @@ interface TranslateProps extends ChatTranslate {
 }
 
 const Translate = memo<TranslateProps>(({ content = '', from, to, id, loading }) => {
-  const { theme } = useStyles();
+  const { theme, styles } = useStyles();
   const { t } = useTranslation('common');
   const [show, setShow] = useState(true);
   const clearTranslate = useSessionStore((s) => s.clearTranslate);
@@ -67,7 +65,11 @@ const Translate = memo<TranslateProps>(({ content = '', from, to, id, loading })
           />
         </Flexbox>
       </Flexbox>
-      {!show ? null : loading && !content ? <BubblesLoading /> : <Markdown>{content}</Markdown>}
+      {!show ? null : loading && !content ? (
+        <BubblesLoading />
+      ) : (
+        <Markdown className={styles.markdown}>{content}</Markdown>
+      )}
     </Flexbox>
   );
 });

src/app/chat/settings/features/SubmitAgentButton/index.tsx

@@ -22,7 +22,6 @@ const SubmitAgentButton = memo(() => {
         title={t('submitAgentModal.tooltips')}
       />
       <Modal
-        centered={false}
         footer={null}
         onCancel={() => setIsModalOpen(false)}
         open={isModalOpen}

src/app/market/(desktop)/features/Header.tsx

@@ -1,12 +1,9 @@
-import { ChatHeader, Icon, Logo } from '@lobehub/ui';
-import { Button } from 'antd';
+import { ChatHeader, Logo } from '@lobehub/ui';
 import { createStyles } from 'antd-style';
-import { Bot } from 'lucide-react';
 import Link from 'next/link';
 import { memo } from 'react';
-import { useTranslation } from 'react-i18next';
 
-import { AGENTS_INDEX_GITHUB } from '@/const/url';
+import ShareAgentButton from '../../features/ShareAgentButton';
 
 export const useStyles = createStyles(({ css, token }) => ({
   logo: css`
@@ -17,7 +14,6 @@ export const useStyles = createStyles(({ css, token }) => ({
 
 const Header = memo(() => {
   const { styles } = useStyles();
-  const { t } = useTranslation('market');
 
   return (
     <ChatHeader
@@ -26,14 +22,7 @@ const Header = memo(() => {
           <Logo className={styles.logo} extra={'Discover'} size={36} type={'text'} />
         </Link>
       }
-      right={
-        <Button
-          icon={<Icon icon={Bot} />}
-          onClick={() => window.open(AGENTS_INDEX_GITHUB, '__blank')}
-        >
-          {t('submitAgent')}
-        </Button>
-      }
+      right={<ShareAgentButton />}
     />
   );
 });

src/app/market/(mobile)/features/Header.tsx

@@ -1,8 +1,10 @@
 import { Logo, MobileNavBar } from '@lobehub/ui';
 import { memo } from 'react';
 
+import ShareAgentButton from '../../features/ShareAgentButton';
+
 const Header = memo(() => {
-  return <MobileNavBar center={<Logo type={'text'} />} />;
+  return <MobileNavBar center={<Logo type={'text'} />} right={<ShareAgentButton mobile />} />;
 });
 
 export default Header;

src/app/market/features/AgentDetailContent/AgentInfo/index.tsx

@@ -59,7 +59,11 @@ const AgentModalInner = memo(() => {
         />
       </Flexbox>
       <Flexbox style={{ padding: 16 }}>
-        {tab === InfoTabs.prompt && <Markdown fullFeaturedCodeBlock>{systemRole}</Markdown>}
+        {tab === InfoTabs.prompt && (
+          <Markdown className={styles.markdown} fullFeaturedCodeBlock>
+            {systemRole}
+          </Markdown>
+        )}
         {tab === InfoTabs.comment && <Comment identifier={identifier} />}
       </Flexbox>
     </>

src/app/market/features/AgentDetailContent/AgentInfo/style.ts

@@ -1,6 +1,6 @@
 import { createStyles } from 'antd-style';
 
-export const useStyles = createStyles(({ css, token, prefixCls }) => ({
+export const useStyles = createStyles(({ css, token, prefixCls, stylish }) => ({
   author: css`
     font-size: 12px;
   `,
@@ -27,6 +27,7 @@ export const useStyles = createStyles(({ css, token, prefixCls }) => ({
       flex-direction: column;
     }
   `,
+  markdown: stylish.markdownInChat,
   nav: css`
     padding-top: 4px;
 

src/app/market/features/ShareAgentButton/Inner.tsx

@@ -0,0 +1,52 @@
+import { Icon } from '@lobehub/ui';
+import { Button, Divider, Tag } from 'antd';
+import { Github, Settings, Share2 } from 'lucide-react';
+import Image from 'next/image';
+import { memo } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { AGENTS_INDEX_GITHUB } from '@/const/url';
+
+const Inner = memo(() => {
+  const { t } = useTranslation('market');
+  return (
+    <div>
+      <Image
+        alt={'banner'}
+        height={602}
+        src={'/images/market_modal_banner.webp'}
+        style={{ height: 'auto', marginBottom: 24, width: '100%' }}
+        width={1602}
+      />
+      <h3>
+        <Tag color={'cyan'}>{t('guide.func1.tag')}</Tag>
+        <span>{t('guide.func1.title')}</span>
+      </h3>
+      <p>
+        <Icon icon={Settings} />
+        {' - '}
+        {t('guide.func1.desc1')}
+        <br />
+        <Icon icon={Share2} />
+        {' - '}
+        {t('guide.func1.desc2')}
+      </p>
+      <Divider />
+      <h3>
+        <Tag color={'cyan'}>{t('guide.func2.tag')}</Tag>
+        <span>{t('guide.func2.title')}</span>
+      </h3>
+      <p>{t('guide.func2.desc')}</p>
+      <br />
+      <Button
+        icon={<Icon icon={Github} />}
+        onClick={() => window.open(AGENTS_INDEX_GITHUB, '__blank')}
+        type={'primary'}
+      >
+        {t('guide.func2.button')}
+      </Button>
+    </div>
+  );
+});
+
+export default Inner;

src/app/market/features/ShareAgentButton/index.tsx

@@ -0,0 +1,43 @@
+import { ActionIcon, Icon, Modal } from '@lobehub/ui';
+import { Button } from 'antd';
+import { Share2 } from 'lucide-react';
+import { memo, useState } from 'react';
+import { useTranslation } from 'react-i18next';
+
+import { MOBILE_HEADER_ICON_SIZE } from '@/const/layoutTokens';
+
+import Inner from './Inner';
+
+const ShareAgentButton = memo<{ mobile?: boolean }>(({ mobile }) => {
+  const { t } = useTranslation('market');
+  const [isModalOpen, setIsModalOpen] = useState(false);
+
+  const buttonContent = mobile ? (
+    <ActionIcon
+      icon={Share2}
+      onClick={() => setIsModalOpen(true)}
+      size={MOBILE_HEADER_ICON_SIZE}
+      title={t('submitAgent')}
+    />
+  ) : (
+    <Button icon={<Icon icon={Share2} />} onClick={() => setIsModalOpen(true)}>
+      {t('submitAgent')}
+    </Button>
+  );
+
+  return (
+    <>
+      {buttonContent}
+      <Modal
+        footer={null}
+        onCancel={() => setIsModalOpen(false)}
+        open={isModalOpen}
+        title={t('submitAgent')}
+      >
+        <Inner />
+      </Modal>
+    </>
+  );
+});
+
+export default ShareAgentButton;

src/features/AgentInfo/index.tsx

@@ -7,7 +7,7 @@ import { Center } from 'react-layout-kit';
 
 import { MetaData } from '@/types/meta';
 
-const useStyles = createStyles(({ css, token }) => ({
+const useStyles = createStyles(({ css, token, stylish }) => ({
   avatar: css`
     flex: none;
   `,
@@ -15,6 +15,7 @@ const useStyles = createStyles(({ css, token }) => ({
     color: ${token.colorTextDescription};
     text-align: center;
   `,
+  markdown: stylish.markdownInChat,
 
   title: css`
     font-size: 20px;
@@ -59,7 +60,7 @@ const AgentInfo = memo<AgentInfoProps>(({ systemRole, style, meta }) => {
       {systemRole && (
         <>
           <Divider style={{ margin: '8px 0' }} />
-          <Markdown>{systemRole}</Markdown>
+          <Markdown className={styles.markdown}>{systemRole}</Markdown>
         </>
       )}
     </Center>

src/features/AgentSetting/AgentPlugin/PluginSettings.tsx

@@ -12,12 +12,15 @@ import { pluginHelpers, pluginSelectors, usePluginStore } from '@/store/plugin';
 
 import { useStore } from '../store';
 
-const useStyles = createStyles(({ css, token }) => ({
-  md: css`
-    p {
-      color: ${token.colorTextDescription};
-    }
-  `,
+const useStyles = createStyles(({ css, token, cx, stylish }) => ({
+  markdown: cx(
+    stylish.markdownInChat,
+    css`
+      p {
+        color: ${token.colorTextDescription};
+      }
+    `,
+  ),
 }));
 
 const PluginSettings = memo(() => {
@@ -62,7 +65,7 @@ const PluginSettings = memo(() => {
                   type={item.type as any}
                 />
               ),
-              desc: item.desc && <Markdown className={styles.md}>{item.desc}</Markdown>,
+              desc: item.desc && <Markdown className={styles.markdown}>{item.desc}</Markdown>,
             })),
             icon: ToyBrick,
             title: t('settingPlugin.config', { id: pluginHelpers.getPluginTitle(item.meta) }),

src/features/PluginSettings/index.tsx

@@ -26,12 +26,15 @@ interface PluginSettingsConfigProps {
   schema: PluginSchema;
 }
 
-const useStyles = createStyles(({ css, token }) => ({
-  md: css`
-    p {
-      color: ${token.colorTextDescription};
-    }
-  `,
+const useStyles = createStyles(({ css, token, stylish, cx }) => ({
+  markdown: cx(
+    stylish.markdownInChat,
+    css`
+      p {
+        color: ${token.colorTextDescription};
+      }
+    `,
+  ),
 }));
 
 const PluginSettingsConfig = memo<PluginSettingsConfigProps>(({ schema, id }) => {
@@ -45,7 +48,7 @@ const PluginSettingsConfig = memo<PluginSettingsConfigProps>(({ schema, id }) =>
     <Form layout={'vertical'}>
       {items.map((item) => (
         <Form.Item
-          desc={item.desc && <Markdown className={styles.md}>{item.desc as string}</Markdown>}
+          desc={item.desc && <Markdown className={styles.markdown}>{item.desc as string}</Markdown>}
           key={item.label}
           label={item.label}
           tag={item.tag}

src/locales/default/common.ts

@@ -30,7 +30,6 @@ export default {
   feedback: '反馈与建议',
   historyRange: '历史范围',
   import: '导入配置',
-
   lang: {
     'en': '英语',
     'en-US': '英语',
@@ -45,7 +44,6 @@ export default {
   noDescription: '暂无描述',
   ok: '确定',
   password: '密码',
-
   pin: '置顶',
   pinOff: '取消置顶',
   regenerate: '重新生成',

src/locales/default/error.ts

@@ -1,7 +1,7 @@
 export default {
   pluginSettings: {
     desc: '完成以下配置，即可开始使用该插件',
-    title: '{{name}}插件配置',
+    title: '{{name}} 插件配置',
   },
   response: {
     400: '很抱歉，服务器不明白您的请求，请确认您的请求参数是否正确',

src/locales/default/market.ts

@@ -1,5 +1,19 @@
 export default {
   addAgent: '添加助手',
+  guide: {
+    func1: {
+      desc1: '在会话窗口中通过右上角设置进入你想提交助手的设置页面;',
+      desc2: '点击右上角提交到助手市场按钮。',
+      tag: '方法一',
+      title: '通过 LobeChat 提交',
+    },
+    func2: {
+      button: '前往 Github 助手仓库',
+      desc: '如果您想将助手添加到索引中，请使用 agent-template.json 或 agent-template-full.json 在 plugins 目录中创建一个条目，编写简短的描述并适当标记，然后创建一个拉取请求。',
+      tag: '方法二',
+      title: '通过 Github 提交',
+    },
+  },
   search: {
     placeholder: '搜索助手名称介绍或关键词...',
   },