pi-crew 0.1.46 → 0.1.49

package/src/ui/dashboard-panes/metrics-pane.ts

@@ -1,34 +1,34 @@
-import type { MetricRegistry } from "../../observability/metric-registry.ts";
-import type { HistogramPoint, MetricLabels, MetricPoint } from "../../observability/metrics-primitives.ts";
-import type { RunUiSnapshot } from "../snapshot-types.ts";
-
-export interface MetricsPaneOptions {
-	registry?: MetricRegistry;
-	maxCounters?: number;
-}
-
-function labelsText(labels: MetricLabels): string {
-	const entries = Object.entries(labels);
-	return entries.length ? `{${entries.map(([key, value]) => `${key}=${value}`).join(",")}}` : "";
-}
-
-function isHistogramPoint(point: MetricPoint | HistogramPoint): point is HistogramPoint {
-	return "quantiles" in point;
-}
-
-export function renderMetricsPane(_snapshot: RunUiSnapshot | undefined, opts: MetricsPaneOptions = {}): string[] {
-	if (!opts.registry) return ["Metrics pane: registry unavailable"];
-	const snapshots = opts.registry.snapshot();
-	if (!snapshots.length) return ["Metrics pane: no metrics recorded"];
-	const lines = ["Metrics pane: top metrics"];
-	for (const snapshot of snapshots.slice(0, opts.maxCounters ?? 10)) {
-		const first = snapshot.values[0];
-		if (!first) {
-			lines.push(`${snapshot.name}: empty`);
-			continue;
-		}
-		if (isHistogramPoint(first)) lines.push(`${snapshot.name}${labelsText(first.labels)} count=${first.count} p95=${Number.isFinite(first.quantiles.p95) ? Math.round(first.quantiles.p95) : "n/a"}`);
-		else lines.push(`${snapshot.name}${labelsText(first.labels)} ${first.value}`);
-	}
-	return lines;
-}
+import type { MetricRegistry } from "../../observability/metric-registry.ts";
+import type { HistogramPoint, MetricLabels, MetricPoint } from "../../observability/metrics-primitives.ts";
+import type { RunUiSnapshot } from "../snapshot-types.ts";
+
+export interface MetricsPaneOptions {
+	registry?: MetricRegistry;
+	maxCounters?: number;
+}
+
+function labelsText(labels: MetricLabels): string {
+	const entries = Object.entries(labels);
+	return entries.length ? `{${entries.map(([key, value]) => `${key}=${value}`).join(",")}}` : "";
+}
+
+function isHistogramPoint(point: MetricPoint | HistogramPoint): point is HistogramPoint {
+	return "quantiles" in point;
+}
+
+export function renderMetricsPane(_snapshot: RunUiSnapshot | undefined, opts: MetricsPaneOptions = {}): string[] {
+	if (!opts.registry) return ["Metrics pane: registry unavailable"];
+	const snapshots = opts.registry.snapshot();
+	if (!snapshots.length) return ["Metrics pane: no metrics recorded"];
+	const lines = ["Metrics pane: top metrics"];
+	for (const snapshot of snapshots.slice(0, opts.maxCounters ?? 10)) {
+		const first = snapshot.values[0];
+		if (!first) {
+			lines.push(`${snapshot.name}: empty`);
+			continue;
+		}
+		if (isHistogramPoint(first)) lines.push(`${snapshot.name}${labelsText(first.labels)} count=${first.count} p95=${Number.isFinite(first.quantiles.p95) ? Math.round(first.quantiles.p95) : "n/a"}`);
+		else lines.push(`${snapshot.name}${labelsText(first.labels)} ${first.value}`);
+	}
+	return lines;
+}

package/src/ui/dynamic-border.ts

@@ -1,25 +1,25 @@
-import type { CrewTheme } from "./theme-adapter.ts";
-
-export interface DynamicCrewBorderOptions {
-	color?: (value: string) => string;
-	char?: string;
-}
-
-export class DynamicCrewBorder {
-	private readonly theme: CrewTheme;
-	private readonly color?: (value: string) => string;
-	private readonly char: string;
-
-	constructor(theme: CrewTheme, options: DynamicCrewBorderOptions = {}) {
-		this.theme = theme;
-		this.color = options.color;
-		this.char = options.char && options.char.length > 0 ? options.char : "─";
-	}
-
-	render(width: number): string[] {
-		const line = this.char.repeat(Math.max(0, width));
-		return [this.color ? this.color(line) : this.theme.fg("border", line)];
-	}
-
-	invalidate(): void {}
-}
+import type { CrewTheme } from "./theme-adapter.ts";
+
+export interface DynamicCrewBorderOptions {
+	color?: (value: string) => string;
+	char?: string;
+}
+
+export class DynamicCrewBorder {
+	private readonly theme: CrewTheme;
+	private readonly color?: (value: string) => string;
+	private readonly char: string;
+
+	constructor(theme: CrewTheme, options: DynamicCrewBorderOptions = {}) {
+		this.theme = theme;
+		this.color = options.color;
+		this.char = options.char && options.char.length > 0 ? options.char : "─";
+	}
+
+	render(width: number): string[] {
+		const line = this.char.repeat(Math.max(0, width));
+		return [this.color ? this.color(line) : this.theme.fg("border", line)];
+	}
+
+	invalidate(): void {}
+}

package/src/ui/layout-primitives.ts

@@ -1,106 +1,106 @@
-import { pad, wrapHard } from "../utils/visual.ts";
-
-export interface RenderableComponent {
-	invalidate(): void;
-	render(width: number): string[];
-}
-
-export class Container implements RenderableComponent {
-	private children: RenderableComponent[] = [];
-
-	addChild(child: RenderableComponent): void {
-		this.children.push(child);
-	}
-
-	clear(): void {
-		this.children = [];
-	}
-
-	invalidate(): void {
-		for (const child of this.children) {
-			child.invalidate();
-		}
-	}
-
-	render(width: number): string[] {
-		const lines: string[] = [];
-		for (const child of this.children) {
-			lines.push(...child.render(width));
-		}
-		return lines;
-	}
-}
-
-export class Box extends Container {
-	private readonly paddingX: number;
-	private readonly paddingY: number;
-
-	constructor(paddingX = 0, paddingY = 0) {
-		super();
-		this.paddingX = paddingX;
-		this.paddingY = paddingY;
-	}
-
-	render(width: number): string[] {
-		const innerWidth = Math.max(1, width - this.paddingX * 2);
-		const rows = super.render(innerWidth);
-		const paddedRows: string[] = [];
-		const left = " ".repeat(this.paddingX);
-		const right = " ".repeat(this.paddingX);
-		for (const row of rows) {
-			paddedRows.push(pad(`${left}${row}${right}`, width));
-		}
-		const emptyRow = pad("", width);
-		if (this.paddingY <= 0) return paddedRows;
-		if (this.paddingY > 0) {
-			const topAndBottom = Array.from({ length: this.paddingY }, () => emptyRow);
-			return [...topAndBottom, ...paddedRows, ...topAndBottom];
-		}
-		return paddedRows;
-	}
-}
-
-export class Text implements RenderableComponent {
-	private text: string;
-	private cachedWidth = 0;
-	private cachedResult: string[] = [];
-
-	constructor(text = "") {
-		this.text = text;
-	}
-
-	setText(text: string): void {
-		if (text === this.text) return;
-		this.text = text;
-		this.invalidate();
-	}
-
-	invalidate(): void {
-		this.cachedWidth = 0;
-		this.cachedResult = [];
-	}
-
-	render(width: number): string[] {
-		if (this.cachedWidth === width) return this.cachedResult;
-		const wrapped = wrapHard(this.text, Math.max(1, width));
-		const lines = wrapped.length ? wrapped : [""];
-		this.cachedWidth = width;
-		this.cachedResult = lines.map((line) => pad(line, width));
-		return this.cachedResult;
-	}
-}
-
-export class Spacer implements RenderableComponent {
-	private readonly rows: number;
-
-	constructor(rows = 0) {
-		this.rows = rows;
-	}
-
-	render(width: number): string[] {
-		if (this.rows <= 0) return [];
-		return Array.from({ length: Math.max(0, this.rows) }, () => pad("", width));
-	}
-
-	invalidate(): void {}
-}
+import { pad, wrapHard } from "../utils/visual.ts";
+
+export interface RenderableComponent {
+	invalidate(): void;
+	render(width: number): string[];
+}
+
+export class Container implements RenderableComponent {
+	private children: RenderableComponent[] = [];
+
+	addChild(child: RenderableComponent): void {
+		this.children.push(child);
+	}
+
+	clear(): void {
+		this.children = [];
+	}
+
+	invalidate(): void {
+		for (const child of this.children) {
+			child.invalidate();
+		}
+	}
+
+	render(width: number): string[] {
+		const lines: string[] = [];
+		for (const child of this.children) {
+			lines.push(...child.render(width));
+		}
+		return lines;
+	}
+}
+
+export class Box extends Container {
+	private readonly paddingX: number;
+	private readonly paddingY: number;
+
+	constructor(paddingX = 0, paddingY = 0) {
+		super();
+		this.paddingX = paddingX;
+		this.paddingY = paddingY;
+	}
+
+	render(width: number): string[] {
+		const innerWidth = Math.max(1, width - this.paddingX * 2);
+		const rows = super.render(innerWidth);
+		const paddedRows: string[] = [];
+		const left = " ".repeat(this.paddingX);
+		const right = " ".repeat(this.paddingX);
+		for (const row of rows) {
+			paddedRows.push(pad(`${left}${row}${right}`, width));
+		}
+		const emptyRow = pad("", width);
+		if (this.paddingY <= 0) return paddedRows;
+		if (this.paddingY > 0) {
+			const topAndBottom = Array.from({ length: this.paddingY }, () => emptyRow);
+			return [...topAndBottom, ...paddedRows, ...topAndBottom];
+		}
+		return paddedRows;
+	}
+}
+
+export class Text implements RenderableComponent {
+	private text: string;
+	private cachedWidth = 0;
+	private cachedResult: string[] = [];
+
+	constructor(text = "") {
+		this.text = text;
+	}
+
+	setText(text: string): void {
+		if (text === this.text) return;
+		this.text = text;
+		this.invalidate();
+	}
+
+	invalidate(): void {
+		this.cachedWidth = 0;
+		this.cachedResult = [];
+	}
+
+	render(width: number): string[] {
+		if (this.cachedWidth === width) return this.cachedResult;
+		const wrapped = wrapHard(this.text, Math.max(1, width));
+		const lines = wrapped.length ? wrapped : [""];
+		this.cachedWidth = width;
+		this.cachedResult = lines.map((line) => pad(line, width));
+		return this.cachedResult;
+	}
+}
+
+export class Spacer implements RenderableComponent {
+	private readonly rows: number;
+
+	constructor(rows = 0) {
+		this.rows = rows;
+	}
+
+	render(width: number): string[] {
+		if (this.rows <= 0) return [];
+		return Array.from({ length: Math.max(0, this.rows) }, () => pad("", width));
+	}
+
+	invalidate(): void {}
+}

package/src/ui/live-run-sidebar.ts

@@ -14,6 +14,7 @@ import { asCrewTheme, subscribeThemeChange } from "./theme-adapter.ts";
 import { Box, Text } from "./layout-primitives.ts";
 import type { RunSnapshotCache, RunUiSnapshot } from "./snapshot-types.ts";
 import { spinnerBucket, spinnerFrame } from "./spinner.ts";
+import { runEventBus } from "./run-event-bus.ts";
 
 const TASK_READ_TTL_MS = 200;
 
@@ -59,6 +60,7 @@ export class LiveRunSidebar {
 	private readonly theme: CrewTheme;
 	private readonly config: CrewUiConfig;
 	private readonly unsubscribeTheme: () => void;
+	private readonly unsubscribeEventBus: () => void;
 	private readonly snapshotCache?: RunSnapshotCache;
 	private cachedLines: string[] = [];
 	private cachedWidth = 0;
@@ -72,6 +74,7 @@ export class LiveRunSidebar {
 		this.config = input.config ?? {};
 		this.snapshotCache = input.snapshotCache;
 		this.unsubscribeTheme = subscribeThemeChange(input.theme, () => this.invalidate());
+		this.unsubscribeEventBus = runEventBus.onAny(() => this.invalidate());
 	}
 
 	private buildSignature(manifestStatus: string, tasks: TeamTaskState[], agents: ReturnType<typeof readCrewAgents>, waitingCount: number, snapshot?: RunUiSnapshot): string {
@@ -99,6 +102,7 @@ export class LiveRunSidebar {
 
 	dispose(): void {
 		this.unsubscribeTheme();
+		this.unsubscribeEventBus();
 	}
 
 	render(width: number): string[] {