@oh-my-pi/pi-coding-agent 15.5.10 → 15.5.12

package/src/modes/components/custom-editor.ts

@@ -1,5 +1,6 @@
 import { Editor, type KeyId, matchesKey, parseKittySequence } from "@oh-my-pi/pi-tui";
 import type { AppKeybinding } from "../../config/keybindings";
+import { highlightUltrathink } from "../ultrathink";
 
 type ConfigurableEditorAction = Extract<
 	AppKeybinding,
@@ -44,6 +45,8 @@ const DEFAULT_ACTION_KEYS: Record<ConfigurableEditorAction, KeyId[]> = {
  * Custom editor that handles configurable app-level shortcuts for coding-agent.
  */
 export class CustomEditor extends Editor {
+	/** Rainbow-highlight the "ultrathink" keyword as the user types it. */
+	decorateText = highlightUltrathink;
 	onEscape?: () => void;
 	shouldBypassAutocompleteOnEscape?: () => boolean;
 	onClear?: () => void;

package/src/modes/interactive-mode.ts

@@ -67,7 +67,7 @@ import type { LspStartupServerInfo } from "../tools";
 import { normalizeLocalScheme } from "../tools/path-utils";
 import { setAutoQaConsentHandler } from "../tools/report-tool-issue";
 import { type ResolveToolDetails, runResolveInvocation } from "../tools/resolve";
-import { formatPhaseDisplayName } from "../tools/todo-write";
+import { formatPhaseDisplayName, selectStickyTodoWindow, todoMatchesAnyDescription } from "../tools/todo-write";
 import { ToolError } from "../tools/tool-errors";
 import type { EventBus } from "../utils/event-bus";
 import { getEditorCommand, openInEditor } from "../utils/external-editor";
@@ -324,6 +324,10 @@ export class InteractiveMode implements InteractiveModeContext {
 	#eventBus?: EventBus;
 	#eventBusUnsubscribers: Array<() => void> = [];
 	#welcomeComponent?: WelcomeComponent;
+	#todoSpinnerInterval?: NodeJS.Timeout;
+	#todoSpinnerFrame = 0;
+	#todoClosingTimeout?: NodeJS.Timeout;
+	#todoClosingState: "idle" | "playing" | "done" = "idle";
 
 	constructor(
 		session: AgentSession,
@@ -529,6 +533,12 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.#observerRegistry.setMainSession(this.sessionManager.getSessionFile() ?? undefined);
 		this.#observerRegistry.onChange(() => {
 			this.statusLine.setSubagentCount(this.#observerRegistry.getActiveSubagentCount());
+			// Auto-checkmark todos whose matching subagent just succeeded, then
+			// re-render so the running override (animated row when a subagent
+			// is doing the work for a still-pending todo) updates as subagents
+			// start, finish, or fail. Also handles spinner start/stop.
+			this.#reconcileTodosWithSubagents();
+			this.#renderTodoList();
 			this.ui.requestRender();
 		});
 
@@ -839,6 +849,7 @@ export class InteractiveMode implements InteractiveModeContext {
 			this.#pendingSubmissionDispose = undefined;
 		}
 		this.editor.setText("");
+		this.ui.refreshNativeScrollbackIfDirty();
 		this.ensureLoadingAnimation();
 		this.ui.requestRender();
 		return submission;
@@ -949,21 +960,101 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.renderSessionContext(context);
 	}
 
-	#formatTodoLine(todo: TodoItem, prefix: string): string {
+	#formatTodoLine(todo: TodoItem, prefix: string, matched: boolean, spinnerOn: boolean): string {
 		const checkbox = theme.checkbox;
 		const marker = formatHudNoteMarker(todo.notes?.length ?? 0);
+		const frames = theme.spinnerFrames;
+		// When the spinner is ticking, use the current animated frame; otherwise
+		// fall back to the static "running" glyph so in_progress rows still look
+		// distinct from pending rows.
+		const runningGlyph =
+			spinnerOn && frames.length > 0
+				? (frames[this.#todoSpinnerFrame % frames.length] ?? theme.status.running)
+				: theme.status.running;
 		switch (todo.status) {
 			case "completed":
-				return theme.fg("success", `${prefix}${checkbox.checked} ${chalk.strikethrough(todo.content)}`) + marker;
+				return (
+					theme.fg("success", `${prefix}${theme.status.success} ${chalk.strikethrough(todo.content)}`) + marker
+				);
 			case "in_progress":
-				return theme.fg("accent", `${prefix}${checkbox.unchecked} ${todo.content}`) + marker;
+				return theme.fg("accent", `${prefix}${runningGlyph} ${todo.content}`) + marker;
 			case "abandoned":
 				return theme.fg("error", `${prefix}${checkbox.unchecked} ${chalk.strikethrough(todo.content)}`) + marker;
 			default:
+				if (matched) {
+					return theme.fg("accent", `${prefix}${runningGlyph} ${todo.content}`) + marker;
+				}
 				return theme.fg("dim", `${prefix}${checkbox.unchecked} ${todo.content}`) + marker;
 		}
 	}
 
+	#getActiveSubagentDescriptions(): string[] {
+		const out: string[] = [];
+		for (const session of this.#observerRegistry.getSessions()) {
+			if (session.kind !== "subagent") continue;
+			if (session.status !== "active") continue;
+			const candidate =
+				session.description?.trim() || session.progress?.description?.trim() || session.label?.trim();
+			if (candidate) out.push(candidate);
+		}
+		return out;
+	}
+
+	/**
+	 * Auto-complete any pending/in_progress todo whose content matches a
+	 * subagent that has finished successfully. Fires on every observer
+	 * `onChange` so the visual state stays in sync with subagent lifecycle
+	 * without requiring the agent to issue a follow-up `todo_write`. Failed
+	 * and aborted subagents are intentionally NOT auto-completed — those
+	 * stay open so the user (or the next agent turn) can decide what to do.
+	 *
+	 * Idempotent: only flips open tasks, never re-touches completed ones.
+	 */
+	#reconcileTodosWithSubagents(): void {
+		const completedDescs: string[] = [];
+		for (const session of this.#observerRegistry.getSessions()) {
+			if (session.kind !== "subagent") continue;
+			if (session.status !== "completed") continue;
+			const candidate =
+				session.description?.trim() || session.progress?.description?.trim() || session.label?.trim();
+			if (candidate) completedDescs.push(candidate);
+		}
+		if (completedDescs.length === 0) return;
+
+		let mutated = false;
+		const next: TodoPhase[] = this.todoPhases.map(phase => ({
+			name: phase.name,
+			tasks: phase.tasks.map(task => {
+				if (task.status !== "pending" && task.status !== "in_progress") return task;
+				if (!todoMatchesAnyDescription(task.content, completedDescs)) return task;
+				mutated = true;
+				return { ...task, status: "completed" as const };
+			}),
+		}));
+		if (!mutated) return;
+		this.todoPhases = next;
+		this.session.setTodoPhases(next);
+	}
+
+	#updateTodoSpinnerAnimation(needSpinner: boolean): void {
+		if (needSpinner) {
+			if (this.#todoSpinnerInterval) return;
+			this.#todoSpinnerInterval = setInterval(() => {
+				const frames = theme.spinnerFrames;
+				if (frames.length === 0) return;
+				this.#todoSpinnerFrame = (this.#todoSpinnerFrame + 1) % frames.length;
+				// Rebuild the todo container so the new frame appears, then schedule
+				// a paint. The renderer self-stops the interval once no row needs it.
+				this.#renderTodoList();
+				this.ui.requestRender();
+			}, 80);
+		} else if (this.#todoSpinnerInterval) {
+			clearInterval(this.#todoSpinnerInterval);
+			this.#todoSpinnerInterval = undefined;
+			this.#todoSpinnerFrame = 0;
+		}
+	}
+
 	#getActivePhase(phases: TodoPhase[]): TodoPhase | undefined {
 		const nonEmpty = phases.filter(phase => phase.tasks.length > 0);
 		const active = nonEmpty.find(phase =>
@@ -976,44 +1067,183 @@ export class InteractiveMode implements InteractiveModeContext {
 		this.todoContainer.clear();
 		const phases = this.todoPhases.filter(phase => phase.tasks.length > 0);
 		if (phases.length === 0) {
+			this.#updateTodoSpinnerAnimation(false);
+			this.#stopTodoClosingAnimation();
+			this.#todoClosingState = "idle";
 			return;
 		}
 
+		// When every visible task is completed or abandoned, fold the panel
+		// away with a brief celebratory animation (see
+		// #startTodoClosingAnimation). State machine guards against replaying
+		// on every re-render once the animation has finished.
+		const allClosed = phases.every(phase =>
+			phase.tasks.every(t => t.status === "completed" || t.status === "abandoned"),
+		);
+		if (allClosed) {
+			this.#updateTodoSpinnerAnimation(false);
+			if (this.#todoClosingState === "done") return;
+			if (this.#todoClosingState === "idle") this.#startTodoClosingAnimation(phases);
+			return;
+		}
+		// Any open task here means the close animation is no longer applicable.
+		this.#stopTodoClosingAnimation();
+		this.#todoClosingState = "idle";
+
 		const indent = "  ";
 		const hook = theme.tree.hook;
 		const lines = ["", indent + theme.bold(theme.fg("accent", "Todos"))];
 
+		const activeDescs = this.#getActiveSubagentDescriptions();
+		// Cache matcher results so we don't re-scan the description list per row
+		// twice (once for the spinner decision, once for the render).
+		const matchedSet = new Set<TodoItem>();
+		const isMatched = (todo: TodoItem): boolean => {
+			if (activeDescs.length === 0) return false;
+			if (matchedSet.has(todo)) return true;
+			if (todoMatchesAnyDescription(todo.content, activeDescs)) {
+				matchedSet.add(todo);
+				return true;
+			}
+			return false;
+		};
+
+		// The cube animates whenever any visible open todo is "live":
+		// (a) status is in_progress (the agent itself is working it), or
+		// (b) a still-pending todo has a matching in-flight subagent doing
+		// the work for it. The renderer self-stops the interval once no row
+		// qualifies, so an orphan in_progress row at end-of-session keeps
+		// ticking — that's the intentional "this todo is still open" signal.
+		let needsSpinner = false;
+		const considerForSpinner = (todo: TodoItem): void => {
+			if (todo.status === "in_progress") {
+				needsSpinner = true;
+				return;
+			}
+			if (todo.status !== "pending") return;
+			if (isMatched(todo)) needsSpinner = true;
+		};
+
 		if (!this.todoExpanded) {
 			const activeIdx = phases.indexOf(this.#getActivePhase(phases) ?? phases[0]);
 			const activePhase = phases[activeIdx];
-			if (!activePhase) return;
+			if (!activePhase) {
+				this.#updateTodoSpinnerAnimation(false);
+				return;
+			}
+			const { visible, hiddenOpenCount } = selectStickyTodoWindow(activePhase.tasks, 5);
+			for (const todo of visible) considerForSpinner(todo);
+			this.#updateTodoSpinnerAnimation(needsSpinner);
+
 			lines.push(
 				`${indent}${theme.fg("accent", `${hook} ${formatPhaseDisplayName(activePhase.name, activeIdx + 1)}`)}`,
 			);
-			const visibleTasks = activePhase.tasks.slice(0, 5);
-			visibleTasks.forEach((todo, index) => {
+			visible.forEach((todo, index) => {
 				const prefix = `${indent}${index === 0 ? hook : " "} `;
-				lines.push(this.#formatTodoLine(todo, prefix));
+				lines.push(this.#formatTodoLine(todo, prefix, matchedSet.has(todo), needsSpinner));
 			});
-			if (visibleTasks.length < activePhase.tasks.length) {
-				const remaining = activePhase.tasks.length - visibleTasks.length;
-				lines.push(theme.fg("muted", `${indent}  ${hook} +${remaining} more`));
+			if (hiddenOpenCount > 0) {
+				lines.push(theme.fg("muted", `${indent}  ${hook} +${hiddenOpenCount} more`));
 			}
 			this.todoContainer.addChild(new Text(lines.join("\n"), 1, 0));
 			return;
 		}
 
+		for (const phase of phases) for (const todo of phase.tasks) considerForSpinner(todo);
+		this.#updateTodoSpinnerAnimation(needsSpinner);
+
 		phases.forEach((phase, phaseIndex) => {
 			lines.push(`${indent}${theme.fg("accent", `${hook} ${formatPhaseDisplayName(phase.name, phaseIndex + 1)}`)}`);
 			phase.tasks.forEach((todo, index) => {
 				const prefix = `${indent}${index === 0 ? hook : " "} `;
-				lines.push(this.#formatTodoLine(todo, prefix));
+				lines.push(this.#formatTodoLine(todo, prefix, matchedSet.has(todo), needsSpinner));
 			});
 		});
 
 		this.todoContainer.addChild(new Text(lines.join("\n"), 1, 0));
 	}
 
+	/**
+	 * Play a short "all done" close animation: a celebratory bright frame,
+	 * a brief dim transition, then a row-by-row vertical collapse until the
+	 * panel is empty. Triggered from #renderTodoList exactly once per
+	 * open-to-all-closed transition; #todoClosingState gates re-entry.
+	 *
+	 * While playing, the animator owns the panel container; #renderTodoList
+	 * returns early. Subsequent renders with state === "done" keep the
+	 * panel hidden until a fresh open task flips state back to "idle".
+	 */
+	#startTodoClosingAnimation(phases: TodoPhase[]): void {
+		this.#stopTodoClosingAnimation();
+		this.#todoClosingState = "playing";
+
+		const indent = "  ";
+		const hook = theme.tree.hook;
+		const snapshot: string[] = ["", `${indent}Todos ${theme.status.success}`];
+		for (let i = 0; i < phases.length; i++) {
+			const phase = phases[i];
+			snapshot.push(`${indent}${hook} ${formatPhaseDisplayName(phase.name, i + 1)}`);
+			for (let j = 0; j < phase.tasks.length; j++) {
+				const task = phase.tasks[j];
+				const mark = task.status === "abandoned" ? theme.status.aborted : theme.status.success;
+				const prefix = `${indent}${j === 0 ? hook : " "} `;
+				snapshot.push(`${prefix}${mark} ${task.content}`);
+			}
+		}
+
+		// Frame schedule (tint, drop-from-bottom, hold-ms). Frame 0 holds long
+		// enough for the user to actually read the final checkmarks before the
+		// fade starts; later frames fade and progressively drop rows from the
+		// bottom for the collapse effect. Total runtime ≈ 1.4s.
+		const frames = [
+			{ tint: "success" as const, drop: 0, holdMs: 900 },
+			{ tint: "success" as const, drop: 0, holdMs: 150 },
+			{ tint: "muted" as const, drop: 1, holdMs: 90 },
+			{ tint: "muted" as const, drop: 2, holdMs: 90 },
+			{ tint: "dim" as const, drop: 3, holdMs: 80 },
+			{ tint: "dim" as const, drop: 4, holdMs: 80 },
+		];
+
+		let frameIdx = 0;
+		const tick = (): void => {
+			if (this.#todoClosingState !== "playing") return;
+			if (frameIdx >= frames.length) {
+				this.todoContainer.clear();
+				this.#stopTodoClosingAnimation();
+				this.#todoClosingState = "done";
+				this.ui.requestRender();
+				return;
+			}
+			const { tint, drop, holdMs } = frames[frameIdx];
+			const visibleCount = Math.max(0, snapshot.length - drop);
+			this.todoContainer.clear();
+			if (visibleCount > 0) {
+				const visible = snapshot.slice(0, visibleCount);
+				const painted = visible.map((line, idx) => {
+					if (idx === 1) {
+						// Header row gets a bold flourish on the opening tick.
+						const colored = theme.fg(tint, line);
+						return frameIdx === 0 ? theme.bold(colored) : colored;
+					}
+					return theme.fg(tint, line);
+				});
+				this.todoContainer.addChild(new Text(painted.join("\n"), 1, 0));
+			}
+			this.ui.requestRender();
+			frameIdx++;
+			this.#todoClosingTimeout = setTimeout(tick, holdMs);
+		};
+
+		tick();
+	}
+
+	#stopTodoClosingAnimation(): void {
+		if (this.#todoClosingTimeout) {
+			clearTimeout(this.#todoClosingTimeout);
+			this.#todoClosingTimeout = undefined;
+		}
+	}
+
 	async #loadTodoList(): Promise<void> {
 		this.todoPhases = this.session.getTodoPhases();
 		this.#renderTodoList();
@@ -2035,6 +2265,7 @@ export class InteractiveMode implements InteractiveModeContext {
 			this.loadingAnimation = undefined;
 		}
 		this.#cleanupMicAnimation();
+		this.#updateTodoSpinnerAnimation(false);
 		this.#cancelGoalContinuation();
 		if (this.#sttController) {
 			this.#sttController.dispose();

package/src/modes/ultrathink.ts

@@ -0,0 +1,79 @@
+import ultrathinkNotice from "../prompts/system/ultrathink-notice.md" with { type: "text" };
+import { theme } from "./theme/theme";
+
+/**
+ * "ultrathink" keyword support, mirroring Claude Code's affordance.
+ *
+ * Typing the standalone word in the input editor paints it with a rainbow
+ * gradient ({@link highlightUltrathink}); submitting a message that mentions it
+ * appends a hidden {@link ULTRATHINK_NOTICE} nudging the model toward careful
+ * multi-step reasoning. Matching is word-bounded and case-insensitive, so
+ * "ultrathinking"/"ultrathinks" never trigger either behavior.
+ */
+
+// Cheap, stateless presence probe used to skip the boundary regex on most lines.
+const ULTRATHINK_PROBE = /ultrathink/i;
+// Detection: standalone keyword, any case. Non-global so `.test` stays stateless.
+const ULTRATHINK_WORD = /\bultrathink\b/i;
+// Highlight: global so `.replace` walks every occurrence.
+const ULTRATHINK_HIGHLIGHT = /\bultrathink\b/gi;
+
+/** Hidden system notice appended after a user message that mentions "ultrathink". */
+export const ULTRATHINK_NOTICE: string = ultrathinkNotice.trim();
+
+/** Whether `text` contains the standalone keyword "ultrathink" (any case). */
+export function containsUltrathink(text: string): boolean {
+	return ULTRATHINK_WORD.test(text);
+}
+
+const FG_RESET = "\x1b[39m";
+// Hue stops swept across the visible spectrum. More stops than the keyword has
+// letters so the gradient resolves smoothly regardless of casing/match length.
+const RAINBOW_STOPS = 14;
+
+let cachedMode: string | undefined;
+let cachedPalette: readonly string[] | undefined;
+
+/** Rainbow foreground escapes for the active color mode, compiled once per mode. */
+function rainbowPalette(): readonly string[] {
+	const mode = theme.getColorMode();
+	if (cachedPalette && cachedMode === mode) return cachedPalette;
+	const format = mode === "truecolor" ? "ansi-16m" : "ansi-256";
+	const palette: string[] = [];
+	for (let i = 0; i < RAINBOW_STOPS; i++) {
+		// Sweep red→violet (0..330°), stopping short of the wrap back to red.
+		const hue = Math.round((i / RAINBOW_STOPS) * 330);
+		palette.push(Bun.color(`hsl(${hue}, 90%, 62%)`, format) ?? "");
+	}
+	cachedMode = mode;
+	cachedPalette = palette;
+	return palette;
+}
+
+/** Paint each character of `word` with the next rainbow stop, resetting fg after. */
+function rainbow(word: string): string {
+	const palette = rainbowPalette();
+	const n = word.length;
+	let out = "";
+	let prev = "";
+	for (let i = 0; i < n; i++) {
+		const color = palette[Math.floor((i / n) * palette.length)] ?? palette[0] ?? "";
+		// Coalesce consecutive characters that resolve to the same stop.
+		if (color !== prev) {
+			out += color;
+			prev = color;
+		}
+		out += word[i];
+	}
+	return `${out}${FG_RESET}`;
+}
+
+/**
+ * Rainbow-highlight every standalone "ultrathink" in `text` for editor display.
+ * Adds only zero-width SGR escapes — the visible width is unchanged — and returns
+ * the input untouched when the keyword is absent.
+ */
+export function highlightUltrathink(text: string): string {
+	if (!ULTRATHINK_PROBE.test(text)) return text;
+	return text.replace(ULTRATHINK_HIGHLIGHT, rainbow);
+}

package/src/prompts/system/ultrathink-notice.md

@@ -0,0 +1,3 @@
+<system-notice>
+This task involves multi-step reasoning. Think carefully through the problem before responding.
+</system-notice>

package/src/session/agent-session.ts

@@ -148,6 +148,7 @@ import type { HindsightSessionState } from "../hindsight/state";
 import { type LocalProtocolOptions, resolveLocalUrlToPath } from "../internal-urls";
 import { resolveMemoryBackend } from "../memory-backend";
 import { getCurrentThemeName, theme } from "../modes/theme/theme";
+import { containsUltrathink, ULTRATHINK_NOTICE } from "../modes/ultrathink";
 import type { PlanModeState } from "../plan-mode/state";
 import autoContinuePrompt from "../prompts/system/auto-continue.md" with { type: "text" };
 import eagerTodoPrompt from "../prompts/system/eager-todo.md" with { type: "text" };
@@ -3997,6 +3998,21 @@ export class AgentSession {
 		// Expand file-based prompt templates if requested
 		const expandedText = expandPromptTemplates ? expandPromptTemplate(text, [...this.#promptTemplates]) : text;
 
+		// "ultrathink" keyword: nudge the model toward careful multi-step reasoning by
+		// appending a hidden notice after the user's message. User-authored prompts only —
+		// synthetic/agent-initiated turns never trigger it.
+		const ultrathinkNotice: CustomMessage | undefined =
+			!options?.synthetic && containsUltrathink(expandedText)
+				? {
+						role: "custom",
+						customType: "ultrathink-notice",
+						content: ULTRATHINK_NOTICE,
+						display: false,
+						attribution: "user",
+						timestamp: Date.now(),
+					}
+				: undefined;
+
 		// If streaming, queue via steer() or followUp() based on option
 		if (this.isStreaming) {
 			if (!options?.streamingBehavior) {
@@ -4007,6 +4023,10 @@ export class AgentSession {
 			} else {
 				await this.#queueSteer(expandedText, options?.images);
 			}
+			// Steer/follow-up the ultrathink notice alongside the queued user message.
+			if (ultrathinkNotice) {
+				await this.sendCustomMessage(ultrathinkNotice, { deliverAs: options.streamingBehavior });
+			}
 			return;
 		}
 
@@ -4035,6 +4055,7 @@ export class AgentSession {
 			await this.#promptWithMessage(message, expandedText, {
 				...options,
 				prependMessages: eagerTodoPrelude ? [eagerTodoPrelude.message] : undefined,
+				appendMessages: ultrathinkNotice ? [ultrathinkNotice] : undefined,
 			});
 		} finally {
 			// Clean up residual eager-todo directive if the prompt never consumed it
@@ -4084,6 +4105,7 @@ export class AgentSession {
 		expandedText: string,
 		options?: Pick<PromptOptions, "toolChoice" | "images" | "skipCompactionCheck"> & {
 			prependMessages?: AgentMessage[];
+			appendMessages?: AgentMessage[];
 			skipPostPromptRecoveryWait?: boolean;
 		},
 	): Promise<void> {
@@ -4147,6 +4169,12 @@ export class AgentSession {
 
 			messages.push(message);
 
+			// Inject the ultrathink notice (and any other per-turn appends) right after the
+			// user message so the model reads it as part of the same turn.
+			if (options?.appendMessages) {
+				messages.push(...options.appendMessages);
+			}
+
 			// Early bail-out: if a newer abort/prompt cycle started during setup,
 			// return before mutating shared state (nextTurn messages, system prompt).
 			if (this.#promptGeneration !== generation) {