pi-plans 0.2.0 → 0.3.0

package/src/refine-ui.ts

@@ -7,6 +7,15 @@ import {
 	visibleWidth as localVisibleWidth,
 	wrapTextWithAnsi as localWrapTextWithAnsi,
 } from "./refine-ui-helpers.ts";
+import {
+	applyRefineProgress,
+	applyRefineResult,
+	statusLabel,
+	type RefineLaneState,
+	type RefineTranscriptEntry,
+	type RefineTranscriptEntryType,
+	type RefineOverlayRole,
+} from "./refine-ui-state.ts";
 
 let _piTui: typeof import("@earendil-works/pi-tui") | undefined;
 let _piTuiAttempted = false;
@@ -24,7 +33,7 @@ async function loadPiTui(): Promise<typeof import("@earendil-works/pi-tui") | un
 
 void loadPiTui();
 
-function truncateToWidth(text: string, width: number, ellipsis?: string): string {
+function truncateToWidth(text: string, width: number, ellipsis = ""): string {
 	try {
 		return _piTui ? _piTui.truncateToWidth(text, width, ellipsis) : localTruncateToWidth(text, width, ellipsis);
 	} catch {
@@ -48,6 +57,29 @@ function wrapTextWithAnsi(text: string, width: number): string[] {
 	}
 }
 
+type RefineKey = "escape" | "tab" | "shift+tab" | "up" | "down" | "pageUp" | "pageDown";
+
+function fallbackKey(data: string, key: RefineKey): boolean {
+	const sequences: Record<RefineKey, string[]> = {
+		escape: ["\x1b", "\x1b\x1b"],
+		tab: ["\t"],
+		"shift+tab": ["\x1b[Z"],
+		up: ["\x1b[A", "\x1bOA"],
+		down: ["\x1b[B", "\x1bOB"],
+		pageUp: ["\x1b[5~"],
+		pageDown: ["\x1b[6~"],
+	};
+	return sequences[key].includes(data);
+}
+
+function matchesKey(data: string, key: RefineKey): boolean {
+	try {
+		return _piTui ? _piTui.matchesKey(data, key) : fallbackKey(data, key);
+	} catch {
+		return fallbackKey(data, key);
+	}
+}
+
 function handleEscape(data: string): boolean {
 	try {
 		return _piTui ? _piTui.matchesKey(data, "escape") : localMatchesEscape(data);
@@ -55,22 +87,15 @@ function handleEscape(data: string): boolean {
 		return localMatchesEscape(data);
 	}
 }
-import {
-	applyRefineProgress,
-	applyRefineResult,
-	statusLabel,
-	type RefineLaneState,
-	type RefineOverlayRole,
-} from "./refine-ui-state.ts";
 
-export type { RefineLaneState, RefineLaneStatus, RefineOverlayRole } from "./refine-ui-state.ts";
+export type { RefineLaneState, RefineLaneStatus, RefineOverlayRole, RefineTranscriptEntry, RefineTranscriptEntryType } from "./refine-ui-state.ts";
 
-const OVERLAY_MIN_WIDTH = 44;
-const OVERLAY_MAX_WIDTH = 96;
+const OVERLAY_MIN_WIDTH = 72;
 const OVERLAY_MIN_HEIGHT = 18;
 const OVERLAY_MAX_HEIGHT = 32;
 const OVERLAY_HEIGHT_RATIO = 0.78;
-const CHROME_LINES = 5; // top + title + (header rule + footer rule + hints)
+const STREAMING_PREVIEW_LINES = 3;
+const OVERLAY_CHROME_LINES = 4; // top border + title row + footer row + bottom border
 
 export function getTerminalRowCount(): number {
 	const raw = (process.stdout as { rows?: number }).rows;
@@ -83,55 +108,30 @@ export function pickOverlayHeight(): number {
 	return Math.min(OVERLAY_MAX_HEIGHT, target);
 }
 
+/** The overlay manager resolves the 78%/72-column size; render accepts its resolved width. */
 export function pickOverlayWidth(width: number): number {
-	const target = Math.max(OVERLAY_MIN_WIDTH, Math.min(OVERLAY_MAX_WIDTH, Math.floor(width * 0.78)));
-	return Math.max(OVERLAY_MIN_WIDTH, Math.min(OVERLAY_MAX_WIDTH, target));
+	return Math.max(24, width);
 }
 
-/**
- * Break a free-form assistant/tool detail blob into sentence-sized lines so the
- * overlay stays readable even when the model streams raw fragments.
- */
-export function chunkDetailForOverlay(text: string, innerWidth: number, maxLines = 6): string[] {
-	const normalized = text.replace(/\s+/g, " ").trim();
-	if (!normalized) return [];
-	const boundary = /(?<=[.!?])\s+/;
-	const sentences = normalized.split(boundary).map((sentence) => sentence.trim()).filter(Boolean);
-	if (sentences.length === 0) return [normalized];
-	const lines: string[] = [];
-	const usable = Math.max(8, innerWidth);
-	for (const sentence of sentences) {
-		for (const wrapped of wrapTextWithAnsi(sentence, usable)) {
-			lines.push(wrapped);
-			if (lines.length >= maxLines) return lines;
-		}
-	}
-	return lines;
-}
-
-function borderColor(theme: Theme): ThemeColor {
-	return "borderAccent";
+function borderColor(theme: Theme, selected = false): ThemeColor {
+	return selected ? "borderAccent" : "border";
 }
 
-function renderRow(theme: Theme, content: string, innerWidth: number): string {
-	const truncated = truncateToWidth(content, innerWidth, "...");
+function renderRow(theme: Theme, content: string, innerWidth: number, selected = false): string {
+	const truncated = truncateToWidth(content, innerWidth, "");
 	const width = visibleWidth(truncated);
 	const filler = innerWidth > width ? " ".repeat(innerWidth - width) : "";
-	return `${theme.fg(borderColor(theme), "│")}${truncated}${filler}${theme.fg(borderColor(theme), "│")}`;
-}
-
-function renderHorizontalRule(theme: Theme, innerWidth: number): string {
-	return theme.fg(borderColor(theme), `├${"─".repeat(innerWidth)}┤`);
+	return `${theme.fg(borderColor(theme, selected), "│")}${truncated}${filler}${theme.fg(borderColor(theme, selected), "│")}`;
 }
 
-function renderBorderLine(theme: Theme, innerWidth: number, edge: "top" | "bottom"): string {
-	const side = edge === "top" ? "┌" : "└";
+function renderBorderLine(theme: Theme, innerWidth: number, edge: "top" | "bottom", selected = false): string {
+	const left = edge === "top" ? "┌" : "└";
 	const right = edge === "top" ? "┐" : "┘";
-	return theme.fg(borderColor(theme), `${side}${"─".repeat(innerWidth)}${right}`);
+	return theme.fg(borderColor(theme, selected), `${left}${"─".repeat(innerWidth)}${right}`);
 }
 
 function fitLine(line: string, width: number): string {
-	return visibleWidth(line) > width ? truncateToWidth(line, width, "...") : line;
+	return visibleWidth(line) > width ? truncateToWidth(line, width, "") : line;
 }
 
 function laneColor(status: RefineLaneState["status"]): ThemeColor {
@@ -144,74 +144,177 @@ function laneColor(status: RefineLaneState["status"]): ThemeColor {
 	}
 }
 
+function entryBadge(entry: RefineTranscriptEntry, theme: Theme): string {
+	const streaming = entry.streaming ? theme.fg("warning", " ▍") : "";
+	switch (entry.type) {
+		case "assistant-text":
+			return theme.fg("accent", theme.bold(" assistant ")) + streaming;
+		case "thinking":
+			return theme.fg("warning", theme.bold(" thinking ")) + streaming;
+		case "tool-call":
+			return theme.fg("accent", theme.bold(` tool ${entry.toolName ?? "call"} `)) + streaming;
+		case "tool-result":
+			return theme.fg(entry.isError ? "error" : "success", theme.bold(` ${entry.isError ? "error" : "result"} ${entry.toolName ?? ""} `)) + streaming;
+		case "diagnostic":
+			return theme.fg("error", theme.bold(" diagnostic "));
+	}
+}
+
+function wrapTranscriptText(text: string, width: number): string[] {
+	const sourceLines = text.replace(/\r\n/g, "\n").split("\n");
+	return sourceLines.flatMap((line) => line ? wrapTextWithAnsi(line, Math.max(1, width)) : [""]);
+}
+
+function previewTranscriptText(entry: RefineTranscriptEntry, width: number): { lines: string[]; truncated: boolean } {
+	const lines = wrapTranscriptText(entry.text, Math.max(1, width));
+	if (!entry.streaming || entry.type === "thinking" || lines.length <= STREAMING_PREVIEW_LINES) {
+		return { lines, truncated: false };
+	}
+	return { lines: lines.slice(-STREAMING_PREVIEW_LINES), truncated: true };
+}
+
+function footerText(laneCount: number): string {
+	const parts = ["Esc 关闭", "↑/↓ 滚动", "PgUp/PgDn 翻页"];
+	if (laneCount > 1) parts.push("Tab & Shift + Tab 切换 lane");
+	return parts.join(" · ");
+}
+
+function buildTranscriptLines(entries: RefineTranscriptEntry[], theme: Theme, width: number): string[] {
+	const lines: string[] = [];
+	for (const entry of entries) {
+		lines.push(entryBadge(entry, theme));
+		const preview = previewTranscriptText(entry, Math.max(1, width - 2));
+		if (preview.truncated) lines.push(`  ${theme.fg("dim", "…")}`);
+		for (const line of preview.lines) {
+			const styled = entry.type === "thinking"
+				? theme.fg("warning", line)
+				: entry.type === "tool-result" && entry.isError
+					? theme.fg("error", line)
+					: entry.type === "diagnostic"
+						? theme.fg("error", line)
+						: theme.fg("dim", line);
+			lines.push(`  ${styled}`);
+		}
+	}
+	return lines;
+}
+
+function summaryFor(role: RefineOverlayRole, lanes: RefineLaneState[], modelLabel?: string): string {
+	const complete = lanes.filter((lane) => lane.status === "complete").length;
+	const terminal = lanes.filter((lane) => ["complete", "failed", "cancelled"].includes(lane.status)).length;
+	const running = lanes.filter((lane) => lane.status === "running").length;
+	const title = role === "reviewer" ? "Reviewer" : "Criticizer";
+	const visibleTitle = modelLabel ? `${title} (${modelLabel})` : title;
+	const state = terminal === lanes.length ? "done" : running > 0 ? `${running} running` : "queued";
+	return `${visibleTitle} · ${complete}/${lanes.length} done · ${state}`;
+}
+
 export class RefineOverlayComponent implements Component {
 	private readonly theme: Theme;
 	private readonly role: RefineOverlayRole;
 	private readonly lanes: RefineLaneState[];
 	private readonly onCancel: () => void;
+	private readonly tui?: TUI;
+	private readonly modelLabel?: string;
+	private selectedLane = 0;
+	private disposed = false;
 
-	constructor(theme: Theme, role: RefineOverlayRole, lanes: RefineLaneState[], onCancel: () => void) {
+	constructor(theme: Theme, role: RefineOverlayRole, lanes: RefineLaneState[], onCancel: () => void, tui?: TUI, modelLabel?: string) {
 		this.theme = theme;
 		this.role = role;
 		this.lanes = lanes;
 		this.onCancel = onCancel;
+		this.tui = tui;
+		this.modelLabel = modelLabel;
+		this.tui?.terminal?.write?.("\x1b[?1000h\x1b[?1006h");
 	}
 
 	handleInput(data: string): void {
-		if (handleEscape(data)) this.onCancel();
+		if (this.disposed) return;
+		if (handleEscape(data)) {
+			this.onCancel();
+			return;
+		}
+		if (this.lanes.length > 1 && matchesKey(data, "tab")) {
+			this.selectedLane = (this.selectedLane + 1) % this.lanes.length;
+			this.tui?.requestRender();
+			return;
+		}
+		if (this.lanes.length > 1 && matchesKey(data, "shift+tab")) {
+			this.selectedLane = (this.selectedLane - 1 + this.lanes.length) % this.lanes.length;
+			this.tui?.requestRender();
+			return;
+		}
+		const lane = this.lanes[this.selectedLane];
+		if (!lane) return;
+		const viewport = Math.max(1, lane.viewportHeight ?? 1);
+		if (matchesKey(data, "up")) lane.scrollOffset -= 1;
+		else if (matchesKey(data, "down")) lane.scrollOffset += 1;
+		else if (matchesKey(data, "pageUp")) lane.scrollOffset -= Math.max(1, viewport - 1);
+		else if (matchesKey(data, "pageDown")) lane.scrollOffset += Math.max(1, viewport - 1);
+		else {
+			const mouse = data.match(/^\x1b\[<(\d+);\d+;\d+[Mm]$/);
+			if (!mouse || (Number(mouse[1]) & 64) !== 64) return;
+			lane.scrollOffset += (Number(mouse[1]) & 1) === 0 ? -3 : 3;
+		}
+		lane.followTranscript = false;
+		this.tui?.requestRender();
+	}
+
+	dispose(): void {
+		if (this.disposed) return;
+		this.disposed = true;
+		this.tui?.terminal?.write?.("\x1b[?1000l\x1b[?1006l");
 	}
 
 	render(width: number): string[] {
 		const dialogWidth = pickOverlayWidth(width);
-		const innerWidth = Math.max(8, dialogWidth - 2);
-		const title = this.role === "reviewer" ? "Reviewer" : "Criticizer";
-
-		// Build lane rows (label + status + detail sentence chunk)
-		const laneRows: string[] = [];
-		for (const lane of this.lanes) {
-			const status = this.theme.fg(laneColor(lane.status), statusLabel(lane.status));
-			const phase = lane.phase ? this.theme.fg("muted", ` · ${lane.phase}`) : "";
-			laneRows.push(this.theme.fg("accent", `▸ ${lane.label}:`) + ` ${status}${phase}`);
-			for (const chunk of chunkDetailForOverlay(lane.detail, innerWidth - 4, 4)) {
-				laneRows.push(this.theme.fg("dim", `    ${chunk}`));
-			}
-		}
-
-		const runningCount = this.lanes.filter((lane) => lane.status === "running").length;
-		const summary = `${this.lanes.length} lane${this.lanes.length === 1 ? "" : "s"}` +
-			(runningCount > 0 ? ` · ${runningCount} running` : "") +
-			(this.lanes.every((lane) => lane.status === "complete") ? " · all done" : "");
-
-		const hint = "Esc cancel · ↑/↓ lanes scroll when more lines than viewport";
-
-		// Compose chrome + body, then enforce viewport height.
-		const body = [
-			this.theme.fg("accent", this.theme.bold(title)),
-			this.theme.fg("dim", "Independent read-only refinement in progress"),
-			...laneRows,
-		];
-		if (body.length === 0) body.push(this.theme.fg("dim", "(no active lanes)"));
-
+		const innerWidth = Math.max(22, dialogWidth - 2);
 		const dialogHeight = pickOverlayHeight();
-		const available = Math.max(8, dialogHeight - CHROME_LINES);
-		const visibleBody = body.slice(Math.max(0, body.length - available));
-		const hiddenAbove = Math.max(0, body.length - visibleBody.length);
-		const summaryText = hiddenAbove > 0
-			? `${summary} · ↑${hiddenAbove}`
-			: summary;
-
+		const laneCount = Math.max(1, this.lanes.length);
+		const paneHeight = Math.max(3, Math.floor((dialogHeight - OVERLAY_CHROME_LINES) / laneCount));
+		const title = summaryFor(this.role, this.lanes, this.modelLabel);
 		const lines: string[] = [renderBorderLine(this.theme, innerWidth, "top")];
-		lines.push(renderRow(this.theme, this.theme.fg("accent", this.theme.bold(title)), innerWidth));
-		lines.push(renderRow(this.theme, this.theme.fg("dim", summaryText), innerWidth));
-		lines.push(renderHorizontalRule(this.theme, innerWidth));
-		for (const row of visibleBody) lines.push(renderRow(this.theme, row, innerWidth));
-		lines.push(renderHorizontalRule(this.theme, innerWidth));
-		lines.push(renderRow(this.theme, this.theme.fg("dim", hint), innerWidth));
-		lines.push(renderBorderLine(this.theme, innerWidth, "bottom"));
+		lines.push(renderRow(this.theme, this.theme.fg("accent", this.theme.bold(title)), innerWidth, false));
 
+		if (this.lanes.length === 0) {
+			lines.push(renderRow(this.theme, this.theme.fg("dim", "No active lanes"), innerWidth));
+		} else {
+			for (let index = 0; index < this.lanes.length; index++) {
+				lines.push(...this.renderPane(this.lanes[index]!, innerWidth, paneHeight, index === this.selectedLane));
+			}
+		}
+		lines.push(renderRow(this.theme, this.theme.fg("dim", footerText(this.lanes.length)), innerWidth));
+		lines.push(renderBorderLine(this.theme, innerWidth, "bottom"));
 		return lines.map((line) => fitLine(line, width));
 	}
 
+	private renderPane(lane: RefineLaneState, innerWidth: number, paneHeight: number, selected: boolean): string[] {
+		const transcriptWidth = Math.max(1, innerWidth - 2);
+		const transcriptLines = buildTranscriptLines(lane.transcript, this.theme, transcriptWidth);
+		const viewportHeight = Math.max(1, paneHeight - 3);
+		lane.viewportHeight = viewportHeight;
+		const maxScroll = Math.max(0, transcriptLines.length - viewportHeight);
+		if (lane.followTranscript) lane.scrollOffset = maxScroll;
+		else {
+			lane.scrollOffset = Math.max(0, Math.min(lane.scrollOffset, maxScroll));
+			if (lane.scrollOffset >= maxScroll) lane.followTranscript = true;
+		}
+		const hiddenAbove = lane.scrollOffset;
+		const hiddenBelow = Math.max(0, maxScroll - lane.scrollOffset);
+		const scrollCount = hiddenAbove || hiddenBelow ? ` ↑${hiddenAbove} ↓${hiddenBelow}` : "";
+		const status = this.theme.fg(laneColor(lane.status), statusLabel(lane.status));
+		const phase = lane.phase ? this.theme.fg("muted", ` · ${lane.phase}`) : "";
+		const marker = selected ? "▸ " : "  ";
+		const header = `${marker}${this.theme.fg("accent", this.theme.bold(lane.label))} ${status}${phase}${this.theme.fg("dim", scrollCount)}`;
+		const visible = transcriptLines.slice(lane.scrollOffset, lane.scrollOffset + viewportHeight);
+		const lines = [renderBorderLine(this.theme, innerWidth, "top", selected), renderRow(this.theme, header, innerWidth, selected)];
+		for (const line of visible) lines.push(renderRow(this.theme, line, innerWidth, selected));
+		for (let i = visible.length; i < viewportHeight; i++) lines.push(renderRow(this.theme, "", innerWidth, selected));
+		lines.push(renderBorderLine(this.theme, innerWidth, "bottom", selected));
+		return lines;
+	}
+
 	invalidate(): void {}
 }
 
@@ -220,10 +323,7 @@ export interface RefineOverlayContext {
 	hasUI: boolean;
 }
 
-/**
- * Owns a one-shot overlay. Child processes remain owned by the caller; the
- * controller only receives progress and supplies a single cancellation hook.
- */
+/** Owns the public overlay and exposes progress updates without owning child processes. */
 export class RefineOverlayController {
 	readonly lanes: RefineLaneState[];
 	private readonly role: RefineOverlayRole;
@@ -244,10 +344,15 @@ export class RefineOverlayController {
 			status: "queued",
 			phase: "queued",
 			detail: "",
+			transcript: [],
+			currentTurnIndex: 0,
+			scrollOffset: 0,
+			followTranscript: true,
+			viewportHeight: 1,
 		}));
 	}
 
-	open(ctx: RefineOverlayContext): void {
+	open(ctx: RefineOverlayContext, modelLabel?: string): void {
 		if (!ctx.hasUI || this.overlayPromise) return;
 
 		this.overlayPromise = ctx.ui
@@ -255,7 +360,7 @@ export class RefineOverlayController {
 				(_tui, theme, _keybindings, done) => {
 					this.tui = _tui;
 					this.done = done;
-					this.component = new RefineOverlayComponent(theme, this.role, this.lanes, () => this.cancel());
+					this.component = new RefineOverlayComponent(theme, this.role, this.lanes, () => this.cancel(), _tui, modelLabel);
 					if (this.closed) done(undefined);
 					return this.component;
 				},
@@ -297,17 +402,19 @@ export class RefineOverlayController {
 	}
 
 	cancel(): void {
-		if (this.closed) return;
-		this.onCancel();
+		// Esc only closes the overlay; the refiner child keeps running to natural
+		// completion and its result still flows through the tool result path.
 		void this.close();
 	}
 
 	async close(): Promise<void> {
 		if (!this.closed) {
 			this.closed = true;
+			this.component?.dispose();
 			if (this.done) this.done(undefined);
 			else this.handle?.hide();
 			this.component = undefined;
+			this.tui = undefined;
 		}
 		await this.overlayPromise;
 	}
@@ -315,8 +422,9 @@ export class RefineOverlayController {
 	isClosed(): boolean {
 		return this.closed;
 	}
+
 }
 
 export function refineOverlayContext(ctx: ExtensionContext | ExtensionCommandContext): RefineOverlayContext {
 	return { ui: ctx.ui, hasUI: ctx.hasUI };
-}
+}

package/src/state.ts

@@ -43,6 +43,9 @@ export interface PlansConfig {
 	artifact_root: string;
 	artifact_root_source: SettingSource;
 	artifact_root_updated_at: string | null;
+	/** null = never asked; the plans tool surfaces a hint so the agent asks once. */
+	graph_enabled: boolean | null;
+	graph_enabled_updated_at: string | null;
 }
 
 const DEFAULT_ARTIFACT_ROOT = "./docs/pi-plans";
@@ -80,6 +83,8 @@ export const DEFAULT_CONFIG: PlansConfig = {
 	artifact_root: DEFAULT_ARTIFACT_ROOT,
 	artifact_root_source: "unset",
 	artifact_root_updated_at: null,
+	graph_enabled: null,
+	graph_enabled_updated_at: null,
 };
 
 export const VALID_ROLE_MODES = new Set(["delegated-subagent", "current-session"]);
@@ -325,6 +330,13 @@ export function setArtifactRoot(workdir: string, artifactRoot: string, source: "
 	return { config, stateRoot, notices };
 }
 
+export function setGraphEnabled(workdir: string, enabled: boolean): EnsureResult {
+	const { config, stateRoot, notices } = ensureState(workdir);
+	config.graph_enabled = enabled;
+	config.graph_enabled_updated_at = utcNow();
+	atomicWriteJson(path.join(stateRoot, "config.json"), config);
+	return { config, stateRoot, notices };
+}
 
 export interface SetRoleOptions {
 	role: "reviewer" | "criticizer";
@@ -354,8 +366,13 @@ export function setRole(workdir: string, options: SetRoleOptions): EnsureResult
 	return { config, stateRoot, notices };
 }
 
-// ---------------------------------------------------------------------------
-// Runs
+export function updateConfig(workdir: string, updater: (config: PlansConfig) => PlansConfig): EnsureResult {
+	const { config, stateRoot, notices } = ensureState(workdir);
+	const next = updater(structuredClone(config));
+	atomicWriteJson(path.join(stateRoot, "config.json"), next);
+	return { config: next, stateRoot, notices };
+}
+
 // ---------------------------------------------------------------------------
 
 const SLUG_RE = /[^a-z0-9]+/g;
@@ -502,7 +519,3 @@ export function setRunStatus(workdir: string, runId: string, status: string): Ru
 	atomicWriteJson(runPath, run);
 	return run;
 }
-
-export function refsCacheDir(): string {
-	return path.join(os.homedir(), ".cache", "pi-plans", "refs");
-}