@oh-my-pi/pi-coding-agent 15.0.0 → 15.0.1

package/src/modes/components/eval-execution.ts

@@ -4,11 +4,17 @@
  */
 
 import { sanitizeText } from "@oh-my-pi/pi-natives";
-import { Container, Loader, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
-import { getSymbolTheme, highlightCode, theme } from "../../modes/theme/theme";
-import { formatTruncationMetaNotice, type TruncationMeta } from "../../tools/output-meta";
-import { DynamicBorder } from "./dynamic-border";
-import { truncateToVisualLines } from "./visual-truncate";
+import { Container, type Loader, Text, type TUI } from "@oh-my-pi/pi-tui";
+import { highlightCode, theme } from "../../modes/theme/theme";
+import type { TruncationMeta } from "../../tools/output-meta";
+import {
+	buildExecutionFrame,
+	buildStatusFooter,
+	createCollapsedPreview,
+	type ExecutionColorKey,
+	type ExecutionStatus,
+	resolveExecutionStatus,
+} from "./execution-shared";
 
 const PREVIEW_LINES = 20;
 const MAX_DISPLAY_LINE_CHARS = 4000;
@@ -17,7 +23,7 @@ export type EvalExecutionLanguage = "python" | "js";
 
 export class EvalExecutionComponent extends Container {
 	#outputLines: string[] = [];
-	#status: "running" | "complete" | "cancelled" | "error" = "running";
+	#status: ExecutionStatus = "running";
 	#exitCode: number | undefined = undefined;
 	#loader: Loader;
 	#truncation?: TruncationMeta;
@@ -28,7 +34,7 @@ export class EvalExecutionComponent extends Container {
 		return this.language === "js" ? "javascript" : "python";
 	}
 
-	#formatHeader(colorKey: "dim" | "pythonMode"): Text {
+	#formatHeader(colorKey: ExecutionColorKey): Text {
 		const prompt = theme.fg(colorKey, theme.bold(">>>"));
 		const continuation = theme.fg(colorKey, "    ");
 		const codeLines = highlightCode(this.code, this.#highlightLang());
@@ -46,26 +52,13 @@ export class EvalExecutionComponent extends Container {
 	) {
 		super();
 
-		const colorKey = this.excludeFromContext ? "dim" : "pythonMode";
-		const borderColor = (str: string) => theme.fg(colorKey, str);
+		const colorKey: ExecutionColorKey = this.excludeFromContext ? "dim" : "pythonMode";
+		const { contentContainer, loader } = buildExecutionFrame(this, ui, colorKey);
+		this.#contentContainer = contentContainer;
+		this.#loader = loader;
 
-		this.addChild(new Spacer(1));
-		this.addChild(new DynamicBorder(borderColor));
-
-		this.#contentContainer = new Container();
-		this.addChild(this.#contentContainer);
 		this.#contentContainer.addChild(this.#formatHeader(colorKey));
-
-		this.#loader = new Loader(
-			ui,
-			spinner => theme.fg(colorKey, spinner),
-			text => theme.fg("muted", text),
-			`Running… (esc to cancel)`,
-			getSymbolTheme().spinnerFrames,
-		);
 		this.#contentContainer.addChild(this.#loader);
-
-		this.addChild(new DynamicBorder(borderColor));
 	}
 
 	setExpanded(expanded: boolean): void {
@@ -99,11 +92,7 @@ export class EvalExecutionComponent extends Container {
 		options?: { output?: string; truncation?: TruncationMeta },
 	): void {
 		this.#exitCode = exitCode;
-		this.#status = cancelled
-			? "cancelled"
-			: exitCode !== 0 && exitCode !== undefined && exitCode !== null
-				? "error"
-				: "complete";
+		this.#status = resolveExecutionStatus(exitCode, cancelled);
 		this.#truncation = options?.truncation;
 		if (options?.output !== undefined) {
 			this.#setOutput(options.output);
@@ -120,7 +109,7 @@ export class EvalExecutionComponent extends Container {
 
 		this.#contentContainer.clear();
 
-		const colorKey = this.excludeFromContext ? "dim" : "pythonMode";
+		const colorKey: ExecutionColorKey = this.excludeFromContext ? "dim" : "pythonMode";
 		this.#contentContainer.addChild(this.#formatHeader(colorKey));
 
 		if (availableLines.length > 0) {
@@ -129,39 +118,20 @@ export class EvalExecutionComponent extends Container {
 				this.#contentContainer.addChild(new Text(`\n${displayText}`, 1, 0));
 			} else {
 				const styledOutput = previewLogicalLines.map(line => theme.fg("muted", line)).join("\n");
-				const previewText = `\n${styledOutput}`;
-				this.#contentContainer.addChild({
-					render: (width: number) => {
-						const { visualLines } = truncateToVisualLines(previewText, PREVIEW_LINES, width, 1);
-						return visualLines;
-					},
-					invalidate: () => {},
-				});
+				this.#contentContainer.addChild(createCollapsedPreview(`\n${styledOutput}`, PREVIEW_LINES));
 			}
 		}
 
 		if (this.#status === "running") {
 			this.#contentContainer.addChild(this.#loader);
 		} else {
-			const statusParts: string[] = [];
-
-			if (hiddenLineCount > 0) {
-				statusParts.push(theme.fg("dim", `… ${hiddenLineCount} more lines (ctrl+o to expand)`));
-			}
-
-			if (this.#status === "cancelled") {
-				statusParts.push(theme.fg("warning", "(cancelled)"));
-			} else if (this.#status === "error") {
-				statusParts.push(theme.fg("error", `(exit ${this.#exitCode})`));
-			}
-
-			if (this.#truncation) {
-				statusParts.push(theme.fg("warning", formatTruncationMetaNotice(this.#truncation)));
-			}
-
-			if (statusParts.length > 0) {
-				this.#contentContainer.addChild(new Text(`\n${statusParts.join("\n")}`, 1, 0));
-			}
+			const footer = buildStatusFooter({
+				status: this.#status,
+				exitCode: this.#exitCode,
+				truncation: this.#truncation,
+				hiddenLineCount,
+			});
+			if (footer) this.#contentContainer.addChild(footer);
 		}
 	}
 

package/src/modes/components/execution-shared.ts

@@ -0,0 +1,102 @@
+/**
+ * Shared rendering primitives for bash/eval execution components.
+ *
+ * Each helper isolates a piece of structure both components share verbatim
+ * (frame layout, collapsed preview, post-run status line). Differences in
+ * how each component prepares its header, output lines, or sixel masking
+ * stay in their respective files.
+ */
+
+import { type Component, Container, Loader, Spacer, Text, type TUI } from "@oh-my-pi/pi-tui";
+import { getSymbolTheme, theme } from "../../modes/theme/theme";
+import { formatTruncationMetaNotice, type TruncationMeta } from "../../tools/output-meta";
+import { DynamicBorder } from "./dynamic-border";
+import { truncateToVisualLines } from "./visual-truncate";
+
+export type ExecutionStatus = "running" | "complete" | "cancelled" | "error";
+
+/** Theme color keys valid for an execution frame. */
+export type ExecutionColorKey = "dim" | "bashMode" | "pythonMode";
+
+/**
+ * Build the spacer + top border + content container + bottom border scaffold
+ * that bash and eval execution components share. The caller appends the
+ * header (command vs `>>>` prompt) and the returned loader to
+ * `contentContainer` so per-mode order is preserved.
+ */
+export function buildExecutionFrame(
+	parent: Container,
+	ui: TUI,
+	colorKey: ExecutionColorKey,
+): { contentContainer: Container; loader: Loader } {
+	const borderColor = (str: string) => theme.fg(colorKey, str);
+
+	parent.addChild(new Spacer(1));
+	parent.addChild(new DynamicBorder(borderColor));
+
+	const contentContainer = new Container();
+	parent.addChild(contentContainer);
+
+	const loader = new Loader(
+		ui,
+		spinner => theme.fg(colorKey, spinner),
+		text => theme.fg("muted", text),
+		`Running… (esc to cancel)`,
+		getSymbolTheme().spinnerFrames,
+	);
+
+	parent.addChild(new DynamicBorder(borderColor));
+	return { contentContainer, loader };
+}
+
+/**
+ * Wrap a styled preview block in a render-time visual-line truncator.
+ * Recomputed per render width so wrapping stays in sync with terminal size.
+ */
+export function createCollapsedPreview(previewText: string, previewLines: number): Component {
+	return {
+		render: (width: number) => truncateToVisualLines(previewText, previewLines, width, 1).visualLines,
+		invalidate: () => {},
+	};
+}
+
+/**
+ * Build the post-run status block (hidden-line hint, exit/cancel marker,
+ * truncation notice). Returns undefined when there is nothing to display so
+ * callers can skip appending a stray Text child.
+ */
+export function buildStatusFooter(opts: {
+	status: ExecutionStatus;
+	exitCode: number | undefined;
+	truncation: TruncationMeta | undefined;
+	hiddenLineCount: number;
+	/** Suppress the "… N more lines" hint (used when sixel passthrough renders the full output). */
+	suppressHiddenCount?: boolean;
+}): Text | undefined {
+	const parts: string[] = [];
+
+	if (opts.hiddenLineCount > 0 && !opts.suppressHiddenCount) {
+		parts.push(theme.fg("dim", `… ${opts.hiddenLineCount} more lines (ctrl+o to expand)`));
+	}
+	if (opts.status === "cancelled") {
+		parts.push(theme.fg("warning", "(cancelled)"));
+	} else if (opts.status === "error") {
+		parts.push(theme.fg("error", `(exit ${opts.exitCode})`));
+	}
+	if (opts.truncation) {
+		parts.push(theme.fg("warning", formatTruncationMetaNotice(opts.truncation)));
+	}
+
+	if (parts.length === 0) return undefined;
+	return new Text(`\n${parts.join("\n")}`, 1, 0);
+}
+
+/**
+ * Derive the post-run status from an exit code + cancellation flag using the
+ * same precedence both execution components apply.
+ */
+export function resolveExecutionStatus(exitCode: number | undefined, cancelled: boolean): ExecutionStatus {
+	if (cancelled) return "cancelled";
+	if (exitCode !== 0 && exitCode !== undefined && exitCode !== null) return "error";
+	return "complete";
+}

package/src/modes/components/hook-message.ts

@@ -1,9 +1,12 @@
-import type { TextContent } from "@oh-my-pi/pi-ai";
 import type { Component } from "@oh-my-pi/pi-tui";
-import { Box, Container, Markdown, Spacer, Text } from "@oh-my-pi/pi-tui";
+import { Box, Container, Spacer } from "@oh-my-pi/pi-tui";
 import type { HookMessageRenderer } from "../../extensibility/hooks/types";
-import { getMarkdownTheme, theme } from "../../modes/theme/theme";
+import { theme } from "../../modes/theme/theme";
 import type { HookMessage } from "../../session/messages";
+import { renderFramedMessage } from "./message-frame";
+
+/** Lines of default markdown body shown before the "…" fold when collapsed. */
+const HOOK_COLLAPSED_LINES = 5;
 
 /**
  * Component that renders a custom message entry from hooks.
@@ -41,60 +44,25 @@ export class HookMessageComponent extends Container {
 	}
 
 	#rebuild(): void {
-		// Remove previous content component
 		if (this.#customComponent) {
 			this.removeChild(this.#customComponent);
 			this.#customComponent = undefined;
 		}
 		this.removeChild(this.#box);
 
-		// Try custom renderer first - it handles its own styling
-		if (this.customRenderer) {
-			try {
-				const component = this.customRenderer(this.message, { expanded: this.#expanded }, theme);
-				if (component) {
-					// Custom renderer provides its own styled component
-					this.#customComponent = component;
-					this.addChild(component);
-					return;
-				}
-			} catch {
-				// Fall through to default rendering
-			}
-		}
-
-		// Default rendering uses our box
-		this.addChild(this.#box);
-		this.#box.clear();
-
-		// Default rendering: label + content
-		const label = theme.fg("customMessageLabel", theme.bold(`[${this.message.customType}]`));
-		this.#box.addChild(new Text(label, 0, 0));
-		this.#box.addChild(new Spacer(1));
+		const custom = renderFramedMessage({
+			message: this.message,
+			box: this.#box,
+			expanded: this.#expanded,
+			customRenderer: this.customRenderer,
+			collapseAfterLines: HOOK_COLLAPSED_LINES,
+		});
 
-		// Extract text content
-		let text: string;
-		if (typeof this.message.content === "string") {
-			text = this.message.content;
+		if (custom) {
+			this.#customComponent = custom;
+			this.addChild(custom);
 		} else {
-			text = this.message.content
-				.filter((c): c is TextContent => c.type === "text")
-				.map(c => c.text)
-				.join("\n");
+			this.addChild(this.#box);
 		}
-
-		// Limit lines when collapsed
-		if (!this.#expanded) {
-			const lines = text.split("\n");
-			if (lines.length > 5) {
-				text = `${lines.slice(0, 5).join("\n")}\n…`;
-			}
-		}
-
-		this.#box.addChild(
-			new Markdown(text, 0, 0, getMarkdownTheme(), {
-				color: (text: string) => theme.fg("customMessageText", text),
-			}),
-		);
 	}
 }

package/src/modes/components/mcp-add-wizard.ts

@@ -47,6 +47,18 @@ type WizardStep =
 	| "scope"
 	| "confirm";
 
+/**
+ * Result of the wizard's OAuth callback. `credentialId` is mandatory;
+ * `clientId`/`clientSecret` are populated when the OAuth provider performed
+ * dynamic client registration (or when the caller pre-supplied them) so the
+ * wizard can fold them into the final `mcp.json` entry for refresh.
+ */
+export interface MCPAddWizardOAuthResult {
+	credentialId: string;
+	clientId?: string;
+	clientSecret?: string;
+}
+
 interface WizardState {
 	name: string;
 	transport: TransportType | null;
@@ -104,7 +116,13 @@ export class MCPAddWizard extends Container {
 	#onCompleteCallback: (name: string, config: MCPServerConfig, scope: Scope) => void;
 	#onCancelCallback: () => void;
 	#onOAuthCallback:
-		| ((authUrl: string, tokenUrl: string, clientId: string, clientSecret: string, scopes: string) => Promise<string>)
+		| ((
+				authUrl: string,
+				tokenUrl: string,
+				clientId: string,
+				clientSecret: string,
+				scopes: string,
+		  ) => Promise<MCPAddWizardOAuthResult>)
 		| null = null;
 	#onTestConnectionCallback: ((config: MCPServerConfig) => Promise<void>) | null = null;
 	#onRenderCallback: (() => void) | null = null;
@@ -118,7 +136,7 @@ export class MCPAddWizard extends Container {
 			clientId: string,
 			clientSecret: string,
 			scopes: string,
-		) => Promise<string>,
+		) => Promise<MCPAddWizardOAuthResult>,
 		onTestConnection?: (config: MCPServerConfig) => Promise<void>,
 		onRender?: () => void,
 		initialName?: string,
@@ -1120,7 +1138,7 @@ export class MCPAddWizard extends Container {
 
 		try {
 			// Call OAuth handler
-			const credentialId = await this.#onOAuthCallback(
+			const oauthResult = await this.#onOAuthCallback(
 				this.#state.oauthAuthUrl,
 				this.#state.oauthTokenUrl,
 				this.#state.oauthClientId,
@@ -1128,8 +1146,11 @@ export class MCPAddWizard extends Container {
 				this.#state.oauthScopes,
 			);
 
-			// Store credential ID
-			this.#state.oauthCredentialId = credentialId;
+			// Store credential ID + any dynamically-registered client credentials,
+			// so the final mcp.json entry persists everything needed for refresh.
+			this.#state.oauthCredentialId = oauthResult.credentialId;
+			if (oauthResult.clientId) this.#state.oauthClientId = oauthResult.clientId;
+			if (oauthResult.clientSecret) this.#state.oauthClientSecret = oauthResult.clientSecret;
 
 			// Show success message
 			this.#contentContainer.clear();

package/src/modes/components/message-frame.ts

@@ -0,0 +1,88 @@
+/**
+ * Shared rendering for extension/hook custom message frames.
+ *
+ * Both `CustomMessageComponent` and `HookMessageComponent` wrap a
+ * `Spacer(1) + Box` layout, try a user-supplied renderer first, and fall
+ * back to a label + markdown body when the renderer returns nothing or
+ * throws. The only meaningful difference is that hook messages collapse to
+ * the first N lines when not expanded; extension messages render in full.
+ */
+
+import type { TextContent } from "@oh-my-pi/pi-ai";
+import type { Box, Component } from "@oh-my-pi/pi-tui";
+import { Markdown, Spacer, Text } from "@oh-my-pi/pi-tui";
+import { getMarkdownTheme, type Theme, theme } from "../../modes/theme/theme";
+
+/** Message shape consumed by the shared frame. */
+export interface FramedMessage {
+	customType: string;
+	content: string | (TextContent | { type: string })[];
+}
+
+/**
+ * Callable signature shared by `MessageRenderer` (extensions) and
+ * `HookMessageRenderer` (hooks). Both narrow `message` to their own type;
+ * this signature is the structural intersection callers can hand off here.
+ */
+export type FramedRenderer<M extends FramedMessage> = (
+	message: M,
+	options: { expanded: boolean },
+	theme: Theme,
+) => Component | undefined;
+
+export interface RebuildFrameOptions<M extends FramedMessage> {
+	message: M;
+	box: Box;
+	expanded: boolean;
+	/** Collapse the markdown body to this many lines when `expanded` is false. Omit to never collapse. */
+	collapseAfterLines?: number;
+	customRenderer?: FramedRenderer<M>;
+}
+
+/**
+ * Attempt the custom renderer; on failure or undefined return, populate
+ * `box` with the default `[customType]` label + markdown body and return
+ * undefined. When the custom renderer succeeds, return its Component so the
+ * caller can mount it and skip the default box.
+ */
+export function renderFramedMessage<M extends FramedMessage>(opts: RebuildFrameOptions<M>): Component | undefined {
+	if (opts.customRenderer) {
+		try {
+			const component = opts.customRenderer(opts.message, { expanded: opts.expanded }, theme);
+			if (component) return component;
+		} catch {
+			// Fall through to default rendering
+		}
+	}
+
+	opts.box.clear();
+
+	const label = theme.fg("customMessageLabel", theme.bold(`[${opts.message.customType}]`));
+	opts.box.addChild(new Text(label, 0, 0));
+	opts.box.addChild(new Spacer(1));
+
+	let text: string;
+	if (typeof opts.message.content === "string") {
+		text = opts.message.content;
+	} else {
+		text = opts.message.content
+			.filter((c): c is TextContent => c.type === "text")
+			.map(c => c.text)
+			.join("\n");
+	}
+
+	if (!opts.expanded && opts.collapseAfterLines !== undefined) {
+		const lines = text.split("\n");
+		if (lines.length > opts.collapseAfterLines) {
+			text = `${lines.slice(0, opts.collapseAfterLines).join("\n")}\n…`;
+		}
+	}
+
+	opts.box.addChild(
+		new Markdown(text, 0, 0, getMarkdownTheme(), {
+			color: (value: string) => theme.fg("customMessageText", value),
+		}),
+	);
+
+	return undefined;
+}

package/src/modes/components/model-selector.ts

@@ -2,6 +2,7 @@ import { ThinkingLevel } from "@oh-my-pi/pi-agent-core";
 import { getSupportedEfforts, type Model, modelsAreEqual } from "@oh-my-pi/pi-ai";
 import {
 	Container,
+	fuzzyFilter,
 	getKeybindings,
 	Input,
 	matchesKey,
@@ -18,7 +19,6 @@ import { resolveModelRoleValue } from "../../config/model-resolver";
 import type { Settings } from "../../config/settings";
 import { type ThemeColor, theme } from "../../modes/theme/theme";
 import { getThinkingLevelMetadata } from "../../thinking";
-import { fuzzyFilter } from "../../utils/fuzzy";
 import { getTabBarTheme } from "../shared";
 import { DynamicBorder } from "./dynamic-border";
 

package/src/modes/components/session-observer-overlay.ts

@@ -18,6 +18,7 @@ import type { ToolResultMessage } from "@oh-my-pi/pi-ai";
 import { Container, Markdown, type MarkdownTheme, matchesKey } from "@oh-my-pi/pi-tui";
 import { formatDuration, formatNumber, logger } from "@oh-my-pi/pi-utils";
 import type { KeyId } from "../../config/keybindings";
+import { isSilentAbort } from "../../session/messages";
 import type { SessionMessageEntry } from "../../session/session-manager";
 import { parseSessionEntries } from "../../session/session-manager";
 import { PREVIEW_LIMITS, replaceTabs, TRUNCATE_LENGTHS, truncateToWidth } from "../../tools/render-utils";
@@ -267,7 +268,10 @@ export class SessionObserverOverlayComponent extends Container {
 		if (progress.toolCount > 0) stats.push(`${formatNumber(progress.toolCount)} tools`);
 		if (progress.tokens > 0) stats.push(`${formatNumber(progress.tokens)} tokens`);
 		if (progress.durationMs > 0) stats.push(formatDuration(progress.durationMs));
-		return stats.length > 0 ? theme.fg("dim", stats.join(theme.sep.dot)) : "";
+		const parts: string[] = [];
+		if (stats.length > 0) parts.push(theme.fg("dim", stats.join(theme.sep.dot)));
+		if (progress.cost > 0) parts.push(theme.fg("statusLineCost", `$${progress.cost.toFixed(2)}`));
+		return parts.join(theme.sep.dot);
 	}
 
 	#buildTranscriptLines(messageEntries: SessionMessageEntry[], lines: string[]): void {
@@ -285,7 +289,7 @@ export class SessionObserverOverlayComponent extends Container {
 
 			if (msg.role === "assistant") {
 				// Handle error messages with empty content
-				if (msg.content.length === 0 && msg.errorMessage) {
+				if (msg.content.length === 0 && msg.errorMessage && !isSilentAbort(msg.errorMessage)) {
 					const startLine = lines.length;
 					const isSelected = entryIndex === this.#selectedEntryIndex;
 					const cursor = isSelected ? theme.fg("accent", "▶") : " ";

package/src/modes/components/session-selector.ts

@@ -1,6 +1,7 @@
 import {
 	type Component,
 	Container,
+	fuzzyFilter,
 	Input,
 	matchesKey,
 	padding,
@@ -14,7 +15,6 @@ import { formatBytes } from "@oh-my-pi/pi-utils";
 import { theme } from "../../modes/theme/theme";
 import { matchesAppInterrupt } from "../../modes/utils/keybinding-matchers";
 import type { SessionInfo } from "../../session/session-manager";
-import { fuzzyFilter } from "../../utils/fuzzy";
 import { DynamicBorder } from "./dynamic-border";
 import { HookSelectorComponent } from "./hook-selector";
 

package/src/modes/components/status-line/segments.ts

@@ -3,7 +3,7 @@ import * as path from "node:path";
 import { ThinkingLevel } from "@oh-my-pi/pi-agent-core";
 import { TERMINAL } from "@oh-my-pi/pi-tui";
 import { formatDuration, formatNumber, getProjectDir, relativePathWithinRoot } from "@oh-my-pi/pi-utils";
-import { theme } from "../../../modes/theme/theme";
+import { type ThemeColor, theme } from "../../../modes/theme/theme";
 import { shortenPath } from "../../../tools/render-utils";
 import { getSessionAccentAnsi, getSessionAccentHex } from "../../../utils/session-color";
 import { sanitizeStatusText } from "../../shared";
@@ -76,17 +76,65 @@ const modelSegment: StatusLineSegment = {
 	},
 };
 
+function formatGoalBudget(current: number, budget?: number): string {
+	const used = formatNumber(current);
+	if (budget === undefined) return used;
+	return `${used}/${formatNumber(budget)}`;
+}
+
+function renderGoalMode(ctx: SegmentContext, mode: { enabled: boolean; paused: boolean }): RenderedSegment {
+	const goal = ctx.session.getGoalModeState()?.goal;
+	const status = goal?.status ?? (mode.paused ? "paused" : "active");
+
+	let icon: string = theme.icon.goal;
+	let color: ThemeColor = "accent";
+	switch (status) {
+		case "paused":
+			icon = theme.icon.pause || theme.symbol("status.pending");
+			color = "warning";
+			break;
+		case "complete":
+			icon = theme.symbol("status.success");
+			color = "success";
+			break;
+		case "budget-limited":
+			icon = theme.symbol("status.warning");
+			color = "warning";
+			break;
+		case "dropped":
+			icon = theme.symbol("status.aborted");
+			color = "dim";
+			break;
+		default:
+			break;
+	}
+
+	const parts: string[] = [withIcon(icon, "Goal")];
+	const showBudget = ctx.session.settings.get("goal.statusInFooter") === true;
+	if (showBudget && goal) {
+		parts.push(formatGoalBudget(goal.tokensUsed, goal.tokenBudget));
+	}
+	return { content: theme.fg(color, parts.join(" ")), visible: true };
+}
+
 const modeSegment: StatusLineSegment = {
 	id: "mode",
 	render(ctx) {
+		const pauseSuffix = theme.icon.pause ? ` ${theme.icon.pause}` : " (paused)";
+
 		const plan = ctx.planMode;
 		if (plan && (plan.enabled || plan.paused)) {
-			const label = plan.paused ? "Plan ⏸" : "Plan";
+			const label = plan.paused ? `Plan${pauseSuffix}` : "Plan";
 			const content = withIcon(theme.icon.plan, label);
 			const color = plan.paused ? "warning" : "accent";
 			return { content: theme.fg(color, content), visible: true };
 		}
 
+		const goal = ctx.goalMode;
+		if (goal && (goal.enabled || goal.paused)) {
+			return renderGoalMode(ctx, goal);
+		}
+
 		const loop = ctx.loopMode;
 		if (loop?.enabled) {
 			const content = withIcon(theme.icon.loop, "Loop");
@@ -216,8 +264,11 @@ const tokenOutSegment: StatusLineSegment = {
 const tokenTotalSegment: StatusLineSegment = {
 	id: "token_total",
 	render(ctx) {
-		const { input, output, cacheRead, cacheWrite } = ctx.usageStats;
-		const total = input + output + cacheRead + cacheWrite;
+		// Excludes cacheRead: that field re-reads the full cached context every
+		// turn, making the cumulative sum N×context_size. The dedicated cache_read
+		// segment handles cache monitoring; the cost segment handles billing.
+		const { input, output, cacheWrite } = ctx.usageStats;
+		const total = input + output + cacheWrite;
 		if (!total) return { content: "", visible: false };
 
 		const content = withIcon(theme.icon.tokens, formatNumber(total));

package/src/modes/components/status-line/types.ts

@@ -27,6 +27,10 @@ export interface SegmentContext {
 	loopMode: {
 		enabled: boolean;
 	} | null;
+	goalMode: {
+		enabled: boolean;
+		paused: boolean;
+	} | null;
 	// Cached values for performance (computed once per render)
 	usageStats: {
 		input: number;