@lobehub/chat 1.33.4 → 1.34.0

package/locales/zh-CN/models.json

@@ -176,6 +176,15 @@
   "Qwen/Qwen2.5-Math-72B-Instruct": {
     "description": "Qwen2.5-Math 专注于数学领域的问题求解，为高难度题提供专业解答。"
   },
+  "Qwen2-72B-Instruct": {
+    "description": "Qwen2 是 Qwen 模型的最新系列，支持 128k 上下文，对比当前最优的开源模型，Qwen2-72B 在自然语言理解、知识、代码、数学及多语言等多项能力上均显著超越当前领先的模型。"
+  },
+  "Qwen2-7B-Instruct": {
+    "description": "Qwen2 是 Qwen 模型的最新系列，能够超越同等规模的最优开源模型甚至更大规模的模型，Qwen2 7B 在多个评测上取得显著的优势，尤其是代码及中文理解上。"
+  },
+  "Qwen2.5-72B-Instruct": {
+    "description": "Qwen2.5-72B-Instruct  支持 16k 上下文, 生成长文本超过 8K 。支持 function call 与外部系统无缝交互，极大提升了灵活性和扩展性。模型知识明显增加，并且大大提高了编码和数学能力, 多语言支持超过 29 种"
+  },
   "SenseChat": {
     "description": "基础版本模型 (V4)，4K上下文长度，通用能力强大"
   },
@@ -206,6 +215,9 @@
   "Tencent/Hunyuan-A52B-Instruct": {
     "description": "Hunyuan-Large 是业界最大的开源 Transformer 架构 MoE 模型，拥有 3890 亿总参数量和 520 亿激活参数量。"
   },
+  "Yi-34B-Chat": {
+    "description": "Yi-1.5-34B 在保持原系列模型优秀的通用语言能力的前提下，通过增量训练 5 千亿高质量 token，大幅提高了数学逻辑、代码能力。"
+  },
   "abab5.5-chat": {
     "description": "面向生产力场景，支持复杂任务处理和高效文本生成，适用于专业领域应用。"
   },
@@ -368,6 +380,9 @@
   "codegeex-4": {
     "description": "CodeGeeX-4 是强大的AI编程助手，支持多种编程语言的智能问答与代码补全，提升开发效率。"
   },
+  "codegeex4-all-9b": {
+    "description": "CodeGeeX4-ALL-9B 是一个多语言代码生成模型，支持包括代码补全和生成、代码解释器、网络搜索、函数调用、仓库级代码问答在内的全面功能，覆盖软件开发的各种场景。是参数少于 10B 的顶尖代码生成模型。"
+  },
   "codegemma": {
     "description": "CodeGemma 专用于不同编程任务的轻量级语言模型，支持快速迭代和集成。"
   },
@@ -422,6 +437,9 @@
   "deepseek-chat": {
     "description": "融合通用与代码能力的全新开源模型, 不仅保留了原有 Chat 模型的通用对话能力和 Coder 模型的强大代码处理能力，还更好地对齐了人类偏好。此外，DeepSeek-V2.5 在写作任务、指令跟随等多个方面也实现了大幅提升。"
   },
+  "deepseek-coder-33B-instruct": {
+    "description": "DeepSeek Coder 33B 是一个代码语言模型， 基于 2 万亿数据训练而成，其中 87% 为代码， 13% 为中英文语言。模型引入 16K 窗口大小和填空任务，提供项目级别的代码补全和片段填充功能。"
+  },
   "deepseek-coder-v2": {
     "description": "DeepSeek Coder V2 是开源的混合专家代码模型，在代码任务方面表现优异，与 GPT4-Turbo 相媲美。"
   },
@@ -476,6 +494,9 @@
   "gemini-exp-1114": {
     "description": "Gemini Exp 1114 是Google最新的实验性多模态AI模型，具备快速处理能力，支持文本、图像和视频输入，适用于多种任务的高效扩展。"
   },
+  "gemini-exp-1121": {
+    "description": "Gemini Exp 1121 是Google最新的实验性多模态AI模型，具备快速处理能力，支持文本、图像和视频输入，适用于多种任务的高效扩展。"
+  },
   "gemma-7b-it": {
     "description": "Gemma 7B 适合中小规模任务处理，兼具成本效益。"
   },
@@ -503,6 +524,9 @@
   "glm-4-0520": {
     "description": "GLM-4-0520 是最新模型版本，专为高度复杂和多样化任务设计，表现卓越。"
   },
+  "glm-4-9b-chat": {
+    "description": "GLM-4-9B-Chat 在语义、数学、推理、代码和知识等多方面均表现出较高性能。还具备网页浏览、代码执行、自定义工具调用和长文本推理。 支持包括日语，韩语，德语在内的 26 种语言。"
+  },
   "glm-4-air": {
     "description": "GLM-4-Air 是性价比高的版本，性能接近GLM-4，提供快速度和实惠的价格。"
   },

package/locales/zh-CN/providers.json

@@ -22,6 +22,9 @@
   "fireworksai": {
     "description": "Fireworks AI 是一家领先的高级语言模型服务商，专注于功能调用和多模态处理。其最新模型 Firefunction V2 基于 Llama-3，优化用于函数调用、对话及指令跟随。视觉语言模型 FireLLaVA-13B 支持图像和文本混合输入。其他 notable 模型包括 Llama 系列和 Mixtral 系列，提供高效的多语言指令跟随与生成支持。"
   },
+  "giteeai": {
+    "description": "Gitee AI 的 Serverless API 为 AI 开发者提供开箱即用的大模型推理 API 服务。"
+  },
   "github": {
     "description": "通过GitHub模型，开发人员可以成为AI工程师，并使用行业领先的AI模型进行构建。"
   },

package/locales/zh-CN/setting.json

@@ -389,6 +389,11 @@
       "modelDesc": "指定用于优化用户提问的模型",
       "title": "知识库提问重写"
     },
+    "thread": {
+      "label": "子话题命名模型",
+      "modelDesc": "指定用于子话题自动重命名的模型",
+      "title": "子话题自动命名"
+    },
     "title": "系统助手",
     "topic": {
       "label": "话题命名模型",

package/locales/zh-CN/thread.json

@@ -0,0 +1,5 @@
+{
+  "actions": {
+    "confirmRemoveThread": "即将删除该子话题，删除后将不可恢复，请谨慎操作。"
+  }
+}

package/locales/zh-TW/chat.json

@@ -8,6 +8,7 @@
   "agents": "助手",
   "artifact": {
     "generating": "生成中",
+    "inThread": "子話題中無法查看，請切換到主對話區打開",
     "thinking": "思考中",
     "thought": "思考過程",
     "unknownTitle": "未命名作品"
@@ -65,6 +66,7 @@
   },
   "messageAction": {
     "delAndRegenerate": "刪除並重新生成",
+    "deleteDisabledByThreads": "存在子話題，無法刪除",
     "regenerate": "重新生成"
   },
   "newAgent": "新建助手",
@@ -121,6 +123,11 @@
     "loading": "識別中...",
     "prettifying": "潤色中..."
   },
+  "thread": {
+    "divider": "子話題",
+    "threadMessageCount": "{{messageCount}} 條消息",
+    "title": "子話題"
+  },
   "tokenDetails": {
     "chats": "聊天訊息",
     "historySummary": "歷史總結",

package/locales/zh-TW/common.json

@@ -16,6 +16,8 @@
   "back": "返回",
   "batchDelete": "批次刪除",
   "blog": "產品部落格",
+  "branching": "建立子主題",
+  "branchingDisable": "「子主題」功能僅在伺服器端版本可用，如需該功能，請切換到伺服器端部署模式或使用 LobeChat Cloud",
   "cancel": "取消",
   "changelog": "變更日誌",
   "close": "關閉",

package/locales/zh-TW/models.json

@@ -176,6 +176,15 @@
   "Qwen/Qwen2.5-Math-72B-Instruct": {
     "description": "Qwen2.5-Math專注於數學領域的問題求解，為高難度題提供專業解答。"
   },
+  "Qwen2-72B-Instruct": {
+    "description": "Qwen2 是 Qwen 模型的最新系列，支持 128k 上下文，對比當前最優的開源模型，Qwen2-72B 在自然語言理解、知識、代碼、數學及多語言等多項能力上均顯著超越當前領先的模型。"
+  },
+  "Qwen2-7B-Instruct": {
+    "description": "Qwen2 是 Qwen 模型的最新系列，能夠超越同等規模的最優開源模型甚至更大規模的模型，Qwen2 7B 在多個評測上取得顯著的優勢，尤其是在代碼及中文理解上。"
+  },
+  "Qwen2.5-72B-Instruct": {
+    "description": "Qwen2.5-72B-Instruct 支持 16k 上下文，生成長文本超過 8K。支持 function call 與外部系統無縫互動，極大提升了靈活性和擴展性。模型知識明顯增加，並且大幅提高了編碼和數學能力，多語言支持超過 29 種。"
+  },
   "SenseChat": {
     "description": "基礎版本模型 (V4)，4K上下文長度，通用能力強大"
   },
@@ -206,6 +215,9 @@
   "Tencent/Hunyuan-A52B-Instruct": {
     "description": "Hunyuan-Large 是業界最大的開源 Transformer 架構 MoE 模型，擁有 3890 億總參數量和 520 億激活參數量。"
   },
+  "Yi-34B-Chat": {
+    "description": "Yi-1.5-34B 在保持原系列模型優秀的通用語言能力的前提下，通過增量訓練 5 千億高質量 token，大幅提高了數學邏輯和代碼能力。"
+  },
   "abab5.5-chat": {
     "description": "面向生產力場景，支持複雜任務處理和高效文本生成，適用於專業領域應用。"
   },
@@ -368,6 +380,9 @@
   "codegeex-4": {
     "description": "CodeGeeX-4是一個強大的AI編程助手，支持多種編程語言的智能問答與代碼補全，提升開發效率。"
   },
+  "codegeex4-all-9b": {
+    "description": "CodeGeeX4-ALL-9B 是一個多語言代碼生成模型，支持包括代碼補全和生成、代碼解釋器、網絡搜索、函數調用、倉庫級代碼問答在內的全面功能，覆蓋軟件開發的各種場景。是參數少於 10B 的頂尖代碼生成模型。"
+  },
   "codegemma": {
     "description": "CodeGemma 專用于不同編程任務的輕量級語言模型，支持快速迭代和集成。"
   },
@@ -422,6 +437,9 @@
   "deepseek-chat": {
     "description": "融合通用與代碼能力的全新開源模型，不僅保留了原有 Chat 模型的通用對話能力和 Coder 模型的強大代碼處理能力，還更好地對齊了人類偏好。此外，DeepSeek-V2.5 在寫作任務、指令跟隨等多個方面也實現了大幅提升。"
   },
+  "deepseek-coder-33B-instruct": {
+    "description": "DeepSeek Coder 33B 是一個代碼語言模型，基於 2 萬億數據訓練而成，其中 87% 為代碼，13% 為中英文語言。模型引入 16K 窗口大小和填空任務，提供項目級別的代碼補全和片段填充功能。"
+  },
   "deepseek-coder-v2": {
     "description": "DeepSeek Coder V2 是開源的混合專家代碼模型，在代碼任務方面表現優異，與 GPT4-Turbo 相媲美。"
   },
@@ -476,6 +494,9 @@
   "gemini-exp-1114": {
     "description": "Gemini Exp 1114 是 Google 最新的實驗性多模態 AI 模型，具備快速處理能力，支持文本、影像和影片輸入，適用於多種任務的高效擴展。"
   },
+  "gemini-exp-1121": {
+    "description": "Gemini Exp 1121 是 Google 最新的實驗性多模態 AI 模型，具備快速處理能力，支持文本、圖像和視頻輸入，適用於多種任務的高效擴展。"
+  },
   "gemma-7b-it": {
     "description": "Gemma 7B 適合中小規模任務處理，兼具成本效益。"
   },
@@ -503,6 +524,9 @@
   "glm-4-0520": {
     "description": "GLM-4-0520是最新模型版本，專為高度複雜和多樣化任務設計，表現卓越。"
   },
+  "glm-4-9b-chat": {
+    "description": "GLM-4-9B-Chat 在語義、數學、推理、代碼和知識等多方面均表現出較高性能。還具備網頁瀏覽、代碼執行、自定義工具調用和長文本推理。支持包括日語、韓語、德語在內的 26 種語言。"
+  },
   "glm-4-air": {
     "description": "GLM-4-Air是性價比高的版本，性能接近GLM-4，提供快速度和實惠的價格。"
   },

package/locales/zh-TW/providers.json

@@ -22,6 +22,9 @@
   "fireworksai": {
     "description": "Fireworks AI 是一家領先的高級語言模型服務商，專注於功能調用和多模態處理。其最新模型 Firefunction V2 基於 Llama-3，優化用於函數調用、對話及指令跟隨。視覺語言模型 FireLLaVA-13B 支持圖像和文本混合輸入。其他 notable 模型包括 Llama 系列和 Mixtral 系列，提供高效的多語言指令跟隨與生成支持。"
   },
+  "giteeai": {
+    "description": "Gitee AI 的 Serverless API 為 AI 開發者提供開箱即用的大模型推理 API 服務。"
+  },
   "github": {
     "description": "透過 GitHub 模型，開發者可以成為 AI 工程師，並使用業界領先的 AI 模型進行建設。"
   },

package/locales/zh-TW/setting.json

@@ -389,6 +389,11 @@
       "modelDesc": "指定用於優化用戶提問的模型",
       "title": "知識庫提問重寫"
     },
+    "thread": {
+      "label": "子主題命名模型",
+      "modelDesc": "指定用於子主題自動重命名的模型",
+      "title": "子主題自動命名"
+    },
     "title": "系統助手",
     "topic": {
       "label": "話題命名模型",

package/locales/zh-TW/thread.json

@@ -0,0 +1,5 @@
+{
+  "actions": {
+    "confirmRemoveThread": "即將刪除該子話題，刪除後將無法恢復，請謹慎操作。"
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.33.4",
+  "version": "1.34.0",
   "description": "Lobe Chat - an open-source, high-performance chatbot framework that supports speech synthesis, multimodal, and extensible Function Call plugin system. Supports one-click free deployment of your private ChatGPT/LLM web application.",
   "keywords": [
     "framework",
@@ -65,6 +65,7 @@
     "test:update": "vitest -u",
     "type-check": "tsc --noEmit",
     "webhook:ngrok": "ngrok http http://localhost:3011",
+    "workflow:changelog": "tsx ./scripts/changelogWorkflow/index.ts",
     "workflow:countCharters": "tsx scripts/countEnWord.ts",
     "workflow:docs": "tsx ./scripts/docsWorkflow/index.ts",
     "workflow:i18n": "tsx ./scripts/i18nWorkflow/index.ts",
@@ -244,11 +245,13 @@
     "@next/bundle-analyzer": "^14.2.15",
     "@next/eslint-plugin-next": "^14.2.15",
     "@peculiar/webcrypto": "^1.5.0",
+    "@semantic-release/exec": "^6.0.3",
     "@testing-library/jest-dom": "^6.6.2",
     "@testing-library/react": "^16.0.1",
     "@types/chroma-js": "^2.4.4",
     "@types/debug": "^4.1.12",
     "@types/diff": "^6.0.0",
+    "@types/fs-extra": "^11.0.4",
     "@types/ip": "^1.1.3",
     "@types/json-schema": "^7.0.15",
     "@types/lodash": "^4.17.12",
@@ -276,6 +279,7 @@
     "eslint-plugin-mdx": "^2.3.4",
     "eslint-plugin-unused-imports": "4.0.1",
     "fake-indexeddb": "^6.0.0",
+    "fs-extra": "^11.2.0",
     "glob": "^11.0.0",
     "gray-matter": "^4.0.3",
     "happy-dom": "^15.7.4",
@@ -284,6 +288,7 @@
     "lint-staged": "^15.2.10",
     "lodash": "^4.17.21",
     "markdown-table": "^3.0.3",
+    "markdown-to-txt": "^2.0.1",
     "node-fetch": "^3.3.2",
     "node-gyp": "^10.2.0",
     "openapi-typescript": "^6.7.6",

package/scripts/changelogWorkflow/buildStaticChangelog.ts

@@ -0,0 +1,135 @@
+import { consola } from 'consola';
+import { readJsonSync, writeJSONSync } from 'fs-extra';
+import { markdownToTxt } from 'markdown-to-txt';
+import { existsSync, readFileSync } from 'node:fs';
+import { resolve } from 'node:path';
+import semver from 'semver';
+
+import { CHANGELOG_DIR, CHANGELOG_FILE } from './const';
+
+export interface ChangelogStaticItem {
+  children: {
+    [category: string]: string[];
+  };
+  date: string;
+  version: string;
+}
+
+class BuildStaticChangelog {
+  private removeDetailsTag = (changelog: string): string => {
+    const detailsRegex: RegExp = /<details\b[^>]*>[\S\s]*?<\/details>/gi;
+    return changelog.replaceAll(detailsRegex, '');
+  };
+
+  private cleanVersion = (version: string): string => {
+    return semver.clean(version) || version;
+  };
+
+  private formatCategory = (category: string): string => {
+    const cate = category.trim().toLowerCase();
+
+    switch (cate) {
+      case 'bug fixes': {
+        return 'fixes';
+      }
+      case 'features': {
+        return 'features';
+      }
+      default: {
+        return 'improvements';
+      }
+    }
+  };
+
+  private formatChangelog = (changelog: string): ChangelogStaticItem[] => {
+    const cleanedChangelog = this.removeDetailsTag(changelog);
+    const input = markdownToTxt(cleanedChangelog);
+    const versions = input.split(/Version&nbsp;|Version /).slice(1);
+
+    const output: ChangelogStaticItem[] = [];
+
+    for (const version of versions) {
+      const lines = version.trim().split('\n');
+      const versionNumber = lines[0].trim();
+      const date = lines[2].replace('Released on ', '').trim();
+
+      const entry: ChangelogStaticItem = {
+        children: {},
+        date: date,
+        version: this.cleanVersion(versionNumber),
+      };
+
+      let currentCategory = '';
+      let skipSection = false;
+
+      for (let i = 3; i < lines.length; i++) {
+        const line = lines[i].trim();
+        if (line === '') continue;
+
+        if (/^\p{Emoji}/u.test(line)) {
+          currentCategory = this.formatCategory(line.replace(/^\p{Emoji} /u, ''));
+          if (!currentCategory) continue;
+          entry.children[currentCategory] = [];
+          skipSection = false;
+        } else if (line.startsWith('misc:') && !skipSection && currentCategory) {
+          entry.children[currentCategory].push(line.replace('misc:', '').trim());
+        }
+      }
+
+      // Remove empty categories
+      for (const category in entry.children) {
+        if (entry.children[category].length === 0) {
+          delete entry.children[category];
+        }
+      }
+
+      output.push(entry);
+    }
+
+    return output;
+  };
+
+  private mergeAndSortVersions = (oldVersions: any, newVersions: any) => {
+    const mergedVersions = [...oldVersions];
+
+    for (const newVersion of newVersions) {
+      const existingIndex = mergedVersions.findIndex(
+        (v) => this.cleanVersion(v.version) === this.cleanVersion(newVersion.version),
+      );
+      if (existingIndex === -1) {
+        const insertIndex = mergedVersions.findIndex(
+          (v) =>
+            semver.compare(this.cleanVersion(newVersion.version), this.cleanVersion(v.version)) > 0,
+        );
+        if (insertIndex === -1) {
+          mergedVersions.push(newVersion);
+        } else {
+          mergedVersions.splice(insertIndex, 0, newVersion);
+        }
+      }
+    }
+
+    return mergedVersions;
+  };
+
+  run() {
+    Object.entries(CHANGELOG_FILE).forEach(([version, path]) => {
+      const data = readFileSync(path, 'utf8');
+      const newFile = this.formatChangelog(data);
+
+      const filename = resolve(CHANGELOG_DIR, `${version}.json`);
+      let mergedFile = newFile;
+
+      if (existsSync(filename)) {
+        const oldFile = readJsonSync(filename, 'utf8');
+        mergedFile = this.mergeAndSortVersions(oldFile, newFile);
+      }
+
+      writeJSONSync(filename, mergedFile, { spaces: 2 });
+
+      consola.success(`Changelog ${version} has been built successfully!`);
+    });
+  }
+}
+
+export const buildStaticChangelog = new BuildStaticChangelog();

package/scripts/changelogWorkflow/const.ts

@@ -0,0 +1,11 @@
+import { resolve } from 'node:path';
+
+export const ROOT = resolve(__dirname, '../..');
+export const DOCS_DIR = resolve(ROOT, 'docs/changelog');
+export const CHANGELOG_DIR = resolve(ROOT, 'changelog');
+export const CHANGELOG_FILE = {
+  v0: resolve(CHANGELOG_DIR, 'CHANGELOG.v0.md'),
+  v1: resolve(ROOT, 'CHANGELOG.md'),
+};
+export const STATICS_DIR = resolve(DOCS_DIR, '__statics__');
+export const CHANGELOG_INDEX = resolve(DOCS_DIR, 'index.json');

package/scripts/changelogWorkflow/index.ts

@@ -0,0 +1,10 @@
+import { consola } from 'consola';
+
+import { buildStaticChangelog } from './buildStaticChangelog';
+
+const run = () => {
+  consola.start('Building static changelog...');
+  buildStaticChangelog.run();
+};
+
+run();

package/src/app/(main)/chat/(workspace)/@conversation/default.tsx

@@ -3,6 +3,7 @@ import { isMobileDevice } from '@/utils/server/responsive';
 import ChatHydration from './features/ChatHydration';
 import ChatInput from './features/ChatInput';
 import ChatList from './features/ChatList';
+import ThreadHydration from './features/ThreadHydration';
 import ZenModeToast from './features/ZenModeToast';
 
 const ChatConversation = () => {
@@ -14,6 +15,7 @@ const ChatConversation = () => {
       <ChatList mobile={mobile} />
       <ChatInput />
       <ChatHydration />
+      <ThreadHydration />
     </>
   );
 };

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatHydration/index.tsx

@@ -12,18 +12,27 @@ const ChatHydration = memo(() => {
 
   // two-way bindings the topic params to chat store
   const [topic, setTopic] = useQueryState('topic', { history: 'replace', throttleMs: 500 });
+  const [thread, setThread] = useQueryState('thread', { history: 'replace', throttleMs: 500 });
   useStoreUpdater('activeTopicId', topic);
+  useStoreUpdater('activeThreadId', thread);
 
   useLayoutEffect(() => {
-    const unsubscribe = useChatStore.subscribe(
+    const unsubscribeTopic = useChatStore.subscribe(
       (s) => s.activeTopicId,
       (state) => {
         setTopic(!state ? null : state);
       },
     );
+    const unsubscribeThread = useChatStore.subscribe(
+      (s) => s.activeThreadId,
+      (state) => {
+        setThread(!state ? null : state);
+      },
+    );
 
     return () => {
-      unsubscribe();
+      unsubscribeTopic();
+      unsubscribeThread();
     };
   }, []);
 

package/src/{features → app/(main)/chat/(workspace)/@conversation/features}/ChatInput/Desktop/Footer/index.tsx

@@ -11,8 +11,8 @@ import { useChatStore } from '@/store/chat';
 import { chatSelectors } from '@/store/chat/selectors';
 import { isMacOS } from '@/utils/platform';
 
-import SaveTopic from '../../Topic';
-import LocalFiles from '../FilePreview';
+import LocalFiles from '../../../../../../../../../features/ChatInput/Desktop/FilePreview';
+import SaveTopic from '../../../../../../../../../features/ChatInput/Topic';
 import SendMore from './SendMore';
 import ShortcutHint from './ShortcutHint';
 
@@ -45,12 +45,10 @@ const useStyles = createStyles(({ css, prefixCls, token }) => {
 
 interface FooterProps {
   expand: boolean;
-  saveTopic?: boolean;
-  setExpand?: (expand: boolean) => void;
-  shortcutHint?: boolean;
+  onExpandChange: (expand: boolean) => void;
 }
 
-const Footer = memo<FooterProps>(({ setExpand, expand, shortcutHint = true, saveTopic = true }) => {
+const Footer = memo<FooterProps>(({ onExpandChange, expand }) => {
   const { t } = useTranslation('chat');
 
   const { styles } = useStyles();
@@ -82,8 +80,8 @@ const Footer = memo<FooterProps>(({ setExpand, expand, shortcutHint = true, save
         {expand && <LocalFiles />}
       </Flexbox>
       <Flexbox align={'center'} flex={'none'} gap={8} horizontal>
-        {shortcutHint && <ShortcutHint />}
-        {saveTopic && <SaveTopic />}
+        <ShortcutHint />
+        <SaveTopic />
         <Flexbox style={{ minWidth: 92 }}>
           {isAIGenerating ? (
             <Button
@@ -100,7 +98,7 @@ const Footer = memo<FooterProps>(({ setExpand, expand, shortcutHint = true, save
                 loading={!canSend}
                 onClick={() => {
                   sendMessage();
-                  setExpand?.(false);
+                  onExpandChange?.(false);
                 }}
                 type={'primary'}
               >

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatInput/Desktop/index.tsx

@@ -3,10 +3,11 @@
 import { memo } from 'react';
 
 import { ActionKeys } from '@/features/ChatInput/ActionBar/config';
-import DesktopChatInput from '@/features/ChatInput/Desktop';
+import DesktopChatInput, { FooterRender } from '@/features/ChatInput/Desktop';
 import { useGlobalStore } from '@/store/global';
 import { systemStatusSelectors } from '@/store/global/selectors';
 
+import Footer from './Footer';
 import TextArea from './TextArea';
 
 const leftActions = [
@@ -17,12 +18,15 @@ const leftActions = [
   'history',
   'stt',
   'tools',
-  'token',
+  'mainToken',
 ] as ActionKeys[];
 
 const rightActions = ['clear'] as ActionKeys[];
 
 const renderTextArea = (onSend: () => void) => <TextArea onSend={onSend} />;
+const renderFooter: FooterRender = ({ expand, onExpandChange }) => (
+  <Footer expand={expand} onExpandChange={onExpandChange} />
+);
 
 const Desktop = memo(() => {
   const [inputHeight, updatePreference] = useGlobalStore((s) => [
@@ -37,6 +41,7 @@ const Desktop = memo(() => {
       onInputHeightChange={(height) => {
         updatePreference({ inputHeight: height });
       }}
+      renderFooter={renderFooter}
       renderTextArea={renderTextArea}
       rightActions={rightActions}
     />

package/src/app/(main)/chat/(workspace)/@conversation/features/ChatList/ChatItem/Thread.tsx

@@ -0,0 +1,62 @@
+import { Typography } from 'antd';
+import { createStyles } from 'antd-style';
+import isEqual from 'fast-deep-equal';
+import { CSSProperties, memo } from 'react';
+import { useTranslation } from 'react-i18next';
+import { Flexbox } from 'react-layout-kit';
+
+import { useChatStore } from '@/store/chat';
+import { threadSelectors } from '@/store/chat/selectors';
+
+import ThreadItem from './ThreadItem';
+
+const useStyles = createStyles(({ css, token, isDarkMode }) => ({
+  container: css`
+    cursor: pointer;
+
+    padding-block: 8px 4px;
+    padding-inline: 4px;
+
+    background: ${isDarkMode ? token.colorFillTertiary : token.colorFillQuaternary};
+    border-radius: 6px;
+  `,
+}));
+
+interface ThreadProps {
+  id: string;
+  placement: 'start' | 'end';
+  style?: CSSProperties;
+}
+
+const Thread = memo<ThreadProps>(({ id, placement, style }) => {
+  const { t } = useTranslation('chat');
+  const { styles } = useStyles();
+
+  const threads = useChatStore(threadSelectors.getThreadsBySourceMsgId(id), isEqual);
+
+  return (
+    <Flexbox
+      direction={placement === 'end' ? 'horizontal-reverse' : 'horizontal'}
+      gap={12}
+      paddingInline={16}
+      style={{ paddingBottom: 16, ...style }}
+    >
+      <div style={{ width: 40 }} />
+      <Flexbox className={styles.container} gap={4} padding={4} style={{ width: 'fit-content' }}>
+        <Flexbox gap={8} horizontal paddingInline={6}>
+          <Typography.Text style={{ fontSize: 12 }} type={'secondary'}>
+            {t('thread.title')}
+            {threads.length}
+          </Typography.Text>
+        </Flexbox>
+        <Flexbox>
+          {threads.map((thread) => (
+            <ThreadItem key={thread.id} {...thread} />
+          ))}
+        </Flexbox>
+      </Flexbox>
+    </Flexbox>
+  );
+});
+
+export default Thread;