@lobehub/chat 1.83.7 → 1.84.0

package/locales/vi-VN/setting.json

@@ -150,6 +150,7 @@
       "title": "Màu nền"
     },
     "description": {
+      "desc": "Giới thiệu ngắn gọn về trợ lý của bạn, không dùng để thiết lập nhân vật",
       "placeholder": "Vui lòng nhập mô tả trợ lý",
       "title": "Mô tả trợ lý"
     },
@@ -161,7 +162,9 @@
       "placeholder": "Vui lòng nhập từ khóa Prompt cho vai diễn",
       "title": "Thiết lập vai diễn"
     },
+    "submit": "Cập nhật thông tin trợ lý",
     "tag": {
+      "desc": "Thẻ trợ lý sẽ được hiển thị trong thị trường trợ lý",
       "placeholder": "Vui lòng nhập nhãn",
       "title": "Nhãn"
     },
@@ -206,6 +209,7 @@
       "placeholder": "Mẫu xử lý trước {{text}} sẽ được thay thế bằng thông tin nhập thời gian thực",
       "title": "Mẫu xử lý đầu vào của người dùng"
     },
+    "submit": "Cập nhật sở thích trò chuyện",
     "title": "Cài đặt trò chuyện"
   },
   "settingModel": {
@@ -243,6 +247,7 @@
       },
       "title": "Cường độ suy luận"
     },
+    "submit": "Cập nhật cài đặt mô hình",
     "temperature": {
       "desc": "Giá trị càng lớn, câu trả lời càng sáng tạo và giàu trí tưởng tượng; giá trị càng nhỏ, câu trả lời càng nghiêm ngặt",
       "title": "Mức độ sáng tạo",
@@ -319,6 +324,7 @@
       "desc": "Trong đó, trình duyệt là dịch vụ nhận dạng giọng nói nguyên bản của trình duyệt",
       "title": "Dịch vụ nhận dạng giọng nói"
     },
+    "submit": "Cập nhật dịch vụ giọng nói",
     "title": "Dịch vụ giọng nói",
     "tts": "Cài đặt tổng hợp giọng nói",
     "ttsService": {
@@ -396,6 +402,12 @@
     "placeholder": "Vui lòng nhập nhận dạng trợ lý, cần phải duy nhất, ví dụ như phát triển web",
     "tooltips": "Chia sẻ lên thị trường trợ lý"
   },
+  "submitFooter": {
+    "reset": "Đặt lại",
+    "submit": "Lưu",
+    "unSaved": "Thay đổi chưa được lưu",
+    "unSavedWarning": "Hiện tại có thay đổi chưa được lưu"
+  },
   "sync": {
     "device": {
       "deviceName": {
@@ -447,6 +459,7 @@
       "placeholder": "Nhập từ gợi ý tùy chỉnh",
       "title": "Từ gợi ý tùy chỉnh"
     },
+    "helpInfo": "Khi tạo trợ lý mới, sẽ sử dụng cài đặt trợ lý mặc định làm giá trị mặc định.",
     "historyCompress": {
       "label": "Mô hình lịch sử cuộc trò chuyện",
       "modelDesc": "Chỉ định mô hình được sử dụng để nén lịch sử cuộc trò chuyện",

package/locales/vi-VN/tool.json

@@ -54,7 +54,16 @@
       "title": "Công cụ tìm kiếm:"
     },
     "searchResult": "Số lượng tìm kiếm:",
-    "searchTimeRange": "Khoảng thời gian:",
+    "searchTimeRange": {
+      "title": "Khoảng thời gian:",
+      "value": {
+        "anytime": "Không giới hạn thời gian",
+        "day": "Trong một ngày",
+        "month": "Trong một tháng",
+        "week": "Trong một tuần",
+        "year": "Trong một năm"
+      }
+    },
     "summary": "Tóm tắt",
     "summaryTooltip": "Tóm tắt nội dung hiện tại",
     "viewMoreResults": "Xem thêm {{results}} kết quả"

package/locales/zh-CN/color.json

@@ -0,0 +1,22 @@
+{
+  "blue": "拂晓蓝",
+  "custom": "自定义",
+  "cyan": "明青",
+  "default": "默认",
+  "geekblue": "极客蓝",
+  "gold": "金盏花",
+  "green": "极光绿",
+  "lime": "青柠",
+  "magenta": "法式洋红",
+  "mauve": "藤萝紫",
+  "olive": "橄榄绿",
+  "orange": "日暮",
+  "presets": "预设",
+  "purple": "酱紫",
+  "red": "薄暮",
+  "sage": "鼠尾草绿",
+  "sand": "沙滩",
+  "slate": "石板灰",
+  "volcano": "火山",
+  "yellow": "日出"
+}

package/locales/zh-CN/common.json

@@ -25,8 +25,8 @@
     "showDetail": "查看详情"
   },
   "autoGenerate": "自动补全",
-  "autoGenerateTooltip": "基于提示词自动补全助手描述",
-  "autoGenerateTooltipDisabled": "请填写提示词后使用自动补全功能",
+  "autoGenerateTooltip": "基于角色设定自动补全助手描述",
+  "autoGenerateTooltipDisabled": "请填写角色设定后使用自动补全功能",
   "back": "返回",
   "batchDelete": "批量删除",
   "blog": "产品博客",

package/locales/zh-CN/file.json

@@ -71,6 +71,9 @@
     "websites": "网页"
   },
   "title": "文件",
+  "toggleLeftPanel": {
+    "title": "显示/隐藏左侧面板"
+  },
   "uploadDock": {
     "body": {
       "collapse": "收起",

package/locales/zh-CN/models.json

@@ -887,6 +887,15 @@
   "ernie-4.5-8k-preview": {
     "description": "文心大模型4.5是百度自主研发的新一代原生多模态基础大模型，通过多个模态联合建模实现协同优化，多模态理解能力优秀；具备更精进的语言能力，理解、生成、逻辑、记忆能力全面提升，去幻觉、逻辑推理、代码能力显著提升。"
   },
+  "ernie-4.5-turbo-128k": {
+    "description": "文心4.5 Turbo在去幻觉、逻辑推理和代码能力等方面也有着明显增强。对比文心4.5，速度更快、价格更低。模型能力全面提升，更好满足多轮长历史对话处理、长文档理解问答任务。"
+  },
+  "ernie-4.5-turbo-32k": {
+    "description": "文心4.5 Turbo在去幻觉、逻辑推理和代码能力等方面也有着明显增强。对比文心4.5，速度更快、价格更低。文本创作、知识问答等能力提升显著。输出长度及整句时延相较ERNIE 4.5有所增加。"
+  },
+  "ernie-4.5-turbo-vl-32k": {
+    "description": "文心一言大模型全新版本，图片理解、创作、翻译、代码等能力显著提升，首次支持32K上下文长度，首Token时延显著降低。"
+  },
   "ernie-char-8k": {
     "description": "百度自研的垂直场景大语言模型，适合游戏NPC、客服对话、对话角色扮演等应用场景，人设风格更为鲜明、一致，指令遵循能力更强，推理性能更优。"
   },
@@ -911,9 +920,15 @@
   "ernie-tiny-8k": {
     "description": "ERNIE Tiny是百度自研的超高性能大语言模型，部署与精调成本在文心系列模型中最低。"
   },
+  "ernie-x1-32k": {
+    "description": "具备更强的理解、规划、反思、进化能力。作为能力更全面的深度思考模型，文心X1兼备准确、创意和文采，在中文知识问答、文学创作、文稿写作、日常对话、逻辑推理、复杂计算及工具调用等方面表现尤为出色。"
+  },
   "ernie-x1-32k-preview": {
     "description": "文心大模型X1具备更强的理解、规划、反思、进化能力。作为能力更全面的深度思考模型，文心X1兼备准确、创意和文采，在中文知识问答、文学创作、文稿写作、日常对话、逻辑推理、复杂计算及工具调用等方面表现尤为出色。"
   },
+  "ernie-x1-turbo-32k": {
+    "description": "与ERNIE-X1-32K相比，模型效果和性能更好。"
+  },
   "gemini-1.0-pro-001": {
     "description": "Gemini 1.0 Pro 001 (Tuning) 提供稳定并可调优的性能，是复杂任务解决方案的理想选择。"
   },

package/locales/zh-CN/setting.json

@@ -144,12 +144,13 @@
   },
   "settingAgent": {
     "avatar": {
-      "title": "头像"
+      "title": "助手头像"
     },
     "backgroundColor": {
-      "title": "背景色"
+      "title": "头像背景色"
     },
     "description": {
+      "desc": "简单介绍你的助手，不作为角色设定",
       "placeholder": "请输入助手描述",
       "title": "助手描述"
     },
@@ -161,7 +162,9 @@
       "placeholder": "请输入角色 Prompt 提示词",
       "title": "角色设定"
     },
+    "submit": "更新助手信息",
     "tag": {
+      "desc": "助手标签将在助手市场中展示",
       "placeholder": "请输入标签",
       "title": "标签"
     },
@@ -206,6 +209,7 @@
       "placeholder": "预处理模版 {{text}} 将替换为实时输入信息",
       "title": "用户输入预处理"
     },
+    "submit": "更新聊天偏好",
     "title": "聊天设置"
   },
   "settingModel": {
@@ -243,6 +247,7 @@
       },
       "title": "推理强度"
     },
+    "submit": "更新模型设置",
     "temperature": {
       "desc": "数值越大，回答越有创意和想象力；数值越小，回答越严谨",
       "title": "创意活跃度",
@@ -319,6 +324,7 @@
       "desc": "其中 browser 为浏览器原生的语音识别服务",
       "title": "语音识别服务"
     },
+    "submit": "更新语音服务",
     "title": "语音服务",
     "tts": "语音合成设置",
     "ttsService": {
@@ -396,6 +402,12 @@
     "placeholder": "请输入助手的标识符，需要是唯一的，比如 web-development",
     "tooltips": "分享到助手市场"
   },
+  "submitFooter": {
+    "reset": "重置",
+    "submit": "保存",
+    "unSaved": "未保存更改",
+    "unSavedWarning": "当前有未保存的更改"
+  },
   "sync": {
     "device": {
       "deviceName": {
@@ -447,6 +459,7 @@
       "placeholder": "请输入自定义提示词",
       "title": "自定义提示词"
     },
+    "helpInfo": "当创建新助手时，将以默认助手设置作为预设值。",
     "historyCompress": {
       "label": "会话历史模型",
       "modelDesc": "指定用于压缩会话历史的模型",

package/locales/zh-TW/color.json

@@ -0,0 +1,22 @@
+{
+  "blue": "拂曉藍",
+  "custom": "自訂",
+  "cyan": "明青",
+  "default": "預設",
+  "geekblue": "極客藍",
+  "gold": "金盞花",
+  "green": "極光綠",
+  "lime": "青檸",
+  "magenta": "法式洋紅",
+  "mauve": "藤蘿紫",
+  "olive": "橄欖綠",
+  "orange": "日暮",
+  "presets": "預設",
+  "purple": "醬紫",
+  "red": "薄暮",
+  "sage": "鼠尾草綠",
+  "sand": "沙灘",
+  "slate": "石板灰",
+  "volcano": "火山",
+  "yellow": "日出"
+}

package/locales/zh-TW/file.json

@@ -71,6 +71,9 @@
     "websites": "網頁"
   },
   "title": "檔案",
+  "toggleLeftPanel": {
+    "title": "顯示/隱藏左側面板"
+  },
   "uploadDock": {
     "body": {
       "collapse": "收起",

package/locales/zh-TW/models.json

@@ -887,6 +887,15 @@
   "ernie-4.5-8k-preview": {
     "description": "文心大模型4.5是百度自主研發的新一代原生多模態基礎大模型，通過多個模態聯合建模實現協同優化，多模態理解能力優秀；具備更精進的語言能力，理解、生成、邏輯、記憶能力全面提升，去幻覺、邏輯推理、代碼能力顯著提升。"
   },
+  "ernie-4.5-turbo-128k": {
+    "description": "文心4.5 Turbo在去幻覺、邏輯推理和程式碼能力等方面也有著明顯增強。對比文心4.5，速度更快、價格更低。模型能力全面提升，更好滿足多輪長歷史對話處理、長文檔理解問答任務。"
+  },
+  "ernie-4.5-turbo-32k": {
+    "description": "文心4.5 Turbo在去幻覺、邏輯推理和程式碼能力等方面也有著明顯增強。對比文心4.5，速度更快、價格更低。文本創作、知識問答等能力提升顯著。輸出長度及整句時延相較ERNIE 4.5有所增加。"
+  },
+  "ernie-4.5-turbo-vl-32k": {
+    "description": "文心一言大模型全新版本，圖片理解、創作、翻譯、程式碼等能力顯著提升，首次支持32K上下文長度，首Token時延顯著降低。"
+  },
   "ernie-char-8k": {
     "description": "百度自研的垂直場景大語言模型，適合遊戲NPC、客服對話、對話角色扮演等應用場景，人設風格更為鮮明、一致，指令遵循能力更強，推理性能更優。"
   },
@@ -911,9 +920,15 @@
   "ernie-tiny-8k": {
     "description": "ERNIE Tiny是百度自研的超高性能大語言模型，部署與精調成本在文心系列模型中最低。"
   },
+  "ernie-x1-32k": {
+    "description": "具備更強的理解、規劃、反思、進化能力。作為能力更全面的深度思考模型，文心X1兼具準確、創意和文采，在中文知識問答、文學創作、文稿寫作、日常對話、邏輯推理、複雜計算及工具調用等方面表現尤為出色。"
+  },
   "ernie-x1-32k-preview": {
     "description": "文心大模型X1具備更強的理解、規劃、反思、進化能力。作為能力更全面的深度思考模型，文心X1兼具準確、創意和文采，在中文知識問答、文學創作、文稿寫作、日常對話、邏輯推理、複雜計算及工具調用等方面表現尤為出色。"
   },
+  "ernie-x1-turbo-32k": {
+    "description": "與ERNIE-X1-32K相比，模型效果和性能更佳。"
+  },
   "gemini-1.0-pro-001": {
     "description": "Gemini 1.0 Pro 001 (Tuning) 提供穩定並可調優的性能，是複雜任務解決方案的理想選擇。"
   },

package/locales/zh-TW/setting.json

@@ -150,6 +150,7 @@
       "title": "背景色"
     },
     "description": {
+      "desc": "簡單介紹你的助手，不作為角色設定",
       "placeholder": "請輸入助手描述",
       "title": "助手描述"
     },
@@ -161,7 +162,9 @@
       "placeholder": "請輸入角色 Prompt 提示詞",
       "title": "角色設定"
     },
+    "submit": "更新助手資訊",
     "tag": {
+      "desc": "助手標籤將在助手市場中展示",
       "placeholder": "請輸入標籤",
       "title": "標籤"
     },
@@ -206,6 +209,7 @@
       "placeholder": "預處理模板 {{text}} 將替換為實時輸入資訊",
       "title": "使用者輸入預處理"
     },
+    "submit": "更新聊天偏好",
     "title": "聊天設定"
   },
   "settingModel": {
@@ -243,6 +247,7 @@
       },
       "title": "推理強度"
     },
+    "submit": "更新模型設定",
     "temperature": {
       "desc": "數值越大，回答越有創意和想像力；數值越小，回答越嚴謹",
       "title": "創意活躍度",
@@ -319,6 +324,7 @@
       "desc": "其中 browser 為瀏覽器原生的語音識別服務",
       "title": "語音識別服務"
     },
+    "submit": "更新語音服務",
     "title": "語音服務",
     "tts": "語音合成設定",
     "ttsService": {
@@ -396,6 +402,12 @@
     "placeholder": "請輸入助手的標識符，需要是唯一的，比如 web-development",
     "tooltips": "分享到助手市場"
   },
+  "submitFooter": {
+    "reset": "重置",
+    "submit": "保存",
+    "unSaved": "未保存更改",
+    "unSavedWarning": "當前有未保存的更改"
+  },
   "sync": {
     "device": {
       "deviceName": {
@@ -447,6 +459,7 @@
       "placeholder": "請輸入自訂提示詞",
       "title": "自訂提示詞"
     },
+    "helpInfo": "當創建新助手時，將以預設助手設定作為預設值。",
     "historyCompress": {
       "label": "會話歷史模型",
       "modelDesc": "指定用於壓縮會話歷史的模型",

package/locales/zh-TW/tool.json

@@ -54,7 +54,16 @@
       "title": "搜尋引擎："
     },
     "searchResult": "搜尋數量：",
-    "searchTimeRange": "時間範圍：",
+    "searchTimeRange": {
+      "title": "時間範圍：",
+      "value": {
+        "anytime": "時間不限",
+        "day": "一天內",
+        "month": "一個月內",
+        "week": "一周內",
+        "year": "一年內"
+      }
+    },
     "summary": "總結",
     "summaryTooltip": "總結當前內容",
     "viewMoreResults": "查看更多 {{results}} 個結果"

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lobehub/chat",
-  "version": "1.83.7",
+  "version": "1.84.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",
@@ -141,12 +141,12 @@
     "@lobechat/electron-client-ipc": "workspace:*",
     "@lobechat/electron-server-ipc": "workspace:*",
     "@lobechat/web-crawler": "workspace:*",
-    "@lobehub/charts": "^1.12.0",
+    "@lobehub/charts": "^2.0.0",
     "@lobehub/chat-plugin-sdk": "^1.32.4",
     "@lobehub/chat-plugins-gateway": "^1.9.0",
-    "@lobehub/icons": "^1.95.0",
-    "@lobehub/tts": "^1.28.3",
-    "@lobehub/ui": "^1.171.0",
+    "@lobehub/icons": "^2.0.0",
+    "@lobehub/tts": "^2.0.0",
+    "@lobehub/ui": "^2.0.1",
     "@modelcontextprotocol/sdk": "^1.10.1",
     "@neondatabase/serverless": "^1.0.0",
     "@next/third-parties": "^15.3.0",

package/src/app/[variants]/(auth)/next-auth/signin/AuthSignInBox.tsx

@@ -1,7 +1,8 @@
 'use client';
 
+import { Button } from '@lobehub/ui';
 import { LobeChat } from '@lobehub/ui/brand';
-import { Button, Col, Flex, Row, Skeleton, Typography } from 'antd';
+import { Col, Flex, Row, Skeleton, Typography } from 'antd';
 import { createStyles } from 'antd-style';
 import { AuthError } from 'next-auth';
 import { signIn } from 'next-auth/react';

package/src/app/[variants]/(main)/(mobile)/me/(home)/features/Header.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { ActionIcon } from '@lobehub/ui';
-import { MobileNavBar } from '@lobehub/ui/mobile';
+import { ChatHeader } from '@lobehub/ui/mobile';
 import { useTheme } from 'antd-style';
 import { Moon, Sun } from 'lucide-react';
 import { memo } from 'react';
@@ -15,7 +15,7 @@ const Header = memo(() => {
   const switchThemeMode = useGlobalStore((s) => s.switchThemeMode);
 
   return (
-    <MobileNavBar
+    <ChatHeader
       right={
         <ActionIcon
           icon={theme.isDarkMode ? Moon : Sun}

package/src/app/[variants]/(main)/(mobile)/me/data/features/Header.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { MobileNavBar, MobileNavBarTitle } from '@lobehub/ui/mobile';
+import { ChatHeader } from '@lobehub/ui/mobile';
 import { useRouter } from 'next/navigation';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -13,9 +13,9 @@ const Header = memo(() => {
 
   const router = useRouter();
   return (
-    <MobileNavBar
+    <ChatHeader
       center={
-        <MobileNavBarTitle
+        <ChatHeader.Title
           title={
             <Flexbox align={'center'} gap={4} horizontal>
               {t('userPanel.data')}

package/src/app/[variants]/(main)/(mobile)/me/profile/features/Header.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { MobileNavBar, MobileNavBarTitle } from '@lobehub/ui/mobile';
+import { ChatHeader } from '@lobehub/ui/mobile';
 import { useRouter } from 'next/navigation';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -13,9 +13,9 @@ const Header = memo(() => {
 
   const router = useRouter();
   return (
-    <MobileNavBar
+    <ChatHeader
       center={
-        <MobileNavBarTitle
+        <ChatHeader.Title
           title={
             <Flexbox align={'center'} gap={4} horizontal>
               {t('userPanel.profile')}

package/src/app/[variants]/(main)/(mobile)/me/settings/features/Header.tsx

@@ -1,6 +1,6 @@
 'use client';
 
-import { MobileNavBar, MobileNavBarTitle } from '@lobehub/ui/mobile';
+import { ChatHeader } from '@lobehub/ui/mobile';
 import { useRouter } from 'next/navigation';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -13,9 +13,9 @@ const Header = memo(() => {
 
   const router = useRouter();
   return (
-    <MobileNavBar
+    <ChatHeader
       center={
-        <MobileNavBarTitle
+        <ChatHeader.Title
           title={
             <Flexbox align={'center'} gap={4} horizontal>
               {t('userPanel.setting')}

package/src/app/[variants]/(main)/(mobile)/me/settings/features/useCategory.tsx

@@ -1,4 +1,4 @@
-import { Tag } from 'antd';
+import { Tag } from '@lobehub/ui';
 import { Bot, Brain, Cloudy, Info, Mic2, Settings2, Sparkles } from 'lucide-react';
 import { useRouter } from 'next/navigation';
 import { useTranslation } from 'react-i18next';

package/src/app/[variants]/(main)/_layout/Desktop/SideBar/BottomActions.tsx

@@ -1,4 +1,4 @@
-import { ActionIcon } from '@lobehub/ui';
+import { ActionIcon, ActionIconProps } from '@lobehub/ui';
 import { Book, Github } from 'lucide-react';
 import Link from 'next/link';
 import { memo } from 'react';
@@ -8,6 +8,12 @@ import { Flexbox } from 'react-layout-kit';
 import { DOCUMENTS_REFER_URL, GITHUB } from '@/const/url';
 import { featureFlagsSelectors, useServerConfigStore } from '@/store/serverConfig';
 
+const ICON_SIZE: ActionIconProps['size'] = {
+  blockSize: 36,
+  size: 20,
+  strokeWidth: 1.5,
+};
+
 const BottomActions = memo(() => {
   const { t } = useTranslation('common');
   const { hideGitHub, hideDocs } = useServerConfigStore(featureFlagsSelectors);
@@ -16,12 +22,22 @@ const BottomActions = memo(() => {
     <Flexbox gap={8}>
       {!hideGitHub && (
         <Link aria-label={'GitHub'} href={GITHUB} target={'_blank'}>
-          <ActionIcon icon={Github} placement={'right'} title={'GitHub'} />
+          <ActionIcon
+            icon={Github}
+            size={ICON_SIZE}
+            title={'GitHub'}
+            tooltipProps={{ placement: 'right' }}
+          />
         </Link>
       )}
       {!hideDocs && (
         <Link aria-label={t('document')} href={DOCUMENTS_REFER_URL} target={'_blank'}>
-          <ActionIcon icon={Book} placement={'right'} title={t('document')} />
+          <ActionIcon
+            icon={Book}
+            size={ICON_SIZE}
+            title={t('document')}
+            tooltipProps={{ placement: 'right' }}
+          />
         </Link>
       )}
     </Flexbox>

package/src/app/[variants]/(main)/_layout/Desktop/SideBar/PinList/index.tsx

@@ -13,37 +13,53 @@ import { useUserStore } from '@/store/user';
 import { settingsSelectors } from '@/store/user/selectors';
 import { HotkeyEnum, KeyEnum } from '@/types/hotkey';
 
-const useStyles = createStyles(({ css, token }) => ({
-  avatar: css`
-    position: relative;
-    transition: all 200ms ease-out 0s;
+const HANDLER_WIDTH = 4;
 
-    &:hover {
-      box-shadow: 0 0 0 2px ${token.colorPrimary};
-    }
-  `,
+const useStyles = createStyles(({ css, token }) => ({
   ink: css`
     &::before {
       content: '';
 
       position: absolute;
       inset-block-start: 50%;
-      inset-inline: -${12 + 3}px;
+      inset-inline: -9px;
       transform: translateY(-50%);
 
-      width: 4px;
-      height: 0;
-      border-radius: 50px;
+      width: 0;
+      height: 8px;
+      border-start-end-radius: ${HANDLER_WIDTH}px;
+      border-end-end-radius: ${HANDLER_WIDTH}px;
 
+      opacity: 0;
       background: ${token.colorPrimary};
 
-      transition: height 150ms ease-out;
+      transition:
+        height 150ms ${token.motionEaseInOut},
+        width 150ms ${token.motionEaseInOut},
+        opacity 200ms ${token.motionEaseInOut};
+    }
+
+    &:hover {
+      &::before {
+        width: ${HANDLER_WIDTH}px;
+        height: 24px;
+        opacity: 1;
+      }
     }
   `,
   inkActive: css`
     &::before {
-      width: 8px;
-      height: 32px;
+      width: ${HANDLER_WIDTH}px;
+      height: 40px;
+      opacity: 1;
+    }
+
+    &:hover {
+      &::before {
+        width: ${HANDLER_WIDTH}px;
+        height: 40px;
+        opacity: 1;
+      }
     }
   `,
 }));
@@ -65,7 +81,7 @@ const PinList = () => {
   return (
     hasList && (
       <>
-        <Divider style={{ margin: '8px 12px' }} />
+        <Divider style={{ marginBottom: 8, marginTop: 4 }} />
         <Flexbox flex={1} gap={12} height={'100%'}>
           {list.slice(0, 9).map((item, index) => (
             <Flexbox key={item.id} style={{ position: 'relative' }}>
@@ -83,10 +99,10 @@ const PinList = () => {
                   <Avatar
                     avatar={sessionHelpers.getAvatar(item.meta)}
                     background={item.meta.backgroundColor}
-                    className={cx(styles.avatar)}
                     onClick={() => {
                       switchAgent(item.id);
                     }}
+                    size={40}
                   />
                 </Flexbox>
               </Tooltip>