@steerable/agent-shell-web 0.6.56 → 0.6.57

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@steerable/agent-shell-web",
-  "version": "0.6.56",
+  "version": "0.6.57",
   "type": "module",
   "description": "Steerable framework — product-neutral renderer SPA source for @steerable/agent-shell (React + Vite). Consumed by product web entry points via the `@/` alias (anchored at this package's src/) and the createProductViteConfig factory. Published as a source package (src/), plus the compiled vite.base config factory (vite.base.js + .d.ts) for Node-side config loading.",
   "license": "Apache-2.0",
@@ -45,8 +45,8 @@
     "react-router-dom": "^6.30.0",
     "rehype-raw": "^7.0.0",
     "remark-gfm": "^4.0.1",
-    "@steerable/agent-ui": "0.6.56",
-    "@steerable/agent-protocol": "0.6.56"
+    "@steerable/agent-ui": "0.6.57",
+    "@steerable/agent-protocol": "0.6.57"
   },
   "devDependencies": {
     "@tailwindcss/vite": "^4.3.0",
@@ -59,7 +59,7 @@
     "typescript": "^5.8.3",
     "vite": "^5.4.21",
     "vitest": "^3.2.4",
-    "@steerable/pack-sdk": "0.6.56"
+    "@steerable/pack-sdk": "0.6.57"
   },
   "scripts": {
     "gen": "echo agent-shell-web",

package/src/components/settings/CliInstallSettingsPanel.tsx

@@ -0,0 +1,67 @@
+import { useState } from 'react';
+import { LuLoader, LuTerminal } from 'react-icons/lu';
+import { t } from '@/i18n';
+import { installCommandLineTool } from '@/lib/local-api';
+
+export function CliInstallSettingsPanel(props: {
+  binName: string;
+  install?: () => Promise<{ path: string; onPath: boolean }>;
+}) {
+  const install = props.install ?? (() => installCommandLineTool(props.binName));
+  const [running, setRunning] = useState(false);
+  const [message, setMessage] = useState<string | null>(null);
+  const [error, setError] = useState<string | null>(null);
+
+  const onClick = async () => {
+    setRunning(true);
+    setMessage(null);
+    setError(null);
+    try {
+      const result = await install();
+      setMessage(result.onPath
+        ? t('Installed {path}', { path: result.path })
+        : t('Installed {path}. Add its directory to PATH.', { path: result.path }));
+    } catch (err) {
+      setError(err instanceof Error ? err.message : String(err));
+    } finally {
+      setRunning(false);
+    }
+  };
+
+  return (
+    <div className="space-y-2 rounded-agent-md border border-agent-border bg-agent-card p-2.5" data-testid="cli-install-settings">
+      <p className="text-xs text-agent-muted-foreground">
+        {t('Install the command-line tool on your PATH so you can run it from a terminal.')}
+      </p>
+      <button
+        type="button"
+        data-testid="cli-install-button"
+        onClick={() => void onClick()}
+        disabled={running}
+        className="inline-flex items-center gap-1.5 rounded-agent-md bg-agent-primary px-3 py-1.5 text-xs font-medium text-agent-primary-foreground transition hover:bg-agent-primary/90 disabled:opacity-50"
+      >
+        {running ? (
+          <>
+            <LuLoader className="h-3.5 w-3.5 animate-spin" />
+            {t('Installing…')}
+          </>
+        ) : (
+          <>
+            <LuTerminal className="h-3.5 w-3.5" />
+            {t('Install command-line tool')}
+          </>
+        )}
+      </button>
+      {message && (
+        <p data-testid="cli-install-message" className="text-xs text-agent-foreground">
+          {message}
+        </p>
+      )}
+      {error && (
+        <p data-testid="cli-install-error" className="text-xs text-agent-destructive">
+          {t('Install failed: {error}', { error })}
+        </p>
+      )}
+    </div>
+  );
+}

package/src/layouts/AgentLayout.tsx

@@ -188,6 +188,14 @@ function AgentLayoutContent() {
     });
     return unsubscribe;
   }, []);
+  useEffect(() => {
+    const bridge = getHostBridge();
+    if (!bridge?.onStoreChanged) return;
+    const unsubscribe = bridge.onStoreChanged(() => {
+      void refreshChatsRef.current();
+    });
+    return unsubscribe;
+  }, []);
   useEffect(() => {
     const onImported = () => {
       void refreshChatsRef.current();

package/src/lib/host-bridge.ts

@@ -239,6 +239,11 @@ export interface HostBridge {
   onChatCreated?: (
     callback: (payload: { chatId: string; agentId?: string | null }) => void,
   ) => () => void;
+  /**
+   * 另一个进程提交了宿主库。侧栏据此重新拉会话列表。
+   * 载荷为空；渲染端不依赖里面的字段。
+   */
+  onStoreChanged?: (callback: () => void) => () => void;
   /**
    * 4.6a 后台任务状态推送。任务到达终态或 worktree 合并/丢弃完成时主进程
    * 广播；载荷只有 chatId/taskId，面板收到后重新拉列表。

package/src/lib/http-bridge.ts

@@ -266,6 +266,8 @@ export function createHttpBridge(): HostBridge {
     onChatCreated: (callback) =>
       subscribeChannel<{ chatId: string; agentId?: string | null }>('chat-created', callback),
 
+    onStoreChanged: (callback) => subscribeChannel('store:changed', () => callback()),
+
     onTaskUpdated: (callback) =>
       subscribeChannel<{ chatId: string; taskId: string }>(
         'task-updated',

package/src/lib/local-api.ts

@@ -767,6 +767,14 @@ export interface DiagnoseResult {
   hint: string | null;
 }
 
+export async function installCommandLineTool(name: string) {
+  return bridge().localBackend.request<{ path: string; onPath: boolean }>({
+    method: 'POST',
+    path: '/api/v2/cli/install',
+    body: { name },
+  });
+}
+
 export async function diagnoseLlmConnection(input: {
   baseUrl?: string;
   apiKey?: string;