gsd-pi 2.76.0-dev.fe143342a → 2.77.0-dev.538325aea

package/packages/gsd-agent-modes/src/modes/interactive/components/__tests__/provider-display-name.test.ts

@@ -0,0 +1,18 @@
+// GSD-2 — Provider display name mapping tests
+import { test, describe } from "node:test";
+import assert from "node:assert/strict";
+import { providerDisplayName } from "../model-selector.js";
+
+describe("providerDisplayName", () => {
+	test("renames 'anthropic' to 'anthropic-api'", () => {
+		assert.equal(providerDisplayName("anthropic"), "anthropic-api");
+	});
+
+	test("passes through unmapped providers unchanged", () => {
+		assert.equal(providerDisplayName("claude-code"), "claude-code");
+		assert.equal(providerDisplayName("openai"), "openai");
+		assert.equal(providerDisplayName("bedrock"), "bedrock");
+		assert.equal(providerDisplayName("github-copilot"), "github-copilot");
+		assert.equal(providerDisplayName("openrouter"), "openrouter");
+	});
+});

package/packages/gsd-agent-modes/src/modes/interactive/components/__tests__/timestamp.test.ts

@@ -0,0 +1,38 @@
+import { test, describe } from "node:test";
+import assert from "node:assert/strict";
+import { formatTimestamp } from "../timestamp.js";
+
+describe("formatTimestamp", () => {
+	// Use a fixed local timestamp to avoid timezone issues
+	const d = new Date(2026, 2, 24, 10, 34, 0); // Mar 24, 2026 10:34:00 local time
+	const ts = d.getTime();
+
+	test("date-time-iso format (default)", () => {
+		assert.equal(formatTimestamp(ts, "date-time-iso"), "2026-03-24 10:34");
+		assert.equal(formatTimestamp(ts), "2026-03-24 10:34"); // default
+	});
+
+	test("date-time-us format", () => {
+		assert.equal(formatTimestamp(ts, "date-time-us"), "03-24-2026 10:34 AM");
+	});
+
+	test("US format handles PM correctly", () => {
+		const pm = new Date(2026, 2, 24, 14, 5, 0).getTime();
+		assert.equal(formatTimestamp(pm, "date-time-us"), "03-24-2026 2:05 PM");
+	});
+
+	test("US format handles noon as 12 PM", () => {
+		const noon = new Date(2026, 2, 24, 12, 0, 0).getTime();
+		assert.equal(formatTimestamp(noon, "date-time-us"), "03-24-2026 12:00 PM");
+	});
+
+	test("US format handles midnight as 12 AM", () => {
+		const midnight = new Date(2026, 2, 24, 0, 0, 0).getTime();
+		assert.equal(formatTimestamp(midnight, "date-time-us"), "03-24-2026 12:00 AM");
+	});
+
+	test("ISO format pads single digit months and days", () => {
+		const jan1 = new Date(2026, 0, 1, 9, 5, 0).getTime();
+		assert.equal(formatTimestamp(jan1, "date-time-iso"), "2026-01-01 09:05");
+	});
+});

package/packages/gsd-agent-modes/src/modes/interactive/components/__tests__/tool-execution.test.ts

@@ -0,0 +1,171 @@
+import { describe, test } from "node:test";
+import assert from "node:assert/strict";
+import stripAnsi from "strip-ansi";
+import { ToolExecutionComponent } from "../tool-execution.js";
+import { initTheme } from "@gsd/pi-coding-agent";
+
+initTheme("dark", false);
+
+function renderTool(
+	toolName: string,
+	args: Record<string, unknown>,
+	result?: {
+		content: Array<{ type: string; text?: string }>;
+		isError: boolean;
+		details?: Record<string, unknown>;
+	},
+): string {
+	const component = new ToolExecutionComponent(
+		toolName,
+		args,
+		{},
+		undefined,
+		{ requestRender() {} } as any,
+	);
+	component.setExpanded(true);
+	if (result) component.updateResult(result);
+	return stripAnsi(component.render(120).join("\n"));
+}
+
+function renderToolCollapsed(
+	toolName: string,
+	args: Record<string, unknown>,
+	result?: {
+		content: Array<{ type: string; text?: string }>;
+		isError: boolean;
+		details?: Record<string, unknown>;
+	},
+): string {
+	const component = new ToolExecutionComponent(
+		toolName,
+		args,
+		{},
+		undefined,
+		{ requestRender() {} } as any,
+	);
+	if (result) component.updateResult(result);
+	return stripAnsi(component.render(120).join("\n"));
+}
+
+describe("ToolExecutionComponent", () => {
+	test("renders capitalized Claude Code Bash tool names with bash output instead of generic args JSON", () => {
+		const rendered = renderTool(
+			"Bash",
+			{ command: "pwd" },
+			{ content: [{ type: "text", text: "/tmp/gsd-pr-fix" }], isError: false },
+		);
+
+		assert.match(rendered, /\$ pwd/);
+		assert.match(rendered, /\/tmp\/gsd-pr-fix/);
+		assert.doesNotMatch(rendered, /^\{\s*\}$/m);
+	});
+
+	test("renders capitalized Claude Code Read tool names with read output", () => {
+		const rendered = renderTool(
+			"Read",
+			{ path: "/tmp/demo.txt" },
+			{ content: [{ type: "text", text: "hello\nworld" }], isError: false },
+		);
+
+		assert.match(rendered, /read .*demo\.txt/);
+		assert.match(rendered, /hello/);
+		assert.match(rendered, /world/);
+	});
+
+	test("generic fallback strips mcp__<server>__ prefix and shows server·tool title", () => {
+		const rendered = renderTool(
+			"mcp__context7__resolve_library_id",
+			{ name: "react" },
+			{ content: [{ type: "text", text: "react@18.3.1" }], isError: false },
+		);
+
+		assert.match(rendered, /context7\u00b7resolve_library_id/);
+		assert.doesNotMatch(rendered, /mcp__/);
+		assert.match(rendered, /name="react"/);
+		assert.match(rendered, /react@18\.3\.1/);
+	});
+
+	test("generic fallback renders compact key=value args for primitive args", () => {
+		const rendered = renderTool(
+			"some_unknown_tool",
+			{ count: 3, enabled: true, label: "hello" },
+		);
+
+		assert.match(rendered, /some_unknown_tool/);
+		assert.match(rendered, /count=3/);
+		assert.match(rendered, /enabled=true/);
+		assert.match(rendered, /label="hello"/);
+		assert.doesNotMatch(rendered, /^\{$/m);
+	});
+
+	test("generic fallback truncates long output when collapsed", () => {
+		const longOutput = Array.from({ length: 25 }, (_, i) => `line ${i + 1}`).join("\n");
+		const rendered = renderToolCollapsed(
+			"mcp__demo__do_thing",
+			{ ok: true },
+			{ content: [{ type: "text", text: longOutput }], isError: false },
+		);
+
+		assert.match(rendered, /line 1\b/);
+		assert.match(rendered, /line 10\b/);
+		assert.doesNotMatch(rendered, /line 20\b/);
+		assert.match(rendered, /\(15 more lines/);
+	});
+
+	test("generic fallback falls back to truncated JSON for complex args", () => {
+		const rendered = renderTool(
+			"mcp__demo__nested",
+			{ payload: { nested: { deeply: ["a", "b", "c"] } }, name: "x" },
+		);
+
+		assert.match(rendered, /demo\u00b7nested/);
+		// Multi-line JSON dump for the complex payload
+		assert.match(rendered, /"payload"/);
+		assert.match(rendered, /"nested"/);
+	});
+
+	// TOOL-01: edits[] array format (pi 0.67.2 edit tool API)
+	test("edit tool renders path label when called with edits[] array format (TOOL-01)", () => {
+		const rendered = renderTool(
+			"Edit",
+			{ path: "/tmp/test.ts", edits: [{ oldText: "old content", newText: "new content" }] },
+		);
+
+		assert.match(rendered, /test\.ts/);
+		assert.doesNotMatch(rendered, /"oldText"/);
+	});
+
+	test("edit tool renders path label when called with single oldText/newText format (TOOL-01)", () => {
+		const rendered = renderTool(
+			"Edit",
+			{ path: "/tmp/test.ts", oldText: "old content", newText: "new content" },
+		);
+
+		assert.match(rendered, /test\.ts/);
+	});
+
+	test("edit tool handles edits[] with no valid elements without crashing (TOOL-01 type guard)", () => {
+		assert.doesNotThrow(() => {
+			renderTool(
+				"Edit",
+				{ path: "/tmp/test.ts", edits: [{ bad: "data" }, null, { also: "bad" }] },
+			);
+		});
+	});
+
+	test("edit tool handles empty edits[] without crashing (TOOL-01 edge case)", () => {
+		assert.doesNotThrow(() => {
+			renderTool("Edit", { path: "/tmp/test.ts", edits: [] });
+		});
+	});
+
+	// TOOL-02: computeEditDiff invocation via lowercase "edit" tool name
+	test("edit tool (lowercase) triggers diff path for edits[] format without crashing (TOOL-02)", () => {
+		assert.doesNotThrow(() => {
+			renderTool(
+				"edit",
+				{ path: "/tmp/nonexistent-for-test.ts", edits: [{ oldText: "a", newText: "b" }] },
+			);
+		});
+	});
+});

package/packages/gsd-agent-modes/src/modes/interactive/components/armin.ts

@@ -0,0 +1,382 @@
+/**
+ * Armin says hi! A fun easter egg with animated XBM art.
+ */
+
+import { type Component, type TUI, visibleWidth } from "@gsd/pi-tui";
+import { theme } from "../../../theme.js";
+
+// XBM image: 31x36 pixels, LSB first, 1=background, 0=foreground
+const WIDTH = 31;
+const HEIGHT = 36;
+const BITS = [
+	0xff, 0xff, 0xff, 0x7f, 0xff, 0xf0, 0xff, 0x7f, 0xff, 0xed, 0xff, 0x7f, 0xff, 0xdb, 0xff, 0x7f, 0xff, 0xb7, 0xff,
+	0x7f, 0xff, 0x77, 0xfe, 0x7f, 0x3f, 0xf8, 0xfe, 0x7f, 0xdf, 0xff, 0xfe, 0x7f, 0xdf, 0x3f, 0xfc, 0x7f, 0x9f, 0xc3,
+	0xfb, 0x7f, 0x6f, 0xfc, 0xf4, 0x7f, 0xf7, 0x0f, 0xf7, 0x7f, 0xf7, 0xff, 0xf7, 0x7f, 0xf7, 0xff, 0xe3, 0x7f, 0xf7,
+	0x07, 0xe8, 0x7f, 0xef, 0xf8, 0x67, 0x70, 0x0f, 0xff, 0xbb, 0x6f, 0xf1, 0x00, 0xd0, 0x5b, 0xfd, 0x3f, 0xec, 0x53,
+	0xc1, 0xff, 0xef, 0x57, 0x9f, 0xfd, 0xee, 0x5f, 0x9f, 0xfc, 0xae, 0x5f, 0x1f, 0x78, 0xac, 0x5f, 0x3f, 0x00, 0x50,
+	0x6c, 0x7f, 0x00, 0xdc, 0x77, 0xff, 0xc0, 0x3f, 0x78, 0xff, 0x01, 0xf8, 0x7f, 0xff, 0x03, 0x9c, 0x78, 0xff, 0x07,
+	0x8c, 0x7c, 0xff, 0x0f, 0xce, 0x78, 0xff, 0xff, 0xcf, 0x7f, 0xff, 0xff, 0xcf, 0x78, 0xff, 0xff, 0xdf, 0x78, 0xff,
+	0xff, 0xdf, 0x7d, 0xff, 0xff, 0x3f, 0x7e, 0xff, 0xff, 0xff, 0x7f,
+];
+
+const BYTES_PER_ROW = Math.ceil(WIDTH / 8);
+const DISPLAY_HEIGHT = Math.ceil(HEIGHT / 2); // Half-block rendering
+
+type Effect = "typewriter" | "scanline" | "rain" | "fade" | "crt" | "glitch" | "dissolve";
+
+const EFFECTS: Effect[] = ["typewriter", "scanline", "rain", "fade", "crt", "glitch", "dissolve"];
+
+// Get pixel at (x, y): true = foreground, false = background
+function getPixel(x: number, y: number): boolean {
+	if (y >= HEIGHT) return false;
+	const byteIndex = y * BYTES_PER_ROW + Math.floor(x / 8);
+	const bitIndex = x % 8;
+	return ((BITS[byteIndex] >> bitIndex) & 1) === 0;
+}
+
+// Get the character for a cell (2 vertical pixels packed)
+function getChar(x: number, row: number): string {
+	const upper = getPixel(x, row * 2);
+	const lower = getPixel(x, row * 2 + 1);
+	if (upper && lower) return "█";
+	if (upper) return "▀";
+	if (lower) return "▄";
+	return " ";
+}
+
+// Build the final image grid
+function buildFinalGrid(): string[][] {
+	const grid: string[][] = [];
+	for (let row = 0; row < DISPLAY_HEIGHT; row++) {
+		const line: string[] = [];
+		for (let x = 0; x < WIDTH; x++) {
+			line.push(getChar(x, row));
+		}
+		grid.push(line);
+	}
+	return grid;
+}
+
+export class ArminComponent implements Component {
+	private ui: TUI;
+	private interval: ReturnType<typeof setInterval> | null = null;
+	private effect: Effect;
+	private finalGrid: string[][];
+	private currentGrid: string[][];
+	private effectState: Record<string, unknown> = {};
+	private cachedLines: string[] = [];
+	private cachedWidth = 0;
+	private gridVersion = 0;
+	private cachedVersion = -1;
+
+	constructor(ui: TUI) {
+		this.ui = ui;
+		this.effect = EFFECTS[Math.floor(Math.random() * EFFECTS.length)];
+		this.finalGrid = buildFinalGrid();
+		this.currentGrid = this.createEmptyGrid();
+
+		this.initEffect();
+		this.startAnimation();
+	}
+
+	invalidate(): void {
+		this.cachedWidth = 0;
+	}
+
+	render(width: number): string[] {
+		if (width === this.cachedWidth && this.cachedVersion === this.gridVersion) {
+			return this.cachedLines;
+		}
+
+		const center = (s: string): string => {
+			const visible = visibleWidth(s);
+			const left = Math.max(0, Math.floor((width - visible) / 2));
+			return " ".repeat(left) + s;
+		};
+
+		this.cachedLines = this.currentGrid.map((row) => {
+			const clipped = row.slice(0, width).join("");
+			return center(theme.fg("accent", clipped));
+		});
+
+		// Add "ARMIN SAYS HI" at the end
+		const message = "ARMIN SAYS HI";
+		this.cachedLines.push(center(theme.fg("accent", message)));
+
+		this.cachedWidth = width;
+		this.cachedVersion = this.gridVersion;
+
+		return this.cachedLines;
+	}
+
+	private createEmptyGrid(): string[][] {
+		return Array.from({ length: DISPLAY_HEIGHT }, () => Array(WIDTH).fill(" "));
+	}
+
+	private initEffect(): void {
+		switch (this.effect) {
+			case "typewriter":
+				this.effectState = { pos: 0 };
+				break;
+			case "scanline":
+				this.effectState = { row: 0 };
+				break;
+			case "rain":
+				// Track falling position for each column
+				this.effectState = {
+					drops: Array.from({ length: WIDTH }, () => ({
+						y: -Math.floor(Math.random() * DISPLAY_HEIGHT * 2),
+						settled: 0,
+					})),
+				};
+				break;
+			case "fade": {
+				// Shuffle all pixel positions
+				const positions: [number, number][] = [];
+				for (let row = 0; row < DISPLAY_HEIGHT; row++) {
+					for (let x = 0; x < WIDTH; x++) {
+						positions.push([row, x]);
+					}
+				}
+				// Fisher-Yates shuffle
+				for (let i = positions.length - 1; i > 0; i--) {
+					const j = Math.floor(Math.random() * (i + 1));
+					[positions[i], positions[j]] = [positions[j], positions[i]];
+				}
+				this.effectState = { positions, idx: 0 };
+				break;
+			}
+			case "crt":
+				this.effectState = { expansion: 0 };
+				break;
+			case "glitch":
+				this.effectState = { phase: 0, glitchFrames: 8 };
+				break;
+			case "dissolve": {
+				// Start with random noise
+				this.currentGrid = Array.from({ length: DISPLAY_HEIGHT }, () =>
+					Array.from({ length: WIDTH }, () => {
+						const chars = [" ", "░", "▒", "▓", "█", "▀", "▄"];
+						return chars[Math.floor(Math.random() * chars.length)];
+					}),
+				);
+				// Shuffle positions for gradual resolve
+				const dissolvePositions: [number, number][] = [];
+				for (let row = 0; row < DISPLAY_HEIGHT; row++) {
+					for (let x = 0; x < WIDTH; x++) {
+						dissolvePositions.push([row, x]);
+					}
+				}
+				for (let i = dissolvePositions.length - 1; i > 0; i--) {
+					const j = Math.floor(Math.random() * (i + 1));
+					[dissolvePositions[i], dissolvePositions[j]] = [dissolvePositions[j], dissolvePositions[i]];
+				}
+				this.effectState = { positions: dissolvePositions, idx: 0 };
+				break;
+			}
+		}
+	}
+
+	private startAnimation(): void {
+		const fps = this.effect === "glitch" ? 60 : 30;
+		this.interval = setInterval(() => {
+			const done = this.tickEffect();
+			this.updateDisplay();
+			this.ui.requestRender();
+			if (done) {
+				this.stopAnimation();
+			}
+		}, 1000 / fps);
+	}
+
+	private stopAnimation(): void {
+		if (this.interval) {
+			clearInterval(this.interval);
+			this.interval = null;
+		}
+	}
+
+	private tickEffect(): boolean {
+		switch (this.effect) {
+			case "typewriter":
+				return this.tickTypewriter();
+			case "scanline":
+				return this.tickScanline();
+			case "rain":
+				return this.tickRain();
+			case "fade":
+				return this.tickFade();
+			case "crt":
+				return this.tickCrt();
+			case "glitch":
+				return this.tickGlitch();
+			case "dissolve":
+				return this.tickDissolve();
+			default:
+				return true;
+		}
+	}
+
+	private tickTypewriter(): boolean {
+		const state = this.effectState as { pos: number };
+		const pixelsPerFrame = 3;
+
+		for (let i = 0; i < pixelsPerFrame; i++) {
+			const row = Math.floor(state.pos / WIDTH);
+			const x = state.pos % WIDTH;
+			if (row >= DISPLAY_HEIGHT) return true;
+			this.currentGrid[row][x] = this.finalGrid[row][x];
+			state.pos++;
+		}
+		return false;
+	}
+
+	private tickScanline(): boolean {
+		const state = this.effectState as { row: number };
+		if (state.row >= DISPLAY_HEIGHT) return true;
+
+		// Copy row
+		for (let x = 0; x < WIDTH; x++) {
+			this.currentGrid[state.row][x] = this.finalGrid[state.row][x];
+		}
+		state.row++;
+		return false;
+	}
+
+	private tickRain(): boolean {
+		const state = this.effectState as {
+			drops: { y: number; settled: number }[];
+		};
+
+		let allSettled = true;
+		this.currentGrid = this.createEmptyGrid();
+
+		for (let x = 0; x < WIDTH; x++) {
+			const drop = state.drops[x];
+
+			// Draw settled pixels
+			for (let row = DISPLAY_HEIGHT - 1; row >= DISPLAY_HEIGHT - drop.settled; row--) {
+				if (row >= 0) {
+					this.currentGrid[row][x] = this.finalGrid[row][x];
+				}
+			}
+
+			// Check if this column is done
+			if (drop.settled >= DISPLAY_HEIGHT) continue;
+
+			allSettled = false;
+
+			// Find the target row for this column (lowest non-space pixel)
+			let targetRow = -1;
+			for (let row = DISPLAY_HEIGHT - 1 - drop.settled; row >= 0; row--) {
+				if (this.finalGrid[row][x] !== " ") {
+					targetRow = row;
+					break;
+				}
+			}
+
+			// Move drop down
+			drop.y++;
+
+			// Draw falling drop
+			if (drop.y >= 0 && drop.y < DISPLAY_HEIGHT) {
+				if (targetRow >= 0 && drop.y >= targetRow) {
+					// Settle
+					drop.settled = DISPLAY_HEIGHT - targetRow;
+					drop.y = -Math.floor(Math.random() * 5) - 1;
+				} else {
+					// Still falling
+					this.currentGrid[drop.y][x] = "▓";
+				}
+			}
+		}
+
+		return allSettled;
+	}
+
+	private tickFade(): boolean {
+		const state = this.effectState as { positions: [number, number][]; idx: number };
+		const pixelsPerFrame = 15;
+
+		for (let i = 0; i < pixelsPerFrame; i++) {
+			if (state.idx >= state.positions.length) return true;
+			const [row, x] = state.positions[state.idx];
+			this.currentGrid[row][x] = this.finalGrid[row][x];
+			state.idx++;
+		}
+		return false;
+	}
+
+	private tickCrt(): boolean {
+		const state = this.effectState as { expansion: number };
+		const midRow = Math.floor(DISPLAY_HEIGHT / 2);
+
+		this.currentGrid = this.createEmptyGrid();
+
+		// Draw from middle expanding outward
+		const top = midRow - state.expansion;
+		const bottom = midRow + state.expansion;
+
+		for (let row = Math.max(0, top); row <= Math.min(DISPLAY_HEIGHT - 1, bottom); row++) {
+			for (let x = 0; x < WIDTH; x++) {
+				this.currentGrid[row][x] = this.finalGrid[row][x];
+			}
+		}
+
+		state.expansion++;
+		return state.expansion > DISPLAY_HEIGHT;
+	}
+
+	private tickGlitch(): boolean {
+		const state = this.effectState as { phase: number; glitchFrames: number };
+
+		if (state.phase < state.glitchFrames) {
+			// Glitch phase: show corrupted version
+			this.currentGrid = this.finalGrid.map((row) => {
+				const offset = Math.floor(Math.random() * 7) - 3;
+				const glitchRow = [...row];
+
+				// Random horizontal offset
+				if (Math.random() < 0.3) {
+					const shifted = glitchRow.slice(offset).concat(glitchRow.slice(0, offset));
+					return shifted.slice(0, WIDTH);
+				}
+
+				// Random vertical swap
+				if (Math.random() < 0.2) {
+					const swapRow = Math.floor(Math.random() * DISPLAY_HEIGHT);
+					return [...this.finalGrid[swapRow]];
+				}
+
+				return glitchRow;
+			});
+			state.phase++;
+			return false;
+		}
+
+		// Final frame: show clean image
+		this.currentGrid = this.finalGrid.map((row) => [...row]);
+		return true;
+	}
+
+	private tickDissolve(): boolean {
+		const state = this.effectState as { positions: [number, number][]; idx: number };
+		const pixelsPerFrame = 20;
+
+		for (let i = 0; i < pixelsPerFrame; i++) {
+			if (state.idx >= state.positions.length) return true;
+			const [row, x] = state.positions[state.idx];
+			this.currentGrid[row][x] = this.finalGrid[row][x];
+			state.idx++;
+		}
+		return false;
+	}
+
+	private updateDisplay(): void {
+		this.gridVersion++;
+	}
+
+	dispose(): void {
+		this.stopAnimation();
+	}
+}