pi-crew 0.1.9 → 0.1.11

package/README.md

@@ -32,7 +32,7 @@ Current highlights:
 - detached async/background runner
 - stale async PID detection
 - active run summary and async completion notifications in Pi sessions
-- safe scaffold execution by default; real child Pi workers are opt-in
+- real child Pi worker execution by default, with explicit scaffold/dry-run opt-out
 - child Pi JSON output parsing for final text, usage, and event counts
 - retryable model fallback attempts per task
 - aggregate usage totals in status/summary
@@ -89,19 +89,21 @@ npm run ci
 
 ## Runtime safety model
 
-By default, `run` uses safe scaffold mode. It creates run state, task prompts, events, and placeholder result artifacts without launching child Pi workers.
+By default, `run` launches each crew task as a separate child Pi process. This matches the subagent model from `pi-subagents`: the parent session orchestrates while worker sessions execute independently and stream durable output back to run state.
 
-Real child Pi workers only run when explicitly enabled by either:
+Use scaffold/dry-run mode only when you explicitly want prompts/artifacts without launching workers:
 
-```bash
-PI_TEAMS_EXECUTE_WORKERS=1 pi
+```json
+{
+  "runtime": { "mode": "scaffold" }
+}
 ```
 
-or config:
+or disable workers globally:
 
 ```json
 {
-  "executeWorkers": true
+  "executeWorkers": false
 }
 ```
 
@@ -143,7 +145,7 @@ Supported config:
 ```json
 {
   "asyncByDefault": false,
-  "executeWorkers": false,
+  "executeWorkers": true,
   "notifierIntervalMs": 5000,
   "requireCleanWorktreeLeader": true,
   "autonomous": {
@@ -163,6 +165,11 @@ Supported config:
     "maxRunMinutes": 60,
     "maxRetriesPerTask": 1,
     "heartbeatStaleMs": 60000
+  },
+  "ui": {
+    "widgetPlacement": "aboveEditor",
+    "widgetMaxLines": 8,
+    "powerbar": true
   }
 }
 ```
@@ -619,7 +626,8 @@ Optional child Pi smoke check is explicit only:
 ## Environment variables
 
 ```text
-PI_TEAMS_EXECUTE_WORKERS=1       enable real child Pi worker execution
+PI_CREW_EXECUTE_WORKERS=0       disable child workers and use scaffold/dry-run mode
+PI_TEAMS_EXECUTE_WORKERS=0      legacy disable flag
 PI_TEAMS_MOCK_CHILD_PI=success   test/mock child worker success
 PI_TEAMS_MOCK_CHILD_PI=json-success
 PI_TEAMS_MOCK_CHILD_PI=retryable-failure

package/docs/architecture.md

@@ -32,8 +32,8 @@ Implemented now:
 - durable run manifests and task files
 - workflow validation
 - foreground workflow scheduler
-- safe scaffold task execution
-- optional real child Pi execution via `PI_TEAMS_EXECUTE_WORKERS=1`
+- child Pi task execution by default
+- explicit scaffold/dry-run task execution via `runtime.mode=scaffold` or `executeWorkers=false`
 - safety-first create/update/delete for agents, teams, and workflows
 - backups for update/delete mutations
 - dry-run support for management mutations

package/docs/usage.md

@@ -19,7 +19,7 @@ Supported fields:
 ```json
 {
   "asyncByDefault": false,
-  "executeWorkers": false,
+  "executeWorkers": true,
   "notifierIntervalMs": 5000,
   "requireCleanWorktreeLeader": true,
   "autonomous": {
@@ -28,6 +28,11 @@ Supported fields:
     "injectPolicy": true,
     "preferAsyncForLongTasks": false,
     "allowWorktreeSuggestion": true
+  },
+  "ui": {
+    "widgetPlacement": "aboveEditor",
+    "widgetMaxLines": 8,
+    "powerbar": true
   }
 }
 ```
@@ -47,9 +52,9 @@ Then open Pi and run:
 /team-autonomy status
 ```
 
-## Safe run
+## Default run: real worker execution
 
-By default, `pi-crew` does not launch child workers. It creates a durable run, prompts, placeholder results, events, and artifacts.
+By default, `pi-crew` launches each task as a separate child Pi worker process. The parent Pi session orchestrates; workers execute independently and stream output to durable run state.
 
 ```json
 {
@@ -59,16 +64,21 @@ By default, `pi-crew` does not launch child workers. It creates a durable run, p
 }
 ```
 
-## Real worker execution
+## Scaffold / dry run
 
-Start Pi with:
+Use scaffold mode only when you want durable prompts/artifacts without launching child workers.
 
-```bash
-PI_TEAMS_EXECUTE_WORKERS=1 pi
+```json
+{
+  "action": "run",
+  "team": "default",
+  "goal": "Plan only",
+  "config": {
+    "runtime": { "mode": "scaffold" }
+  }
+}
 ```
 
-Then run normally. Each task can spawn a child Pi worker.
-
 ## Async run
 
 ```json

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "pi-crew",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "Pi extension for coordinated AI teams, workflows, worktrees, and async task orchestration",
   "author": "baphuongna",
   "license": "MIT",

package/schema.json

@@ -78,6 +78,16 @@
         "enabled": { "type": "boolean" },
         "needsAttentionAfterMs": { "type": "integer", "minimum": 1 }
       }
+    },
+    "ui": {
+      "type": "object",
+      "additionalProperties": false,
+      "description": "Pi UI settings for the crew widget, dashboard, and optional powerbar segments.",
+      "properties": {
+        "widgetPlacement": { "type": "string", "enum": ["aboveEditor", "belowEditor"] },
+        "widgetMaxLines": { "type": "integer", "minimum": 1, "maximum": 50 },
+        "powerbar": { "type": "boolean" }
+      }
     }
   }
 }

package/src/config/config.ts

@@ -47,6 +47,12 @@ export interface CrewWorktreeConfig {
 	linkNodeModules?: boolean;
 }
 
+export interface CrewUiConfig {
+	widgetPlacement?: "aboveEditor" | "belowEditor";
+	widgetMaxLines?: number;
+	powerbar?: boolean;
+}
+
 export interface AgentOverrideConfig {
 	disabled?: boolean;
 	model?: string | false;
@@ -71,6 +77,7 @@ export interface PiTeamsConfig {
 	control?: CrewControlConfig;
 	worktree?: CrewWorktreeConfig;
 	agents?: CrewAgentsConfig;
+	ui?: CrewUiConfig;
 }
 
 export interface LoadedPiTeamsConfig {
@@ -136,6 +143,12 @@ function mergeConfig(base: PiTeamsConfig, override: PiTeamsConfig): PiTeamsConfi
 			...withoutUndefined((override.worktree ?? {}) as Record<string, unknown>),
 		};
 	}
+	if (base.ui || override.ui) {
+		merged.ui = {
+			...(base.ui ?? {}),
+			...withoutUndefined((override.ui ?? {}) as Record<string, unknown>),
+		};
+	}
 	if (base.agents || override.agents) {
 		merged.agents = {
 			...(base.agents ?? {}),
@@ -289,6 +302,17 @@ function parseAgentOverride(value: unknown): AgentOverrideConfig | undefined {
 	return Object.values(override).some((entry) => entry !== undefined) ? override : undefined;
 }
 
+function parseUiConfig(value: unknown): CrewUiConfig | undefined {
+	if (!value || typeof value !== "object" || Array.isArray(value)) return undefined;
+	const obj = value as Record<string, unknown>;
+	const ui: CrewUiConfig = {
+		widgetPlacement: obj.widgetPlacement === "aboveEditor" || obj.widgetPlacement === "belowEditor" ? obj.widgetPlacement : undefined,
+		widgetMaxLines: parsePositiveInteger(obj.widgetMaxLines, 50),
+		powerbar: typeof obj.powerbar === "boolean" ? obj.powerbar : undefined,
+	};
+	return Object.values(ui).some((entry) => entry !== undefined) ? ui : undefined;
+}
+
 function parseAgentsConfig(value: unknown): CrewAgentsConfig | undefined {
 	if (!value || typeof value !== "object" || Array.isArray(value)) return undefined;
 	const obj = value as Record<string, unknown>;
@@ -320,6 +344,7 @@ function parseConfig(raw: unknown): PiTeamsConfig {
 		control: parseControlConfig(obj.control),
 		worktree: parseWorktreeConfig(obj.worktree),
 		agents: parseAgentsConfig(obj.agents),
+		ui: parseUiConfig(obj.ui),
 	};
 }
 

package/src/extension/help.ts

@@ -40,6 +40,6 @@ export function piTeamsHelp(): string {
 		"- /team-validate",
 		"- /team-help",
 		"",
-		"Real child workers are disabled by default. Enable with PI_TEAMS_EXECUTE_WORKERS=1 or config executeWorkers=true.",
+		"Real child workers are enabled by default. Use runtime.mode=scaffold or executeWorkers=false only for dry runs.",
 	].join("\n");
 }

package/src/extension/register.ts

@@ -11,6 +11,7 @@ import { listRuns } from "./run-index.ts";
 import { RunDashboard, type RunDashboardSelection } from "../ui/run-dashboard.ts";
 import { registerPiCrewRpc, type PiCrewRpcHandle } from "./cross-extension-rpc.ts";
 import { stopCrewWidget, updateCrewWidget, type CrewWidgetState } from "../ui/crew-widget.ts";
+import { clearPiCrewPowerbar, registerPiCrewPowerbarSegments, updatePiCrewPowerbar } from "../ui/powerbar-publisher.ts";
 import { DurableTextViewer, DurableTranscriptViewer } from "../ui/transcript-viewer.ts";
 import { loadRunManifestById } from "../state/state-store.ts";
 import { readCrewAgents } from "../runtime/crew-agent-records.ts";
@@ -109,14 +110,22 @@ export function registerPiTeams(pi: ExtensionAPI): void {
 		currentCtx = ctx;
 		notifyActiveRuns(ctx);
 		const loadedConfig = loadConfig(ctx.cwd);
+		registerPiCrewPowerbarSegments(pi.events, loadedConfig.config.ui);
 		startAsyncRunNotifier(ctx, notifierState, loadedConfig.config.notifierIntervalMs ?? 5000);
-		updateCrewWidget(ctx, widgetState);
-		widgetState.interval = setInterval(() => { if (currentCtx) updateCrewWidget(currentCtx, widgetState); }, 1000);
+		updateCrewWidget(ctx, widgetState, loadedConfig.config.ui);
+		updatePiCrewPowerbar(pi.events, ctx.cwd, loadedConfig.config.ui);
+		widgetState.interval = setInterval(() => {
+			if (!currentCtx) return;
+			const config = loadConfig(currentCtx.cwd).config.ui;
+			updateCrewWidget(currentCtx, widgetState, config);
+			updatePiCrewPowerbar(pi.events, currentCtx.cwd, config);
+		}, 1000);
 		widgetState.interval.unref?.();
 	});
 	pi.on("session_shutdown", () => {
 		stopAsyncRunNotifier(notifierState);
-		stopCrewWidget(currentCtx, widgetState);
+		stopCrewWidget(currentCtx, widgetState, currentCtx ? loadConfig(currentCtx.cwd).config.ui : undefined);
+		clearPiCrewPowerbar(pi.events);
 		currentCtx = undefined;
 		rpcHandle?.unsubscribe();
 		rpcHandle = undefined;
@@ -130,7 +139,9 @@ export function registerPiTeams(pi: ExtensionAPI): void {
 		parameters: TeamToolParams as never,
 		async execute(_id, params, _signal, _onUpdate, ctx) {
 			const output = await handleTeamTool(params as TeamToolParamsValue, ctx);
-			updateCrewWidget(ctx, widgetState);
+			const config = loadConfig(ctx.cwd).config.ui;
+			updateCrewWidget(ctx, widgetState, config);
+			updatePiCrewPowerbar(pi.events, ctx.cwd, config);
 			return output;
 		},
 	};
@@ -323,7 +334,7 @@ export function registerPiTeams(pi: ExtensionAPI): void {
 		handler: async (_args: string, ctx: ExtensionCommandContext) => {
 			for (;;) {
 				const runs = listRuns(ctx.cwd).slice(0, 50);
-				const selection = await ctx.ui.custom<RunDashboardSelection | undefined>((_tui, _theme, _keybindings, done) => new RunDashboard(runs, done), {
+				const selection = await ctx.ui.custom<RunDashboardSelection | undefined>((_tui, theme, _keybindings, done) => new RunDashboard(runs, done, theme), {
 					overlay: true,
 					overlayOptions: { width: "90%", maxHeight: "80%", anchor: "center" },
 				});

package/src/extension/team-tool.ts

@@ -318,10 +318,10 @@ export async function handleRun(params: TeamToolParamsValue, ctx: TeamContext):
 		"",
 		`Runtime: ${runtime.kind}${runtime.fallback ? ` (fallback from ${runtime.requestedMode})` : ""}${runtime.reason ? ` - ${runtime.reason}` : ""}`,
 		runtime.kind === "child-process"
-			? "Child Pi worker execution was enabled."
+			? "Child Pi worker execution is enabled by default; each task is launched as a separate Pi process. Set runtime.mode=scaffold or executeWorkers=false only for dry runs."
 			: runtime.kind === "live-session"
 				? "Experimental live-session worker execution was enabled."
-				: "Safe scaffold mode: child Pi workers were not launched. Set PI_CREW_EXECUTE_WORKERS=1, PI_TEAMS_EXECUTE_WORKERS=1, or runtime.mode=child-process to enable real worker execution.",
+				: "Safe scaffold mode: child Pi workers were not launched because runtime.mode=scaffold or executeWorkers=false was configured.",
 	].join("\n");
 	return result(text, { action: "run", status: executed.manifest.status === "failed" ? "error" : "ok", runId: executed.manifest.runId, artifactsRoot: executed.manifest.artifactsRoot }, executed.manifest.status === "failed");
 }
@@ -508,6 +508,7 @@ function configPatchFromConfig(config: unknown): PiTeamsConfig {
 	const runtime = configRecord(cfg.runtime);
 	const limits = configRecord(cfg.limits);
 	const worktree = configRecord(cfg.worktree);
+	const ui = configRecord(cfg.ui);
 	return {
 		asyncByDefault: typeof cfg.asyncByDefault === "boolean" ? cfg.asyncByDefault : undefined,
 		executeWorkers: typeof cfg.executeWorkers === "boolean" ? cfg.executeWorkers : undefined,
@@ -542,6 +543,11 @@ function configPatchFromConfig(config: unknown): PiTeamsConfig {
 			enabled: typeof control.enabled === "boolean" ? control.enabled : undefined,
 			needsAttentionAfterMs: typeof control.needsAttentionAfterMs === "number" && Number.isInteger(control.needsAttentionAfterMs) && control.needsAttentionAfterMs > 0 ? control.needsAttentionAfterMs : undefined,
 		} : undefined,
+		ui: Object.keys(ui).length > 0 ? {
+			widgetPlacement: ui.widgetPlacement === "aboveEditor" || ui.widgetPlacement === "belowEditor" ? ui.widgetPlacement : undefined,
+			widgetMaxLines: typeof ui.widgetMaxLines === "number" && Number.isInteger(ui.widgetMaxLines) && ui.widgetMaxLines > 0 ? ui.widgetMaxLines : undefined,
+			powerbar: typeof ui.powerbar === "boolean" ? ui.powerbar : undefined,
+		} : undefined,
 	};
 }
 

package/src/runtime/process-status.ts

@@ -1,9 +1,14 @@
+import type { CrewAgentRecord } from "./crew-agent-runtime.ts";
+import type { TeamRunManifest } from "../state/types.ts";
+
 export interface ProcessLiveness {
 	pid?: number;
 	alive: boolean;
 	detail: string;
 }
 
+const ORPHANED_ACTIVE_RUN_MS = 10 * 60 * 1000;
+
 export function checkProcessLiveness(pid: number | undefined): ProcessLiveness {
 	if (pid === undefined || !Number.isInteger(pid) || pid <= 0) {
 		return { pid, alive: false, detail: "no pid recorded" };
@@ -23,3 +28,16 @@ export function checkProcessLiveness(pid: number | undefined): ProcessLiveness {
 export function isActiveRunStatus(status: string): boolean {
 	return status === "queued" || status === "planning" || status === "running";
 }
+
+export function isLikelyOrphanedActiveRun(run: TeamRunManifest, agents: CrewAgentRecord[] = [], now = Date.now(), staleMs = ORPHANED_ACTIVE_RUN_MS): boolean {
+	if (!isActiveRunStatus(run.status)) return false;
+	if (run.async?.pid !== undefined) return false;
+	const updatedAt = new Date(run.updatedAt).getTime();
+	if (!Number.isFinite(updatedAt) || now - updatedAt < staleMs) return false;
+	if (agents.length === 0) return run.summary === "Creating workflow prompts and placeholder results.";
+	return agents.every((agent) => agent.status === "queued" && !agent.completedAt && !agent.progress);
+}
+
+export function isDisplayActiveRun(run: TeamRunManifest, agents: CrewAgentRecord[] = [], now = Date.now()): boolean {
+	return isActiveRunStatus(run.status) && !isLikelyOrphanedActiveRun(run, agents, now);
+}

package/src/runtime/runtime-resolver.ts

@@ -48,22 +48,21 @@ export async function isLiveSessionRuntimeAvailable(timeoutMs = 1500, env: NodeJ
 
 export async function resolveCrewRuntime(config: PiTeamsConfig, env: NodeJS.ProcessEnv = process.env): Promise<CrewRuntimeCapabilities> {
 	const requestedMode = config.runtime?.mode ?? "auto";
-	const executeWorkers = config.executeWorkers === true || env.PI_CREW_EXECUTE_WORKERS === "1" || env.PI_TEAMS_EXECUTE_WORKERS === "1";
+	const workersDisabled = config.executeWorkers === false || env.PI_CREW_EXECUTE_WORKERS === "0" || env.PI_TEAMS_EXECUTE_WORKERS === "0";
 	if (requestedMode === "scaffold") return scaffoldCaps(requestedMode);
-	if (requestedMode === "child-process") return childCaps(requestedMode, executeWorkers ? undefined : "child-process requested but executeWorkers is not enabled; caller should refuse or fall back explicitly.");
+	if (workersDisabled) return scaffoldCaps(requestedMode, "Child worker execution disabled by config/env. Set runtime.mode=scaffold or executeWorkers=false only for dry runs.");
+	if (requestedMode === "child-process") return childCaps(requestedMode);
 	if (requestedMode === "live-session" || (requestedMode === "auto" && config.runtime?.preferLiveSession === true)) {
 		const live = await isLiveSessionRuntimeAvailable(1500, env);
 		if (live.available) return liveCaps(requestedMode);
 		if (requestedMode === "live-session" && config.runtime?.allowChildProcessFallback === false) return { ...scaffoldCaps(requestedMode), available: false, reason: live.reason };
-		if (executeWorkers) return { ...childCaps(requestedMode), fallback: "child-process", reason: live.reason };
-		return { ...scaffoldCaps(requestedMode), fallback: "scaffold", reason: live.reason };
+		return { ...childCaps(requestedMode), fallback: "child-process", reason: live.reason };
 	}
-	if (executeWorkers) return childCaps(requestedMode);
-	return scaffoldCaps(requestedMode);
+	return childCaps(requestedMode);
 }
 
-function scaffoldCaps(requestedMode: CrewRuntimeMode): CrewRuntimeCapabilities {
-	return { kind: "scaffold", requestedMode, available: true, steer: false, resume: false, liveToolActivity: false, transcript: false };
+function scaffoldCaps(requestedMode: CrewRuntimeMode, reason?: string): CrewRuntimeCapabilities {
+	return { kind: "scaffold", requestedMode, available: true, steer: false, resume: false, liveToolActivity: false, transcript: false, ...(reason ? { reason } : {}) };
 }
 
 function childCaps(requestedMode: CrewRuntimeMode, reason?: string): CrewRuntimeCapabilities {

package/src/ui/crew-widget.ts

@@ -1,8 +1,9 @@
 import type { ExtensionContext } from "@mariozechner/pi-coding-agent";
+import type { CrewUiConfig } from "../config/config.ts";
 import { listRuns } from "../extension/run-index.ts";
-import { isActiveRunStatus } from "../runtime/process-status.ts";
 import { readCrewAgents } from "../runtime/crew-agent-records.ts";
 import type { CrewAgentRecord } from "../runtime/crew-agent-runtime.ts";
+import { isDisplayActiveRun } from "../runtime/process-status.ts";
 import type { TeamRunManifest } from "../state/types.ts";
 
 const SPINNER = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
@@ -15,12 +16,48 @@ const TOOL_LABELS: Record<string, string> = {
 	find: "finding files",
 	ls: "listing",
 };
+const ANSI_PATTERN = /\u001b\[[0-?]*[ -/]*[@-~]/g;
+
+type ThemeLike = { fg?: (color: string, text: string) => string; bold?: (text: string) => string };
+type WidgetComponent = { render(width: number): string[]; invalidate(): void };
 
 export interface CrewWidgetState {
 	frame: number;
 	interval?: ReturnType<typeof setInterval>;
 }
 
+interface WidgetRun {
+	run: TeamRunManifest;
+	agents: CrewAgentRecord[];
+}
+
+function visibleWidth(value: string): number {
+	return value.replace(ANSI_PATTERN, "").length;
+}
+
+function truncate(value: string, width: number): string {
+	if (width <= 0) return "";
+	if (visibleWidth(value) <= width) return value;
+	if (width <= 1) return "…";
+	let output = "";
+	let visible = 0;
+	for (let index = 0; index < value.length;) {
+		const slice = value.slice(index);
+		const ansi = slice.match(/^\u001b\[[0-?]*[ -/]*[@-~]/);
+		if (ansi?.[0]) {
+			output += ansi[0];
+			index += ansi[0].length;
+			continue;
+		}
+		const char = value[index]!;
+		if (visible >= width - 1) break;
+		output += char;
+		visible += 1;
+		index += char.length;
+	}
+	return `${output}\u001b[0m…`;
+}
+
 function elapsed(iso: string | undefined, now = Date.now()): string | undefined {
 	if (!iso) return undefined;
 	const ms = Math.max(0, now - new Date(iso).getTime());
@@ -45,7 +82,7 @@ function agentActivity(agent: CrewAgentRecord): string {
 	const recent = agent.progress?.recentOutput?.at(-1);
 	if (recent) return recent.replace(/\s+/g, " ").trim();
 	if (agent.progress?.activityState === "needs_attention") return "needs attention";
-	if (agent.status === "queued") return "queued…";
+	if (agent.status === "queued") return "queued";
 	if (agent.status === "running") return "thinking…";
 	if (agent.status === "failed") return agent.error ?? "failed";
 	return "done";
@@ -61,53 +98,86 @@ function agentStats(agent: CrewAgentRecord): string {
 	return parts.join(" · ");
 }
 
-function runStep(run: TeamRunManifest, agents: CrewAgentRecord[]): string {
-	const running = agents.find((agent) => agent.status === "running");
-	if (running) return running.taskId;
-	const queued = agents.find((agent) => agent.status === "queued");
-	if (queued) return queued.taskId;
-	return run.status;
+function agentsFor(run: TeamRunManifest): CrewAgentRecord[] {
+	try { return readCrewAgents(run); } catch { return []; }
 }
 
-export function buildCrewWidgetLines(cwd: string, frame = 0, maxLines = 8): string[] {
+function activeWidgetRuns(cwd: string): WidgetRun[] {
 	const runs = listRuns(cwd).slice(0, 20);
-	const activeRuns = runs.filter((run) => isActiveRunStatus(run.status));
-	const recentRuns = runs.filter((run) => !isActiveRunStatus(run.status)).slice(0, 3);
-	const shownRuns = [...activeRuns, ...recentRuns];
-	if (!shownRuns.length) return [];
+	return runs.map((run) => ({ run, agents: agentsFor(run) })).filter((item) => isDisplayActiveRun(item.run, item.agents));
+}
+
+function statusSummary(runs: WidgetRun[]): string {
+	const runningAgents = runs.flatMap((item) => item.agents).filter((agent) => agent.status === "running").length;
+	const queuedAgents = runs.flatMap((item) => item.agents).filter((agent) => agent.status === "queued").length;
+	return `● pi-crew · runs=${runs.length} agents=${runningAgents} running${queuedAgents ? ` · ${queuedAgents} queued` : ""} · /team-dashboard`;
+}
+
+export function buildCrewWidgetLines(cwd: string, frame = 0, maxLines = 8): string[] {
+	const runs = activeWidgetRuns(cwd);
+	if (!runs.length) return [];
 	const runningGlyph = SPINNER[frame % SPINNER.length] ?? "⠋";
-	const lines: string[] = [];
-	const activeCount = activeRuns.length;
-	lines.push(`${activeCount ? "●" : "○"} pi-crew · active=${activeCount} recent=${recentRuns.length} · /team-dashboard`);
-	for (const run of shownRuns) {
-		let agents: CrewAgentRecord[] = [];
-		try { agents = readCrewAgents(run); } catch { agents = []; }
-		const counts = new Map<string, number>();
-		for (const agent of agents) counts.set(agent.status, (counts.get(agent.status) ?? 0) + 1);
-		const countText = [...counts.entries()].map(([status, count]) => `${status}:${count}`).join(" ") || run.status;
-		lines.push(`${glyph(run.status, runningGlyph)} ${run.runId.slice(-8)} ${run.team}/${run.workflow ?? "none"} · ${runStep(run, agents)} · ${countText}`);
-		for (const agent of agents.filter((item) => item.status === "running" || item.status === "queued").slice(0, 2)) {
+	const lines: string[] = [statusSummary(runs)];
+	for (const { run, agents } of runs) {
+		const running = agents.find((agent) => agent.status === "running");
+		const queued = agents.find((agent) => agent.status === "queued");
+		const step = running?.taskId ?? queued?.taskId ?? run.status;
+		const completed = agents.filter((agent) => agent.status === "completed").length;
+		lines.push(`${glyph(run.status, runningGlyph)} ${run.runId.slice(-8)} ${run.team}/${run.workflow ?? "none"} · ${step} · ${completed}/${agents.length} done`);
+		const activeAgents = agents.filter((item) => item.status === "running" || item.status === "queued");
+		for (const agent of activeAgents.slice(0, 3)) {
 			const stats = agentStats(agent);
 			lines.push(`  ${glyph(agent.status, runningGlyph)} ${agent.taskId} ${agent.role}→${agent.agent} · ${agentActivity(agent)}${stats ? ` · ${stats}` : ""}`);
 		}
+		if (activeAgents.length > 3) lines.push(`  … +${activeAgents.length - 3} more agents`);
 		if (lines.length >= maxLines) break;
 	}
 	return lines.slice(0, maxLines);
 }
 
-export function updateCrewWidget(ctx: Pick<ExtensionContext, "cwd" | "hasUI" | "ui">, state: CrewWidgetState): void {
+class CrewWidgetComponent implements WidgetComponent {
+	private cwd: string;
+	private frame: number;
+	private maxLines: number;
+	private theme: ThemeLike;
+
+	constructor(cwd: string, frame: number, maxLines: number, theme: ThemeLike) {
+		this.cwd = cwd;
+		this.frame = frame;
+		this.maxLines = maxLines;
+		this.theme = theme;
+	}
+	invalidate(): void {}
+	render(width: number): string[] {
+		const fg = this.theme.fg?.bind(this.theme) ?? ((_color: string, text: string) => text);
+		const bold = this.theme.bold?.bind(this.theme) ?? ((text: string) => text);
+		return buildCrewWidgetLines(this.cwd, this.frame, this.maxLines).map((line, index) => {
+			const colored = index === 0
+				? line.replace("● pi-crew", `${fg("accent", "●")} ${bold("pi-crew")}`)
+				: line.replace(/^\s*([⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏▶◦✓✗■·])/, (match, icon: string) => match.replace(icon, fg(icon === "✓" ? "success" : icon === "✗" ? "error" : icon === "◦" ? "dim" : "accent", icon)));
+			return truncate(colored, width);
+		});
+	}
+}
+
+export function updateCrewWidget(ctx: Pick<ExtensionContext, "cwd" | "hasUI" | "ui">, state: CrewWidgetState, config?: CrewUiConfig): void {
 	if (!ctx.hasUI) return;
 	state.frame += 1;
-	const lines = buildCrewWidgetLines(ctx.cwd, state.frame);
+	const maxLines = config?.widgetMaxLines ?? 8;
+	const lines = buildCrewWidgetLines(ctx.cwd, state.frame, maxLines);
 	ctx.ui.setStatus("pi-crew", lines.length ? lines[0] : undefined);
-	ctx.ui.setWidget("pi-crew", lines.length ? lines : undefined, { placement: "aboveEditor" });
+	if (!lines.length) {
+		ctx.ui.setWidget("pi-crew", undefined, { placement: config?.widgetPlacement ?? "aboveEditor" });
+		return;
+	}
+	ctx.ui.setWidget("pi-crew", ((_tui: unknown, theme: unknown) => new CrewWidgetComponent(ctx.cwd, state.frame, maxLines, theme as ThemeLike)) as never, { placement: config?.widgetPlacement ?? "aboveEditor" });
 }
 
-export function stopCrewWidget(ctx: Pick<ExtensionContext, "hasUI" | "ui"> | undefined, state: CrewWidgetState): void {
+export function stopCrewWidget(ctx: Pick<ExtensionContext, "hasUI" | "ui"> | undefined, state: CrewWidgetState, config?: CrewUiConfig): void {
 	if (state.interval) clearInterval(state.interval);
 	state.interval = undefined;
 	if (ctx?.hasUI) {
 		ctx.ui.setStatus("pi-crew", undefined);
-		ctx.ui.setWidget("pi-crew", undefined, { placement: "aboveEditor" });
+		ctx.ui.setWidget("pi-crew", undefined, { placement: config?.widgetPlacement ?? "aboveEditor" });
 	}
 }

package/src/ui/powerbar-publisher.ts

@@ -0,0 +1,55 @@
+import type { CrewUiConfig } from "../config/config.ts";
+import { listRuns } from "../extension/run-index.ts";
+import { readCrewAgents } from "../runtime/crew-agent-records.ts";
+import { isDisplayActiveRun } from "../runtime/process-status.ts";
+
+type EventBus = { emit?: (event: string, data: unknown) => void } | undefined;
+
+function safeEmit(events: EventBus, event: string, data: unknown): void {
+	try { events?.emit?.(event, data); } catch {}
+}
+
+export function registerPiCrewPowerbarSegments(events: EventBus, config?: CrewUiConfig): void {
+	if (config?.powerbar === false) return;
+	safeEmit(events, "powerbar:register-segment", { id: "pi-crew-active", label: "pi-crew active agents" });
+	safeEmit(events, "powerbar:register-segment", { id: "pi-crew-progress", label: "pi-crew run progress" });
+}
+
+export function updatePiCrewPowerbar(events: EventBus, cwd: string, config?: CrewUiConfig): void {
+	if (config?.powerbar === false) return;
+	const active = listRuns(cwd).slice(0, 20).map((run) => {
+		let agents = [] as ReturnType<typeof readCrewAgents>;
+		try { agents = readCrewAgents(run); } catch {}
+		return { run, agents };
+	}).filter((item) => isDisplayActiveRun(item.run, item.agents));
+	if (!active.length) {
+		safeEmit(events, "powerbar:update", { id: "pi-crew-active" });
+		safeEmit(events, "powerbar:update", { id: "pi-crew-progress" });
+		return;
+	}
+	const agents = active.flatMap((item) => item.agents);
+	const running = agents.filter((agent) => agent.status === "running").length;
+	const queued = agents.filter((agent) => agent.status === "queued").length;
+	const completed = agents.filter((agent) => agent.status === "completed").length;
+	const total = Math.max(1, agents.length);
+	safeEmit(events, "powerbar:update", {
+		id: "pi-crew-active",
+		icon: "⚙",
+		text: `crew ${running || active.length}`,
+		suffix: queued ? `${queued}q` : undefined,
+		color: running ? "accent" : "warning",
+	});
+	safeEmit(events, "powerbar:update", {
+		id: "pi-crew-progress",
+		text: active[0]?.run.team ?? "crew",
+		bar: Math.round((completed / total) * 100),
+		suffix: `${completed}/${total}`,
+		color: completed === total ? "success" : "accent",
+		barSegments: 8,
+	});
+}
+
+export function clearPiCrewPowerbar(events: EventBus): void {
+	safeEmit(events, "powerbar:update", { id: "pi-crew-active" });
+	safeEmit(events, "powerbar:update", { id: "pi-crew-progress" });
+}

package/src/ui/run-dashboard.ts

@@ -2,7 +2,7 @@ import * as fs from "node:fs";
 import type { TeamRunManifest } from "../state/types.ts";
 import { readCrewAgents } from "../runtime/crew-agent-records.ts";
 import type { CrewAgentRecord } from "../runtime/crew-agent-runtime.ts";
-import { isActiveRunStatus } from "../runtime/process-status.ts";
+import { isDisplayActiveRun, isLikelyOrphanedActiveRun } from "../runtime/process-status.ts";
 
 interface DashboardComponent {
 	invalidate(): void;
@@ -10,6 +10,8 @@ interface DashboardComponent {
 	handleInput(data: string): void;
 }
 
+type DashboardTheme = { fg?: (color: string, text: string) => string; bold?: (text: string) => string };
+
 export type RunDashboardAction = "status" | "summary" | "artifacts" | "api" | "events" | "agents" | "agent-events" | "agent-output" | "agent-transcript" | "reload";
 export interface RunDashboardSelection {
 	runId: string;
@@ -49,9 +51,17 @@ function padVisible(value: string, width: number): string {
 	return `${value}${" ".repeat(Math.max(0, width - visibleLength(value)))}`;
 }
 
+function colorForStatus(status: string): string {
+	if (status === "completed") return "success";
+	if (status === "failed" || status === "stale") return "error";
+	if (status === "cancelled" || status === "blocked") return "warning";
+	if (status === "running") return "accent";
+	return "dim";
+}
+
 function statusIcon(status: string): string {
 	if (status === "completed") return "✓";
-	if (status === "failed") return "✗";
+	if (status === "failed" || status === "stale") return "✗";
 	if (status === "cancelled") return "!";
 	if (status === "running") return "▶";
 	if (status === "blocked") return "■";
@@ -104,19 +114,24 @@ function readAgentPreview(run: TeamRunManifest, maxLines = 5): string[] {
 	}
 }
 
+function agentsFor(run: TeamRunManifest): CrewAgentRecord[] {
+	try { return readCrewAgents(run); } catch { return []; }
+}
+
 function runLabel(run: TeamRunManifest, selected: boolean): string {
-	let agents: CrewAgentRecord[] = [];
-	try { agents = readCrewAgents(run); } catch { agents = []; }
+	const agents = agentsFor(run);
+	const stale = isLikelyOrphanedActiveRun(run, agents);
 	const running = agents.find((agent) => agent.status === "running");
 	const queued = agents.find((agent) => agent.status === "queued");
-	const step = running ? `step ${running.taskId}` : queued ? `queued ${queued.taskId}` : `agents ${agents.length}`;
+	const step = stale ? "orphaned queued run" : running ? `step ${running.taskId}` : queued ? `queued ${queued.taskId}` : `agents ${agents.length}`;
+	const status = stale ? "stale" : run.status;
 	const marker = selected ? "›" : " ";
-	return `${marker} ${statusIcon(run.status)} ${run.runId.slice(-8)} ${run.status} | ${run.team}/${run.workflow ?? "none"} | ${step} | ${run.goal}`;
+	return `${marker} ${statusIcon(status)} ${run.runId.slice(-8)} ${status} | ${run.team}/${run.workflow ?? "none"} | ${step} | ${run.goal}`;
 }
 
 function groupedRuns(runs: TeamRunManifest[]): Array<{ label: string; run?: TeamRunManifest }> {
-	const active = runs.filter((run) => isActiveRunStatus(run.status));
-	const recent = runs.filter((run) => !isActiveRunStatus(run.status));
+	const active = runs.filter((run) => isDisplayActiveRun(run, agentsFor(run)));
+	const recent = runs.filter((run) => !isDisplayActiveRun(run, agentsFor(run)));
 	const rows: Array<{ label: string; run?: TeamRunManifest }> = [];
 	if (active.length) rows.push({ label: "Active" }, ...active.map((run) => ({ label: run.runId, run })));
 	if (recent.length) rows.push({ label: "Recent" }, ...recent.map((run) => ({ label: run.runId, run })));
@@ -138,23 +153,28 @@ export class RunDashboard implements DashboardComponent {
 	private showFullProgress = false;
 	private readonly runs: TeamRunManifest[];
 	private readonly done: (selection: RunDashboardSelection | undefined) => void;
+	private readonly theme: DashboardTheme;
 
-	constructor(runs: TeamRunManifest[], done: (selection: RunDashboardSelection | undefined) => void) {
+	constructor(runs: TeamRunManifest[], done: (selection: RunDashboardSelection | undefined) => void, theme: unknown = {}) {
 		this.runs = runs;
 		this.done = done;
+		this.theme = theme as DashboardTheme;
 	}
 
 	invalidate(): void {}
 
 	render(width: number): string[] {
+		const fg = this.theme.fg?.bind(this.theme) ?? ((_color: string, text: string) => text);
+		const bold = this.theme.bold?.bind(this.theme) ?? ((text: string) => text);
 		const innerWidth = Math.max(20, width - 4);
 		const borderWidth = Math.min(innerWidth, Math.max(0, width - 2));
+		const border = (text: string) => fg("border", text);
 		const lines = [
-			`╭${"─".repeat(borderWidth)}╮`,
-			`│ ${padVisible(truncate("pi-crew dashboard", innerWidth - 1), innerWidth - 1)}│`,
-			`│ ${padVisible(truncate("↑/↓/j/k select • r reload • p progress • s/u/a/i actions • d agents • e/v/o viewers • q close", innerWidth - 1), innerWidth - 1)}│`,
+			border(`╭${"─".repeat(borderWidth)}╮`),
+			`│ ${padVisible(truncate(`${fg("accent", "●")} ${bold("pi-crew dashboard")}`, innerWidth - 1), innerWidth - 1)}│`,
+			`│ ${padVisible(truncate(fg("dim", "↑/↓/j/k select • r reload • p progress • s/u/a/i actions • d agents • e/v/o viewers • q close"), innerWidth - 1), innerWidth - 1)}│`,
 			`│ ${padVisible(truncate(`Runs: ${this.runs.length} • ${countByStatus(this.runs)}`, innerWidth - 1), innerWidth - 1)}│`,
-			`├${"─".repeat(borderWidth)}┤`,
+			border(`├${"─".repeat(borderWidth)}┤`),
 		];
 		if (this.runs.length === 0) {
 			lines.push(`│ ${padVisible(truncate("No runs found.", innerWidth - 1), innerWidth - 1)}│`);
@@ -163,15 +183,17 @@ export class RunDashboard implements DashboardComponent {
 			const runRows = rows.filter((row) => row.run);
 			for (const row of rows) {
 				if (!row.run) {
-					lines.push(`│ ${padVisible(truncate(row.label, innerWidth - 1), innerWidth - 1)}│`);
+					lines.push(`│ ${padVisible(truncate(fg("accent", row.label), innerWidth - 1), innerWidth - 1)}│`);
 					continue;
 				}
 				const index = runRows.findIndex((candidate) => candidate.run?.runId === row.run?.runId);
-				lines.push(`│ ${padVisible(truncate(runLabel(row.run, index === this.selected), innerWidth - 1), innerWidth - 1)}│`);
+				const label = runLabel(row.run, index === this.selected);
+				const status = isLikelyOrphanedActiveRun(row.run, agentsFor(row.run)) ? "stale" : row.run.status;
+				lines.push(`│ ${padVisible(truncate(fg(colorForStatus(status), label), innerWidth - 1), innerWidth - 1)}│`);
 			}
 			const selectedRun = selectedRunFromGrouped(this.runs, this.selected);
 			if (selectedRun) {
-				lines.push(`├${"─".repeat(borderWidth)}┤`);
+				lines.push(border(`├${"─".repeat(borderWidth)}┤`));
 				const details = [
 					`Selected: ${selectedRun.runId}`,
 					`Status: ${selectedRun.status} | Team: ${selectedRun.team} | Workflow: ${selectedRun.workflow ?? "none"}`,
@@ -186,7 +208,7 @@ export class RunDashboard implements DashboardComponent {
 				}
 			}
 		}
-		lines.push(`╰${"─".repeat(borderWidth)}╯`);
+		lines.push(border(`╰${"─".repeat(borderWidth)}╯`));
 		return lines.map((line) => truncate(line, width));
 	}
 

package/src/ui/transcript-viewer.ts

@@ -1,204 +1,219 @@
-import * as fs from "node:fs";
-type Component = { invalidate(): void; render(width: number): string[]; handleInput(data: string): void };
-type TranscriptTheme = { fg?: (color: string, text: string) => string; bold?: (text: string) => string };
-import type { TeamRunManifest } from "../state/types.ts";
-import { agentOutputPath, readCrewAgents } from "../runtime/crew-agent-records.ts";
-
-function visibleWidth(text: string): number {
-	return text.replace(/\u001b\[[0-?]*[ -/]*[@-~]/g, "").length;
-}
-
-function truncate(text: string, width: number): string {
-	if (width <= 0) return "";
-	if (visibleWidth(text) <= width) return text;
-	return width <= 1 ? "…" : `${text.slice(0, Math.max(0, width - 1))}…`;
-}
-
-function wrap(text: string, width: number): string[] {
-	const source = text.split(/\r?\n/);
-	const lines: string[] = [];
-	for (const raw of source) {
-		const line = raw || " ";
-		if (line.length <= width) {
-			lines.push(line);
-			continue;
-		}
-		for (let index = 0; index < line.length; index += width) lines.push(line.slice(index, index + width));
-	}
-	return lines;
-}
-
-function asRecord(value: unknown): Record<string, unknown> | undefined {
-	return value && typeof value === "object" && !Array.isArray(value) ? value as Record<string, unknown> : undefined;
-}
-
-function textFromContent(content: unknown): string {
-	if (typeof content === "string") return content;
-	if (!Array.isArray(content)) return "";
-	return content.map((part) => {
-		const obj = asRecord(part);
-		if (!obj) return "";
-		if (typeof obj.text === "string") return obj.text;
-		if (typeof obj.content === "string") return obj.content;
-		if (typeof obj.name === "string") return `[tool:${obj.name}]`;
-		return "";
-	}).filter(Boolean).join("\n");
-}
-
-export function formatTranscriptEvent(event: unknown): string[] {
-	const obj = asRecord(event);
-	if (!obj) return [String(event)];
-	const type = typeof obj.type === "string" ? obj.type : undefined;
-	const toolName = typeof obj.toolName === "string" ? obj.toolName : typeof obj.name === "string" ? obj.name : undefined;
-	if (type && /tool/i.test(type)) {
-		const text = textFromContent(obj.content) || (typeof obj.text === "string" ? obj.text : typeof obj.result === "string" ? obj.result : "");
-		return [`[tool${toolName ? `:${toolName}` : ""} ${type}]: ${text.trim() || "(no output)"}`];
-	}
-	const message = asRecord(obj.message);
-	if (message) {
-		const role = typeof message.role === "string" ? message.role : "message";
-		const text = textFromContent(message.content);
-		if (text.trim()) return [`[${role}]: ${text.trim()}`];
-	}
-	if (type) {
-		const text = textFromContent(obj.content) || (typeof obj.text === "string" ? obj.text : "");
-		return text.trim() ? [`[${type}]: ${text.trim()}`] : [`[${type}]`];
-	}
-	return [JSON.stringify(event)];
-}
-
-export function formatTranscriptText(text: string): string[] {
-	const lines: string[] = [];
-	for (const raw of text.split(/\r?\n/).filter(Boolean)) {
-		try {
-			lines.push(...formatTranscriptEvent(JSON.parse(raw)));
-		} catch {
-			lines.push(raw);
-		}
-	}
-	return lines.length ? lines : ["(no transcript content)"];
-}
-
-export function readRunTranscript(manifest: TeamRunManifest, taskId?: string): { title: string; path: string; lines: string[] } {
-	const agents = readCrewAgents(manifest);
-	const agent = taskId ? agents.find((item) => item.taskId === taskId || item.id === taskId) : agents.find((item) => item.transcriptPath) ?? agents[0];
-	const selectedTaskId = agent?.taskId ?? taskId ?? "unknown";
-	const transcriptPath = agent?.transcriptPath && fs.existsSync(agent.transcriptPath) ? agent.transcriptPath : agentOutputPath(manifest, selectedTaskId);
-	const text = fs.existsSync(transcriptPath) ? fs.readFileSync(transcriptPath, "utf-8") : "";
-	return { title: `${manifest.runId}:${selectedTaskId}`, path: transcriptPath, lines: formatTranscriptText(text) };
-}
-
-export class DurableTextViewer implements Component {
-	private scroll = 0;
-	private lastHeight = 10;
-	private title: string;
-	private subtitle: string;
-	private lines: string[];
-	private theme: unknown;
-	private done: (result: undefined) => void;
-
-	constructor(title: string, subtitle: string, lines: string[], theme: unknown, done: (result: undefined) => void) {
-		this.title = title;
-		this.subtitle = subtitle;
-		this.lines = lines.length ? lines : ["(empty)"];
-		this.theme = theme;
-		this.done = done;
-	}
-
-	invalidate(): void {}
-
-	handleInput(data: string): void {
-		if (data === "q" || data === "\u001b") {
-			this.done(undefined);
-			return;
-		}
-		const maxScroll = Math.max(0, this.lines.length - this.lastHeight);
-		if (data === "k" || data === "\u001b[A") this.scroll = Math.max(0, this.scroll - 1);
-		else if (data === "j" || data === "\u001b[B") this.scroll = Math.min(maxScroll, this.scroll + 1);
-		else if (data === "g") this.scroll = 0;
-		else if (data === "G") this.scroll = maxScroll;
-	}
-
-	render(width: number): string[] {
-		const th = this.theme as TranscriptTheme;
-		const fg = th.fg?.bind(th) ?? ((_color: string, text: string) => text);
-		const bold = th.bold?.bind(th) ?? ((text: string) => text);
-		const inner = Math.max(20, width - 4);
-		this.lastHeight = 16;
-		const body = this.lines.flatMap((line) => wrap(line, inner));
-		const maxScroll = Math.max(0, body.length - this.lastHeight);
-		this.scroll = Math.min(this.scroll, maxScroll);
-		const visible = body.slice(this.scroll, this.scroll + this.lastHeight);
-		const pad = (text: string) => `${text}${" ".repeat(Math.max(0, inner - visibleWidth(text)))}`;
-		const row = (text: string) => `${fg("border", "│")} ${truncate(pad(text), inner)} ${fg("border", "│")}`;
-		return [
-			fg("border", `╭${"─".repeat(inner + 2)}╮`),
-			row(`${bold(this.title)} ${fg("dim", this.subtitle)}`),
-			row(fg("dim", "j/k scroll · g/G top/bottom · q close")),
-			fg("border", `├${"─".repeat(inner + 2)}┤`),
-			...visible.map(row),
-			fg("border", `├${"─".repeat(inner + 2)}┤`),
-			row(fg("dim", `${body.length} lines · ${body.length ? Math.round(((this.scroll + visible.length) / body.length) * 100) : 100}%`)),
-			fg("border", `╰${"─".repeat(inner + 2)}╯`),
-		];
-	}
-}
-
-export class DurableTranscriptViewer implements Component {
-	private scroll = 0;
-	private lastHeight = 10;
-	private manifest: TeamRunManifest;
-	private theme: unknown;
-	private done: (result: undefined) => void;
-	private taskId?: string;
-
-	constructor(manifest: TeamRunManifest, theme: unknown, done: (result: undefined) => void, taskId?: string) {
-		this.manifest = manifest;
-		this.theme = theme;
-		this.done = done;
-		this.taskId = taskId;
-	}
-
-	invalidate(): void {}
-
-	handleInput(data: string): void {
-		if (data === "q" || data === "\u001b") {
-			this.done(undefined);
-			return;
-		}
-		const content = readRunTranscript(this.manifest, this.taskId).lines;
-		const maxScroll = Math.max(0, content.length - this.lastHeight);
-		if (data === "k" || data === "\u001b[A") this.scroll = Math.max(0, this.scroll - 1);
-		else if (data === "j" || data === "\u001b[B") this.scroll = Math.min(maxScroll, this.scroll + 1);
-		else if (data === "g") this.scroll = 0;
-		else if (data === "G") this.scroll = maxScroll;
-	}
-
-	render(width: number): string[] {
-		const th = this.theme as TranscriptTheme;
-		const fg = th.fg?.bind(th) ?? ((_color: string, text: string) => text);
-		const bold = th.bold?.bind(th) ?? ((text: string) => text);
-		const inner = Math.max(20, width - 4);
-		const data = readRunTranscript(this.manifest, this.taskId);
-		const body = data.lines.flatMap((line) => wrap(line, inner));
-		this.lastHeight = 16;
-		const maxScroll = Math.max(0, body.length - this.lastHeight);
-		this.scroll = Math.min(this.scroll, maxScroll);
-		const visible = body.slice(this.scroll, this.scroll + this.lastHeight);
-		const pad = (text: string) => `${text}${" ".repeat(Math.max(0, inner - visibleWidth(text)))}`;
-		const row = (text: string) => `${fg("border", "│")} ${truncate(pad(text), inner)} ${fg("border", "│")}`;
-		const lines = [
-			fg("border", `╭${"─".repeat(inner + 2)}╮`),
-			row(`${bold("pi-crew transcript")} ${fg("dim", data.title)}`),
-			row(fg("dim", data.path)),
-			row(fg("dim", "j/k scroll · g/G top/bottom · q close")),
-			fg("border", `├${"─".repeat(inner + 2)}┤`),
-			...visible.map(row),
-			fg("border", `├${"─".repeat(inner + 2)}┤`),
-			row(fg("dim", `${body.length} lines · ${body.length ? Math.round(((this.scroll + visible.length) / body.length) * 100) : 100}%`)),
-			fg("border", `╰${"─".repeat(inner + 2)}╯`),
-		];
-		return lines;
-	}
-}
-
+import * as fs from "node:fs";
+type Component = { invalidate(): void; render(width: number): string[]; handleInput(data: string): void };
+type TranscriptTheme = { fg?: (color: string, text: string) => string; bold?: (text: string) => string };
+import type { TeamRunManifest } from "../state/types.ts";
+import { agentOutputPath, readCrewAgents } from "../runtime/crew-agent-records.ts";
+
+function visibleWidth(text: string): number {
+	return text.replace(/\u001b\[[0-?]*[ -/]*[@-~]/g, "").length;
+}
+
+function truncate(text: string, width: number): string {
+	if (width <= 0) return "";
+	if (visibleWidth(text) <= width) return text;
+	return width <= 1 ? "…" : `${text.slice(0, Math.max(0, width - 1))}…`;
+}
+
+function wrap(text: string, width: number): string[] {
+	const source = text.split(/\r?\n/);
+	const lines: string[] = [];
+	for (const raw of source) {
+		const line = raw || " ";
+		if (line.length <= width) {
+			lines.push(line);
+			continue;
+		}
+		for (let index = 0; index < line.length; index += width) lines.push(line.slice(index, index + width));
+	}
+	return lines;
+}
+
+function asRecord(value: unknown): Record<string, unknown> | undefined {
+	return value && typeof value === "object" && !Array.isArray(value) ? value as Record<string, unknown> : undefined;
+}
+
+function textFromContent(content: unknown): string {
+	if (typeof content === "string") return content;
+	if (!Array.isArray(content)) return "";
+	return content.map((part) => {
+		const obj = asRecord(part);
+		if (!obj) return "";
+		if (typeof obj.text === "string") return obj.text;
+		if (typeof obj.content === "string") return obj.content;
+		if (typeof obj.name === "string") return `[tool:${obj.name}]`;
+		return "";
+	}).filter(Boolean).join("\n");
+}
+
+function truncateBody(text: string, max = 1000): string {
+	return text.length > max ? `${text.slice(0, max)}… (truncated ${text.length - max} chars)` : text;
+}
+
+export function formatTranscriptEvent(event: unknown): string[] {
+	const obj = asRecord(event);
+	if (!obj) return [String(event)];
+	const type = typeof obj.type === "string" ? obj.type : undefined;
+	const toolName = typeof obj.toolName === "string" ? obj.toolName : typeof obj.name === "string" ? obj.name : undefined;
+	if (type && /tool/i.test(type)) {
+		const text = textFromContent(obj.content) || (typeof obj.text === "string" ? obj.text : typeof obj.result === "string" ? obj.result : "");
+		return [`[Tool${toolName ? `: ${toolName}` : ""}] ${type}`, truncateBody(text.trim() || "(no output)")];
+	}
+	const message = asRecord(obj.message);
+	if (message) {
+		const role = typeof message.role === "string" ? message.role : "message";
+		const text = textFromContent(message.content);
+		const label = role === "assistant" ? "Assistant" : role === "user" ? "User" : role;
+		if (text.trim()) return [`[${label}]:`, text.trim()];
+	}
+	if (type) {
+		const text = textFromContent(obj.content) || (typeof obj.text === "string" ? obj.text : "");
+		return text.trim() ? [`[${type}]: ${text.trim()}`] : [`[${type}]`];
+	}
+	return [JSON.stringify(event)];
+}
+
+export function formatTranscriptText(text: string): string[] {
+	const lines: string[] = [];
+	for (const raw of text.split(/\r?\n/).filter(Boolean)) {
+		try {
+			lines.push(...formatTranscriptEvent(JSON.parse(raw)));
+		} catch {
+			lines.push(raw);
+		}
+	}
+	return lines.length ? lines : ["(no transcript content)"];
+}
+
+export function readRunTranscript(manifest: TeamRunManifest, taskId?: string): { title: string; path: string; lines: string[] } {
+	const agents = readCrewAgents(manifest);
+	const agent = taskId ? agents.find((item) => item.taskId === taskId || item.id === taskId) : agents.find((item) => item.transcriptPath) ?? agents[0];
+	const selectedTaskId = agent?.taskId ?? taskId ?? "unknown";
+	const transcriptPath = agent?.transcriptPath && fs.existsSync(agent.transcriptPath) ? agent.transcriptPath : agentOutputPath(manifest, selectedTaskId);
+	const text = fs.existsSync(transcriptPath) ? fs.readFileSync(transcriptPath, "utf-8") : "";
+	return { title: `${manifest.runId}:${selectedTaskId}`, path: transcriptPath, lines: formatTranscriptText(text) };
+}
+
+export class DurableTextViewer implements Component {
+	private scroll = 0;
+	private lastHeight = 10;
+	private autoScroll = true;
+	private title: string;
+	private subtitle: string;
+	private lines: string[];
+	private theme: unknown;
+	private done: (result: undefined) => void;
+
+	constructor(title: string, subtitle: string, lines: string[], theme: unknown, done: (result: undefined) => void) {
+		this.title = title;
+		this.subtitle = subtitle;
+		this.lines = lines.length ? lines : ["(empty)"];
+		this.theme = theme;
+		this.done = done;
+	}
+
+	invalidate(): void {}
+
+	handleInput(data: string): void {
+		if (data === "q" || data === "\u001b") {
+			this.done(undefined);
+			return;
+		}
+		const maxScroll = Math.max(0, this.lines.length - this.lastHeight);
+		if (data === "k" || data === "\u001b[A") { this.scroll = Math.max(0, this.scroll - 1); this.autoScroll = false; }
+		else if (data === "j" || data === "\u001b[B") { this.scroll = Math.min(maxScroll, this.scroll + 1); this.autoScroll = this.scroll >= maxScroll; }
+		else if (data === "\u001b[5~") { this.scroll = Math.max(0, this.scroll - this.lastHeight); this.autoScroll = false; }
+		else if (data === "\u001b[6~") { this.scroll = Math.min(maxScroll, this.scroll + this.lastHeight); this.autoScroll = this.scroll >= maxScroll; }
+		else if (data === "g" || data === "\u001b[H") { this.scroll = 0; this.autoScroll = false; }
+		else if (data === "G" || data === "\u001b[F") { this.scroll = maxScroll; this.autoScroll = true; }
+	}
+
+	render(width: number): string[] {
+		const th = this.theme as TranscriptTheme;
+		const fg = th.fg?.bind(th) ?? ((_color: string, text: string) => text);
+		const bold = th.bold?.bind(th) ?? ((text: string) => text);
+		const inner = Math.max(20, width - 4);
+		this.lastHeight = 16;
+		const body = this.lines.flatMap((line) => wrap(line, inner));
+		const maxScroll = Math.max(0, body.length - this.lastHeight);
+		if (this.autoScroll) this.scroll = maxScroll;
+		this.scroll = Math.min(this.scroll, maxScroll);
+		const visible = body.slice(this.scroll, this.scroll + this.lastHeight);
+		const pad = (text: string) => `${text}${" ".repeat(Math.max(0, inner - visibleWidth(text)))}`;
+		const colorLine = (line: string) => line.startsWith("[User]") ? fg("accent", line) : line.startsWith("[Assistant]") ? bold(line) : line.startsWith("[Tool") ? fg("muted", line) : line.startsWith("[Result]") ? fg("dim", line) : line;
+		const row = (text: string) => `${fg("border", "│")} ${truncate(pad(colorLine(text)), inner)} ${fg("border", "│")}`;
+		return [
+			fg("border", `╭${"─".repeat(inner + 2)}╮`),
+			row(`${bold(this.title)} ${fg("dim", this.subtitle)}`),
+			row(fg("dim", "j/k scroll · PgUp/PgDn · g/G top/bottom · q close")),
+			fg("border", `├${"─".repeat(inner + 2)}┤`),
+			...visible.map(row),
+			fg("border", `├${"─".repeat(inner + 2)}┤`),
+			row(fg("dim", `${body.length} lines · ${body.length ? Math.round(((this.scroll + visible.length) / body.length) * 100) : 100}% · auto-scroll ${this.autoScroll ? "on" : "off"}`)),
+			fg("border", `╰${"─".repeat(inner + 2)}╯`),
+		];
+	}
+}
+
+export class DurableTranscriptViewer implements Component {
+	private scroll = 0;
+	private lastHeight = 10;
+	private autoScroll = true;
+	private manifest: TeamRunManifest;
+	private theme: unknown;
+	private done: (result: undefined) => void;
+	private taskId?: string;
+
+	constructor(manifest: TeamRunManifest, theme: unknown, done: (result: undefined) => void, taskId?: string) {
+		this.manifest = manifest;
+		this.theme = theme;
+		this.done = done;
+		this.taskId = taskId;
+	}
+
+	invalidate(): void {}
+
+	handleInput(data: string): void {
+		if (data === "q" || data === "\u001b") {
+			this.done(undefined);
+			return;
+		}
+		const content = readRunTranscript(this.manifest, this.taskId).lines;
+		const maxScroll = Math.max(0, content.length - this.lastHeight);
+		if (data === "k" || data === "\u001b[A") { this.scroll = Math.max(0, this.scroll - 1); this.autoScroll = false; }
+		else if (data === "j" || data === "\u001b[B") { this.scroll = Math.min(maxScroll, this.scroll + 1); this.autoScroll = this.scroll >= maxScroll; }
+		else if (data === "\u001b[5~") { this.scroll = Math.max(0, this.scroll - this.lastHeight); this.autoScroll = false; }
+		else if (data === "\u001b[6~") { this.scroll = Math.min(maxScroll, this.scroll + this.lastHeight); this.autoScroll = this.scroll >= maxScroll; }
+		else if (data === "g" || data === "\u001b[H") { this.scroll = 0; this.autoScroll = false; }
+		else if (data === "G" || data === "\u001b[F") { this.scroll = maxScroll; this.autoScroll = true; }
+	}
+
+	render(width: number): string[] {
+		const th = this.theme as TranscriptTheme;
+		const fg = th.fg?.bind(th) ?? ((_color: string, text: string) => text);
+		const bold = th.bold?.bind(th) ?? ((text: string) => text);
+		const inner = Math.max(20, width - 4);
+		const data = readRunTranscript(this.manifest, this.taskId);
+		const body = data.lines.flatMap((line) => wrap(line, inner));
+		this.lastHeight = 16;
+		const maxScroll = Math.max(0, body.length - this.lastHeight);
+		if (this.autoScroll) this.scroll = maxScroll;
+		this.scroll = Math.min(this.scroll, maxScroll);
+		const visible = body.slice(this.scroll, this.scroll + this.lastHeight);
+		const pad = (text: string) => `${text}${" ".repeat(Math.max(0, inner - visibleWidth(text)))}`;
+		const colorLine = (line: string) => line.startsWith("[User]") ? fg("accent", line) : line.startsWith("[Assistant]") ? bold(line) : line.startsWith("[Tool") ? fg("muted", line) : line.startsWith("[Result]") ? fg("dim", line) : line;
+		const row = (text: string) => `${fg("border", "│")} ${truncate(pad(colorLine(text)), inner)} ${fg("border", "│")}`;
+		const lines = [
+			fg("border", `╭${"─".repeat(inner + 2)}╮`),
+			row(`${bold("pi-crew transcript")} ${fg("dim", data.title)}`),
+			row(fg("dim", data.path)),
+			row(fg("dim", "j/k scroll · PgUp/PgDn · g/G top/bottom · q close")),
+			fg("border", `├${"─".repeat(inner + 2)}┤`),
+			...visible.map(row),
+			fg("border", `├${"─".repeat(inner + 2)}┤`),
+			row(fg("dim", `${body.length} lines · ${body.length ? Math.round(((this.scroll + visible.length) / body.length) * 100) : 100}% · auto-scroll ${this.autoScroll ? "on" : "off"}`)),
+			fg("border", `╰${"─".repeat(inner + 2)}╯`),
+		];
+		return lines;
+	}
+}
+