@hoox-sh/hoox-tui 0.2.0 → 0.3.0

package/src/components/views/settings.tsx

@@ -20,7 +20,7 @@
  * Follows Pattern 1 (View Composition) and Pattern 2 (Store Subscription).
  */
 import { useMemo, useState, useCallback, useEffect } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import {
   Colors,
   useServiceStore,
@@ -38,6 +38,7 @@ import { getSettingsConnectionSnapshot } from "../../services/tui-connection";
 import * as path from "path";
 import * as os from "os";
 import type { ViewId, NotificationPreferences } from "@hoox-sh/hoox-shared";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 /**
  * Prefer the process-wide CLI bridge test double when test-setup installed it
@@ -234,14 +235,16 @@ interface ShortcutEntry {
 }
 
 const SYSTEM_SHORTCUTS: ShortcutEntry[] = [
-  { key: "Ctrl+1..9", action: "Switch to view 1-9" },
-  { key: "Ctrl+0", action: "Switch to view 10" },
   // Keep action labels short — Keyboard panel is ~34 cols; long text
   // overflows into adjacent panels and corrupts the character frame.
-  { key: "Ctrl+Alt+W", action: "Worker Settings" },
+  // Order matters: first rows stay visible in the 4-column layout.
+  { key: "Ctrl+1..9", action: "Switch to view 1-9" },
+  { key: "Ctrl+0", action: "Switch to view 10" },
   { key: "Ctrl+P", action: "Command Palette" },
   { key: "Ctrl+B", action: "Toggle Sidebar" },
   { key: "Ctrl+Q", action: "Quit" },
+  // Compact summary of Ctrl+Alt chords (sidebar shows per-view keys)
+  { key: "Ctrl+Alt+*", action: "KV/Secrets/DB/AI/…" },
   { key: "Esc", action: "Back / Close" },
   { key: "Tab", action: "Next panel / field" },
   { key: "/", action: "Focus search" },
@@ -975,6 +978,31 @@ export function SettingsView({ dialog }: SettingsViewProps = {}) {
 
   const handleImportConfirm = useCallback(async () => {
     if (!importPath.trim()) return;
+
+    // Fail-closed: require confirm before clobbering local prefs
+    if (!dialog) {
+      useServiceStore.getState().addAlert({
+        id: `import-noconfirm-${Date.now()}`,
+        type: "config",
+        severity: "warning",
+        message: "Import blocked: confirmation dialog unavailable",
+        timestamp: Date.now(),
+        acknowledged: false,
+      });
+      setImporting(false);
+      return;
+    }
+    const confirmed = await showConfirm(dialog, {
+      title: "Import preferences?",
+      message: `Apply settings from ${importPath.trim()}? This overwrites local TUI preferences (not operator secrets).`,
+      confirmLabel: "Import",
+      cancelLabel: "Cancel",
+    });
+    if (!confirmed) {
+      setImporting(false);
+      return;
+    }
+
     try {
       const f = Bun.file(importPath.trim());
       const exists = await f.exists();
@@ -1006,18 +1034,30 @@ export function SettingsView({ dialog }: SettingsViewProps = {}) {
       if (typeof config.refreshIntervalMs === "number")
         updateConfig({ refreshIntervalMs: config.refreshIntervalMs });
       if (typeof config.defaultView === "string")
-        updateConfig({ defaultView: config.defaultView });
+        updateConfig({ defaultView: config.defaultView as ViewId });
       if (typeof config.soundEnabled === "boolean")
         updateConfig({ soundEnabled: config.soundEnabled });
+      // Absolute set — never toggleNotification (would invert vs current state)
       if (
         typeof config.notifications === "object" &&
         config.notifications !== null
       ) {
-        for (const key of Object.keys(config.notifications)) {
-          if (typeof config.notifications[key] === "boolean") {
-            toggleNotification(key as keyof NotificationPreferences);
+        const current = useConfigStore.getState().notifications;
+        const next: NotificationPreferences = { ...current };
+        for (const key of Object.keys(
+          config.notifications
+        ) as (keyof NotificationPreferences)[]) {
+          if (
+            key in next &&
+            typeof (config.notifications as Record<string, unknown>)[key] ===
+              "boolean"
+          ) {
+            next[key] = Boolean(
+              (config.notifications as Record<string, unknown>)[key]
+            );
           }
         }
+        updateConfig({ notifications: next });
       }
       if (config.activeExchanges)
         updateConfig({ activeExchanges: config.activeExchanges });
@@ -1042,7 +1082,7 @@ export function SettingsView({ dialog }: SettingsViewProps = {}) {
     }
     setImporting(false);
     setImportPath("");
-  }, [importPath, updateConfig, toggleNotification]);
+  }, [importPath, updateConfig, dialog]);
 
   const handleCheckSetup = useCallback(async () => {
     setSetupCheck({ kind: "running" });
@@ -1248,7 +1288,7 @@ export function SettingsView({ dialog }: SettingsViewProps = {}) {
 
   // ── Keyboard handling (only when Settings is the active view) ───────────────
 
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     // Import mode overrides
     if (importing) {

package/src/components/views/setup-wizard.test.tsx

@@ -181,6 +181,19 @@ describe("Validation helpers", () => {
     it("rejects non-URL strings", () => {
       expect(validateUrl("not-a-url")).toBe(false);
       expect(validateUrl("")).toBe(false);
+      expect(validateUrl("ftp://x.com")).toBe(false);
+    });
+  });
+
+  describe("maskSecret edge cases", () => {
+    it("masks short secrets entirely", () => {
+      expect(maskSecret("")).toBe("••••");
+      expect(maskSecret("ab")).toBe("••");
+      expect(maskSecret("abcdefg")).toBe("•••••••");
+    });
+
+    it("shows first/last 4 for longer secrets", () => {
+      expect(maskSecret("abcdefghij")).toBe("abcd••••ghij");
     });
   });
 });

package/src/components/views/setup-wizard.tsx

@@ -14,7 +14,7 @@
  * status indicators matching the landing page's HUD-style status display.
  */
 import { useState, useEffect, useCallback, useRef } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import { Colors, useServiceStore } from "@hoox-sh/hoox-shared";
 import { useConfigStore } from "@hoox-sh/hoox-shared";
 import { useUIStore } from "@hoox-sh/hoox-shared";
@@ -24,6 +24,7 @@ import { showConfirm } from "../ui/dialog";
 import type { DialogHandle } from "../ui/dialog";
 import { cliBridge } from "../../services/cli-bridge";
 import { resolveTuiStatePath } from "../../services/hoox-path-service";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 // ─── Prerequisite Check Types ───────────────────────────────────────────────
 
@@ -660,7 +661,10 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
     }
   };
 
-  /** Deploy: write config, run hoox deploy all, navigate on success */
+  /**
+   * Deploy: persist exchange flags + run `hoox deploy all`.
+   * Secrets/API keys are NOT collected here — operators set them via CLI first.
+   */
   const handleDeploy = async () => {
     try {
       const activeExchanges = Object.entries(data.exchanges)
@@ -684,7 +688,8 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
       }
       const confirmed = await showConfirm(dialog, {
         title: "Deploy Configuration",
-        message: "Save setup and apply configuration to Cloudflare?",
+        message:
+          "Deploy with current exchange flags? Secrets must already be set via CLI (hoox config secrets set …).",
         confirmLabel: "Deploy",
         cancelLabel: "Cancel",
       });
@@ -725,10 +730,14 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
   };
 
   // ── Keyboard navigation (only when Setup Wizard is active) ──────────────
-  useKeyboard((key) => {
+  // Note: Ctrl+P is reserved for the global command palette — do not steal it.
+  useViewKeyboard((key) => {
     if (!isActive) return;
+    if (useUIStore.getState().commandPaletteOpen || useUIStore.getState().modal)
+      return;
     if (key.name === "right" || (key.ctrl && key.name === "n")) handleNext();
-    if (key.name === "left" || (key.ctrl && key.name === "p")) handleBack();
+    // Back: ← only (Ctrl+P opens the palette globally)
+    if (key.name === "left") handleBack();
     if (key.name === "escape") handleBack();
     if (key.name === "tab" && key.shift) handleBack();
     if (key.name === "r" && step === 0) runChecks();
@@ -745,26 +754,35 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
     );
   };
 
-  // ── Masked input for secrets ────────────────────────────────────────────
+  // ── Secret fields — CLI-only (TUI does not collect secrets interactively)
   const SecretField = ({
     label,
     value,
-    path,
+    path: _path,
+    cliHint,
     width,
   }: {
     label: string;
     value: string;
     path: string;
+    /** Shown when empty so operators know how to set the secret. */
+    cliHint?: string;
     width?: number;
   }) => (
-    <box flexDirection="row" gap={1}>
-      <text fg={Colors.muted} width={16}>
-        {label}
-      </text>
-      <text fg={value ? Colors.muted : Colors.dim} width={width ?? 24}>
-        {value ? maskSecret(value) : "(not set)"}
-      </text>
-      <ValidationIcon fieldPath={path} />
+    <box flexDirection="column" gap={0}>
+      <box flexDirection="row" gap={1}>
+        <text fg={Colors.muted} width={16}>
+          {label}
+        </text>
+        <text fg={value ? Colors.muted : Colors.dim} width={width ?? 24}>
+          {value ? maskSecret(value) : "(set via CLI)"}
+        </text>
+      </box>
+      {!value && cliHint ? (
+        <text fg={Colors.dim} dim>
+          {`  → ${cliHint}`}
+        </text>
+      ) : null}
     </box>
   );
 
@@ -891,14 +909,17 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
 
   // ── Step Content Renderers (shifted: old step N is now step N+1) ────────
 
-  /** Step 1: API Keys */
+  /** Step 1: API Keys — CLI-only; TUI never prompts for secret material */
   const StepApiKeys = () => (
     <box flexDirection="column" gap={0}>
       <text bold fg={Colors.accent}>
         Exchange API Keys
       </text>
       <text dim fg={Colors.muted}>
-        Enter your exchange API credentials. Secrets are stored encrypted.
+        Secrets are not entered in the TUI. Set them via CLI, then continue.
+      </text>
+      <text dim fg={Colors.dim}>
+        hoox config secrets set BINANCE_API_KEY · etc.
       </text>
       <box flexDirection="column" gap={1} paddingTop={1}>
         {EXCHANGES.map((name) => {
@@ -912,11 +933,13 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
                 label="  API Key"
                 value={data.apiKeys[e].key}
                 path={`apiKeys.${e}.key`}
+                cliHint={`hoox config secrets set ${name.toUpperCase()}_API_KEY`}
               />
               <SecretField
                 label="  API Secret"
                 value={data.apiKeys[e].secret}
                 path={`apiKeys.${e}.secret`}
+                cliHint={`hoox config secrets set ${name.toUpperCase()}_API_SECRET`}
               />
             </box>
           );
@@ -946,14 +969,17 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
     </box>
   );
 
-  /** Step 3: AI Providers */
+  /** Step 3: AI Providers — URL/key via CLI/env; deploy only applies exchange flags */
   const StepAiProviders = () => (
     <box flexDirection="column" gap={0}>
       <text bold fg={Colors.accent}>
         AI Provider
       </text>
       <text dim fg={Colors.muted}>
-        Configure the AI endpoint for strategy generation.
+        Configure AI credentials via CLI/env (not typed in this wizard).
+      </text>
+      <text dim fg={Colors.dim}>
+        HOOX_API_TOKEN · hoox config secrets set OPENAI_API_KEY
       </text>
       <box flexDirection="column" gap={1} paddingTop={1}>
         <box flexDirection="row" gap={1}>
@@ -961,15 +987,20 @@ export function SetupWizard({ dialog }: SetupWizardProps) {
             Provider URL
           </text>
           <text fg={data.ai.providerUrl ? Colors.foreground : Colors.dim}>
-            {data.ai.providerUrl || "(not set)"}
+            {data.ai.providerUrl || "(set via CLI/env)"}
           </text>
         </box>
-        <SecretField label="API Key" value={data.ai.apiKey} path="ai.apiKey" />
+        <SecretField
+          label="API Key"
+          value={data.ai.apiKey}
+          path="ai.apiKey"
+          cliHint="hoox config secrets set OPENAI_API_KEY"
+        />
         <box flexDirection="row" gap={1}>
           <text fg={Colors.muted} width={12}>
             Model
           </text>
-          <text fg={Colors.foreground}>{data.ai.model}</text>
+          <text fg={Colors.foreground}>{data.ai.model || "default"}</text>
         </box>
       </box>
     </box>

package/src/components/views/trade-monitor.tsx

@@ -22,13 +22,14 @@
  * Colors from @hoox-sh/hoox-shared design tokens. No CSS, no DOM.
  */
 import { useState, useMemo, useRef, useEffect } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import { Colors, useServiceStore, useUIStore } from "@hoox-sh/hoox-shared";
 import type { Trade, TradeSide } from "@hoox-sh/hoox-shared";
 import { ErrorBoundary } from "../shared/error-boundary";
 import { Spinner, EmptyState } from "../shared/spinner";
 import { ViewHeader } from "../shared/view-header";
 import { Panel } from "../shared/panel";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 // ─── Constants ────────────────────────────────────────────────────────────────
 
@@ -235,19 +236,25 @@ function LiveTradeFeed({
 
   // Snapshot frozen trades when paused; keep updating otherwise
   const frozenRef = useRef<Trade[]>([]);
-  const wasPausedRef = useRef(false);
+  const [frozenStream, setFrozenStream] = useState<Trade[] | null>(null);
 
-  // Capture snapshot on pause edge, release on resume
-  if (!paused && wasPausedRef.current) {
-    frozenRef.current = [];
-  }
-  if (paused && !wasPausedRef.current) {
-    frozenRef.current = [...tradeStream];
-  }
-  wasPausedRef.current = paused;
+  // Capture snapshot on pause edge, release on resume (not during render)
+  useEffect(() => {
+    if (paused) {
+      frozenRef.current = [...tradeStream];
+      setFrozenStream(frozenRef.current);
+    } else {
+      frozenRef.current = [];
+      setFrozenStream(null);
+    }
+    // Only react to pause edge — intentionally omit tradeStream from deps
+    // when already paused so the frozen snapshot stays stable.
+  }, [paused]);
 
   // Use frozen snapshot when paused, live stream when not
-  const effectiveStream = paused ? frozenRef.current : tradeStream;
+  const effectiveStream = paused
+    ? (frozenStream ?? frozenRef.current)
+    : tradeStream;
 
   // Newest first, only the render window (store is newest-last)
   const sortedTrades = useMemo(
@@ -265,7 +272,7 @@ function LiveTradeFeed({
   const safeIndex = Math.min(selectedIndex, maxIndex);
 
   // Keyboard: navigate trade rows only while this view is active
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     if (key.name === "up") {
       setSelectedIndex((i) => Math.max(0, i - 1));
@@ -687,7 +694,7 @@ export function TradeMonitor() {
   const offline = connectionStatus === "offline";
 
   // Keyboard: space toggles pause/resume only while this view is active
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     if (key.name === "space") {
       setPaused((p) => !p);

package/src/components/views/worker-detail.tsx

@@ -21,7 +21,7 @@
  * Colors from @hoox-sh/hoox-shared tokens — no hardcoded hex.
  */
 import { useState, useMemo, useEffect, useCallback, useRef } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import {
   Colors,
   LogLevelColor,
@@ -36,6 +36,7 @@ import {
 import { ErrorBoundary } from "../shared/error-boundary";
 import { StatusDot, type StatusDotStatus } from "../shared/status-dot";
 import { ViewHeader } from "../shared/view-header";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 // ── Local type aliases (inferred from store return types) ──────────────────
 
@@ -97,14 +98,20 @@ export function redactConfigEntries(
 /**
  * Breadcrumb header showing back navigation, worker name, and status indicator.
  */
-function BreadcrumbHeader({ worker }: { worker: Worker }) {
+function BreadcrumbHeader({
+  worker,
+  onBack,
+}: {
+  worker: Worker;
+  onBack: () => void;
+}) {
   return (
     <ViewHeader
       title={worker.name}
       showDivider={false}
       meta={
         <box flexDirection="row" gap={2}>
-          <text fg={Colors.muted} dim>
+          <text fg={Colors.accent} onMouseUp={onBack}>
             ← BACK
           </text>
           <StatusDot
@@ -207,7 +214,7 @@ function LogsPane({
   }, [workerLogs.length, paused]);
 
   // Keyboard: Space toggles pause when this pane is focused
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!focused) return;
     if (key.name === "space") {
       setPaused((p) => !p);
@@ -546,25 +553,32 @@ export function WorkerDetail() {
     void fetchConfig();
   }, [fetchConfig]);
 
-  // Fetch logs via CLI as fallback when SSE is not connected
+  // Fetch logs via CLI when SSE is offline OR when connected but empty for this worker
   useEffect(() => {
     if (connectionStatus !== "connected") {
       void fetchLogs();
+      return;
     }
-  }, [connectionStatus, fetchLogs]);
+    // Connected but no lines yet for this worker — still allow a one-shot CLI seed
+    const hasWorkerLogs = useServiceStore
+      .getState()
+      .logs.some((l) => l.workerId === worker?.id || l.source === worker?.name);
+    if (!hasWorkerLogs && worker) {
+      void fetchLogs();
+    }
+  }, [connectionStatus, fetchLogs, worker]);
 
   const handleRefresh = useCallback(() => {
     void fetchConfig();
-    if (connectionStatus !== "connected") {
-      void fetchLogs();
-    }
-  }, [fetchConfig, fetchLogs, connectionStatus]);
+    // Always refresh logs on explicit Ctrl+R — not only when offline
+    void fetchLogs();
+  }, [fetchConfig, fetchLogs]);
 
   const activeView = useUIStore((s) => s.activeView);
   const isActive = activeView === "worker-detail";
 
   // View-local keyboard handling (only when this view is active)
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     switch (key.name) {
       case "tab":
@@ -586,6 +600,7 @@ export function WorkerDetail() {
       <ErrorBoundary viewName="Worker Detail">
         <box flexDirection="column" flexGrow={1} padding={2} gap={1}>
           <BreadcrumbHeader
+            onBack={goBack}
             worker={{
               id: selectedWorkerId || "unknown",
               name: selectedWorkerId || "Unknown Worker",
@@ -631,7 +646,7 @@ export function WorkerDetail() {
     <ErrorBoundary viewName={`Worker: ${worker.name}`}>
       <box flexDirection="column" flexGrow={1} padding={1} gap={1}>
         {/* Breadcrumb header */}
-        <BreadcrumbHeader worker={worker} />
+        <BreadcrumbHeader worker={worker} onBack={goBack} />
 
         {/* 2×2 Grid of panes */}
         <box flexDirection="column" flexGrow={1} gap={1}>

package/src/components/views/worker-settings.test.tsx

@@ -24,20 +24,19 @@ describe("WorkerSettingsView", () => {
     expect(display).not.toMatch(/sk-|token|password/i);
   });
 
-  it("dangerous fields require a second confirm before write (contract)", () => {
-    // Mirrors saveCurrent double-Enter gate for kind === "dangerous"
+  it("all non-secret fields require a second confirm before write (contract)", () => {
+    // Mirrors saveCurrent double-Enter gate for every non-secret write
     let pending: string | null = null;
-    const fieldKey = "risk:kill_switch";
-    const kind = "dangerous" as const;
+    const fieldKey = "risk:max_position_size";
 
     // First Enter → arm confirm
-    if (kind === "dangerous" && pending !== fieldKey) {
+    if (pending !== fieldKey) {
       pending = fieldKey;
     }
     expect(pending).toBe(fieldKey);
 
     // Second Enter with same key → proceed
-    const shouldWrite = kind === "dangerous" && pending === fieldKey;
+    const shouldWrite = pending === fieldKey;
     expect(shouldWrite).toBe(true);
   });
 });

package/src/components/views/worker-settings.tsx

@@ -16,7 +16,7 @@
  * `hoox config kv set`. Secret fields are read-only (CLI command shown).
  */
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import {
   Colors,
   AGENT_CONFIG_KV_KEY,
@@ -37,6 +37,7 @@ import { Panel } from "../shared/panel";
 import { Spinner, EmptyState } from "../shared/spinner";
 import { cliBridge } from "../../services/cli-bridge";
 import { loadDashboardSettingsManifests } from "../../services/dashboard-settings-loader";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 function parseKvValue(
   raw: string | null,
@@ -276,15 +277,16 @@ export function WorkerSettingsView() {
       return;
     }
 
-    // Fail-closed confirm for dangerous fields: require a second Enter.
-    if (row.field.kind === "dangerous") {
-      if (pendingDangerousKey !== row.field.key) {
-        setPendingDangerousKey(row.field.key);
-        setStatus(
-          `Confirm dangerous write for "${row.field.label}" — press Enter again to save, Esc to cancel`
-        );
-        return;
-      }
+    // Fail-closed confirm for ALL non-secret writes: require a second Enter.
+    // Prevents accidental live KV mutations from a single mis-press.
+    if (pendingDangerousKey !== row.field.key) {
+      setPendingDangerousKey(row.field.key);
+      const kindLabel =
+        row.field.kind === "dangerous" ? "dangerous write" : "write";
+      setStatus(
+        `Confirm ${kindLabel} for "${row.field.label}" — press Enter again to save, Esc to cancel`
+      );
+      return;
     }
     setPendingDangerousKey(null);
 
@@ -350,7 +352,7 @@ export function WorkerSettingsView() {
     }
   }, [flatFields, fieldIndex, selected, values, pendingDangerousKey, saving]);
 
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     if (key.name === "escape") {
       if (pendingDangerousKey) {

package/src/components/views/workers-overview.tsx

@@ -25,7 +25,7 @@
  * Follows TUI Patterns 1 (View Composition), 2 (Store Subscription), 8 (ScrollBox).
  */
 import { useState, useMemo, useCallback, useEffect, useRef } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import { Colors } from "@hoox-sh/hoox-shared";
 import { useServiceStore } from "@hoox-sh/hoox-shared";
 import { useUIStore } from "@hoox-sh/hoox-shared";
@@ -39,6 +39,7 @@ import { redactSecretsInText } from "../../services/dev-log";
 import type { WorkerInfo } from "@hoox-sh/hoox-shared";
 import { showConfirm } from "../ui/dialog";
 import type { DialogHandle } from "../ui/dialog";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 // ── Props ─────────────────────────────────────────────────────────────────────
 
@@ -337,7 +338,7 @@ export function WorkersOverview({ dialog }: WorkersOverviewProps = {}) {
   }, [maxIndex]);
 
   // ── View-local keyboard: 2D grid navigation ─────────────────────────────
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     switch (key.name) {
       case "up":
         setFocusedIndex((i) => Math.max(0, i - COLS));
@@ -371,25 +372,45 @@ export function WorkersOverview({ dialog }: WorkersOverviewProps = {}) {
 
   const handleLogs = useCallback(async (worker: WorkerInfo) => {
     if (deployingRef.current) return;
+    const store = useServiceStore.getState();
+    // Select worker and open Logs Viewer — primary operator path
+    store.selectWorker(worker.id);
+    useUIStore.getState().setView("logs-viewer");
+
     try {
       const result = await cliBridge.workerLogs(worker.name);
       if (!mountedRef.current) return;
+      if (result.success && result.stdout) {
+        // Seed the log ring so Logs Viewer has content immediately
+        const lines = result.stdout.split("\n").filter((l) => l.trim());
+        const now = Date.now();
+        for (const line of lines.slice(-100)) {
+          store.pushLog({
+            id: `cli-log-${now}-${Math.random().toString(36).slice(2, 8)}`,
+            timestamp: now,
+            level: "info",
+            workerId: worker.id,
+            message: redactSecretsInText(line).slice(0, 500),
+            source: worker.name,
+          });
+        }
+      }
       const failDetail = redactSecretsInText(
         result.stderr || result.stdout || "unknown error"
       );
-      useServiceStore.getState().addAlert({
+      store.addAlert({
         id: `logs-${Date.now()}-${worker.name}`,
         type: "logs",
         severity: result.success ? "info" : "warning",
         message: result.success
-          ? `${worker.name} logs retrieved (${(result.duration / 1000).toFixed(1)}s)`
-          : `${worker.name} logs failed: ${failDetail}`,
+          ? `Opened logs for ${worker.name}`
+          : `${worker.name} logs fetch failed: ${failDetail}`,
         timestamp: Date.now(),
         acknowledged: false,
       });
     } catch (err) {
       if (!mountedRef.current) return;
-      useServiceStore.getState().addAlert({
+      store.addAlert({
         id: `logs-err-${Date.now()}`,
         type: "logs",
         severity: "warning",