feat(tui): add workflow Navigator and call inspector

docs/dynamic-workflows.md

@@ -51,6 +51,7 @@ devspace workflow calls <run-id> --json
 devspace workflow call <run-id> <call-index> --json
 devspace workflow cancel <run-id> --json
 devspace workflow ls --json
+devspace workflow tui [run-id]
 ```
 
 Named scripts live in `.devspace/workflows/<name>.js`. A script can combine
@@ -63,6 +64,19 @@ This avoids coupling a long workflow lifetime to one tool-call timeout.
 `--follow` remains available for interactive terminals with long-running
 process support.
 
+`workflow tui` opens a project-scoped, read-only Navigator. The first screen
+lists workflows. Opening a run shows its declared phases beside the agent calls
+in the selected phase; opening a call exposes normalized activity, prompt,
+result, worktree details, and provider metadata. Use arrow keys (or `j`/`k`) to
+navigate, `Tab` to switch panes or inspector sections, `Enter` to open, `Esc`
+to go back, and `q` to quit.
+
+Elapsed time is derived from persisted call timestamps. Token counts are
+best-effort provider observations: a running call may show a partial snapshot,
+while a completed call shows its final provider-reported total. Providers that
+cannot report a value remain visibly unavailable instead of being estimated.
+Replayed calls do not contribute tokens to the current run.
+
 Failed and cancelled workflows are terminal. `workflow run --resume <run-id>`
 creates a new run, reuses the unchanged successful prefix when safe, and
 continues live from the first failed or changed call.

scripts/workflow-tui-fixture.ts

@@ -5,8 +5,16 @@ import { databasePath } from "../src/db/client.js";
 import { WorkflowStore } from "../src/workflow-store.js";
 import type { WorkflowRunRecord } from "../src/workflow-types.js";
 
-const FIXTURE_VERSION = "large-v1";
+const FIXTURE_VERSION = "large-v2";
 const WORKFLOW_NAME = "Ship multi-service authentication";
+const WORKFLOW_PHASES = [
+  { title: "Discovery", detail: "Map the existing authentication surface" },
+  { title: "Architecture", detail: "Choose service and data boundaries" },
+  { title: "Backend implementation", detail: "Implement services and migrations" },
+  { title: "Frontend integration", detail: "Connect the client experience" },
+  { title: "Verification", detail: "Exercise security and integration boundaries" },
+  { title: "Release", detail: "Prepare the rollout" },
+];
 
 const fixtureNames = [
   "empty",
@@ -87,6 +95,7 @@ function seedFixture(
       scriptPath: join(stateDir, "fixtures", `${name}.js`),
       scriptHash,
       workspaceRoot: workspace,
+      phases: WORKFLOW_PHASES,
       resumedFromRunId: name === "replayed" ? "wfr_previous_fixture" : undefined,
     });
 
@@ -230,6 +239,24 @@ function startCall(
     isolation: worktree ? "worktree" : "shared",
     worktreePath: worktree ? `/tmp/devspace-fixture-worktree-${callIndex}` : undefined,
   });
+  store.attachAgentSession(runId, callIndex, `${provider}-fixture-${callIndex}`);
+  store.updateAgentUsage(runId, callIndex, fixtureUsage(callIndex, "partial"));
+  store.appendAgentActivity({
+    runId,
+    callIndex,
+    kind: "status",
+    status: "completed",
+    label: "session started",
+    detail: `${provider} accepted the task`,
+  });
+  store.appendAgentActivity({
+    runId,
+    callIndex,
+    kind: worktree ? "file" : "tool",
+    status: "running",
+    label: worktree ? "editing isolated worktree" : "inspecting workspace",
+    detail: label,
+  });
 }
 
 function startPhase(store: WorkflowStore, runId: string, phase: string): void {
@@ -251,9 +278,34 @@ function addCompletedCall(
   worktree = false,
 ): void {
   startCall(store, runId, callIndex, label, provider, phase, worktree);
+  store.appendAgentActivity({
+    runId,
+    callIndex,
+    kind: worktree ? "file" : "tool",
+    status: "completed",
+    label: worktree ? "updated implementation" : "inspected workspace",
+    detail: label,
+  });
+  store.updateAgentUsage(runId, callIndex, fixtureUsage(callIndex, "final"));
   store.completeAgentCall({ runId, callIndex, responseText: `${label} completed` });
 }
 
+function fixtureUsage(
+  callIndex: number,
+  state: "partial" | "final",
+): Parameters<WorkflowStore["updateAgentUsage"]>[2] {
+  const multiplier = state === "final" ? 1 : 0.7;
+  const inputTokens = Math.floor((18_000 + callIndex * 4_300) * multiplier);
+  const outputTokens = Math.floor((4_500 + callIndex * 1_700) * multiplier);
+  return {
+    inputTokens,
+    cachedInputTokens: Math.floor(inputTokens * 0.25),
+    outputTokens,
+    totalTokens: inputTokens + outputTokens,
+    state,
+  };
+}
+
 function addCompletedPhase(
   store: WorkflowStore,
   runId: string,

src/workflow-tui.test.ts

@@ -1,5 +1,8 @@
 import assert from "node:assert/strict";
 import {
+  createWorkflowTuiState,
+  reduceWorkflowTuiState,
+  reconcileWorkflowTuiState,
   renderWorkflowTui,
   resolveWorkflowTuiWorkspaceRoot,
 } from "./workflow-tui.js";
@@ -26,23 +29,50 @@ const project: WorkflowProjectView = {
         cancelled: 0,
         observed: 2,
       },
+      totalTokens: 2_400,
       phases: [
+        {
+          title: "Planning",
+          status: "completed",
+          calls: [],
+        },
         {
           title: "Implementation",
+          status: "running",
           calls: [
             {
               callIndex: 1,
               status: "running",
               provider: "codex",
               label: "Patch auth",
+              phase: "Implementation",
               isolation: "worktree",
               fromCache: false,
+              prompt: "Patch the auth flow",
+              providerSessionId: "session_1",
+              usage: {
+                inputTokens: 1_600,
+                outputTokens: 800,
+                totalTokens: 2_400,
+                state: "partial",
+                updatedAt: "2026-07-26T10:00:02.000Z",
+              },
               updatedAt: "2026-07-26T10:00:02.000Z",
             },
           ],
         },
       ],
-      unphasedCalls: [],
+      unphasedCalls: [{
+        callIndex: 2,
+        status: "completed",
+        provider: "claude",
+        label: "Summarize rollout",
+        isolation: "shared",
+        fromCache: false,
+        prompt: "Summarize the rollout",
+        responseText: "Ready",
+        updatedAt: "2026-07-26T10:00:03.000Z",
+      }],
       recentActivity: [
         {
           seq: 1,
@@ -60,12 +90,75 @@ const project: WorkflowProjectView = {
   ],
 };
 
-const rendered = renderWorkflowTui(project, 0, 100, 30, { ansi: false });
-assert.match(rendered, /DevSpace workflows · \/tmp\/project/);
-assert.match(rendered, /Review auth · Implementation/);
-assert.match(rendered, /Patch auth  codex · worktree/);
-assert.match(rendered, /Running tests/);
-assert.match(rendered, /refreshes automatically/);
-assert.equal(resolveWorkflowTuiWorkspaceRoot("./test-project").endsWith("test-project"), true);
+let state = createWorkflowTuiState(project);
+let rendered = renderWorkflowTui(project, state, 100, 30, { ansi: false });
+assert.match(rendered, /Workflows · \/tmp\/project/);
+assert.match(rendered, /Review auth  Implementation/);
+
+state = reduceWorkflowTuiState(project, state, "return");
+assert.equal(state.screen, "workflow");
+rendered = renderWorkflowTui(project, state, 100, 30, { ansi: false });
+assert.match(rendered, /Workflow › Review auth/);
+assert.match(rendered, /PHASES\s+│ AGENTS · Implementation/);
+assert.match(rendered, /Patch auth  codex  2\.4k/);
+assert.match(rendered, /Other  1\/1/);
+
+state = reduceWorkflowTuiState(project, state, "tab");
+state = reduceWorkflowTuiState(project, state, "return");
+assert.equal(state.screen, "call");
+rendered = renderWorkflowTui(project, state, 72, 30, {
+  ansi: false,
+  activity: [{
+    runId: "wfr_1",
+    callIndex: 1,
+    seq: 1,
+    kind: "tool",
+    status: "completed",
+    label: "bash",
+    detail: "npm test",
+    createdAt: "2026-07-26T10:00:03.000Z",
+  }],
+});
+assert.match(rendered, /Workflow › Implementation › Patch auth/);
+assert.match(rendered, /tool\s+bash · npm test/);
+
+let unphasedState = createWorkflowTuiState(project, "wfr_1");
+unphasedState = reduceWorkflowTuiState(project, unphasedState, "down");
+assert.equal(unphasedState.screen === "workflow" && unphasedState.phaseIndex, 2);
+unphasedState = reduceWorkflowTuiState(project, unphasedState, "tab");
+unphasedState = reduceWorkflowTuiState(project, unphasedState, "return");
+assert.equal(unphasedState.screen, "call");
+assert.match(renderWorkflowTui(project, unphasedState, 80, 20, { ansi: false }), /Other › Summarize rollout/);
+
+const reorderedProject = { ...project, runs: [{ ...project.runs[0]!, id: "wfr_new" }, project.runs[0]!] };
+const reconciled = reconcileWorkflowTuiState(project, reorderedProject, {
+  screen: "workflow",
+  runIndex: 0,
+  phaseIndex: 1,
+  callIndex: 0,
+  focus: "calls",
+});
+assert.equal(reconciled.runIndex, 1);
+
+const unsafeProject = {
+  ...project,
+  workspaceRoot: "/tmp/project\u001b]52;c;clipboard\u0007",
+  runs: [{ ...project.runs[0]!, name: "Review\u001b[2Jauth" }],
+};
+const safeRender = renderWorkflowTui(unsafeProject, createWorkflowTuiState(unsafeProject), 100, 20, { ansi: false });
+assert.doesNotMatch(safeRender, /\u001b|\u0007/);
+assert.match(safeRender, /\\x1b/);
+
+const narrow = renderWorkflowTui(project, {
+  screen: "workflow",
+  runIndex: 0,
+  phaseIndex: 1,
+  callIndex: 0,
+  focus: "phases",
+}, 60, 20, { ansi: false });
+assert.match(narrow, /PHASES/);
+assert.doesNotMatch(narrow, /AGENTS · Implementation/);
+
+assert.equal(resolveWorkflowTuiWorkspaceRoot(process.cwd()), process.cwd());
 
 console.log("workflow-tui.test.ts: ok");