@zachwill/pi-orchestrate 0.1.0 → 0.2.0

package/extension/presentation.ts

@@ -6,7 +6,7 @@ import {
   type Theme,
 } from "@earendil-works/pi-coding-agent";
 import {
-  Container,
+  Box,
   Markdown,
   Spacer,
   Text,
@@ -14,92 +14,125 @@ import {
   visibleWidth,
   type Component,
 } from "@earendil-works/pi-tui";
-import type { WaveDeliveryDetails } from "./delivery.js";
-import {
-  isWorkerCompleteForWave,
-  type WaveRecord,
-  type WorkerOutcome,
-  type WorkerRecord,
-  type WorkerStatus,
-  type WorkerUsage,
-} from "./domain.js";
+import { Result, Schema } from "effect";
+import type { WorkerDeliveryDetails } from "./delivery.js";
+import type { WorkerOutcome, WorkerRecord, WorkerStatus, WorkerUsage } from "./domain.js";
 import type { OrchestratorRuntime, RuntimeSnapshot } from "./runtime.js";
 
 export const ORCHESTRATION_PRESENTATION_KEY = "pi-orchestrate";
-export const MAX_RESULT_PREVIEW_LINES = 5;
+export const MAX_RESULT_PREVIEW_LINES = 6;
 export const MAX_WIDGET_WORKERS = 8;
 
-export type PresentationRuntime = Pick<
-  OrchestratorRuntime,
-  "snapshot" | "subscribeState"
->;
-
-interface SafeResult {
-  readonly workerId: string;
-  readonly worker: string;
-  readonly title: string;
-  readonly status: string;
-  readonly outcome: WorkerOutcome;
-  readonly usage: Partial<WorkerUsage>;
-  readonly sessionFile?: string;
-}
+const WORKER_ANIMATIONS = {
+  starting: {
+    frames: ["⠂", "⠌", "⡑", "⢕", "⣫", "⣿", "⣫", "⢕"],
+    color: "muted",
+  },
+  running: {
+    frames: ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"],
+    color: "accent",
+  },
+  stopping: {
+    frames: ["⣿", "⣶", "⣤", "⣀", "⠠", "⠐", "⠈", "⠁"],
+    color: "dim",
+  },
+} as const;
+const ANIMATION_CYCLE_TICKS = 40;
+const SPINNER_INTERVAL_MS = 140;
+const ACTIVE_STATUSES: ReadonlySet<WorkerStatus> = new Set(["starting", "running", "stopping"]);
+
+export type PresentationRuntime = Pick<OrchestratorRuntime, "snapshot" | "subscribeState">;
+
+const NonnegativeFinite = Schema.Finite.check(Schema.isGreaterThanOrEqualTo(0));
+const NonnegativeInteger = Schema.Int.check(Schema.isGreaterThanOrEqualTo(0));
+const legacyOptionalKey = <S extends Schema.Constraint>(schema: S) =>
+  Schema.optionalKey(Schema.UndefinedOr(schema));
+
+const WorkerUsageSchema = Schema.Struct({
+  input: NonnegativeFinite,
+  output: NonnegativeFinite,
+  cacheRead: NonnegativeFinite,
+  cacheWrite: NonnegativeFinite,
+  cost: NonnegativeFinite,
+  contextTokens: NonnegativeFinite,
+  turns: NonnegativeInteger,
+});
+
+const WorkerCompletedOutcomeSchema = Schema.Struct({
+  status: Schema.Literal("completed"),
+  assistantText: Schema.String,
+});
+const WorkerReadyOutcomeSchema = Schema.Struct({
+  status: Schema.Literal("ready"),
+  assistantText: Schema.String,
+});
+const WorkerFailedOutcomeSchema = Schema.Struct({
+  status: Schema.Literal("failed"),
+  message: Schema.String,
+  assistantText: legacyOptionalKey(Schema.String),
+});
+const WorkerAbortedOutcomeSchema = Schema.Struct({
+  status: Schema.Literal("aborted"),
+  message: legacyOptionalKey(Schema.String),
+  assistantText: legacyOptionalKey(Schema.String),
+});
+const WorkerOutcomeSchema = Schema.Union([
+  WorkerCompletedOutcomeSchema,
+  WorkerReadyOutcomeSchema,
+  WorkerFailedOutcomeSchema,
+  WorkerAbortedOutcomeSchema,
+]);
 
-interface SafeDetails {
-  readonly id: string;
-  readonly results: readonly SafeResult[];
-}
+const SettlementPayloadSchema = Schema.Struct({
+  eventId: legacyOptionalKey(Schema.String),
+  sequence: legacyOptionalKey(NonnegativeInteger),
+  ownerSessionId: Schema.String,
+  waveId: Schema.String,
+  workerId: Schema.String,
+  generation: NonnegativeInteger,
+  mode: Schema.Literals(["async", "inline"]),
+  worker: Schema.String,
+  title: Schema.String,
+  lifecycle: Schema.Literals(["one-shot", "reusable"]),
+  status: Schema.Literals(["completed", "ready", "failed", "aborted"]),
+  outcome: WorkerOutcomeSchema,
+  usage: WorkerUsageSchema,
+  startedAt: NonnegativeInteger,
+  settledAt: NonnegativeInteger,
+  remainingActive: legacyOptionalKey(NonnegativeInteger),
+  waveComplete: legacyOptionalKey(Schema.Boolean),
+  sessionFile: legacyOptionalKey(Schema.String),
+  failureStage: legacyOptionalKey(Schema.Literals(["startup", "prompt", "workflow", "cancellation"])),
+}).check(Schema.makeFilter((settlement) => {
+  if (settlement.outcome.status !== settlement.status) return "outcome status must match settlement status";
+  if (settlement.settledAt < settlement.startedAt) return "settlement timestamp must not precede start timestamp";
+  if (settlement.failureStage !== undefined && settlement.status !== "failed" && settlement.status !== "aborted") {
+    return "failure stage requires a failed or aborted settlement";
+  }
+}));
+
+const SettlementEnvelopeSchema = Schema.Struct({ settlement: SettlementPayloadSchema });
+const decodeSettlementEnvelope = Schema.decodeUnknownResult(SettlementEnvelopeSchema);
+type SafeSettlement = Schema.Schema.Type<typeof SettlementPayloadSchema>;
 
 interface StatusBinding {
   readonly ownerSessionId: string;
   readonly ctx: ExtensionContext;
 }
 
-const ACTIVE_STATUSES: ReadonlySet<WorkerStatus> = new Set([
-  "starting",
-  "running",
-  "stopping",
-]);
-
-const KNOWN_RESULT_STATUSES = new Set([
-  "completed",
-  "failed",
-  "aborted",
-  "ready",
-  "closed",
-]);
+interface RenderRequester { requestRender(): void }
 
 export function registerOrchestrationPresentation(pi: ExtensionAPI): void {
-  pi.registerMessageRenderer<WaveDeliveryDetails>(
-    "pi-orchestrate-wave",
-    (message, { expanded }, theme) => {
-      const details = readDeliveryDetails(message.details);
-      const content = messageText(message.content);
-
-      if (expanded) return expandedResult(content, details, theme);
-      return new BoundedLines(collapsedResultLines(content, details, theme));
-    },
+  pi.registerMessageRenderer<WorkerDeliveryDetails>(
+    "pi-orchestrate-worker-result",
+    (message, { expanded }, theme) =>
+      new WorkerResultComponent(messageText(message.content), message.details, expanded, theme),
   );
 }
 
 export function formatResultStatusSummary(details: unknown): string {
-  const parsed = readDeliveryDetails(details);
-  if (!parsed) return "Result details unavailable";
-
-  const resultWord = parsed.results.length === 1 ? "result" : "results";
-  if (parsed.results.length === 0) return `0 ${resultWord}`;
-
-  const counts = new Map<string, number>();
-  for (const result of parsed.results) {
-    const status = KNOWN_RESULT_STATUSES.has(result.status) ? result.status : "unknown";
-    counts.set(status, (counts.get(status) ?? 0) + 1);
-  }
-
-  const statusOrder = ["completed", "ready", "failed", "aborted", "closed", "unknown"];
-  const statuses = statusOrder.flatMap((status) => {
-    const count = counts.get(status);
-    return count === undefined ? [] : [`${count} ${status}`];
-  });
-  return `${parsed.results.length} ${resultWord} · ${statuses.join(" · ")}`;
+  const result = readSettlement(details);
+  return result ? statusHeading(result) : "Worker result details unavailable";
 }
 
 export function formatResultPreviews(
@@ -108,52 +141,32 @@ export function formatResultPreviews(
   limit = MAX_RESULT_PREVIEW_LINES,
 ): string[] {
   if (limit <= 0) return [];
-  const parsed = readDeliveryDetails(details);
-  if (!parsed || parsed.results.length === 0) {
-    return firstNonEmptyLines(fallbackContent, limit);
-  }
-
-  const visibleResults = parsed.results.slice(0, limit);
-  const previews = visibleResults.map((result) => {
-    const label = `${statusIcon(result.status)} ${result.worker} — ${result.title} · ${result.status}`;
-    const outcome = outcomePreview(result);
-    return outcome ? `${label}: ${outcome}` : label;
-  });
-
-  if (parsed.results.length > limit && previews.length > 0) {
-    previews[previews.length - 1] = `… ${parsed.results.length - limit + 1} more results`;
-  }
-  return previews;
+  const result = readSettlement(details);
+  const body = result ? outcomeText(result.outcome) : fallbackContent;
+  return firstNonEmptyLines(body, limit);
 }
 
 export function formatWorkerUsage(usage: Partial<WorkerUsage> | undefined): string | undefined {
   if (!usage) return undefined;
-
-  const parts = contextTurnUsageParts(usage);
-  if (isPositiveNumber(usage.input)) parts.push(`↑${formatCompactNumber(usage.input)}`);
-  if (isPositiveNumber(usage.output)) parts.push(`↓${formatCompactNumber(usage.output)}`);
-  if (isPositiveNumber(usage.cacheRead)) parts.push(`R${formatCompactNumber(usage.cacheRead)}`);
-  if (isPositiveNumber(usage.cacheWrite)) parts.push(`W${formatCompactNumber(usage.cacheWrite)}`);
-  if (isPositiveNumber(usage.cost)) parts.push(`$${usage.cost.toFixed(4)}`);
-  return parts.length > 0 ? parts.join(" · ") : undefined;
+  const parts = [
+    `${numberOrZero(usage.turns)}t`,
+    `${formatCompactNumber(numberOrZero(usage.contextTokens))} ctx`,
+    `↑${formatCompactNumber(numberOrZero(usage.input))}`,
+    `↓${formatCompactNumber(numberOrZero(usage.output))}`,
+    `R${formatCompactNumber(numberOrZero(usage.cacheRead))}`,
+    `W${formatCompactNumber(numberOrZero(usage.cacheWrite))}`,
+    `$${numberOrZero(usage.cost).toFixed(4)}`,
+  ];
+  return parts.join(" · ");
 }
 
 export function formatWorkerStatusLine(worker: WorkerRecord): string {
-  const metadata = [
-    worker.worker,
-    workerStateLabel(worker),
-    formatContextCost(worker.usage),
-  ].filter((part): part is string => Boolean(part));
-
-  return `${worker.title} · ${metadata.join(" · ")} · ${worker.id}`;
+  return `${worker.worker} → ${worker.title} · ${workerStateLabel(worker)} · ${formatTurnMarker(worker)} · ${formatCompactNumber(numberOrZero(worker.usage?.contextTokens))} ctx`;
 }
 
 export function formatFooterStatus(snapshot: RuntimeSnapshot): string | undefined {
-  const active = snapshot.workers.filter((worker) => ACTIVE_STATUSES.has(worker.status)).length;
   const ready = snapshot.workers.filter((worker) => worker.status === "ready").length;
-  if (active === 0 && ready === 0) return undefined;
-
-  return `Orchestrate: ${active} active · ${ready} ready`;
+  return ready > 0 ? `${ready} available for follow-up` : undefined;
 }
 
 export class StatusController {
@@ -162,6 +175,9 @@ export class StatusController {
   private refreshGeneration = 0;
   private disposed = false;
   private unsubscribeState: (() => void) | undefined;
+  private widget: WorkerStatusComponent | undefined;
+  private widgetInstalled = false;
+  private pendingSnapshot: RuntimeSnapshot | undefined;
 
   constructor(private readonly runtime: PresentationRuntime) {}
 
@@ -170,9 +186,8 @@ export class StatusController {
     this.clearBinding();
     this.bindingGeneration += 1;
     this.binding = { ownerSessionId, ctx };
-    this.unsubscribeState = this.runtime.subscribeState((changedOwnerSessionId) => {
-      if (changedOwnerSessionId !== this.binding?.ownerSessionId) return;
-      void this.refresh();
+    this.unsubscribeState = this.runtime.subscribeState((changedOwner) => {
+      if (changedOwner === this.binding?.ownerSessionId) void this.refresh();
     });
     void this.refresh();
   }
@@ -187,25 +202,11 @@ export class StatusController {
   async refresh(): Promise<void> {
     const binding = this.binding;
     if (!binding || this.disposed) return;
-
     const bindingGeneration = this.bindingGeneration;
     const refreshGeneration = ++this.refreshGeneration;
     let snapshot: RuntimeSnapshot;
-    try {
-      snapshot = await this.runtime.snapshot(binding.ownerSessionId);
-    } catch {
-      return;
-    }
-
-    if (
-      this.disposed ||
-      this.binding !== binding ||
-      this.bindingGeneration !== bindingGeneration ||
-      this.refreshGeneration !== refreshGeneration
-    ) {
-      return;
-    }
-
+    try { snapshot = await this.runtime.snapshot(binding.ownerSessionId); } catch { return; }
+    if (this.disposed || this.binding !== binding || this.bindingGeneration !== bindingGeneration || this.refreshGeneration !== refreshGeneration) return;
     this.present(binding.ctx, snapshot);
   }
 
@@ -218,33 +219,38 @@ export class StatusController {
   }
 
   private present(ctx: ExtensionContext, snapshot: RuntimeSnapshot): void {
-    const footer = formatFooterStatus(snapshot);
-    ctx.ui.setStatus(ORCHESTRATION_PRESENTATION_KEY, footer);
-
+    ctx.ui.setStatus(ORCHESTRATION_PRESENTATION_KEY, formatFooterStatus(snapshot));
     if (ctx.mode !== "tui") return;
-    if (widgetWorkerCount(snapshot) === 0) {
-      ctx.ui.setWidget(ORCHESTRATION_PRESENTATION_KEY, undefined);
+    const active = activeWorkers(snapshot);
+    this.pendingSnapshot = snapshot;
+    if (active.length === 0) {
+      if (this.widgetInstalled) ctx.ui.setWidget(ORCHESTRATION_PRESENTATION_KEY, undefined);
+      this.widget = undefined;
+      this.widgetInstalled = false;
       return;
     }
-
-    ctx.ui.setWidget(
-      ORCHESTRATION_PRESENTATION_KEY,
-      (_tui, theme) => new WorkerStatusComponent(snapshot, theme),
-      { placement: "aboveEditor" },
-    );
+    if (this.widget) {
+      this.widget.update(snapshot);
+      return;
+    }
+    if (this.widgetInstalled) return;
+    ctx.ui.setWidget(ORCHESTRATION_PRESENTATION_KEY, (tui, theme) => {
+      this.widget = new WorkerStatusComponent(this.pendingSnapshot ?? snapshot, theme, tui);
+      return this.widget;
+    }, { placement: "aboveEditor" });
+    this.widgetInstalled = true;
   }
 
   private clearBinding(): void {
     this.unsubscribeState?.();
     this.unsubscribeState = undefined;
-
+    this.widget = undefined;
+    this.pendingSnapshot = undefined;
     const current = this.binding;
     if (!current) return;
-
     current.ctx.ui.setStatus(ORCHESTRATION_PRESENTATION_KEY, undefined);
-    if (current.ctx.mode === "tui") {
-      current.ctx.ui.setWidget(ORCHESTRATION_PRESENTATION_KEY, undefined);
-    }
+    if (current.ctx.mode === "tui" && this.widgetInstalled) current.ctx.ui.setWidget(ORCHESTRATION_PRESENTATION_KEY, undefined);
+    this.widgetInstalled = false;
     this.binding = undefined;
   }
 }
@@ -253,377 +259,248 @@ export function createStatusController(runtime: PresentationRuntime): StatusCont
   return new StatusController(runtime);
 }
 
-class BoundedLines implements Component {
-  constructor(private readonly lines: readonly string[]) {}
+export class WorkerStatusComponent implements Component {
+  private frameIndex = 0;
+  private snapshot: RuntimeSnapshot;
+  private timer: ReturnType<typeof setInterval> | undefined;
 
-  render(width: number): string[] {
-    const boundedWidth = Math.max(1, width);
-    return this.lines.map((line) => truncateToWidth(line, boundedWidth, "…"));
+  constructor(snapshot: RuntimeSnapshot, private readonly theme: Theme, private readonly tui?: RenderRequester) {
+    this.snapshot = snapshot;
+    this.startTimer();
   }
 
-  invalidate(): void {}
-}
-
-interface WaveGroup {
-  readonly wave: WaveRecord;
-  readonly workers: readonly WorkerRecord[];
-  readonly settled: number;
-}
-
-class WorkerStatusComponent implements Component {
-  constructor(
-    private readonly snapshot: RuntimeSnapshot,
-    private readonly theme: Theme,
-  ) {}
+  update(snapshot: RuntimeSnapshot): void {
+    this.snapshot = snapshot;
+    if (activeWorkers(snapshot).length > 0) this.startTimer();
+    else this.stopTimer();
+    this.tui?.requestRender();
+  }
 
   render(width: number): string[] {
     const boundedWidth = Math.max(1, width);
-    const groups = activeWaveGroups(this.snapshot);
-    const groupedWorkerIds = new Set(groups.flatMap((group) => group.workers.map((worker) => worker.id)));
-    const ready = readyWorkers(this.snapshot).filter((worker) => !groupedWorkerIds.has(worker.id));
-    const totalWorkers = groups.reduce((total, group) => total + group.workers.length, 0) + ready.length;
-    const lines: string[] = [];
-    let remaining = MAX_WIDGET_WORKERS;
-    let shown = 0;
-
-    for (const group of groups) {
-      if (remaining === 0) break;
-      const visibleWorkers = group.workers.slice(0, remaining);
-      if (visibleWorkers.length === 0) continue;
-      lines.push(this.waveHeader(group));
-      for (const worker of visibleWorkers) lines.push(this.workerLine(worker, boundedWidth));
-      shown += visibleWorkers.length;
-      remaining -= visibleWorkers.length;
-    }
-
-    if (remaining > 0) {
-      const visibleReady = ready.slice(0, remaining);
-      if (visibleReady.length > 0) {
-        lines.push(this.theme.fg("toolTitle", this.theme.bold(`Ready · ${ready.length}`)));
-        for (const worker of visibleReady) lines.push(this.workerLine(worker, boundedWidth));
-        shown += visibleReady.length;
-      }
-    }
-
-    if (totalWorkers > shown) {
-      lines.push(this.theme.fg("dim", `… ${totalWorkers - shown} more workers`));
-    }
+    const active = activeWorkers(this.snapshot);
+    if (active.length === 0) return [];
+    const oldest = Math.min(...active.map((worker) => worker.startedAt));
+    const elapsed = formatElapsed(Math.max(0, Date.now() - oldest));
+    const lines = [this.theme.fg("toolTitle", this.theme.bold(`Workers · ${active.length} active · ${elapsed}`))];
+    for (const worker of active.slice(0, MAX_WIDGET_WORKERS)) lines.push(this.workerLine(worker, boundedWidth));
+    if (active.length > MAX_WIDGET_WORKERS) lines.push(this.theme.fg("dim", `… ${active.length - MAX_WIDGET_WORKERS} more active`));
     return lines.map((line) => truncateToWidth(line, boundedWidth, "…"));
   }
 
   invalidate(): void {}
+  dispose(): void { this.stopTimer(); }
+
+  private startTimer(): void {
+    if (this.timer || activeWorkers(this.snapshot).length === 0) return;
+    this.timer = setInterval(() => {
+      this.frameIndex = (this.frameIndex + 1) % ANIMATION_CYCLE_TICKS;
+      this.tui?.requestRender();
+    }, SPINNER_INTERVAL_MS);
+    const timer = this.timer;
+    if (typeof timer === "object" && timer !== null && "unref" in timer && typeof timer.unref === "function") timer.unref();
+  }
 
-  private waveHeader(group: WaveGroup): string {
-    return this.theme.fg(
-      "toolTitle",
-      this.theme.bold(
-        `Wave ${group.wave.id} · ${group.settled}/${group.wave.workerIds.length} settled`,
-      ),
-    );
+  private stopTimer(): void {
+    if (!this.timer) return;
+    clearInterval(this.timer);
+    this.timer = undefined;
   }
 
   private workerLine(worker: WorkerRecord, width: number): string {
-    const state = workerStateLabel(worker);
-    const title = `${statusIcon(worker.status)} ${this.theme.fg("text", this.theme.bold(worker.title))}`;
-    const workerType = this.theme.fg("muted", worker.worker);
-    const activity = this.theme.fg("text", state);
-    const context = isPositiveNumber(worker.usage.contextTokens)
-      ? this.theme.fg("dim", `${formatCompactNumber(worker.usage.contextTokens)} ctx`)
-      : undefined;
-    const cost = isPositiveNumber(worker.usage.cost)
-      ? this.theme.fg("dim", `$${worker.usage.cost.toFixed(4)}`)
-      : undefined;
-    const id = this.theme.fg("muted", String(worker.id));
-    const variants = [
-      [title, workerType, activity, context, cost, id],
-      [title, workerType, activity, context, id],
-      [title, workerType, activity, id],
-      [title, activity, id],
-    ].map((parts) => parts.filter((part): part is string => Boolean(part)).join(" · "));
-    const fitting = variants.find((line) => visibleWidth(line) <= width);
-    if (fitting) return fitting;
-
-    const suffix = ` · ${activity} · ${id}`;
-    const titleWidth = Math.max(1, width - visibleWidth(suffix));
-    if (titleWidth > 1) return `${truncateToWidth(title, titleWidth, "…")}${suffix}`;
-    return truncateToWidth(`${statusIcon(worker.status)} ${id}`, width, "…");
+    const animation = worker.status === "starting"
+      ? WORKER_ANIMATIONS.starting
+      : worker.status === "stopping"
+        ? WORKER_ANIMATIONS.stopping
+        : WORKER_ANIMATIONS.running;
+    const glyph = this.theme.fg(
+      animation.color,
+      animation.frames[this.frameIndex % animation.frames.length] ?? animation.frames[0],
+    );
+    const turns = formatTurnMarker(worker);
+    const context = `${formatContextTokens(numberOrZero(worker.usage?.contextTokens))} ctx`;
+    const suffixFields = width >= 28 ? [turns, context] : width >= 12 ? [turns] : [];
+    const requiredWidth = (fields: readonly string[]) => visibleWidth(`⠋  · ${fields.join(" · ")}`) + 10;
+    const showWorker = width >= 72 && requiredWidth([worker.worker, ...suffixFields]) <= width;
+    const prefix = showWorker ? `${glyph} ${this.theme.fg("muted", worker.worker)} → ` : `${glyph} `;
+    const suffix = suffixFields.length ? ` · ${suffixFields.join(" · ")}` : "";
+    const titleWidth = Math.max(1, width - visibleWidth(prefix) - visibleWidth(suffix));
+    const title = truncateToWidth(this.theme.fg("text", this.theme.bold(worker.title)), titleWidth, "…");
+    return `${prefix}${title}${suffix}`;
   }
 }
 
-function collapsedResultLines(
-  content: string,
-  details: SafeDetails | undefined,
-  theme: Theme,
-): string[] {
-  const waveId = details?.id ?? "unknown wave";
-  const heading = `${theme.fg("toolTitle", theme.bold("Worker results"))} ${theme.fg("dim", `· ${waveId}`)}`;
-  const summary = theme.fg("muted", formatResultStatusSummary(details));
-  const previews = formatResultPreviews(details, content).map((line) => theme.fg("customMessageText", line));
-  const hint = theme.fg("dim", keyHint("app.tools.expand", "to expand results"));
-  return [heading, summary, ...previews, hint];
+class WidthBoundComponent implements Component {
+  constructor(private readonly child: Component, private readonly maxLines?: number) {}
+  render(width: number): string[] {
+    const bounded = Math.max(1, Math.floor(width));
+    const lines = this.child.render(bounded);
+    const selected = this.maxLines === undefined ? lines : lines.slice(0, this.maxLines);
+    return selected.map((line) => truncateToWidth(line, bounded, "…"));
+  }
+  invalidate(): void { this.child.invalidate(); }
+  dispose(): void { (this.child as Component & { dispose?: () => void }).dispose?.(); }
 }
 
-function expandedResult(
-  content: string,
-  details: SafeDetails | undefined,
-  theme: Theme,
-): Component {
-  const container = new Container();
-  const waveId = details?.id ?? "unknown wave";
-  container.addChild(
-    new Text(
-      `${theme.fg("toolTitle", theme.bold("Worker results"))} ${theme.fg("dim", `· ${waveId}`)}`,
-      0,
-      0,
-    ),
-  );
-  container.addChild(new Text(theme.fg("muted", formatResultStatusSummary(details)), 0, 0));
-  container.addChild(new Spacer(1));
-
-  if (!details) {
-    container.addChild(new Markdown(content, 0, 0, getMarkdownTheme()));
-    container.addChild(new Spacer(1));
-    container.addChild(new Text(theme.fg("dim", "Structured worker metadata unavailable"), 0, 0));
-    return container;
-  }
+export class WorkerResultComponent implements Component {
+  private child: Component;
 
-  container.addChild(new Markdown(reconstructOutcomeMarkdown(details), 0, 0, getMarkdownTheme()));
-  container.addChild(new Spacer(1));
-  container.addChild(new Text(theme.fg("toolTitle", theme.bold("Worker details")), 0, 0));
-
-  for (const result of details.results) {
-    const usage = formatWorkerUsage(result.usage) ?? "unavailable";
-    const session = result.sessionFile ?? "unavailable";
-    container.addChild(new Text(theme.fg("text", `${result.worker} — ${result.title}`), 0, 0));
-    container.addChild(
-      new Text(
-        `${theme.fg("muted", "ID")} ${result.workerId} · ${theme.fg("muted", "status")} ${result.status}`,
-        0,
-        0,
-      ),
-    );
-    container.addChild(new Text(theme.fg("dim", `usage ${usage}`), 0, 0));
-    container.addChild(new Text(theme.fg("dim", `session ${session}`), 0, 0));
+  constructor(
+    private readonly content: string,
+    private readonly rawDetails: unknown,
+    private readonly expanded: boolean,
+    private readonly theme: Theme,
+  ) {
+    this.child = this.build();
   }
-  return container;
-}
 
-function readDeliveryDetails(value: unknown): SafeDetails | undefined {
-  if (!isRecord(value) || typeof value.id !== "string" || !Array.isArray(value.results)) {
-    return undefined;
+  render(width: number): string[] { return new WidthBoundComponent(this.child).render(width); }
+  invalidate(): void {
+    (this.child as Component & { dispose?: () => void }).dispose?.();
+    this.child = this.build();
   }
-
-  const results: SafeResult[] = [];
-  for (const candidate of value.results) {
-    if (
-      !isRecord(candidate) ||
-      typeof candidate.workerId !== "string" ||
-      typeof candidate.worker !== "string" ||
-      typeof candidate.title !== "string" ||
-      typeof candidate.status !== "string" ||
-      !KNOWN_RESULT_STATUSES.has(candidate.status) ||
-      !isRecord(candidate.usage)
-    ) {
-      return undefined;
+  dispose(): void { (this.child as Component & { dispose?: () => void }).dispose?.(); }
+
+  private build(): Component {
+    const details = readSettlement(this.rawDetails);
+    const box = new Box(1, 1, (text) => this.theme.bg("customMessageBg", text));
+    if (!details) {
+      box.addChild(new Text(this.theme.fg("warning", this.theme.bold("Worker result details unavailable")), 0, 0));
+      box.addChild(new WidthBoundComponent(new Markdown(this.content, 0, 0, getMarkdownTheme()), this.expanded ? undefined : MAX_RESULT_PREVIEW_LINES));
+      if (!this.expanded) box.addChild(new Text(this.theme.fg("dim", keyHint("app.tools.expand", "to expand")), 0, 0));
+      return box;
     }
 
-    const outcome = readOutcome(candidate.outcome, candidate.status);
-    if (!outcome) return undefined;
-    results.push({
-      workerId: candidate.workerId,
-      worker: candidate.worker,
-      title: candidate.title,
-      status: candidate.status,
-      outcome,
-      usage: candidate.usage as Partial<WorkerUsage>,
-      ...(typeof candidate.sessionFile === "string" ? { sessionFile: candidate.sessionFile } : {}),
-    });
+    const color = details.status === "failed" ? "error" : details.status === "aborted" ? "warning" : "success";
+    const elapsed = elapsedBetween(details.startedAt, details.settledAt);
+    const status = details.status === "aborted"
+      ? " · aborted"
+      : details.status === "failed" && details.failureStage === "startup"
+        ? " · could not start"
+        : "";
+    const header = `${statusIcon(details)} ${details.worker} · ${details.title}${status}${elapsed ? ` · ${elapsed}` : ""}`;
+    const outcome = presentedOutcome(details);
+    box.addChild(new Text(this.theme.fg(color, this.theme.bold(header)), 0, 0));
+    box.addChild(new Spacer(1));
+    if (outcome.heading) {
+      box.addChild(new Text(this.theme.fg("success", this.theme.bold(outcome.heading)), 0, 0));
+      if (outcome.body) box.addChild(new Spacer(1));
+    }
+    if (outcome.body) {
+      box.addChild(new WidthBoundComponent(
+        new Markdown(outcome.body, 0, 0, getMarkdownTheme()),
+        this.expanded ? undefined : MAX_RESULT_PREVIEW_LINES,
+      ));
+    }
+    if (!this.expanded) {
+      box.addChild(new Spacer(1));
+      box.addChild(new Text(this.theme.fg("dim", keyHint("app.tools.expand", "to expand")), 0, 0));
+      return box;
+    }
+    box.addChild(new Spacer(1));
+    box.addChild(new Text(this.theme.fg("toolTitle", this.theme.bold("Worker details")), 0, 0));
+    for (const line of settlementMetadata(details)) box.addChild(new Text(this.theme.fg("dim", line), 0, 0));
+    return box;
   }
-  return { id: value.id, results };
 }
 
-function messageText(content: unknown): string {
-  if (typeof content === "string") return content;
-  if (!Array.isArray(content)) return "";
-
-  return content.flatMap((part) => {
-    if (isRecord(part) && part.type === "text" && typeof part.text === "string") {
-      return [part.text];
-    }
-    return [];
-  }).join("\n");
+function readSettlement(value: unknown): SafeSettlement | undefined {
+  const envelope = isRecord(value) && isRecord(value.settlement) ? value : { settlement: value };
+  const decoded = decodeSettlementEnvelope(envelope);
+  return Result.isSuccess(decoded) ? decoded.success.settlement : undefined;
 }
 
-function outcomePreview(result: SafeResult): string | undefined {
-  const outcome = result.outcome;
-  const assistantText = "assistantText" in outcome
-    ? firstNonEmptyLines(outcome.assistantText ?? "", 1)[0]
-    : undefined;
-  const message = "message" in outcome ? outcome.message?.trim() : undefined;
-  if (result.status === "failed") return message;
-  if (result.status === "aborted") return message;
-  return assistantText;
+function statusHeading(result: SafeSettlement): string {
+  if (result.status === "failed") return result.failureStage === "startup" ? "could not start" : "failed";
+  if (result.status === "aborted") return "aborted";
+  if (result.status === "ready") return "response complete";
+  return "completed";
 }
 
-function reconstructOutcomeMarkdown(details: SafeDetails): string {
-  return details.results.map((result) => {
-    const heading = `### ${result.worker} — ${result.title}`;
-    const outcome = renderOutcomeMarkdown(result.outcome);
-    return outcome ? `${heading}\n\n${outcome}` : heading;
-  }).join("\n\n");
+function statusIcon(result: SafeSettlement): string {
+  if (result.status === "failed") return "✗";
+  if (result.status === "aborted") return "■";
+  return "✓";
 }
 
-function renderOutcomeMarkdown(outcome: WorkerOutcome): string {
-  switch (outcome.status) {
-    case "completed":
-    case "ready":
-      return outcome.assistantText;
-    case "failed":
-      return outcome.assistantText
-        ? `Failed: ${outcome.message}\n\n${outcome.assistantText}`
-        : `Failed: ${outcome.message}`;
-    case "aborted": {
-      const reason = outcome.message ? `Aborted: ${outcome.message}` : "Aborted";
-      return outcome.assistantText ? `${reason}\n\n${outcome.assistantText}` : reason;
-    }
-    case "closed":
-      return "Closed";
-  }
+function outcomeText(outcome: WorkerOutcome): string {
+  if (outcome.status === "completed" || outcome.status === "ready") return outcome.assistantText;
+  if (outcome.status === "failed") return outcome.assistantText ? `${outcome.message}\n\n${outcome.assistantText}` : outcome.message;
+  if (outcome.status === "aborted") return [outcome.message || "Worker was aborted.", outcome.assistantText].filter(Boolean).join("\n\n");
+  return "Worker session closed.";
 }
 
-function readOutcome(value: unknown, status: string): WorkerOutcome | undefined {
-  if (!isRecord(value) || value.status !== status) return undefined;
-  if (status === "completed" || status === "ready") {
-    return typeof value.assistantText === "string"
-      ? { status, assistantText: value.assistantText }
-      : undefined;
-  }
-  if (status === "failed") {
-    if (typeof value.message !== "string") return undefined;
-    return {
-      status: "failed",
-      message: value.message,
-      ...(typeof value.assistantText === "string" ? { assistantText: value.assistantText } : {}),
-    };
-  }
-  if (status === "aborted") {
-    return {
-      status: "aborted",
-      ...(typeof value.message === "string" ? { message: value.message } : {}),
-      ...(typeof value.assistantText === "string" ? { assistantText: value.assistantText } : {}),
-    };
-  }
-  if (status === "closed") return { status: "closed" };
-  return undefined;
-}
+function presentedOutcome(result: SafeSettlement): { heading?: string; body: string } {
+  const body = outcomeText(result.outcome);
+  if (result.status !== "completed" && result.status !== "ready") return { body };
 
-function firstNonEmptyLines(text: string, limit: number): string[] {
-  const lines: string[] = [];
-  let start = 0;
-  for (let index = 0; index <= text.length && lines.length < limit; index += 1) {
-    if (index !== text.length && text[index] !== "\n") continue;
-    const line = text.slice(start, index).replace(/\r$/, "").trim();
-    if (line) lines.push(line);
-    start = index + 1;
+  const lines = body.split("\n");
+  const headingIndex = lines.findIndex((line) => line.trim() !== "");
+  if (headingIndex < 0 || !/^#{1,6}\s+(?:completed|complete|done)\s*#*\s*$/i.test(lines[headingIndex]!)) {
+    return { body };
   }
-  return lines;
-}
 
-function activeWaveGroups(snapshot: RuntimeSnapshot): WaveGroup[] {
-  const workersById = new Map(snapshot.workers.map((worker) => [worker.id, worker]));
-  return snapshot.waves.flatMap((wave) => {
-    if (wave.state !== "running") return [];
-    const workers = wave.workerIds.flatMap((workerId) => {
-      const worker = workersById.get(workerId);
-      return worker?.waveId === wave.id ? [worker] : [];
-    });
-    const settled = workers.filter((worker) => isWorkerCompleteForWave(worker.status)).length;
-    return [{ wave, workers, settled }];
-  });
+  lines.splice(headingIndex, 1);
+  while (lines[headingIndex]?.trim() === "") lines.splice(headingIndex, 1);
+  return {
+    heading: result.status === "ready" ? "✓ Response complete" : "✓ Completed",
+    body: lines.join("\n").trimEnd(),
+  };
 }
 
-function readyWorkers(snapshot: RuntimeSnapshot): WorkerRecord[] {
-  return snapshot.workers.filter((worker) => worker.status === "ready");
+function settlementMetadata(result: SafeSettlement): string[] {
+  return [
+    `worker ID ${result.workerId} · wave ID ${result.waveId}`,
+    `status ${result.status} · generation ${result.generation}`,
+    `turns ${numberOrZero(result.usage.turns)} · current context ${formatCompactNumber(numberOrZero(result.usage.contextTokens))}`,
+    `input ${numberOrZero(result.usage.input)} · output ${numberOrZero(result.usage.output)} · cache read ${numberOrZero(result.usage.cacheRead)} · cache write ${numberOrZero(result.usage.cacheWrite)} · cost $${numberOrZero(result.usage.cost).toFixed(4)}`,
+    `session ${result.sessionFile ?? "unavailable"}`,
+  ];
 }
 
-function widgetWorkerCount(snapshot: RuntimeSnapshot): number {
-  const groups = activeWaveGroups(snapshot);
-  const groupedWorkerIds = new Set(groups.flatMap((group) => group.workers.map((worker) => worker.id)));
-  return groups.reduce((total, group) => total + group.workers.length, 0) +
-    readyWorkers(snapshot).filter((worker) => !groupedWorkerIds.has(worker.id)).length;
+function messageText(content: unknown): string {
+  if (typeof content === "string") return content;
+  if (!Array.isArray(content)) return "";
+  return content.flatMap((part) => isRecord(part) && part.type === "text" && typeof part.text === "string" ? [part.text] : []).join("\n");
 }
 
-const TOOL_ACTIVITY: Readonly<Record<string, string>> = {
-  read: "reading",
-  grep: "searching",
-  find: "finding files",
-  ls: "listing",
-  bash: "running command",
-  edit: "editing",
-  write: "writing",
-};
+function activeWorkers(snapshot: RuntimeSnapshot): WorkerRecord[] {
+  return snapshot.workers.filter((worker) => ACTIVE_STATUSES.has(worker.status));
+}
 
+const TOOL_ACTIVITY: Readonly<Record<string, string>> = { read: "reading", grep: "searching", find: "finding files", ls: "listing", bash: "running command", edit: "editing", write: "writing" };
 function workerStateLabel(worker: Pick<WorkerRecord, "status" | "activity">): string {
   if (worker.status === "starting" || worker.status === "stopping") return worker.status;
   if (worker.status !== "running") return worker.status;
-  if (!worker.activity?.trim()) return "thinking";
+  if (!worker.activity?.trim()) return "working";
   return TOOL_ACTIVITY[worker.activity] ?? worker.activity;
 }
 
-function formatContextCost(usage: Partial<WorkerUsage> | undefined): string | undefined {
-  if (!usage) return undefined;
-  const parts: string[] = [];
-  if (isPositiveNumber(usage.contextTokens)) parts.push(`${formatCompactNumber(usage.contextTokens)} ctx`);
-  if (isPositiveNumber(usage.cost)) parts.push(`$${usage.cost.toFixed(4)}`);
-  return parts.length > 0 ? parts.join(" · ") : undefined;
+function formatTurnMarker(worker: Pick<WorkerRecord, "messageDirection" | "usage">): string {
+  const direction = worker.messageDirection === "from-model" ? "↓" : "↑";
+  return `${numberOrZero(worker.usage?.turns)}${direction}`;
 }
-
-function contextTurnUsageParts(usage: Partial<WorkerUsage>): string[] {
-  const parts: string[] = [];
-  if (isPositiveNumber(usage.contextTokens)) parts.push(`${formatCompactNumber(usage.contextTokens)} ctx`);
-  if (isPositiveNumber(usage.turns)) {
-    parts.push(`${usage.turns} ${usage.turns === 1 ? "turn" : "turns"}`);
-  }
-  return parts;
+function elapsedBetween(start?: number, end?: number): string | undefined {
+  return start !== undefined && end !== undefined && end >= start ? formatElapsed(end - start) : undefined;
+}
+function formatElapsed(milliseconds: number): string {
+  const seconds = Math.floor(milliseconds / 1000);
+  if (seconds < 60) return `${seconds}s`;
+  const minutes = Math.floor(seconds / 60);
+  return seconds % 60 === 0 ? `${minutes}m` : `${minutes}m ${seconds % 60}s`;
+}
+function firstNonEmptyLines(text: string, limit: number): string[] {
+  return text.split(/\r?\n/).map((line) => line.trim()).filter(Boolean).slice(0, limit);
+}
+function numberOrZero(value: unknown): number { return typeof value === "number" && Number.isFinite(value) && value >= 0 ? value : 0; }
+function formatContextTokens(value: number): string {
+  if (value < 1_000) return String(Math.round(value));
+  return `${Math.round(value / 1_000)}k`;
 }
-
 function formatCompactNumber(value: number): string {
   if (value >= 1_000_000) return `${trimDecimal(value / 1_000_000)}m`;
   if (value >= 1_000) return `${trimDecimal(value / 1_000)}k`;
   return String(Math.round(value));
 }
-
-function trimDecimal(value: number): string {
-  return value.toFixed(1).replace(/\.0$/, "");
-}
-
-function statusIcon(status: string): string {
-  switch (status) {
-    case "starting":
-      return "◌";
-    case "running":
-      return "●";
-    case "stopping":
-      return "◍";
-    case "ready":
-      return "○";
-    case "completed":
-      return "✓";
-    case "failed":
-      return "✗";
-    case "aborted":
-      return "■";
-    case "closed":
-      return "×";
-    default:
-      return "·";
-  }
-}
-
-function isPositiveNumber(value: unknown): value is number {
-  return typeof value === "number" && Number.isFinite(value) && value > 0;
-}
-
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return typeof value === "object" && value !== null;
-}
+function trimDecimal(value: number): string { return value.toFixed(1).replace(/\.0$/, ""); }
+function isRecord(value: unknown): value is Record<string, unknown> { return typeof value === "object" && value !== null; }