@steerable/agent-shell-web 0.6.53 → 0.6.56

package/src/components/chat/ChatProjectBadge.tsx

@@ -10,13 +10,14 @@ import {
   LuPlus,
 } from 'react-icons/lu';
 import { CreateProjectModal } from '@/components/CreateProjectModal';
-import { getElectronBridge, isElectron } from '@/lib/electron-bridge';
+import { getHostBridge, hasHostBridge } from '@/lib/host-bridge';
 import {
   createProject,
   updateChatProject,
   updateProject,
   type LocalProject,
 } from '@/lib/local-api';
+import { t } from '@/i18n';
 
 /**
  * 项目徽章 / 选择器（Codex 式 cwd 指示），渲染在输入框上方的 meta 行里，
@@ -113,8 +114,8 @@ function MenuSectionLabel({
           type="button"
           onClick={onAdd}
           className="flex h-5 w-5 items-center justify-center rounded-full text-agent-muted-foreground transition-colors hover:bg-agent-foreground/10 hover:text-agent-foreground"
-          title="新建项目"
-          aria-label="新建项目"
+          title={t('New project')}
+          aria-label={t('New project')}
         >
           <LuPlus className="h-3 w-3" />
         </button>
@@ -132,7 +133,7 @@ function CreateProjectMenuItem({ onClick }: { onClick: () => void }) {
       className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-xs text-agent-foreground transition-colors hover:bg-agent-foreground/5"
     >
       <LuFolderPlus className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
-      新建项目
+      {t('New project')}
     </button>
   );
 }
@@ -218,9 +219,9 @@ export function ChatProjectBadge({
 
   const changeFolder = () =>
     run(async () => {
-      if (!isElectron() || !project) return;
-      const result = await getElectronBridge()!.local?.selectDirectory({
-        title: `重新选择「${project.name}」绑定的文件夹`,
+      if (!hasHostBridge() || !project) return;
+      const result = await getHostBridge()!.local?.selectDirectory({
+        title: t('Choose a new folder for "{name}"', { name: project.name }),
       });
       if (!result || result.canceled || result.filePaths.length === 0) return;
       await updateProject(project.id, { folderPath: result.filePaths[0] });
@@ -230,7 +231,7 @@ export function ChatProjectBadge({
   return (
     <div className="relative">
       <BadgeButton
-        label={project ? project.name : '选择项目'}
+        label={project ? project.name : t('Choose a project')}
         active={Boolean(project)}
         open={open}
         busy={busy}
@@ -240,8 +241,10 @@ export function ChatProjectBadge({
         }}
         title={
           project
-            ? `${project.folderPath}\n点击管理项目归属 / 修改绑定目录`
-            : '把当前对话关联到一个项目（文件写入限制在项目家目录、源文件夹，以及这些目录的子目录内）'
+            ? `${project.folderPath}\n${t('Click to manage the project or change its folder')}`
+            : t(
+                'Link this chat to a project (file writes are limited to the project home folder, its source folders, and their subfolders)',
+              )
         }
       />
 
@@ -249,7 +252,7 @@ export function ChatProjectBadge({
         <MenuShell onClose={() => setOpen(false)}>
           {project ? (
             <>
-              <MenuSectionLabel>当前项目</MenuSectionLabel>
+              <MenuSectionLabel>{t('Current project')}</MenuSectionLabel>
               <div
                 className="flex items-center gap-2 rounded px-2 py-1.5 text-xs text-agent-foreground"
                 title={project.folderPath}
@@ -268,7 +271,7 @@ export function ChatProjectBadge({
               </div>
             </>
           ) : (
-            <MenuSectionLabel onAdd={openCreate}>关联到项目</MenuSectionLabel>
+            <MenuSectionLabel onAdd={openCreate}>{t('Link to a project')}</MenuSectionLabel>
           )}
 
           {otherProjects.length > 0 && (
@@ -276,7 +279,7 @@ export function ChatProjectBadge({
               {project && (
                 <div className="mx-1 my-1 border-t border-agent-border/60" />
               )}
-              {project && <MenuSectionLabel>移动到</MenuSectionLabel>}
+              {project && <MenuSectionLabel>{t('Move to')}</MenuSectionLabel>}
               <div className="max-h-40 overflow-y-auto">
                 {otherProjects.map((p) => (
                   <ProjectMenuRow
@@ -291,7 +294,7 @@ export function ChatProjectBadge({
           {!project && projects.length === 0 && (
             <>
               <div className="px-2 py-1.5 text-[11px] text-agent-muted-foreground/70">
-                还没有项目
+                {t('No projects yet')}
               </div>
               <CreateProjectMenuItem onClick={openCreate} />
             </>
@@ -307,7 +310,7 @@ export function ChatProjectBadge({
                 className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-xs text-agent-foreground transition-colors hover:bg-agent-foreground/5"
               >
                 <LuFolderPen className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
-                修改项目目录…
+                {t('Change project folder...')}
               </button>
               <button
                 type="button"
@@ -316,7 +319,7 @@ export function ChatProjectBadge({
                 className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-xs text-agent-foreground transition-colors hover:bg-agent-foreground/5"
               >
                 <LuFolderX className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
-                移出项目（变为无项目对话）
+                {t('Remove from project (becomes a chat without a project)')}
               </button>
             </>
           )}
@@ -375,21 +378,23 @@ export function ProjectPickerButton({
   return (
     <div className="relative">
       <BadgeButton
-        label={selected ? selected.name : '选择项目'}
+        label={selected ? selected.name : t('Choose a project')}
         active={Boolean(selected)}
         open={open}
         busy={false}
         onClick={() => setOpen((v) => !v)}
         title={
           selected
-            ? `${selected.folderPath}\n新对话将绑定到此项目`
-            : '为新对话选择项目。不选则在文稿/<应用名>/conversations/ 下建立本对话工作区'
+            ? `${selected.folderPath}\n${t('New chats will be linked to this project')}`
+            : t(
+                'Choose a project for the new chat. Without one, a workspace for this chat is created under Documents/<app name>/conversations/',
+              )
         }
       />
 
       {open && (
         <MenuShell onClose={() => setOpen(false)}>
-          <MenuSectionLabel onAdd={openCreate}>新对话所属项目</MenuSectionLabel>
+          <MenuSectionLabel onAdd={openCreate}>{t('Project for new chat')}</MenuSectionLabel>
           <button
             type="button"
             role="menuitem"
@@ -400,7 +405,7 @@ export function ProjectPickerButton({
             className="flex w-full items-center gap-2 rounded px-2 py-1.5 text-left text-xs text-agent-foreground transition-colors hover:bg-agent-foreground/5"
           >
             <LuFolderX className="h-3.5 w-3.5 shrink-0 text-agent-muted-foreground" />
-            <span className="min-w-0 flex-1 truncate">不关联项目</span>
+            <span className="min-w-0 flex-1 truncate">{t('No project')}</span>
             {!selected && (
               <LuCheck className="h-3 w-3 shrink-0 text-agent-muted-foreground" />
             )}
@@ -421,7 +426,7 @@ export function ProjectPickerButton({
           {projects.length === 0 && (
             <>
               <div className="px-2 py-1.5 text-[11px] text-agent-muted-foreground/70">
-                还没有项目
+                {t('No projects yet')}
               </div>
               <CreateProjectMenuItem onClick={openCreate} />
             </>

package/src/components/chat/EmptyChatHero.tsx

@@ -1,4 +1,5 @@
 import { BRAND_HOME_HINT, BRAND_NAME, getBrandLogoUrl } from '@/brand';
+import { t } from '@/i18n';
 
 /**
  * 新对话落地页与空会话首屏的品牌区：侧栏同一枚 logo，加一句
@@ -16,7 +17,7 @@ export function EmptyChatHero() {
           draggable={false}
         />
       </h1>
-      {hint ? <p className="mt-1.5 text-xs text-agent-muted-foreground">{hint}</p> : null}
+      {hint ? <p className="mt-1.5 text-xs text-agent-muted-foreground">{t(hint)}</p> : null}
     </div>
   );
 }

package/src/components/chat/ExecPolicyPicker.tsx

@@ -1,6 +1,7 @@
 import { useEffect, useRef, useState } from 'react';
 import { LuChevronDown, LuFolderLock, LuLockOpen } from 'react-icons/lu';
 import type { ExecPolicy } from '@/lib/exec-policy';
+import { t } from '@/i18n';
 
 /**
  * ExecPolicyPicker — 输入框上的命令沙箱切换（类 Codex 底部权限档）。
@@ -17,14 +18,14 @@ const OPTIONS: Array<{
 }> = [
   {
     id: 'workspace',
-    label: '工作区',
-    description:
-      '只能写入当前工作区，范围外的路径会被拒绝。',
+    label: 'Workspace',
+    description: 'Can only write to the current workspace. Paths outside it are blocked.',
   },
   {
     id: 'full',
-    label: '完整权限',
-    description: '关闭命令沙箱，可写本机任意路径。工具审批仍然生效。',
+    label: 'Full access',
+    description:
+      'Turns off the command sandbox so any path on this computer can be written. Tool approvals still apply.',
   },
 ];
 
@@ -60,9 +61,9 @@ export function ExecPolicyPicker({
         disabled={disabled}
         aria-haspopup="listbox"
         aria-expanded={open}
-        aria-label="命令沙箱"
+        aria-label={t('Command sandbox')}
         data-testid="exec-policy-picker"
-        title={current.description}
+        title={t(current.description)}
         onClick={() => setOpen((next) => !next)}
         className={[
           'inline-flex h-6 max-w-[140px] items-center gap-1 rounded-full border px-1.5 text-[12px] leading-[1.45] transition-colors disabled:cursor-not-allowed disabled:opacity-70',
@@ -76,13 +77,13 @@ export function ExecPolicyPicker({
         ) : (
           <LuFolderLock className="h-3 w-3 shrink-0" />
         )}
-        <span className="truncate">{current.label}</span>
+        <span className="truncate">{t(current.label)}</span>
         <LuChevronDown className="h-3 w-3 shrink-0 text-agent-muted-foreground" />
       </button>
       {open && (
         <div
           role="listbox"
-          aria-label="命令沙箱"
+          aria-label={t('Command sandbox')}
           className="absolute bottom-full left-0 z-30 mb-1 w-64 overflow-hidden rounded-agent-md border border-agent-border bg-agent-canvas py-1 shadow-sm"
         >
           {OPTIONS.map((option) => {
@@ -106,10 +107,10 @@ export function ExecPolicyPicker({
                 ].join(' ')}
               >
                 <span className="text-[12px] font-medium leading-[1.45] text-agent-foreground">
-                  {option.label}
+                  {t(option.label)}
                 </span>
                 <span className="text-[11px] leading-snug text-agent-muted-foreground">
-                  {option.description}
+                  {t(option.description)}
                 </span>
               </button>
             );

package/src/components/chat/ExecutedActionsCard.tsx

@@ -3,6 +3,7 @@ import { LuCircleCheck, LuCircleX, LuListTodo } from 'react-icons/lu';
 import { ToolExecutionCard } from '@steerable/agent-ui/cards';
 import type { ToolExecutionPayload } from '@steerable/agent-protocol';
 import type { LocalChatAgent } from '@/lib/local-api';
+import { t } from '@/i18n';
 import { UnifiedDiff } from './UnifiedDiff';
 import {
   summarizeRunCodeAction,
@@ -117,11 +118,11 @@ function sandboxBadge(sandbox: ExecutedAction['sandbox']): string | null {
   if (!sandbox) return null;
   switch (sandbox.enforcement) {
     case 'full':
-      return '[沙箱]';
+      return t('[Sandboxed]');
     case 'partial':
-      return '[沙箱·部分]';
+      return t('[Sandboxed · partial]');
     default:
-      return '[未沙箱]';
+      return t('[Not sandboxed]');
   }
 }
 
@@ -252,7 +253,7 @@ function renderDelegateArgs(
       {profile ? (
         <section>
           <div className="mb-0.5 text-[10px] uppercase tracking-wider text-agent-muted-foreground">
-            子代理
+            {t('Subagent')}
           </div>
           <div className="text-[11px]">{displayName}</div>
         </section>
@@ -260,7 +261,7 @@ function renderDelegateArgs(
       {task ? (
         <section>
           <div className="mb-0.5 text-[10px] uppercase tracking-wider text-agent-muted-foreground">
-            任务
+            {t('Task')}
           </div>
           <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
             {task}
@@ -277,7 +278,7 @@ function renderDelegateOutput(output: unknown): ReactNode {
     return (
       <div className="space-y-1.5">
         {kvBlock(
-          '回报',
+          t('Report'),
           <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
             {env.message}
           </pre>,
@@ -286,7 +287,7 @@ function renderDelegateOutput(output: unknown): ReactNode {
     );
   }
   if (env.error || env.success === false) {
-    return <div className="text-[11px] text-agent-muted-foreground">没有文字回报</div>;
+    return <div className="text-[11px] text-agent-muted-foreground">{t('No text report')}</div>;
   }
   return renderActionOutput(output);
 }
@@ -303,11 +304,11 @@ function TaskLead() {
   );
 }
 
-const TASK_STATUS_ZH: Record<string, string> = {
-  running: '已启动',
-  blocked: '等待依赖',
-  completed: '已完成',
-  failed: '失败',
+const TASK_STATUS_LABELS: Record<string, string> = {
+  running: 'Started',
+  blocked: 'Waiting on dependencies',
+  completed: 'Completed',
+  failed: 'Failed',
 };
 
 function kvBlock(label: string, value: ReactNode): ReactNode {
@@ -331,17 +332,22 @@ function renderTaskArgs(tool: string, args: unknown): ReactNode {
       <div className="space-y-1.5">
         {parsed.task
           ? kvBlock(
-              '任务',
+              t('Task'),
               <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
                 {parsed.task}
               </pre>,
             )
           : null}
         {parsed.dependsOn.length > 0
-          ? kvBlock('依赖', parsed.dependsOn.map(shortTaskId).join('、'))
+          ? kvBlock(t('Dependencies'), parsed.dependsOn.map(shortTaskId).join(t(', ')))
           : null}
         {parsed.worktree
-          ? kvBlock('工作区', parsed.worktreeName ? `隔离 · ${parsed.worktreeName}` : '隔离')
+          ? kvBlock(
+              t('Workspace'),
+              parsed.worktreeName
+                ? t('Isolated · {name}', { name: parsed.worktreeName })
+                : t('Isolated'),
+            )
           : null}
       </div>
     );
@@ -352,10 +358,10 @@ function renderTaskArgs(tool: string, args: unknown): ReactNode {
   if (!taskId && !message) return renderActionOutput(args);
   return (
     <div className="space-y-1.5">
-      {taskId ? kvBlock('编号', <span className="font-mono">{shortTaskId(taskId)}</span>) : null}
+      {taskId ? kvBlock(t('ID'), <span className="font-mono">{shortTaskId(taskId)}</span>) : null}
       {message
         ? kvBlock(
-            '消息',
+            t('Message'),
             <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
               {message}
             </pre>,
@@ -375,32 +381,35 @@ function renderTaskOutput(output: unknown): ReactNode {
       {parsed.items.map((item, index) => (
         <div key={item.taskId ?? `task-${index}`} className="space-y-1.5">
           {item.taskId
-            ? kvBlock('编号', <span className="font-mono">{shortTaskId(item.taskId)}</span>)
+            ? kvBlock(t('ID'), <span className="font-mono">{shortTaskId(item.taskId)}</span>)
             : null}
-          {item.status ? kvBlock('状态', TASK_STATUS_ZH[item.status] ?? item.status) : null}
+          {item.status ? kvBlock(
+                t('Status'),
+                TASK_STATUS_LABELS[item.status] ? t(TASK_STATUS_LABELS[item.status]) : item.status,
+              ) : null}
           {item.task
             ? kvBlock(
-                '任务',
+                t('Task'),
                 <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
                   {item.task}
                 </pre>,
               )
             : null}
-          {item.worktreeLabel ? kvBlock('工作区', item.worktreeLabel) : null}
-          {item.hint ? kvBlock('说明', item.hint) : null}
+          {item.worktreeLabel ? kvBlock(t('Workspace'), item.worktreeLabel) : null}
+          {item.hint ? kvBlock(t('Note'), item.hint) : null}
           {item.answer
             ? kvBlock(
-                '结果',
+                t('Result'),
                 <pre className="whitespace-pre-wrap break-words rounded bg-agent-muted/40 px-2 py-1.5">
                   {item.answer}
                 </pre>,
               )
             : null}
-          {item.error ? kvBlock('原因', item.error) : null}
+          {item.error ? kvBlock(t('Reason'), item.error) : null}
         </div>
       ))}
       {parsed.hint && parsed.items.every((item) => item.hint !== parsed.hint)
-        ? kvBlock('说明', parsed.hint)
+        ? kvBlock(t('Note'), parsed.hint)
         : null}
     </div>
   );
@@ -419,7 +428,7 @@ function toolCardExtras(
     const { profile } = parseDelegateSubagent(action.arguments);
     const displayName = delegateSubagentDisplayName(profile, agents);
     return {
-      label: `委派 · ${displayName}`,
+      label: t('Delegate · {name}', { name: displayName }),
       lead: <DelegateLead name={displayName} color={delegateColor(profile, agents)} />,
       renderArgs: (args) => renderDelegateArgs(args, agents),
       renderOutput: renderDelegateOutput,
@@ -453,16 +462,16 @@ function inspectActivate(
           chatId,
           recordId: child.recordId,
           live: child.status === 'running',
-          title: task ?? '子代理任务',
+          title: task ?? t('Subagent task'),
         }),
-      activateTitle: '查看子代理执行过程',
+      activateTitle: t('View subagent run'),
     };
   }
   const target = inspectableTaskFromAction(action.tool, action.arguments, action.result);
   if (!target) return {};
   return {
     onActivate: () => onInspectTask({ id: target.id, chatId, title: target.title }),
-    activateTitle: '查看后台执行过程',
+    activateTitle: t('View background run'),
   };
 }
 
@@ -558,15 +567,18 @@ export function ExecutedActionsCard({
             <LuCircleX className="h-3.5 w-3.5 text-agent-destructive" />
           )}
           <span className="font-medium text-agent-foreground">
-            已自动执行 {expanded.length} 个操作
+            {t('Ran {count} actions automatically', { count: expanded.length })}
           </span>
         </div>
         <span className="text-[11px] text-agent-muted-foreground">
           {runningCount > 0
-            ? `${runningCount} 执行中`
+            ? t('{count} running', { count: runningCount })
             : failureCount > 0
-              ? `${successCount} 成功 · ${failureCount} 失败`
-              : `全部成功`}
+              ? t('{success} succeeded · {failed} failed', {
+                  success: successCount,
+                  failed: failureCount,
+                })
+              : t('All succeeded')}
         </span>
       </div>
       <div className="space-y-px">

package/src/components/chat/FilePathCode.tsx

@@ -3,6 +3,7 @@ import { openLocalPath, type ResolvedLocalPath } from '@/lib/local-api';
 import { hostToolChrome } from '@/lib/host-tools';
 import { peekResolvedPath, subscribeResolvedPath } from './path-mentions';
 import { splitTurnFilePath } from './turn-files';
+import { t } from '@/i18n';
 
 /**
  * 行内代码里的文件路径：后端确认存在后变成可点击，点击用系统默认应用打开。
@@ -48,9 +49,9 @@ export function FilePathCode({ candidate, chatId, children, ...rest }: FilePathC
     setOpenError(null);
     try {
       const result = await openLocalPath(resolved.path);
-      if (!result.success) setOpenError(result.error || '打开失败');
+      if (!result.success) setOpenError(result.error || t('Failed to open'));
     } catch (err) {
-      setOpenError(err instanceof Error ? err.message : '打开失败');
+      setOpenError(err instanceof Error ? err.message : t('Failed to open'));
     }
   };
 
@@ -59,7 +60,11 @@ export function FilePathCode({ candidate, chatId, children, ...rest }: FilePathC
       type="button"
       data-file-path-chip=""
       onClick={handleClick}
-      title={openError ? `${resolved.path}（${openError}）` : `点击打开 ${resolved.path}`}
+      title={
+        openError
+          ? t('{path} ({error})', { path: resolved.path, error: openError })
+          : t('Click to open {path}', { path: resolved.path })
+      }
       className={`${INLINE_CODE_CLASS} cursor-pointer underline decoration-dotted underline-offset-2 transition-colors hover:bg-agent-accent/15 hover:text-agent-accent ${
         openError ? 'text-red-600 dark:text-red-400' : ''
       }`}

package/src/components/chat/InterruptedTurnCard.tsx

@@ -12,6 +12,7 @@
  * 写下的终态，不会进入本卡片：前者是用户的明确意图，后者已有错误展示。
  */
 import { LuTriangleAlert } from 'react-icons/lu';
+import { t } from '@/i18n';
 
 export interface InterruptedTurnCardProps {
   /** 点击「继续上次回复」——触发 resume 流（不再追加用户消息）。 */
@@ -28,7 +29,7 @@ export function InterruptedTurnCard({ onContinue, onDismiss }: InterruptedTurnCa
     >
       <div className="flex items-center gap-2 text-amber-700 dark:text-amber-300">
         <LuTriangleAlert className="h-4 w-4 shrink-0" />
-        <span>上次回复因应用退出或异常中断，未能完成。</span>
+        <span>{t('The last reply was interrupted because the app quit or crashed, so it did not finish.')}</span>
       </div>
       <div className="flex shrink-0 items-center gap-2">
         <button
@@ -36,14 +37,14 @@ export function InterruptedTurnCard({ onContinue, onDismiss }: InterruptedTurnCa
           onClick={onDismiss}
           className="rounded px-1.5 py-0.5 text-amber-700/80 transition-colors hover:text-amber-900 dark:text-amber-300/80 dark:hover:text-amber-100"
         >
-          忽略
+          {t('Dismiss')}
         </button>
         <button
           type="button"
           onClick={onContinue}
           className="inline-flex items-center gap-1 rounded-full bg-agent-foreground px-3 py-1 font-medium text-agent-canvas transition hover:opacity-90"
         >
-          继续上次回复
+          {t('Continue last reply')}
         </button>
       </div>
     </div>

package/src/components/chat/LocalChatPanel.tsx

@@ -20,6 +20,7 @@ import type { TurnBlock } from './turn-timeline';
 import type { TurnFile } from './turn-files';
 import type { LlmSpeedSnapshot } from './process-status';
 import { ComposerStatusStack } from './composer-status-stack';
+import { t } from '@/i18n';
 import { SessionTodoList } from './SessionTodoList';
 import { resolveLatestSessionTodos } from './todo-list-model';
 import { SessionOrchestrationFlow } from './SessionOrchestrationFlow';
@@ -418,7 +419,7 @@ export function LocalChatPanel({
         disabled={disabled}
         placeholder={
           mode === 'plan'
-            ? '描述你的目标，Agent 将先制定计划…'
+            ? t('Describe your goal. The Agent will make a plan first...')
             : inputPlaceholder
         }
         currentAgent={currentAgent}

package/src/components/chat/Markdown.tsx

@@ -11,6 +11,7 @@ import ReactMarkdown, { type Components } from 'react-markdown';
 import remarkGfm from 'remark-gfm';
 import rehypeRaw from 'rehype-raw';
 import { LuBlocks, LuMessageSquare, LuPlug } from 'react-icons/lu';
+import { t } from '@/i18n';
 import type { LocalChat, LocalChatAgent } from '@/lib/local-api';
 import {
   resolveSlashTool,
@@ -314,7 +315,7 @@ function renderTextWithMentions(
           );
         }
 
-        const chat = chats.find((c) => (c.title || '未命名对话') === name);
+        const chat = chats.find((c) => (c.title || t('Untitled chat')) === name);
         if (chat) {
           return (
             <span

package/src/components/chat/MessageList.tsx

@@ -10,6 +10,7 @@ import {
 import { LuArrowDown } from 'react-icons/lu';
 import type { ChatMessage } from '@steerable/agent-protocol';
 import type { LocalChat, LocalChatAgent, LocalTask } from '@/lib/local-api';
+import { t } from '@/i18n';
 import { UserMessage } from './UserMessage';
 import { AssistantMessage } from './AssistantMessage';
 import { InterruptedTurnCard } from './InterruptedTurnCard';
@@ -467,8 +468,8 @@ export function MessageList({
             scrollToBottom('smooth');
           }}
           className="absolute bottom-2 right-2 flex h-7 w-7 items-center justify-center rounded-full border border-agent-border bg-agent-canvas text-agent-foreground shadow-md transition-colors hover:bg-agent-foreground/5"
-          title="回到底部"
-          aria-label="回到底部"
+          title={t('Back to bottom')}
+          aria-label={t('Back to bottom')}
         >
           <LuArrowDown className="h-4 w-4" />
         </button>