@steerable/agent-shell-web 0.6.53 → 0.6.56

package/src/lib/{browser-dev-electron-mock.ts → browser-dev-host-mock.ts}

@@ -1,8 +1,8 @@
 import type {
-  ElectronBridge,
+  HostBridge,
   LocalBackendRequestInput,
   LocalBackendStreamEvent,
-} from './electron-bridge';
+} from './host-bridge';
 import type {
   ChatAgentWriteInput,
   LocalChat,
@@ -97,33 +97,33 @@ function createInitialState(): BrowserMockState {
     {
       id: 'coach',
       slug: 'coach',
-      name: '行动教练',
+      name: 'Action coach',
       icon: null,
       color: '#2563eb',
-      description: '把目标拆成可执行计划，适合调试标准聊天路径。',
-      rolePrompt: '你是一个行动教练。',
+      description: 'Breaks a goal into an executable plan. Useful for debugging the standard chat path.',
+      rolePrompt: 'You are an action coach.',
       isBuiltin: true,
       sortOrder: 1,
     },
     {
       id: 'tool-demo',
       slug: 'tool-demo',
-      name: '工具演示专家',
+      name: 'Tool demo',
       icon: null,
       color: '#7c3aed',
-      description: '模拟本地工具调用和执行摘要，适合调试工具卡片。',
-      rolePrompt: '你是工具演示智能体。',
+      description: 'Simulates local tool calls and execution summaries. Useful for debugging tool cards.',
+      rolePrompt: 'You are the tool-demo agent.',
       isBuiltin: true,
       sortOrder: 2,
     },
     {
       id: 'writer',
       slug: 'writer',
-      name: '文案顾问',
+      name: 'Writing advisor',
       icon: null,
       color: '#16a34a',
-      description: '偏长文本回复样例，适合调试 markdown 与滚动。',
-      rolePrompt: '你是一个文案顾问。',
+      description: 'Longer text replies, for debugging markdown and scrolling.',
+      rolePrompt: 'You are a writing advisor.',
       isBuiltin: true,
       sortOrder: 3,
     },
@@ -132,14 +132,14 @@ function createInitialState(): BrowserMockState {
   const chats = [
     createChatRecord({
       id: 'chat-browser-demo',
-      title: '浏览器 UI 调试样例',
+      title: 'Browser UI debug sample',
       agentId: 'coach',
       minutesAgo: 8,
       isPinned: true,
     }),
     createChatRecord({
       id: 'chat-tool-demo',
-      title: '工具调用卡片预览',
+      title: 'Tool-call card preview',
       agentId: 'tool-demo',
       minutesAgo: 64,
     }),
@@ -155,14 +155,14 @@ function createInitialState(): BrowserMockState {
           chatId: 'chat-browser-demo',
           role: 'assistant',
           content:
-            '可以在这里调试普通浏览器里的聊天 UI。这个回复来自 dev mock bridge，不依赖 Electron IPC。',
+            'You can debug the chat UI in a normal browser here. This reply comes from the dev mock bridge and does not call a live model.',
           minutesAgo: 7,
         }),
         createMessage({
           id: 'msg-demo-user-1',
           chatId: 'chat-browser-demo',
           role: 'user',
-          content: '我想在浏览器里调试聊天界面。',
+          content: 'I want to debug the chat UI in the browser.',
           minutesAgo: 8,
         }),
       ],
@@ -171,7 +171,7 @@ function createInitialState(): BrowserMockState {
           id: 'msg-tool-assistant-1',
           chatId: 'chat-tool-demo',
           role: 'assistant',
-          content: '我已经模拟执行了一次本地命令，并把结果展示在工具卡片里。',
+          content: 'I simulated a local command and put the result in a tool card.',
           minutesAgo: 63,
           messageMetadata: JSON.stringify({
             executedActions: [
@@ -187,7 +187,7 @@ function createInitialState(): BrowserMockState {
           id: 'msg-tool-user-1',
           chatId: 'chat-tool-demo',
           role: 'user',
-          content: '帮我看一下最近的工具调用记录。',
+          content: 'Show me the recent tool-call records.',
           minutesAgo: 64,
         }),
       ],
@@ -201,9 +201,9 @@ function createInitialState(): BrowserMockState {
       maxTotalTokens: 60_000,
     },
     skills: [
-      { name: 'tool-demo', description: '模拟查询与回放工具。', builtin: true },
-      { name: 'local-exec', description: '模拟本地命令执行。', builtin: true },
-      { name: 'anti-deferred', description: '模拟防拖延执行策略。', builtin: true },
+      { name: 'tool-demo', description: 'Simulates query and replay tools.', builtin: true },
+      { name: 'local-exec', description: 'Simulates local command execution.', builtin: true },
+      { name: 'anti-deferred', description: 'Simulates the anti-deferral execution policy.', builtin: true },
     ],
     activeStreams: new Map(),
     source: 'fallback',
@@ -235,8 +235,8 @@ function createStateFromFixture(fixture: BrowserDevFixture): BrowserMockState |
       Array.isArray(fixture.skills) && fixture.skills.length > 0
         ? fixture.skills
         : [
-            { name: 'tool-demo', description: '查询与回放工具。', builtin: true },
-            { name: 'local-exec', description: '本地命令执行。', builtin: true },
+            { name: 'tool-demo', description: 'Query and replay tools.', builtin: true },
+            { name: 'local-exec', description: 'Local command execution.', builtin: true },
           ],
     activeStreams: new Map(),
     source: 'fixture',
@@ -318,7 +318,7 @@ async function request<T>(input: LocalBackendRequestInput): Promise<T> {
     const agent: LocalChatAgent = {
       id,
       slug: null,
-      name: (body.name || '新助手').trim() || '新助手',
+      name: (body.name || 'New assistant').trim() || 'New assistant',
       icon: null,
       color: body.color ?? '#4f46e5',
       description: body.description ?? null,
@@ -392,10 +392,10 @@ async function request<T>(input: LocalBackendRequestInput): Promise<T> {
   if (method === 'GET' && cleanPath === '/api/v2/chat-agents/tools') {
     return {
       tools: [
-        { name: 'local_exec_shell', description: '执行本地 shell 命令。', category: 'local' },
-        { name: 'local_read_file', description: '读取本地文本文件。', category: 'local' },
-        { name: 'local_write_file', description: '写入本地文件。', category: 'local' },
-        { name: 'web_search', description: '联网搜索。', category: 'local' },
+        { name: 'local_exec_shell', description: 'Run a local shell command.', category: 'local' },
+        { name: 'local_read_file', description: 'Read a local text file.', category: 'local' },
+        { name: 'local_write_file', description: 'Write a local file.', category: 'local' },
+        { name: 'web_search', description: 'Search the web.', category: 'local' },
       ],
     } as T;
   }
@@ -404,7 +404,7 @@ async function request<T>(input: LocalBackendRequestInput): Promise<T> {
     const body = input.body as { path?: string } | undefined;
     const name = body?.path?.split(/[\\/]/).filter(Boolean).pop() || 'browser-skill';
     if (!state.skills.some((skill) => skill.name === name)) {
-      state.skills.push({ name, description: '浏览器预览中导入的 mock skill。' });
+      state.skills.push({ name, description: 'Mock skill imported in the browser preview.' });
     }
     return { success: true, name } as T;
   }
@@ -444,7 +444,7 @@ async function request<T>(input: LocalBackendRequestInput): Promise<T> {
     const chatId = `chat-browser-${Date.now()}`;
     const chat = createChatRecord({
       id: chatId,
-      title: '新会话',
+      title: 'New chat',
       agentId,
       minutesAgo: 0,
     });
@@ -515,7 +515,7 @@ async function startStream(
   }
 
   const body = input.body as { message?: string } | undefined;
-  const message = body?.message?.trim() || '请演示一下浏览器 mock 回复。';
+  const message = body?.message?.trim() || 'Please demo a browser mock reply.';
   const streamId = `browser-stream-${Date.now()}`;
   state.activeStreams.set(streamId, []);
 
@@ -530,10 +530,10 @@ async function startStream(
   state.messagesByChatId[chatId] = [...(state.messagesByChatId[chatId] ?? []), userMessage];
 
   const reply =
-    `这是浏览器 dev mock 的流式回复。你刚才输入的是：「${message}」。` +
-    ' 这里可以调试消息气泡、滚动、停止按钮、工具执行卡片和后续状态。';
+    `This is a streaming reply from the browser dev mock. You wrote: "${message}".` +
+    ' Use it to debug message bubbles, scrolling, the stop button, tool cards, and later status.';
   const chunks = reply.match(/.{1,8}/g) ?? [reply];
-  const reasoning = '先调用一次 mock 工具，再把回复按调用流程交错显示。';
+  const reasoning = 'Call one mock tool, then interleave the reply with that call.';
   const mockAction = {
     id: 'browser-mock-1',
     tool: 'browser_mock',
@@ -580,7 +580,7 @@ async function startStream(
           { type: 'text', content: reply },
         ],
         durationMs: 1_200,
-        suggestedReplies: ['继续完善这份结果', '换一种呈现方式', '告诉我下一步怎么做'],
+        suggestedReplies: ['Keep improving this result', 'Try another presentation', 'Tell me the next step'],
       }),
     });
     assistantMessage.createdAt = new Date().toISOString();
@@ -593,7 +593,7 @@ async function startStream(
     pushSse(onEvent, '[DONE]');
     onEvent({ type: 'end', status: 200 });
     state.activeStreams.delete(streamId);
-    const suggestions = ['继续完善这份结果', '换一种呈现方式', '告诉我下一步怎么做'];
+    const suggestions = ['Keep improving this result', 'Try another presentation', 'Tell me the next step'];
     for (const listener of suggestedReplyListeners) {
       listener({ chatId, messageId: assistantMessage.id, suggestions });
     }
@@ -608,13 +608,13 @@ function cancelStream(streamId: string) {
   state.activeStreams.delete(streamId);
 }
 
-export function installBrowserDevElectronMock() {
-  if (typeof window === 'undefined' || window.electron) return;
+export function installBrowserDevHostMock() {
+  if (typeof window === 'undefined' || window.steerableHost) return;
   // DEV 浏览器预览自动安装；官网静态 demo 构建（app-demo 入口）经 demo flag
   // 显式安装。普通 prod 构建两条路都不通，本模块根本不会进产物。
   if (!import.meta.env.DEV && !isDemoMode()) return;
 
-  window.electron = {
+  window.steerableHost = {
     runtime: 'local',
     platform: 'win32',
     local: {
@@ -622,10 +622,10 @@ export function installBrowserDevElectronMock() {
         canceled: false,
         filePaths: ['C:\\browser-preview\\mock-skill'],
       }),
-      // 浏览器 dev 模式没有 Electron capturePage/clipboard，如实返回失败。
+      // 浏览器 dev 模式没有桌面截图和剪贴板，如实返回失败。
       captureScreenshot: async () => ({
         success: false as const,
-        error: '浏览器开发模式不支持窗口截图（需要 Electron 运行时）',
+        error: 'Browser dev mode cannot capture a window screenshot.',
       }),
     },
     localBackend: {
@@ -644,10 +644,10 @@ export function installBrowserDevElectronMock() {
         suggestedReplyListeners.delete(callback);
       };
     },
-  } satisfies ElectronBridge;
+  } satisfies HostBridge;
 
   console.info(
-    '[browser-dev-electron-mock] Installed mock window.electron bridge.',
+    '[browser-dev-host-mock] Installed mock window.steerableHost bridge.',
     state.source === 'fixture'
       ? { source: state.fixtureMeta?.source, exportedAt: state.fixtureMeta?.exportedAt }
       : { source: 'built-in fallback' },

package/src/lib/chat-title.ts

@@ -5,8 +5,9 @@
  * automation.py:_AUTOMATION_TITLE_PREFIX), so the same parser works for both.
  */
 
-export const AUTOMATION_TITLE_PREFIX = '[自动化] ';
-const BARE_BRACKET_PREFIX = '[自动化]';
+// 与后端 automation.py 的标题前缀是同一条持久化约定，不能按界面语言改写。
+export const AUTOMATION_TITLE_PREFIX = '[自动化] '; // i18n:allow
+const BARE_BRACKET_PREFIX = '[自动化]'; // i18n:allow
 
 export interface ParsedChatTitle {
   displayTitle: string;

package/src/lib/chat-transport.ts

@@ -7,7 +7,7 @@
  *   user types in ChatPanel
  *     -> useChatStream.sendUserMessage()
  *     -> transport.stream(input, onEvent)
- *     -> window.electron.localBackend.startStream({ POST /api/v2/chats/:id/run })
+ *     -> window.steerableHost.localBackend.startStream({ POST /api/v2/chats/:id/run })
  *     -> main process forwards each raw SSE chunk via webContents.send
  *     -> preload re-emits as `{ type: 'data'; chunk: string }`
  *     -> we parse the SSE frames with the framework's `SSEParser`, normalise
@@ -52,7 +52,8 @@ import {
   parseSSEData,
 } from '@steerable/agent-ui/state';
 import type { SSEEvent } from '@steerable/agent-protocol';
-import { getElectronBridge } from './electron-bridge';
+import { getHostBridge } from './host-bridge';
+import { t } from '@/i18n';
 import {
   appendDelta,
   freezeReasoningDurations,
@@ -213,7 +214,7 @@ class LocalBackendSseAdapter {
 // starts a fresh SSE pipe against /api/v2/chats/:id/run.
 // ---------------------------------------------------------------------------
 
-export interface ElectronChatTransport extends ChatStreamTransport {
+export interface HostChatTransport extends ChatStreamTransport {
   /**
    * 立即取消当前进行中的流（如果有）。
    *
@@ -225,7 +226,7 @@ export interface ElectronChatTransport extends ChatStreamTransport {
   cancelActive: () => void;
 }
 
-export function createElectronChatTransport(chatId: string): ElectronChatTransport {
+export function createHostChatTransport(chatId: string): HostChatTransport {
   // 当前 in-flight 流的 id。startStream resolve 后写入，流结束（end/error）
   // 或被取消后清空。同一 transport 一次只会有一条流（useChatStream 在
   // isStreaming 时拒绝重入）。
@@ -233,7 +234,7 @@ export function createElectronChatTransport(chatId: string): ElectronChatTranspo
 
   return {
     cancelActive: () => {
-      const bridge = getElectronBridge();
+      const bridge = getHostBridge();
       if (active.streamId) {
         bridge?.localBackend.cancelStream(active.streamId);
         active.streamId = null;
@@ -254,15 +255,15 @@ export function createElectronChatTransport(chatId: string): ElectronChatTranspo
     // 轮中转向：仅在 CoreLoop 路径（STEERABLE_USE_CORELOOP=1）且回合仍
     // 运行时生效；否则主进程软失败，useChatStream 保留草稿。
     steer: async (content: string) => {
-      const bridge = getElectronBridge();
+      const bridge = getHostBridge();
       if (!bridge?.localBackend.steerChat) return false;
       return await bridge.localBackend.steerChat(chatId, content);
     },
     stream: async (input: ChatStreamSendInput, onEvent) => {
-      const bridge = getElectronBridge();
+      const bridge = getHostBridge();
       if (!bridge) {
         throw new Error(
-          'Electron bridge unavailable — chat transport requires the desktop shell.',
+          'Host bridge unavailable — chat transport requires the desktop shell.',
         );
       }
 
@@ -347,10 +348,10 @@ export async function regenerateChatMessage(
   chatId: string,
   messageId: string,
 ): Promise<void> {
-  const bridge = getElectronBridge();
+  const bridge = getHostBridge();
   if (!bridge) {
     throw new Error(
-      'Electron bridge unavailable — regenerate requires the desktop shell.',
+      'Host bridge unavailable — regenerate requires the desktop shell.',
     );
   }
   await new Promise<void>((resolve, reject) => {
@@ -372,7 +373,7 @@ export async function regenerateChatMessage(
         if (frame.event !== 'error' || !frame.data) return;
         const parsed = parseSSEData(frame.data);
         const message = (parsed as { message?: unknown } | null)?.message;
-        refusal = typeof message === 'string' && message ? message : '重新生成失败';
+        refusal = typeof message === 'string' && message ? message : t('Regeneration failed');
       },
     });
     bridge.localBackend
@@ -388,7 +389,10 @@ export async function regenerateChatMessage(
             parser.end();
             settle(
               payload.status >= 400
-                ? new Error(refusal ?? `重新生成失败（HTTP ${payload.status}）`)
+                ? new Error(
+                    refusal ??
+                      t('Regeneration failed (HTTP {status})', { status: payload.status }),
+                  )
                 : undefined,
             );
           } else if (payload.type === 'error') settle(new Error(payload.error));

package/src/lib/date-groups.ts

@@ -1,34 +1,42 @@
 /**
  * Date-group helpers used by AgentSidebar to label chat groups
- * ("今天" / "昨天" / "N天前" / "M月D日" / "YYYY年M月D日"). Lifted verbatim
- * from `deeppath/apps/web/src/app/agent/AgentSidebar.tsx` so the visual
+ * ("Today" / "Yesterday" / "N days ago" / "M/D" / "M/D/YYYY"). Lifted from
+ * `deeppath/apps/web/src/app/agent/AgentSidebar.tsx` so the visual
  * grouping stays in lockstep.
  *
  * priority is used for ordering groups: smaller = newer = listed first.
+ * 标签走 t()，排序只看日期，不解析标签文本。
  */
+import { t } from '@/i18n';
 
-export function getDateGroupLabel(date: Date): string {
+function dayBuckets(date: Date): { diffDays: number; target: Date; today: Date } {
   const today = new Date();
   today.setHours(0, 0, 0, 0);
   const target = new Date(date);
   target.setHours(0, 0, 0, 0);
   const diffDays =
     (today.getTime() - target.getTime()) / (1000 * 60 * 60 * 24);
-  if (diffDays === 0) return '今天';
-  if (diffDays === 1) return '昨天';
-  if (diffDays < 4) return `${Math.floor(diffDays)}天前`;
-  const m = target.getMonth() + 1;
-  const d = target.getDate();
+  return { diffDays, target, today };
+}
+
+export function getDateGroupLabel(date: Date): string {
+  const { diffDays, target, today } = dayBuckets(date);
+  if (diffDays === 0) return t('Today');
+  if (diffDays === 1) return t('Yesterday');
+  if (diffDays < 4) return t('{count} days ago', { count: Math.floor(diffDays) });
+  const month = target.getMonth() + 1;
+  const day = target.getDate();
   if (target.getFullYear() !== today.getFullYear()) {
-    return `${target.getFullYear()}年${m}月${d}日`;
+    return t('{month}/{day}/{year}', { year: target.getFullYear(), month, day });
   }
-  return `${m}月${d}日`;
+  return t('{month}/{day}', { month, day });
 }
 
-export function getDateGroupPriority(label: string): number {
-  if (label === '今天') return 1;
-  if (label === '昨天') return 2;
-  if (label.endsWith('天前')) return 2 + parseInt(label, 10);
-  if (label.includes('年')) return 1000;
+export function getDateGroupPriority(date: Date): number {
+  const { diffDays, target, today } = dayBuckets(date);
+  if (diffDays === 0) return 1;
+  if (diffDays === 1) return 2;
+  if (diffDays < 4) return 2 + Math.floor(diffDays);
+  if (target.getFullYear() !== today.getFullYear()) return 1000;
   return 100;
 }