pi-crew 0.10.1 → 0.10.2

package/src/ui/widget/task-list.ts

@@ -0,0 +1,198 @@
+/**
+ * task-list.ts — the run's plan, painted above the editor (pi-tasks /
+ * Claude Code style): a `● N tasks (…)` header, then one row per task in
+ * PLAN ORDER with task numbers (#1, #2, …) instead of technical ids.
+ * Completed rows are dimmed and struck through; the task actively executing
+ * carries a spinner frame with elapsed time and token counts; queued rows
+ * name the dependencies they wait on.
+ *
+ * Example:
+ * ```
+ * ● 4 tasks (1 done, 1 in progress, 2 open)
+ *   ✔ #1 Design the flux capacitor
+ *   ⠙ #2 Wire the overlay scroll (2m 49s · ↑ 4.1k ↓ 1.2k)
+ *   ◻ #3 Run the suite › blocked by #2
+ *   ◻ #4 Report the result
+ * ```
+ *
+ * Pure plan surface: which worker/agent/model runs a task is the dock's
+ * story below the editor, never the plan's. Pure display — the interactive
+ * surface stays that dock. Rows come from the run snapshot's `tasks` slice
+ * (plan order), so the list repaints on task transitions only; the running
+ * row's spinner/elapsed/token suffix rides the render signature's spinner
+ * bucket while any worker is alive.
+ */
+
+import type { TeamTaskState } from "../../state/types.ts";
+import { truncate } from "../../utils/visual.ts";
+import { spinnerFrame } from "../spinner.ts";
+import { shortRunLabel } from "./widget-model.ts";
+import type { WidgetRun } from "./widget-types.ts";
+
+/** Task rows painted before the "… and N more" overflow line (pi-tasks
+ *  defaults its `maxVisible` to 10). */
+const MAX_TASK_ROWS = 10;
+
+const ACTIVE_TASK_STATUSES = new Set(["running", "queued", "waiting", "needs_attention"]);
+
+// pi-tasks-style strikethrough + dim for completed rows: raw SGR because the
+// theme adapter has no strike; the truncate/colorize paths are ANSI-aware.
+const DIM_ON = "\x1b[2m";
+const DIM_OFF = "\x1b[22m";
+const STRIKE_ON = "\x1b[9m";
+const STRIKE_OFF = "\x1b[29m";
+
+function isDoneStatus(status: string): boolean {
+	return status === "completed" || status === "failed" || status === "cancelled" || status === "skipped";
+}
+
+function taskTitle(task: TeamTaskState): string {
+	return (task.displayName ?? task.title ?? "").replace(/\s+/g, " ").trim();
+}
+
+/** pi-tasks status glyph per row: ✔ done (struck through), spinner for the
+ *  actively executing task, ◼ parked/needs input, ◻ queued, ✗ dead. */
+function taskStatusIcon(task: TeamTaskState): string {
+	switch (task.status) {
+		case "running":
+			return spinnerFrame("crew-task-list");
+		case "queued":
+			return "◻";
+		case "waiting":
+		case "needs_attention":
+			return "◼";
+		case "completed":
+			return "✔";
+		case "failed":
+		case "cancelled":
+		case "skipped":
+			return "✗";
+		default:
+			return "?";
+	}
+}
+
+/** `45s` / `2m 49s` / `1h 03m`. */
+function formatDuration(ms: number): string {
+	if (!Number.isFinite(ms) || ms < 0) return "";
+	const totalSeconds = Math.floor(ms / 1000);
+	if (totalSeconds < 60) return `${totalSeconds}s`;
+	const minutes = Math.floor(totalSeconds / 60);
+	if (minutes < 60) return `${minutes}m ${String(totalSeconds % 60).padStart(2, "0")}s`;
+	const hours = Math.floor(minutes / 60);
+	return `${hours}h ${String(minutes % 60).padStart(2, "0")}m`;
+}
+
+/** `4.1k` / `1.2M` / `918` — no unit suffix; the arrow pair carries it. */
+function compactTokens(count: number): string {
+	if (typeof count !== "number" || !Number.isFinite(count) || count <= 0) return "";
+	if (count >= 1_000_000) return `${(count / 1_000_000).toFixed(1)}M`;
+	if (count >= 1_000) return `${(count / 1_000).toFixed(1)}k`;
+	return `${count}`;
+}
+
+/** `(2m 49s · ↑ 4.1k ↓ 1.2k)` — elapsed plus tokens, pi-tasks style. Live
+ *  totals come from agentProgress until the final usage lands. */
+function runningSuffix(task: TeamTaskState): string {
+	const parts: string[] = [];
+	const start = Date.parse(task.startedAt ?? "");
+	if (Number.isFinite(start) && start > 0) {
+		const end = task.finishedAt ? Date.parse(task.finishedAt) : Date.now();
+		const elapsed = formatDuration(end - start);
+		if (elapsed) parts.push(elapsed);
+	}
+	const input = task.usage?.input ?? 0;
+	const output = task.usage?.output ?? 0;
+	if (input > 0 || output > 0) {
+		parts.push(`↑ ${compactTokens(input) || "0"} ↓ ${compactTokens(output) || "0"}`);
+	} else {
+		const live = compactTokens(task.agentProgress?.tokens ?? 0);
+		if (live) parts.push(live);
+	}
+	return parts.length ? ` (${parts.join(" · ")})` : "";
+}
+
+/** `› blocked by #2, #3` for queued tasks — open (non-completed)
+ *  dependencies only, named by task number (pi-tasks display rule). */
+function blockedSuffix(task: TeamTaskState, tasks: readonly TeamTaskState[], numberById: Map<string, number>): string {
+	if (task.status !== "queued") return "";
+	const openDeps = (task.dependsOn ?? [])
+		.map((depId) => tasks.find((entry) => entry.id === depId))
+		.filter((dep): dep is TeamTaskState => dep !== undefined && dep.status !== "completed");
+	if (openDeps.length === 0) return "";
+	const labels = openDeps.map((dep) => `#${numberById.get(dep.id) ?? "?"}`);
+	return ` › blocked by ${labels.join(", ")}`;
+}
+
+/** One line per task: `#n title` behind its status glyph — pi-tasks style.
+ *  Completed titles are dimmed and struck through. */
+function taskRow(
+	task: TeamTaskState,
+	taskNumber: number,
+	tasks: readonly TeamTaskState[],
+	numberById: Map<string, number>,
+	width: number,
+): string {
+	const title = taskTitle(task);
+	const suffix = task.status === "running" ? runningSuffix(task) : blockedSuffix(task, tasks, numberById);
+	if (task.status === "completed") {
+		const struck = `${STRIKE_ON}${DIM_ON}#${taskNumber} ${title}${DIM_OFF}${STRIKE_OFF}`;
+		return truncate(`  ✔ ${struck}`.trimEnd(), width);
+	}
+	return truncate(`  ${taskStatusIcon(task)} #${taskNumber} ${title}${suffix}`.trimEnd(), width);
+}
+
+/** The run whose plan is shown: the first with unfinished work, else the first. */
+function primaryRun(runs: readonly WidgetRun[]): WidgetRun | undefined {
+	return runs.find((entry) => (entry.snapshot?.tasks ?? []).some((task) => ACTIVE_TASK_STATUSES.has(task.status))) ?? runs[0];
+}
+
+/** Which rows fit the cap: plan order, but never drop an unfinished task —
+ *  if active work falls outside the first MAX_TASK_ROWS rows it stays and
+ *  finished rows give way instead. */
+function visibleTasks(tasks: readonly TeamTaskState[]): TeamTaskState[] {
+	if (tasks.length <= MAX_TASK_ROWS) return [...tasks];
+	const active = tasks.filter((task) => ACTIVE_TASK_STATUSES.has(task.status));
+	if (active.length >= MAX_TASK_ROWS) return active.slice(0, MAX_TASK_ROWS);
+	const keep = new Set(active.map((task) => task.id));
+	for (const task of tasks) {
+		if (keep.size >= MAX_TASK_ROWS) break;
+		keep.add(task.id);
+	}
+	return tasks.filter((task) => keep.has(task.id));
+}
+
+/**
+ * Build the task-list lines for the current runs. Empty when no run carries a
+ * tasks slice (nothing to say — the dock alone stays).
+ */
+export function buildTaskListLines(runs: readonly WidgetRun[], width: number): string[] {
+	const entry = primaryRun(runs);
+	if (!entry) return [];
+	const tasks = entry.snapshot?.tasks ?? [];
+	if (tasks.length === 0) return [];
+
+	const numberById = new Map(tasks.map((task, index) => [task.id, index + 1]));
+	const done = tasks.filter((task) => task.status === "completed").length;
+	const dead = tasks.filter((task) => isDoneStatus(task.status) && task.status !== "completed").length;
+	const inProgress = tasks.filter(
+		(task) => task.status === "running" || task.status === "waiting" || task.status === "needs_attention",
+	).length;
+	const open = tasks.filter((task) => task.status === "queued").length;
+
+	const counts = [`${done} done`];
+	if (dead) counts.push(`${dead} failed`);
+	counts.push(`${inProgress} in progress`, `${open} open`);
+	const headerParts = [`● ${tasks.length} tasks (${counts.join(", ")})`];
+	if (runs.length > 1) headerParts.push(shortRunLabel(entry.run));
+	const lines = [truncate(headerParts.join(" · "), width)];
+
+	const visible = visibleTasks(tasks);
+	for (const task of visible) {
+		lines.push(taskRow(task, numberById.get(task.id) ?? 0, tasks, numberById, width));
+	}
+	if (tasks.length > visible.length) {
+		lines.push(truncate(`  … and ${tasks.length - visible.length} more`, width));
+	}
+	return lines;
+}

package/src/ui/widget/widget-formatters.ts

@@ -7,7 +7,7 @@
 import type { CrewAgentRecord } from "../../runtime/crew-agent-runtime.ts";
 import type { LiveAgentHandle } from "../../runtime/live-session/live-agent-manager.ts";
 import { getTaskUsage } from "../../runtime/usage-tracker.ts";
-import { visibleWidth } from "../../utils/visual.ts";
+import { truncateToWidth, visibleWidth } from "../../utils/visual.ts";
 import { computeLiveDurationMs } from "../live-duration.ts";
 
 // ── No-color mode (UI-10) ─────────────────────────────────────────────
@@ -75,6 +75,7 @@ const TOKENS_METRIC_WIDTH = 10; // "1.2k tok", "12.3M tok"
 const TPS_METRIC_WIDTH = 9; // "411 tok/s"
 const CTX_METRIC_WIDTH = 7; // "100% ctx"
 const DURATION_METRIC_WIDTH = 6; // "120.0s"
+const COST_METRIC_WIDTH = 9; // "$0.001234"
 
 function alignMetric(value: string, width: number): string {
 	const pad = Math.max(0, width - visibleWidth(value));
@@ -82,6 +83,11 @@ function alignMetric(value: string, width: number): string {
 }
 
 export function formatTokensCompact(count: number): string {
+	// Display-layer guard: state records have at least once carried the
+	// literal "***" in a numeric field (redaction false-positive, fixed at
+	// the source). A string here would print `*** tok` verbatim, so non-
+	// numeric/undefined input renders as an empty metric instead.
+	if (typeof count !== "number" || !Number.isFinite(count)) return "";
 	if (count >= 1_000_000) return `${(count / 1_000_000).toFixed(1)}M tok`;
 	if (count >= 1_000) return `${(count / 1_000).toFixed(1)}k tok`;
 	return `${count} tok`;
@@ -99,6 +105,13 @@ export function elapsed(iso: string | undefined, now = Date.now()): string | und
 	return `${Math.floor(ms / 3_600_000)}h`;
 }
 
+/** pi-subtask's always-on elapsed tail: `0s` from the start (its fork rows
+ *  flatten sub-second ages to 0 — not the legacy widget's "now"). */
+export function dockElapsed(iso: string | undefined, now = Date.now()): string {
+	const value = elapsed(iso, now);
+	return value === undefined ? "" : value === "now" ? "0s" : value;
+}
+
 // ── Agent activity description ────────────────────────────────────────
 
 const TOOL_LABELS: Record<string, string> = {
@@ -176,6 +189,218 @@ export function agentActivity(agent: CrewAgentRecord, liveHandle?: LiveAgentHand
 	return "done";
 }
 
+// ── Per-agent cost ────────────────────────────────────────────────────
+
+/**
+ * Compact per-agent spend for widget rows, or "" when there is nothing to
+ * show. `formatCost`'s 6-decimal sub-cent output (`$0.001000`) wastes a third
+ * of a one-line row, so the widget uses a short form: cent precision in
+ * dollars, milli-precision below, and a `< $0.001` floor.
+ */
+export function formatCostCompact(cost: number): string {
+	if (cost >= 1) return `$${cost.toFixed(2)}`;
+	if (cost >= 0.01) return `$${cost.toFixed(3).replace(/0+$/, "").replace(/\.$/, "")}`;
+	if (cost >= 0.001) return `$${cost.toFixed(4).replace(/0+$/, "").replace(/\.$/, "")}`;
+	return "< $0.001";
+}
+
+/**
+ * Formatted per-agent spend, or "" when there is nothing to show. The value
+ * already lives on the durable task record and the dashboard agents pane has
+ * shown it since Round 17; the widget omitted it only by oversight.
+ */
+export function agentCost(agent: CrewAgentRecord): string {
+	const cost = agent.usage?.cost;
+	if (typeof cost !== "number" || !Number.isFinite(cost) || cost <= 0) return "";
+	return formatCostCompact(cost);
+}
+
+// ── pi-subtask dock formatters ─────────────────────────────────────────
+
+/**
+ * pi-subtask's FIXED per-status glyphs (`statusIcon` in source/pi-subtask:
+ * starting ○, running ✻, done ✓, failed ✗, stopped ■). The compact dock
+ * deliberately does NOT spin the running marker like the legacy widget —
+ * the row set is stable across ticks, which is what makes the keyboard
+ * cursor feel anchored.
+ */
+export function dockStatusIcon(status: string): string {
+	switch (status) {
+		case "running":
+			return "✻";
+		case "queued":
+		case "waiting":
+			return "○";
+		case "completed":
+			return "✓";
+		case "failed":
+			return "✗";
+		case "needs_attention":
+			return "⚠";
+		case "cancelled":
+		case "stopped":
+			return "■";
+		default:
+			return "?";
+	}
+}
+
+/** pi-subtask uses the status word as a finished row's activity. */
+export function dockStatusLabel(status: string): string {
+	switch (status) {
+		case "completed":
+			return "done";
+		case "failed":
+			return "failed";
+		case "cancelled":
+		case "stopped":
+			return "stopped";
+		case "needs_attention":
+			return "needs attention";
+		case "queued":
+			return "queued";
+		case "waiting":
+			return "waiting";
+		default:
+			return status;
+	}
+}
+
+/** pi-subtask's formatTokens: raw under 1k, `Nk` under 1M, `N.M` above. */
+export function tokenCountShort(count: number): string {
+	if (count < 1_000) return `${count}`;
+	if (count < 1_000_000) return `${Math.round(count / 1_000)}k`;
+	return `${(count / 1_000_000).toFixed(1)}M`;
+}
+
+export interface DockUsageOptions {
+	/** While the agent's pane is open: add tok/s + context % like pi-subtask. */
+	viewed?: boolean;
+	/** Model context window for the `P% / N` gauge; omitted when unknown. */
+	contextWindow?: number;
+}
+
+/**
+ * pi-subtask's footer-style usage (formatUsage): `↑in ↓out Rcache CH% $cost`,
+ * plus `N tok/s` and `P% / window` while viewed. Live agents have split
+ * input/output/cacheWrite via the usage tracker; non-live ones show the
+ * durable token total + cost.
+ */
+export function dockUsageText(agent: CrewAgentRecord, liveHandle?: LiveAgentHandle, options: DockUsageOptions = {}): string {
+	const parts: string[] = [];
+	if (liveHandle) {
+		const usage = getTaskUsage(liveHandle.taskId);
+		const input = usage.input ?? 0;
+		const output = usage.output ?? 0;
+		const cacheWrite = usage.cacheWrite ?? 0;
+		if (input > 0) parts.push(`↑${tokenCountShort(input)}`);
+		if (output > 0) parts.push(`↓${tokenCountShort(output)}`);
+		if (cacheWrite > 0) parts.push(`R${tokenCountShort(cacheWrite)}`);
+		const promptTokens = input + cacheWrite;
+		if (cacheWrite > 0 && promptTokens > 0) {
+			parts.push(`CH${((cacheWrite / promptTokens) * 100).toFixed(1)}%`);
+		}
+		const cost = agent.usage?.cost;
+		if (typeof cost === "number" && Number.isFinite(cost) && cost > 0) parts.push(`$${cost.toFixed(4)}`);
+		if (options.viewed) {
+			const act = liveHandle.activity;
+			const ms = computeLiveDurationMs(act);
+			const totalTokens = input + output + cacheWrite;
+			if (totalTokens > 0 && ms > 1000) {
+				const tps = Math.round(totalTokens / (ms / 1000));
+				if (tps > 0) parts.push(`${tps} tok/s`);
+			}
+			try {
+				const ctxPct = liveHandle.session.getSessionStats?.()?.contextUsage?.percent;
+				if (ctxPct != null) {
+					const window =
+						options.contextWindow && options.contextWindow >= 1_000_000
+							? `${(options.contextWindow / 1_000_000).toFixed(1)}M`
+							: options.contextWindow
+								? tokenCountShort(options.contextWindow)
+								: "";
+					parts.push(`${Math.round(ctxPct)}%${window ? ` / ${window}` : ""}`);
+				}
+			} catch {
+				/* ignore */
+			}
+		}
+		return parts.join(" ");
+	}
+	const tokens = agent.progress?.tokens;
+	const tokenCount = typeof tokens === "number" && Number.isFinite(tokens) && tokens > 0 ? tokens : 0;
+	if (tokenCount > 0) parts.push(`${tokenCountShort(tokenCount)} tok`);
+	const cost = agent.usage?.cost;
+	if (typeof cost === "number" && Number.isFinite(cost) && cost > 0) parts.push(`$${cost.toFixed(4)}`);
+	return parts.join(" ");
+}
+
+// ── Adaptive single-line row ───────────────────────────────────────────
+
+export interface BudgetedRowParts {
+	/** Marker + glyph prefix; never trimmed. */
+	lead: string;
+	/** Agent label; grows into whatever the activity leaves over. */
+	name: string;
+	/** Current activity; shrinks first but keeps a readable floor. */
+	activity: string;
+	/** Metrics tail; never trimmed, so numbers stay comparable across ticks. */
+	suffix: string;
+	separator?: string;
+}
+
+/** Smallest activity/name slice still worth showing before we drop the field. */
+const MIN_FIELD_WIDTH = 12;
+
+/**
+ * Assemble one row that fills `width` without wrapping.
+ *
+ * `lead` and `suffix` are fixed costs; the remaining budget is split between
+ * `name` and `activity`. The activity absorbs the trimming first (it changes
+ * every tick anyway) but keeps a MIN_FIELD_WIDTH floor, and the name expands
+ * into the rest up to its natural length — so a 200-column terminal shows the
+ * full description instead of the same clip an 80-column one gets.
+ *
+ * The closing truncate is a hard guard, not an optimisation: pi's renderer
+ * throws on a line wider than the terminal.
+ */
+export function budgetedRow(parts: BudgetedRowParts, width: number): string {
+	const sep = parts.separator ?? " · ";
+	const { lead, suffix } = parts;
+	const name = parts.name.replace(/\s+/g, " ").trim();
+	const activity = parts.activity.replace(/\s+/g, " ").trim();
+	if (!name && !activity) return truncateToWidth(lead + suffix, width);
+	if (!activity) return fitNameOnly(lead, name, suffix, width);
+	if (!name) return fitNameOnly(lead, activity, suffix, width);
+
+	const budget = width - visibleWidth(lead) - visibleWidth(suffix) - visibleWidth(sep);
+	// Too narrow to hold name + activity above their floors: keep the name
+	// only, and never let the metrics tail eat the clipping.
+	if (budget < MIN_FIELD_WIDTH * 2) return fitNameOnly(lead, name, suffix, width);
+
+	const nameNatural = visibleWidth(name);
+	const activityNatural = visibleWidth(activity);
+	const activityRoom = Math.min(activityNatural, Math.max(MIN_FIELD_WIDTH, budget - nameNatural));
+	const nameRoom = Math.max(MIN_FIELD_WIDTH, budget - activityRoom);
+	const assembled = lead + truncateToWidth(name, nameRoom) + sep + truncateToWidth(activity, activityRoom) + suffix;
+	// The room arithmetic keeps this ≤ width by construction (nameRoom +
+	// activityRoom ≤ budget in every branch); this guard is the last line of
+	// defense because pi's renderer throws on over-width lines.
+	if (visibleWidth(assembled) <= width) return assembled;
+	return fitNameOnly(lead, name, suffix, width);
+}
+
+/**
+ * Narrow-terminal fallback: fixed lead + suffix, the name absorbs every
+ * remaining column. The metrics tail is sacred — it must stay comparable
+ * across ticks — so clipping always happens in the middle fields.
+ */
+function fitNameOnly(lead: string, name: string, suffix: string, width: number): string {
+	const fixed = visibleWidth(lead) + visibleWidth(suffix);
+	if (fixed >= width) return truncateToWidth(lead + suffix, width);
+	return lead + truncateToWidth(name, width - fixed) + suffix;
+}
+
 // ── Agent stats line ──────────────────────────────────────────────────
 
 export function agentStats(agent: CrewAgentRecord, liveHandle?: LiveAgentHandle): string {
@@ -186,6 +411,10 @@ export function agentStats(agent: CrewAgentRecord, liveHandle?: LiveAgentHandle)
 		const usage = getTaskUsage(liveHandle.taskId);
 		const total = (usage.input ?? 0) + (usage.output ?? 0) + (usage.cacheWrite ?? 0);
 		if (total > 0) parts.push(alignMetric(formatTokensCompact(total), TOKENS_METRIC_WIDTH));
+		// The live usage tracker carries tokens only (LifetimeUsage has no cost
+		// field), so cost always comes off the durable task record.
+		const liveCost = agentCost(agent);
+		if (liveCost) parts.push(alignMetric(liveCost, COST_METRIC_WIDTH));
 		try {
 			const stats = liveHandle.session.getSessionStats?.();
 			const ctxPct = stats?.contextUsage?.percent;
@@ -200,11 +429,18 @@ export function agentStats(agent: CrewAgentRecord, liveHandle?: LiveAgentHandle)
 		}
 		parts.push(alignMetric(`${(ms / 1000).toFixed(1)}s`, DURATION_METRIC_WIDTH));
 	} else {
+		// Type-narrowed: state has carried the literal "***" (redaction
+		// false-positive) in progress.tokens, which is truthy but not a count.
+		// Only real numbers produce metrics; formatTokensCompact guards too.
+		const tokens = agent.progress?.tokens;
+		const tokenCount = typeof tokens === "number" ? tokens : undefined;
 		if (agent.toolUses) parts.push(alignMetric(`${agent.toolUses} tools`, TOOLS_METRIC_WIDTH));
-		if (agent.progress?.tokens) parts.push(alignMetric(formatTokensCompact(agent.progress.tokens), TOKENS_METRIC_WIDTH));
+		if (tokenCount && tokenCount > 0) parts.push(alignMetric(formatTokensCompact(tokenCount), TOKENS_METRIC_WIDTH));
+		const cost = agentCost(agent);
+		if (cost) parts.push(alignMetric(cost, COST_METRIC_WIDTH));
 		const ageMs = agent.startedAt ? Math.max(0, Date.now() - new Date(agent.startedAt).getTime()) : 0;
-		if (agent.progress?.tokens && ageMs > 1000) {
-			const tps = Math.round(agent.progress.tokens / (ageMs / 1000));
+		if (tokenCount && tokenCount > 0 && ageMs > 1000) {
+			const tps = Math.round(tokenCount / (ageMs / 1000));
 			if (tps > 0) parts.push(alignMetric(`${formatTokensCompact(tps)}/s`, TPS_METRIC_WIDTH));
 		}
 		const age = elapsed(agent.completedAt ?? agent.startedAt);