@gajae-code/coding-agent 0.11.10 → 0.12.0

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

@@ -235,18 +235,16 @@ function getSavedUsageMode(): UsageMode {
 	return segmentOptions.usage?.mode === "remaining" ? "remaining" : "used";
 }
 
-function setSavedUsageMode(mode: string): StatusLineSegmentOptions {
+function getUsageModeSettings(mode: string): StatusLineSegmentOptions {
 	const normalizedMode: UsageMode = mode === "remaining" ? "remaining" : "used";
 	const segmentOptions = settings.get("statusLine.segmentOptions") as StatusLineSegmentOptions;
-	const nextOptions: StatusLineSegmentOptions = {
+	return {
 		...segmentOptions,
 		usage: {
 			...(segmentOptions.usage ?? {}),
 			mode: normalizedMode,
 		},
 	};
-	settings.set("statusLine.segmentOptions", nextOptions as Record<string, unknown>);
-	return nextOptions;
 }
 
 function statusSegmentLabel(id: StatusLineSegmentId): string {
@@ -613,14 +611,17 @@ class StatusLineCustomEditor extends Container {
 	}
 
 	#save(): void {
-		settings.set("statusLine.preset", "custom");
-		settings.set("statusLine.leftSegments", [...this.#draft.leftSegments]);
-		settings.set("statusLine.rightSegments", [...this.#draft.rightSegments]);
-		settings.set("statusLine.separator", this.#draft.separator);
-		settings.set(
-			"statusLine.segmentOptions",
-			cloneSegmentOptions(this.#draft.segmentOptions) as Record<string, unknown>,
-		);
+		const saved = commitInteractiveSettings(this.callbacks, () => {
+			settings.set("statusLine.preset", "custom");
+			settings.set("statusLine.leftSegments", [...this.#draft.leftSegments]);
+			settings.set("statusLine.rightSegments", [...this.#draft.rightSegments]);
+			settings.set("statusLine.separator", this.#draft.separator);
+			settings.set(
+				"statusLine.segmentOptions",
+				cloneSegmentOptions(this.#draft.segmentOptions) as Record<string, unknown>,
+			);
+		});
+		if (!saved) return;
 		this.callbacks.onChange("statusLine.preset", "custom");
 		this.callbacks.onChange("statusLine.leftSegments", [...this.#draft.leftSegments]);
 		this.callbacks.onChange("statusLine.rightSegments", [...this.#draft.rightSegments]);
@@ -707,9 +708,29 @@ export interface SettingsCallbacks {
 	getStatusLinePreview?: (width?: number) => string;
 	/** Called when plugins change */
 	onPluginsChanged?: () => void;
+	/** Called when an interactive setting cannot be committed. */
+	onError?: (message: string) => void;
 	/** Called when settings panel is closed */
 	onCancel: () => void;
 }
+function commitInteractiveSettings(callbacks: SettingsCallbacks, commit: () => void): boolean {
+	if (!settings.canWriteDurableConfig()) {
+		callbacks.onError?.(
+			"Cannot change settings while config.yml has invalid YAML syntax. Repair config.yml and reload settings.",
+		);
+		return false;
+	}
+	try {
+		commit();
+		return true;
+	} catch (error) {
+		if (!settings.canWriteDurableConfig()) {
+			callbacks.onError?.(error instanceof Error ? error.message : String(error));
+			return false;
+		}
+		throw error;
+	}
+}
 
 /**
  * Main tabbed settings selector component.
@@ -994,11 +1015,18 @@ export class SettingsSelectorComponent extends Container {
 					// The shared pet commit policy rechecks capability immediately
 					// before mutation and persists only on acceptance; the settings
 					// surface must not persist ahead of that result.
-					const accepted = this.callbacks.onPetCommit?.(value) ?? false;
+					let accepted = false;
+					if (
+						!commitInteractiveSettings(this.callbacks, () => {
+							accepted = this.callbacks.onPetCommit?.(value) ?? false;
+						})
+					) {
+						return;
+					}
 					done(accepted ? value : undefined);
 					return;
 				}
-				this.#setSettingValue(def.path, value);
+				if (!commitInteractiveSettings(this.callbacks, () => this.#setSettingValue(def.path, value))) return;
 				this.callbacks.onChange(def.path, value);
 				done(value);
 			},
@@ -1031,7 +1059,7 @@ export class SettingsSelectorComponent extends Container {
 			value => {
 				// Empty string clears the setting; undefined-typed string settings
 				// store "" which the browser.ts expandPath ignores (no-op fallback).
-				this.#setSettingValue(def.path, value);
+				if (!commitInteractiveSettings(this.callbacks, () => this.#setSettingValue(def.path, value))) return;
 				this.callbacks.onChange(def.path, value);
 				wrappedDone(value);
 			},
@@ -1089,7 +1117,15 @@ export class SettingsSelectorComponent extends Container {
 			getSettingsListTheme(),
 			(id, newValue) => {
 				if (id === STATUS_LINE_USAGE_MODE_ID) {
-					const segmentOptions = setSavedUsageMode(newValue);
+					const segmentOptions = getUsageModeSettings(newValue);
+					if (
+						!commitInteractiveSettings(this.callbacks, () => {
+							settings.set("statusLine.segmentOptions", segmentOptions as Record<string, unknown>);
+						})
+					) {
+						this.#refreshCurrentTabItems(defs);
+						return;
+					}
 					this.callbacks.onChange("statusLine.segmentOptions", segmentOptions);
 					if (tabId === "appearance") {
 						this.#triggerStatusLinePreview();
@@ -1105,14 +1141,20 @@ export class SettingsSelectorComponent extends Container {
 
 				if (def.type === "boolean") {
 					const boolValue = newValue === "true";
-					settings.set(path, boolValue as never);
+					if (!commitInteractiveSettings(this.callbacks, () => settings.set(path, boolValue as never))) {
+						this.#refreshCurrentTabItems(defs);
+						return;
+					}
 					this.callbacks.onChange(path, boolValue);
 
 					if (tabId === "appearance") {
 						this.#triggerStatusLinePreview();
 					}
 				} else if (def.type === "enum") {
-					settings.set(path, newValue as never);
+					if (!commitInteractiveSettings(this.callbacks, () => settings.set(path, newValue as never))) {
+						this.#refreshCurrentTabItems(defs);
+						return;
+					}
 					this.callbacks.onChange(path, newValue);
 				}
 				// Submenu/text types already persisted the value inside their own

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

@@ -129,6 +129,21 @@ function stabilizeStreamingPreviews(previews: PerFileDiffPreview[]): PerFileDiff
 	return changed ? next : previews;
 }
 
+function previewsAreEqual(a: PerFileDiffPreview[] | undefined, b: PerFileDiffPreview[]): boolean {
+	return (
+		a?.length === b.length &&
+		a.every((preview, index) => {
+			const next = b[index];
+			return (
+				preview.path === next?.path &&
+				preview.diff === next.diff &&
+				preview.error === next.error &&
+				preview.firstChangedLine === next.firstChangedLine
+			);
+		})
+	);
+}
+
 function isEditLikeToolName(toolName: string): boolean {
 	return toolName === "edit" || toolName === "apply_patch";
 }
@@ -144,6 +159,8 @@ export interface ToolExecutionOptions {
 	editFuzzyThreshold?: number;
 	editAllowFuzzy?: boolean;
 	hashlineAutoDropPureInsertDuplicates?: boolean;
+	/** Internal observer for visible asynchronous renderer mutations. */
+	onVisibleTranscriptMutation?: () => void;
 }
 
 export interface ToolExecutionHandle {
@@ -168,6 +185,11 @@ export interface ToolExecutionHandle {
 	 * back to {@link setExpanded}.
 	 */
 	setManuallyExpanded?(expanded: boolean): void;
+	/**
+	 * Internal capability for dispatchers that need exact synchronous visible-output
+	 * detection. Optional so existing structural handles remain source compatible.
+	 */
+	consumeVisibleTranscriptChange?(): boolean;
 }
 
 /**
@@ -213,8 +235,11 @@ export class ToolExecutionComponent extends Container {
 	#argsIdentityVersion = 0;
 	#lastArgsReference: any;
 	#shareArgsWithRenderer = false;
-	// Cached converted images for Kitty protocol (which requires PNG), keyed by index
-	#convertedImages: Map<number, { data: string; mimeType: string }> = new Map();
+	// Cached converted images for Kitty protocol (which requires PNG), keyed by index and source.
+	#convertedImages: Map<number, { data: string; mimeType: string; source: string }> = new Map();
+	#imageConversionGenerations = new Map<number, number>();
+	#imageConversionsInFlight = new Map<number, string>();
+
 	// Spinner animation for partial task results
 	#spinnerFrame?: number;
 	#spinnerAnimation?: AnimationRegistration;
@@ -229,6 +254,10 @@ export class ToolExecutionComponent extends Container {
 		expanded: false,
 		isPartial: true,
 	};
+	#onVisibleTranscriptMutation?: () => void;
+	#visibleTranscriptChanged = false;
+	#visibleProjection = "";
+	#disposed = false;
 
 	constructor(
 		toolName: string,
@@ -246,6 +275,8 @@ export class ToolExecutionComponent extends Container {
 		this.#editFuzzyThreshold = options.editFuzzyThreshold;
 		this.#editAllowFuzzy = options.editAllowFuzzy;
 		this.#hashlineAutoDropPureInsertDuplicates = options.hashlineAutoDropPureInsertDuplicates;
+		this.#onVisibleTranscriptMutation = options.onVisibleTranscriptMutation;
+
 		this.#tool = tool;
 		this.#ui = ui;
 		this.#cwd = cwd;
@@ -273,18 +304,23 @@ export class ToolExecutionComponent extends Container {
 		this.#editMode = resolveEditModeForTool(toolName, tool);
 
 		this.#updateDisplay();
+		this.#visibleProjection = this.#captureLogicalVisibleProjection();
+
 		void this.#runPreviewDiff();
 	}
 
 	updateArgs(args: any, _toolCallId?: string): void {
+		const argsChanged = !Bun.deepEquals(this.#args, args);
+		if (!argsChanged && !this.#editMode) return;
 		if (args !== this.#lastArgsReference) {
 			this.#lastArgsReference = args;
 			this.#argsIdentityVersion += 1;
 		}
-		this.#args = this.#shareArgsWithRenderer ? args : cloneToolArgs(args);
+		this.#args = argsChanged ? (this.#shareArgsWithRenderer ? args : cloneToolArgs(args)) : this.#args;
 		this.#updateSpinnerAnimation();
 		void this.#runPreviewDiff();
 		this.#updateDisplay();
+		this.#markVisibleMutationIfChanged();
 	}
 
 	/**
@@ -295,6 +331,8 @@ export class ToolExecutionComponent extends Container {
 		this.#argsComplete = true;
 		this.#updateSpinnerAnimation();
 		void this.#runPreviewDiff();
+		this.#updateDisplay();
+		this.#markVisibleMutationIfChanged();
 	}
 
 	async #runPreviewDiff(): Promise<void> {
@@ -338,14 +376,17 @@ export class ToolExecutionComponent extends Container {
 				hashlineAutoDropPureInsertDuplicates: this.#hashlineAutoDropPureInsertDuplicates,
 				isStreaming,
 			});
-			if (controller.signal.aborted) return;
+			if (this.#disposed || controller.signal.aborted) return;
 			if (previews) {
-				this.#editDiffPreview = isStreaming ? stabilizeStreamingPreviews(previews) : previews;
+				const nextPreview = isStreaming ? stabilizeStreamingPreviews(previews) : previews;
+				const changed = !previewsAreEqual(this.#editDiffPreview, nextPreview);
+				this.#editDiffPreview = nextPreview;
 				this.#updateDisplay();
 				this.#ui.requestRender();
+				if (changed) this.#markVisibleMutationIfChanged(true);
 			}
 		} catch (err) {
-			if (controller.signal.aborted) return;
+			if (this.#disposed || controller.signal.aborted) return;
 			logger.warn("Edit preview diff failed", { tool: this.#toolName, error: String(err) });
 		}
 	}
@@ -359,8 +400,10 @@ export class ToolExecutionComponent extends Container {
 		isPartial = false,
 		_toolCallId?: string,
 	): void {
+		if (this.#isPartial === isPartial && Bun.deepEquals(this.#result, result)) return;
 		this.#textOutputCache = undefined;
 		this.#result = result;
+		this.#invalidateStaleKittyConversions();
 		this.#isPartial = isPartial;
 		// When tool is complete, ensure args are marked complete so spinner stops
 		if (!isPartial) {
@@ -370,6 +413,7 @@ export class ToolExecutionComponent extends Container {
 		this.#updateDisplay();
 		// Convert non-PNG images to PNG for Kitty protocol (async)
 		this.#maybeConvertImagesForKitty();
+		this.#markVisibleMutationIfChanged();
 	}
 
 	/**
@@ -383,40 +427,101 @@ export class ToolExecutionComponent extends Container {
 		return [...contentImages, ...detailImages];
 	}
 
-	/**
-	 * Convert non-PNG images to PNG for Kitty graphics protocol.
-	 * Kitty requires PNG format (f=100), so JPEG/GIF/WebP won't display.
-	 */
-	#maybeConvertImagesForKitty(): void {
-		// Only needed for Kitty protocol
-		if (TERMINAL.imageProtocol !== ImageProtocol.Kitty) return;
-		if (!this.#result) return;
-
-		const imageBlocks = this.#getAllImageBlocks();
+	#imageSource(image: { data?: string; mimeType?: string }): string | undefined {
+		return image.data && image.mimeType ? `${image.mimeType}\u0000${image.data}` : undefined;
+	}
 
-		for (let i = 0; i < imageBlocks.length; i++) {
-			const img = imageBlocks[i];
-			if (!img.data || !img.mimeType) continue;
-			// Skip if already PNG or already converted
-			if (img.mimeType === "image/png") continue;
-			if (this.#convertedImages.has(i)) continue;
+	#invalidateStaleKittyConversions(): void {
+		const images = this.#getAllImageBlocks();
+		const indices = new Set<number>();
+		for (let index = 0; index < images.length; index++) {
+			const source = this.#imageSource(images[index]);
+			if (!source) continue;
+			indices.add(index);
+			if (this.#convertedImages.get(index)?.source !== source) this.#convertedImages.delete(index);
+			if (this.#imageConversionsInFlight.get(index) !== source) {
+				this.#imageConversionsInFlight.delete(index);
+				this.#imageConversionGenerations.set(index, (this.#imageConversionGenerations.get(index) ?? 0) + 1);
+			}
+		}
+		for (const index of this.#convertedImages.keys()) {
+			if (!indices.has(index)) this.#convertedImages.delete(index);
+		}
+		for (const index of this.#imageConversionsInFlight.keys()) {
+			if (!indices.has(index)) {
+				this.#imageConversionsInFlight.delete(index);
+				this.#imageConversionGenerations.set(index, (this.#imageConversionGenerations.get(index) ?? 0) + 1);
+			}
+		}
+	}
 
-			// Convert async - catch errors from processing
-			const index = i;
-			new Bun.Image(Buffer.from(img.data, "base64"))
+	/** Convert non-PNG images to PNG for Kitty graphics protocol. */
+	#maybeConvertImagesForKitty(): void {
+		if (TERMINAL.imageProtocol !== ImageProtocol.Kitty) return;
+		for (const [index, image] of this.#getAllImageBlocks().entries()) {
+			const source = this.#imageSource(image);
+			if (!source || image.mimeType === "image/png") continue;
+			if (
+				this.#convertedImages.get(index)?.source === source ||
+				this.#imageConversionsInFlight.get(index) === source
+			)
+				continue;
+			const generation = this.#imageConversionGenerations.get(index) ?? 0;
+			this.#imageConversionsInFlight.set(index, source);
+			new Bun.Image(Buffer.from(image.data!, "base64"))
 				.png()
 				.toBase64()
 				.then(data => {
-					this.#convertedImages.set(index, { data, mimeType: "image/png" });
+					if (
+						this.#disposed ||
+						this.#imageConversionGenerations.get(index) !== generation ||
+						this.#imageConversionsInFlight.get(index) !== source ||
+						this.#imageSource(this.#getAllImageBlocks()[index] ?? {}) !== source
+					)
+						return;
+					this.#imageConversionsInFlight.delete(index);
+					this.#convertedImages.set(index, { data, mimeType: "image/png", source });
 					this.#updateDisplay();
 					this.#ui.requestRender();
+					this.#markVisibleMutationIfChanged(true);
 				})
 				.catch(() => {
-					// Ignore conversion failures - display will use original image format
+					if (
+						this.#disposed ||
+						this.#imageConversionGenerations.get(index) !== generation ||
+						this.#imageConversionsInFlight.get(index) !== source
+					)
+						return;
+					this.#imageConversionsInFlight.delete(index);
 				});
 		}
 	}
 
+	#captureLogicalVisibleProjection(): string {
+		return this.render(10_000).join("\n");
+	}
+
+	#markVisibleMutationIfChanged(notify = false): void {
+		const projection = this.#captureLogicalVisibleProjection();
+		if (projection === this.#visibleProjection) return;
+		this.#visibleProjection = projection;
+		this.#markVisibleMutation(notify);
+	}
+
+	#markVisibleMutation(notify = false): void {
+		if (notify) {
+			this.#onVisibleTranscriptMutation?.();
+			return;
+		}
+		this.#visibleTranscriptChanged = true;
+	}
+
+	consumeVisibleTranscriptChange(): boolean {
+		const changed = this.#visibleTranscriptChanged;
+		this.#visibleTranscriptChanged = false;
+		return changed;
+	}
+
 	/**
 	 * Start or stop spinner animation based on whether this is a partial task result.
 	 */
@@ -430,6 +535,7 @@ export class ToolExecutionComponent extends Container {
 		const needsSpinner = isStreamingArgs || isPartialTask;
 		if (needsSpinner && !this.#spinnerAnimation) {
 			this.#spinnerAnimation = registerAnimationCallback(() => {
+				if (this.#disposed) return;
 				const frameCount = theme.spinnerFrames.length;
 				if (frameCount === 0) return;
 				this.#spinnerFrame = ((this.#spinnerFrame ?? -1) + 1) % frameCount;
@@ -456,6 +562,11 @@ export class ToolExecutionComponent extends Container {
 	}
 
 	override dispose(): void {
+		if (this.#disposed) return;
+		this.#disposed = true;
+		this.#imageConversionGenerations.clear();
+		this.#imageConversionsInFlight.clear();
+		this.#convertedImages.clear();
 		this.stopAnimation();
 		super.dispose();
 	}

package/src/modes/components/tool-status-header.ts

@@ -70,16 +70,13 @@ export interface StatusLineActionHint {
 
 const ACTION_HINT_PRIORITY: readonly AppKeybinding[] = [
 	"app.message.sendNow",
-	"app.message.queue",
 	"app.message.followUp",
+	"app.message.queue",
 	"app.message.dequeue",
 	"app.commandPalette.open",
 	"app.plan.toggle",
 	"app.mode.cycle",
-	"app.thinking.cycle",
-	"app.model.select",
 	"app.model.cycleForward",
-	"app.history.search",
 	"app.session.togglePath",
 	"app.session.toggleSort",
 	"app.session.rename",

package/src/modes/components/welcome.ts

@@ -20,6 +20,7 @@ export interface WelcomeComponentOptions {
 	getViewportRows?: () => number | undefined;
 	getReservedBottomRows?: (termWidth: number) => number;
 	changelogMarkdown?: string;
+	rightGutterWidth?: number;
 	collapseChangelog?: boolean;
 	buildLabel?: string;
 	keyDisplayContext?: KeyDisplayContext;
@@ -110,7 +111,8 @@ export class WelcomeComponent implements Component {
 	}
 
 	render(termWidth: number): string[] {
-		const boxWidth = Math.max(0, termWidth);
+		const rightGutterWidth = this.#rightGutterWidth(termWidth);
+		const boxWidth = Math.max(0, termWidth - rightGutterWidth);
 		if (boxWidth < 4) {
 			return [];
 		}
@@ -245,7 +247,7 @@ export class WelcomeComponent implements Component {
 			lines.push(tl + titleStyled + theme.fg("dim", hChar.repeat(afterTitle)) + tr);
 		}
 		if (outputRows === 1) {
-			return lines;
+			return this.#withRightGutter(lines, rightGutterWidth);
 		}
 
 		if (showRightColumn) {
@@ -273,7 +275,7 @@ export class WelcomeComponent implements Component {
 			lines.push(bl + h.repeat(leftCol) + br);
 		}
 
-		return lines;
+		return this.#withRightGutter(lines, rightGutterWidth);
 	}
 
 	/** Center text within a given width */
@@ -295,6 +297,19 @@ export class WelcomeComponent implements Component {
 		}
 		return str + padding(width - visLen);
 	}
+	#rightGutterWidth(termWidth: number): number {
+		const configured = this.options.rightGutterWidth ?? 0;
+		if (!Number.isFinite(configured) || configured <= 0) return 0;
+		const gutterWidth = Math.floor(configured);
+		return Math.min(gutterWidth, Math.max(0, termWidth - 4));
+	}
+
+	#withRightGutter(lines: string[], rightGutterWidth: number): string[] {
+		if (rightGutterWidth <= 0) return lines;
+		const gutter = padding(rightGutterWidth);
+		return lines.map(line => line + gutter);
+	}
+
 	#targetRows(termWidth: number): number | undefined {
 		const viewportRows = this.options.getViewportRows?.();
 		if (typeof viewportRows !== "number" || !Number.isFinite(viewportRows) || viewportRows <= 0) {

package/src/modes/controllers/command-controller.ts

@@ -65,6 +65,8 @@ export function buildHelpMarkdown(keybindings: Pick<KeybindingsManager, "getAcce
 	const displayKey = (action: Keybinding): string => keybindings.getAccessibleDisplayString(action) || "Disabled";
 	const sessionNewKey = formatHotkeyMarkdownCode(displayKey("app.session.new"));
 	const selectModelKey = formatHotkeyMarkdownCode(displayKey("app.model.select"));
+	const queueMessageKey = formatHotkeyMarkdownCode(displayKey("app.message.queue"));
+	const dequeueMessageKey = formatHotkeyMarkdownCode(displayKey("app.message.dequeue"));
 	const autocompleteNavigationKeys = formatHotkeyMarkdownCode(
 		`${displayKey("tui.select.up")}/${displayKey("tui.select.down")}`,
 		false,
@@ -84,6 +86,8 @@ export function buildHelpMarkdown(keybindings: Pick<KeybindingsManager, "getAcce
 		"| Show session details | `/session info` |",
 		"| Delete current session transcript/artifacts | `/session delete` |",
 		`| Select a model | \`/model\` or ${selectModelKey} |`,
+		`| Queue a message for the next turn | ${queueMessageKey} |`,
+		`| Select or edit a queued message | ${dequeueMessageKey} |`,
 		"| Show all shortcuts | `?` on an empty prompt or `/hotkeys` |",
 		"",
 		"**Finding commands**",