From b174527719bf2f00a1487241e1d9946f3446b9ec Mon Sep 17 00:00:00 2001
From: 7418 <7418@openclaw.ai>
Date: Sat, 28 Feb 2026 13:13:30 +0800
Subject: [PATCH] =?UTF-8?q?fix:=20ChatList=20=E5=B8=83=E5=B1=80=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=20+=20=E5=A4=9A=E8=AF=AD=E8=A8=80=E9=80=82=E9=85=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- ChatList 字体从 12px 放大到 13px，图标同步放大，改善点击体验
- ConnectionStatus 胶囊移到顶部 header 区域，与下方按钮左对齐
- "Threads" 改为会话列表上方的小标题，充当分割作用
- ConnectionStatus 文字（Connected/Disconnected/Checking）多语言适配
- "从 Claude CLI 导入" 改为 "从 Claude Code 导入"
- 新增 i18n key: chatList.threads, connection.connected/disconnected/checking

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/components/layout/ChatListPanel.tsx    | 34 ++++++++++++----------
 src/components/layout/ConnectionStatus.tsx |  6 ++--
 src/i18n/en.ts                             |  6 +++-
 src/i18n/zh.ts                             |  6 +++-
 4 files changed, 32 insertions(+), 20 deletions(-)

diff --git a/src/components/layout/ChatListPanel.tsx b/src/components/layout/ChatListPanel.tsx
index 3246f46..31333a8 100644
--- a/src/components/layout/ChatListPanel.tsx
+++ b/src/components/layout/ChatListPanel.tsx
@@ -358,10 +358,7 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
       style={{ width: width ?? 240 }}
     >
       {/* Header - extra top padding for macOS traffic lights */}
-      <div className="flex h-12 shrink-0 items-center justify-between px-3 mt-5 pl-6">
-        <span className="text-[13px] font-semibold tracking-tight text-sidebar-foreground">
-          Threads
-        </span>
+      <div className="flex h-12 shrink-0 items-center px-3 mt-5">
         <ConnectionStatus />
       </div>
 
@@ -425,12 +422,19 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
       {/* Session list grouped by project */}
       <ScrollArea className="flex-1 min-h-0 px-3">
         <div className="flex flex-col pb-3">
+          {/* Section title */}
+          <div className="px-2 pt-1 pb-1.5">
+            <span className="text-[11px] font-medium uppercase tracking-wider text-muted-foreground/60">
+              {t('chatList.threads')}
+            </span>
+          </div>
+
           {/* Split group section */}
           {isSplitActive && (
             <div className="mb-2 rounded-lg border border-border/60 bg-muted/30 p-1.5">
               <div className="flex items-center gap-1.5 px-2 py-1">
-                <Columns2 className="h-3 w-3 text-muted-foreground" />
-                <span className="text-[11px] font-medium text-muted-foreground">{t('split.splitGroup')}</span>
+                <Columns2 className="h-3.5 w-3.5 text-muted-foreground" />
+                <span className="text-xs font-medium text-muted-foreground">{t('split.splitGroup')}</span>
               </div>
               <div className="mt-0.5 flex flex-col gap-0.5">
                 {splitSessions.map((session) => {
@@ -466,7 +470,7 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                         </span>
                       )}
                       <div className="flex-1 min-w-0">
-                        <span className="line-clamp-1 text-[12px] font-medium leading-tight break-all">
+                        <span className="line-clamp-1 text-[13px] font-medium leading-tight break-all">
                           {session.title}
                         </span>
                       </div>
@@ -532,13 +536,13 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                       >
                     <HugeiconsIcon
                       icon={isCollapsed ? ArrowRight01Icon : ArrowDown01Icon}
-                      className="h-3 w-3 shrink-0 text-muted-foreground"
+                      className="h-3.5 w-3.5 shrink-0 text-muted-foreground"
                     />
                     <HugeiconsIcon
                       icon={isCollapsed ? Folder01Icon : FolderOpenIcon}
-                      className="h-3.5 w-3.5 shrink-0 text-muted-foreground"
+                      className="h-4 w-4 shrink-0 text-muted-foreground"
                     />
-                    <span className="flex-1 truncate text-[12px] font-medium text-sidebar-foreground">
+                    <span className="flex-1 truncate text-[13px] font-medium text-sidebar-foreground">
                       {group.displayName}
                     </span>
                     {/* New chat in project button (on hover) */}
@@ -562,7 +566,7 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                           >
                             <HugeiconsIcon
                               icon={PlusSignIcon}
-                              className="h-3 w-3"
+                              className="h-3.5 w-3.5"
                             />
                             <span className="sr-only">
                               New chat in {group.displayName}
@@ -634,7 +638,7 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                                       });
                                     }}
                                   >
-                                    <Columns2 className="h-3 w-3" />
+                                    <Columns2 className="h-3.5 w-3.5" />
                                   </button>
                                 )}
                                 {/* Streaming indicator: hidden when hover shows split icon */}
@@ -658,14 +662,14 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                                 )}
                               </span>
                               <div className="flex-1 min-w-0">
-                                <span className="line-clamp-1 text-[12px] font-medium leading-tight break-all">
+                                <span className="line-clamp-1 text-[13px] font-medium leading-tight break-all">
                                   {session.title}
                                 </span>
                               </div>
                               {/* Right area — fixed width, time and delete stacked with opacity */}
                               <div className="relative w-[38px] h-4 shrink-0">
                                 <span className={cn(
-                                  "absolute inset-0 flex items-center justify-end text-[10px] text-muted-foreground/40 truncate transition-opacity",
+                                  "absolute inset-0 flex items-center justify-end text-[11px] text-muted-foreground/40 truncate transition-opacity",
                                   (isHovered || isDeleting) ? "opacity-0" : "opacity-100"
                                 )}>
                                   {formatRelativeTime(session.updated_at, t)}
@@ -678,7 +682,7 @@ export function ChatListPanel({ open, width }: ChatListPanelProps) {
                                   onClick={(e) => handleDeleteSession(e, session.id)}
                                   disabled={isDeleting}
                                 >
-                                  <HugeiconsIcon icon={Delete02Icon} className="h-3 w-3" />
+                                  <HugeiconsIcon icon={Delete02Icon} className="h-3.5 w-3.5" />
                                 </button>
                               </div>
                             </Link>
diff --git a/src/components/layout/ConnectionStatus.tsx b/src/components/layout/ConnectionStatus.tsx
index a8cd48f..c6909c8 100644
--- a/src/components/layout/ConnectionStatus.tsx
+++ b/src/components/layout/ConnectionStatus.tsx
@@ -141,10 +141,10 @@ export function ConnectionStatus() {
           )}
         />
         {status === null
-          ? "Checking"
+          ? t('connection.checking')
           : connected
-            ? "Connected"
-            : "Disconnected"}
+            ? t('connection.connected')
+            : t('connection.disconnected')}
       </button>
 
       <Dialog open={dialogOpen} onOpenChange={setDialogOpen}>
diff --git a/src/i18n/en.ts b/src/i18n/en.ts
index dddd916..254118f 100644
--- a/src/i18n/en.ts
+++ b/src/i18n/en.ts
@@ -22,8 +22,9 @@ const en = {
   'chatList.delete': 'Delete',
   'chatList.searchSessions': 'Search sessions...',
   'chatList.noSessions': 'No sessions yet',
-  'chatList.importFromCli': 'Import from Claude CLI',
+  'chatList.importFromCli': 'Import from Claude Code',
   'chatList.addProjectFolder': 'Add project folder',
+  'chatList.threads': 'Threads',
 
   // ── Message list ────────────────────────────────────────────
   'messageList.claudeChat': 'Claude Chat',
@@ -270,6 +271,9 @@ const en = {
   'connection.installAuto': 'Install Claude Code Automatically',
   'connection.refresh': 'Refresh',
   'connection.installClaude': 'Install Claude Code',
+  'connection.connected': 'Connected',
+  'connection.disconnected': 'Disconnected',
+  'connection.checking': 'Checking',
 
   // ── Install wizard ──────────────────────────────────────────
   'install.title': 'Install Claude Code',
diff --git a/src/i18n/zh.ts b/src/i18n/zh.ts
index 59149b1..4278602 100644
--- a/src/i18n/zh.ts
+++ b/src/i18n/zh.ts
@@ -19,8 +19,9 @@ const zh: Record<TranslationKey, string> = {
   'chatList.delete': '删除',
   'chatList.searchSessions': '搜索会话...',
   'chatList.noSessions': '暂无会话',
-  'chatList.importFromCli': '从 Claude CLI 导入',
+  'chatList.importFromCli': '从 Claude Code 导入',
   'chatList.addProjectFolder': '添加项目文件夹',
+  'chatList.threads': '对话列表',
 
   // ── Message list ────────────────────────────────────────────
   'messageList.claudeChat': 'Claude 对话',
@@ -267,6 +268,9 @@ const zh: Record<TranslationKey, string> = {
   'connection.installAuto': '自动安装 Claude Code',
   'connection.refresh': '刷新',
   'connection.installClaude': '安装 Claude Code',
+  'connection.connected': '已连接',
+  'connection.disconnected': '未连接',
+  'connection.checking': '检测中',
 
   // ── Install wizard ──────────────────────────────────────────
   'install.title': '安装 Claude Code',