@opengsd/gsd-pi 1.0.2-dev.5961fbf → 1.0.2-dev.5f7864c

package/src/resources/extensions/gsd/visualizer-overlay.ts

@@ -1,5 +1,5 @@
 import type { Theme } from "@gsd/pi-coding-agent";
-import { truncateToWidth, visibleWidth, matchesKey, Key } from "@gsd/pi-tui";
+import { visibleWidth, matchesKey, Key } from "@gsd/pi-tui";
 import { loadVisualizerData, type VisualizerData } from "./visualizer-data.js";
 import {
   renderProgressView,
@@ -19,6 +19,7 @@ import { join } from "node:path";
 import { writeExportFile } from "./export.js";
 import { gsdRoot } from "./paths.js";
 import { stripAnsi } from "../shared/mod.js";
+import { renderDialogFrame, renderKeyHints } from "./tui/render-kit.js";
 
 export const TAB_COUNT = 10;
 const TAB_LABELS = [
@@ -500,8 +501,7 @@ export class GSDVisualizerOverlay {
 
     // Apply scroll
     const viewportHeight = Math.max(5, process.stdout.rows ? process.stdout.rows - 8 : 24);
-    const chromeHeight = 2;
-    const visibleContentRows = Math.max(1, viewportHeight - chromeHeight);
+    const visibleContentRows = Math.max(1, viewportHeight - 4);
     this.lastVisibleRows = visibleContentRows;
     const totalLines = content.length;
     const maxScroll = Math.max(0, content.length - visibleContentRows);
@@ -509,49 +509,21 @@ export class GSDVisualizerOverlay {
     const offset = this.scrollOffsets[this.activeTab];
     const visibleContent = content.slice(offset, offset + visibleContentRows);
 
-    const lines = this.wrapInBox(visibleContent, width, offset, visibleContentRows, totalLines);
-
-    // Footer hint
-    const hint = th.fg("dim", "Tab/Shift+Tab/1-9,0 switch \u00b7 / filter \u00b7 PgUp/PgDn scroll \u00b7 ? help \u00b7 esc close");
-    const hintVis = visibleWidth(hint);
-    const hintPad = Math.max(0, Math.floor((width - hintVis) / 2));
-    lines.push(" ".repeat(hintPad) + hint);
+    const footer = renderKeyHints(
+      th,
+      ["Tab/Shift+Tab/1-9,0 switch", "/ filter", "PgUp/PgDn scroll", "? help", "esc close"],
+      Math.max(1, width - 4),
+    );
+    const lines = renderDialogFrame(th, "GSD Visualizer", visibleContent, width, {
+      footer,
+      scroll: { offset, visibleRows: visibleContentRows, totalRows: totalLines },
+    });
 
     this.cachedWidth = width;
     this.cachedLines = lines;
     return lines;
   }
 
-  private wrapInBox(inner: string[], width: number, offset?: number, visibleRows?: number, totalLines?: number): string[] {
-    const th = this.theme;
-    const border = (s: string) => th.fg("borderAccent", s);
-    const innerWidth = width - 4;
-    const lines: string[] = [];
-    lines.push(border("\u256d" + "\u2500".repeat(width - 2) + "\u256e"));
-
-    // Compute scroll indicator positions
-    const scrollable = totalLines !== undefined && visibleRows !== undefined && totalLines > visibleRows;
-    let thumbStart = -1;
-    let thumbLen = 0;
-    const innerRows = inner.length;
-    if (scrollable && innerRows > 0 && totalLines! > 0) {
-      thumbStart = Math.round(((offset ?? 0) / totalLines!) * innerRows);
-      thumbLen = Math.max(1, Math.round((visibleRows! / totalLines!) * innerRows));
-    }
-
-    for (let i = 0; i < inner.length; i++) {
-      const line = inner[i];
-      const truncated = truncateToWidth(line, innerWidth);
-      const padWidth = Math.max(0, innerWidth - visibleWidth(truncated));
-      const rightBorder = scrollable && i >= thumbStart && i < thumbStart + thumbLen
-        ? border("\u2503")
-        : border("\u2502");
-      lines.push(border("\u2502") + " " + truncated + " ".repeat(padWidth) + " " + rightBorder);
-    }
-    lines.push(border("\u2570" + "\u2500".repeat(width - 2) + "\u256f"));
-    return lines;
-  }
-
   invalidate(): void {
     this.cachedWidth = undefined;
     this.cachedLines = undefined;

package/src/resources/extensions/gsd/worktree-lifecycle.ts

@@ -216,6 +216,10 @@ export type EnterResult =
       cause?: unknown;
     };
 
+export interface StrandedMilestoneAdoptionOptions {
+  mode: "worktree" | "branch";
+}
+
 export type ExitResult =
   | { ok: true; merged: boolean; codeFilesChanged: boolean }
   | { ok: false; reason: "merge-conflict" | "teardown-failed"; cause?: unknown };
@@ -237,6 +241,8 @@ export interface MergeContext {
    */
   worktreeBasePath: string;
   milestoneId: string;
+  /** Temporary override used while recovering stranded work. */
+  isolationModeOverride?: "worktree" | "branch" | "none";
   /**
    * When true, `mergeMilestoneStandalone` returns `{ merged: false,
    * mode: "skipped" }` immediately (mirrors the single-loop guard). Default
@@ -533,6 +539,7 @@ export function _enterMilestoneCore(
   deps: WorktreeLifecycleDeps,
   milestoneId: string,
   ctx: NotifyCtx,
+  opts: { modeOverride?: "worktree" | "branch" } = {},
 ): EnterResult {
   if (!isValidMilestoneId(milestoneId)) {
     debugLog("WorktreeLifecycle", {
@@ -653,7 +660,7 @@ export function _enterMilestoneCore(
   // Handles the case where originalBasePath is falsy and basePath is itself
   // a worktree path — prevents double-nested worktree paths (#3729).
   const basePath = resolveWorktreeProjectRoot(s.basePath, s.originalBasePath);
-  const mode = getIsolationMode(basePath);
+  const mode = opts.modeOverride ?? getIsolationMode(basePath);
 
   if (s.isolationDegraded) {
     if (mode === "worktree") {
@@ -1298,7 +1305,9 @@ export function mergeMilestoneStandalone(
     };
   }
 
-  const mode = getIsolationMode(originalBasePath || worktreeBasePath);
+  const mode =
+    mctx.isolationModeOverride ??
+    getIsolationMode(originalBasePath || worktreeBasePath);
   debugLog("WorktreeLifecycle", {
     action: "mergeAndExit",
     milestoneId,
@@ -1637,6 +1646,7 @@ export class WorktreeLifecycle {
         originalBasePath: this.s.originalBasePath,
         worktreeBasePath: this.s.basePath,
         milestoneId,
+        isolationModeOverride: this.s.strandedRecoveryIsolationMode ?? undefined,
         isolationDegraded: this.s.isolationDegraded,
         notify: ctx.notify,
       });
@@ -1740,6 +1750,7 @@ export class WorktreeLifecycle {
       // Rebuild GitService after merge (branch HEAD changed)
       rebuildGitService(this.s, this.deps);
     }
+    this.s.strandedRecoveryIsolationMode = null;
     return result;
   }
 
@@ -1876,6 +1887,30 @@ export class WorktreeLifecycle {
     this.s.basePath = resolvePausedResumeBasePath(base, persistedWorktreePath);
   }
 
+  /**
+   * Adopt in-progress stranded work during bootstrap.
+   *
+   * Unlike completed-orphan recovery, this does not merge, delete, or commit.
+   * It only moves the live session onto the branch/worktree proven by the
+   * audit evidence, while preserving that mode for the eventual merge.
+   */
+  adoptStrandedMilestone(
+    milestoneId: string,
+    base: string,
+    ctx: NotifyCtx,
+    opts: StrandedMilestoneAdoptionOptions,
+  ): EnterResult {
+    this.adoptSessionRoot(base);
+    this.s.strandedRecoveryIsolationMode = opts.mode;
+    const result = _enterMilestoneCore(this.s, this.deps, milestoneId, ctx, {
+      modeOverride: opts.mode,
+    });
+    if (!result.ok) {
+      this.s.strandedRecoveryIsolationMode = null;
+    }
+    return result;
+  }
+
   /**
    * Adopt an orphan worktree for a bootstrap-time merge (ADR-016 phase 2 / B4,
    * issue #5622).

package/src/resources/extensions/search-the-web/native-search.ts

@@ -16,6 +16,47 @@ export const CUSTOM_SEARCH_TOOL_NAMES = ["search-the-web", "search_and_read", "g
 
 /** Thinking block types that require signature validation by the API */
 const THINKING_TYPES = new Set(["thinking", "redacted_thinking"]);
+const NATIVE_SERVER_TOOL_USE_TYPES = new Set([
+  "server_tool_use",
+  "serverToolUse",
+]);
+const NATIVE_WEB_SEARCH_RESULT_TYPES = new Set([
+  "web_search_tool_result",
+  "webSearchResult",
+]);
+
+function nativeServerToolId(block: any): string | undefined {
+  if (!NATIVE_SERVER_TOOL_USE_TYPES.has(block?.type)) return undefined;
+  return typeof block.id === "string" ? block.id : undefined;
+}
+
+function nativeWebSearchResultId(block: any): string | undefined {
+  if (!NATIVE_WEB_SEARCH_RESULT_TYPES.has(block?.type)) return undefined;
+  const id = block.type === "webSearchResult" ? block.toolUseId : block.tool_use_id;
+  return typeof id === "string" ? id : undefined;
+}
+
+function hasCompleteNativeServerToolReplay(content: any[]): boolean {
+  const pendingToolUseIds = new Set<string>();
+  let sawNativeServerToolUse = false;
+
+  for (const block of content) {
+    const toolUseId = nativeServerToolId(block);
+    if (toolUseId !== undefined) {
+      if (pendingToolUseIds.has(toolUseId)) return false;
+      sawNativeServerToolUse = true;
+      pendingToolUseIds.add(toolUseId);
+      continue;
+    }
+
+    const resultId = nativeWebSearchResultId(block);
+    if (resultId !== undefined) {
+      if (!pendingToolUseIds.delete(resultId)) return false;
+    }
+  }
+
+  return sawNativeServerToolUse && pendingToolUseIds.size === 0;
+}
 
 /**
  * Providers whose Anthropic-Messages endpoint is known to accept the native
@@ -36,6 +77,11 @@ const NATIVE_WEB_SEARCH_PROVIDERS = new Set([
   "vercel-ai-gateway",
 ]);
 
+function looksLikeAnthropicModelName(modelName: string): boolean {
+  const normalized = modelName.trim().toLowerCase();
+  return normalized.startsWith("claude-") || normalized.startsWith("anthropic/claude-");
+}
+
 /**
  * True when the model is an Anthropic-shaped transport AND the provider is
  * known to accept the native `web_search_20250305` tool. Gate both on api
@@ -89,11 +135,10 @@ export interface NativeSearchPI {
  * those blocks. The Anthropic API detects the modification and rejects the
  * request with "thinking blocks cannot be modified."
  *
- * Fix: Remove thinking blocks from all assistant messages in the history.
- * In Anthropic's Messages API, the messages array always ends with a user
- * message, so every assistant message is from a previous turn that has been
- * through a store/replay cycle. The model generates fresh thinking for the
- * current turn regardless.
+ * Fix: Remove thinking blocks only from assistant messages that do not carry
+ * native server-tool blocks. Complete native server-tool histories can be
+ * replayed as-is; stripping thinking from those messages is itself a latest
+ * assistant message modification.
  */
 export function stripThinkingFromHistory(
   messages: Array<Record<string, unknown>>
@@ -103,6 +148,9 @@ export function stripThinkingFromHistory(
 
     const content = msg.content;
     if (!Array.isArray(content)) continue;
+    if (hasCompleteNativeServerToolReplay(content)) {
+      continue;
+    }
 
     msg.content = content.filter(
       (block: any) => !THINKING_TYPES.has(block?.type)
@@ -180,6 +228,8 @@ export function registerNativeSearchHooks(pi: NativeSearchPI): { getIsAnthropic:
     // The model name heuristic is needed for session restores where
     // modelsAreEqual suppresses model_select AND the SDK doesn't pass model.
     const eventModel = event.model as { provider?: string; api?: string } | undefined;
+    const payloadModelName = typeof payload.model === "string" ? payload.model : "";
+    const payloadLooksAnthropic = payloadModelName ? looksLikeAnthropicModelName(payloadModelName) : undefined;
     let isAnthropic: boolean;
     if (eventModel?.api || eventModel?.provider) {
       // Preferred path: gate on api shape + provider allowlist. Both fields
@@ -188,12 +238,14 @@ export function registerNativeSearchHooks(pi: NativeSearchPI): { getIsAnthropic:
       // (#444 regression) or minimax-served Claude-compat as Anthropic (#4492).
       isAnthropic = supportsNativeWebSearch(eventModel);
     } else if (modelSelectFired) {
-      isAnthropic = isAnthropicProvider;
+      // The model_select flag can be stale if the next request omits event.model
+      // after a provider switch. A concrete non-Claude payload must win so an
+      // Anthropic-only tool never leaks into OpenAI Responses requests.
+      isAnthropic = isAnthropicProvider && payloadLooksAnthropic !== false;
     } else {
       // Last resort: session-restore paths where the SDK doesn't pass model.
       // The model-name prefix is best-effort and assumes direct Anthropic.
-      const modelName = typeof payload.model === "string" ? payload.model : "";
-      isAnthropic = modelName.startsWith("claude-");
+      isAnthropic = payloadLooksAnthropic === true;
     }
     if (!isAnthropic) return;
 

package/src/resources/extensions/shared/confirm-ui.ts

@@ -18,6 +18,7 @@
 import type { ExtensionContext } from "@gsd/pi-coding-agent";
 import { type Theme } from "@gsd/pi-coding-agent";
 import { Key, matchesKey, truncateToWidth, type TUI } from "@gsd/pi-tui";
+import { renderSharedDialogFrame } from "./dialog-frame.js";
 import { makeUI, GLYPH } from "./ui.js";
 
 export interface ConfirmOptions {
@@ -83,20 +84,18 @@ export async function showConfirm(
 		function render(width: number): string[] {
 			if (cachedLines) return cachedLines;
 
-			const ui = makeUI(theme, width);
+			const contentWidth = Math.max(1, width - 4);
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
 			push(
-				ui.bar(),
-				ui.blank(),
-				ui.header(`  ${opts.title}`),
 				ui.blank(),
 				ui.subtitle(`  ${opts.message}`),
 				ui.blank(),
 			);
 
-			const add = (s: string) => truncateToWidth(s, width);
+			const add = (s: string) => truncateToWidth(s, contentWidth);
 			const option = (num: number, label: string, selected: boolean) => {
 				if (selected) {
 					return add(`  ${theme.fg("accent", GLYPH.cursor)} ${theme.fg("accent", `${num}. ${label}`)}`);
@@ -107,14 +106,11 @@ export async function showConfirm(
 			lines.push(option(1, yesLabel, cursor === 0));
 			lines.push(option(2, noLabel, cursor === 1));
 
-			push(
-				ui.blank(),
-				ui.hints(["↑/↓ to choose", "y/n to quick-select", "enter to confirm"]),
-				ui.bar(),
-			);
+			push(ui.blank());
+			const footer = ui.hints(["↑/↓ to choose", "y/n to quick-select", "enter to confirm"])[0] ?? "";
 
-			cachedLines = lines;
-			return lines;
+			cachedLines = renderSharedDialogFrame(theme, opts.title, lines, width, { footer });
+			return cachedLines;
 		}
 
 		return {

package/src/resources/extensions/shared/dialog-frame.ts

@@ -0,0 +1,71 @@
+import { type Theme } from "@gsd/pi-coding-agent";
+import { truncateToWidth, visibleWidth } from "@gsd/pi-tui";
+
+type ThemeColor = Parameters<Theme["fg"]>[0];
+
+export interface SharedDialogFrameOptions {
+	borderColor?: ThemeColor;
+	footer?: string | string[];
+	paddingX?: number;
+}
+
+function safeLine(text: string, width: number): string {
+	return truncateToWidth(text, width, "");
+}
+
+function padVisible(text: string, width: number): string {
+	const clipped = safeLine(text, width);
+	return clipped + " ".repeat(Math.max(0, width - visibleWidth(clipped)));
+}
+
+function renderTopBorder(
+	theme: Theme,
+	title: string,
+	width: number,
+	border: (text: string) => string,
+): string {
+	const trimmedTitle = title.trim();
+	if (!trimmedTitle || width < 10) {
+		return border("╭" + "─".repeat(width - 2) + "╮");
+	}
+
+	const safeTitle = safeLine(trimmedTitle, Math.max(0, width - 7));
+	const fill = Math.max(0, width - visibleWidth(safeTitle) - 5);
+	return border("╭─ ") + theme.bold(theme.fg("accent", safeTitle)) + border(" " + "─".repeat(fill) + "╮");
+}
+
+export function renderSharedDialogFrame(
+	theme: Theme,
+	title: string,
+	inner: string[],
+	width: number,
+	options: SharedDialogFrameOptions = {},
+): string[] {
+	if (width < 4) return inner.map((line) => safeLine(line, width));
+
+	const paddingX = Math.max(0, options.paddingX ?? 1);
+	const contentWidth = Math.max(0, width - 2 - paddingX * 2);
+	const border = (text: string) => theme.fg(options.borderColor ?? "borderAccent", text);
+	const pad = " ".repeat(paddingX);
+	const lines = [renderTopBorder(theme, title, width, border)];
+
+	for (const line of inner) {
+		lines.push(border("│") + pad + padVisible(line, contentWidth) + pad + border("│"));
+	}
+
+	const footer = Array.isArray(options.footer)
+		? options.footer
+		: options.footer
+			? [options.footer]
+			: [];
+	if (footer.length > 0) {
+		lines.push(border("├" + "─".repeat(width - 2) + "┤"));
+		for (const line of footer) {
+			lines.push(border("│") + pad + padVisible(line, contentWidth) + pad + border("│"));
+		}
+	}
+
+	lines.push(border("╰" + "─".repeat(width - 2) + "╯"));
+	return lines;
+}
+

package/src/resources/extensions/shared/interview-ui.ts

@@ -36,6 +36,7 @@ import {
 	truncateToWidth,
 	type TUI,
 } from "@gsd/pi-tui";
+import { renderSharedDialogFrame } from "./dialog-frame.js";
 import { mergeSideBySide } from "./layout-utils.js";
 import { makeUI, INDENT } from "./ui.js";
 
@@ -126,6 +127,10 @@ const DIVIDER_CHARS = " │ ";
 const DIVIDER_WIDTH = 3;
 const PREVIEW_MAX_LINES = 20;     // hard cap — keeps total ≤ 24 rows for single-question
 
+function dialogContentWidth(width: number): number {
+	return width < 4 ? Math.max(1, width) : Math.max(1, width - 4);
+}
+
 // ─── Wrap-up screen ───────────────────────────────────────────────────────────
 
 export async function showWrapUpScreen(
@@ -157,11 +162,12 @@ export async function showWrapUpScreen(
 
 		function render(width: number): string[] {
 			if (cachedLines) return cachedLines;
-			const ui = makeUI(theme, width);
+			const contentWidth = dialogContentWidth(width);
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
-			push(ui.bar(), ui.blank(), ui.header(`  ${opts.headline}`), ui.blank());
+			push(ui.blank());
 			if (opts.progress) push(ui.meta(`  ${opts.progress}`), ui.blank());
 
 			if (cursorIdx === 1) {
@@ -175,14 +181,11 @@ export async function showWrapUpScreen(
 			} else {
 				push(ui.actionUnselected(2, opts.keepGoingLabel, "Continue with another batch of questions."));
 			}
-			push(
-				ui.blank(),
-				ui.hints(["↑/↓ to choose", "1/2 to quick-select", "enter to confirm"]),
-				ui.bar(),
-			);
+			push(ui.blank());
 
-			cachedLines = lines;
-			return lines;
+			const footer = ui.hints(["↑/↓ to choose", "1/2 to quick-select", "enter to confirm"])[0] ?? "";
+			cachedLines = renderSharedDialogFrame(theme, opts.headline, lines, width, { footer });
+			return cachedLines;
 		}
 
 		return {
@@ -469,11 +472,13 @@ export async function showInterviewRound(
 		// ── Review screen ────────────────────────────────────────────────
 
 		function renderReviewScreen(width: number): string[] {
-			const ui = makeUI(theme, width);
+			const contentWidth = dialogContentWidth(width);
+			const title = opts.reviewHeadline ?? "Review your answers";
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
-			push(ui.bar(), ui.blank(), ui.header(`  ${opts.reviewHeadline ?? "Review your answers"}`), ui.blank());
+			push(ui.blank());
 
 			for (let i = 0; i < questions.length; i++) {
 				const q = questions[i];
@@ -500,24 +505,22 @@ export async function showInterviewRound(
 			push(
 				ui.actionSelected(0, "Submit answers"),
 				ui.blank(),
-				ui.hints(["← to go back and edit", "enter to submit", `esc to ${opts.exitLabel ?? "end interview"}`]),
-				ui.bar(),
 			);
 
-			return lines;
+			const footer = ui.hints(["← to go back and edit", "enter to submit", `esc to ${opts.exitLabel ?? "end interview"}`])[0] ?? "";
+			return renderSharedDialogFrame(theme, title, lines, width, { footer });
 		}
 
 		// ── Exit confirm screen ──────────────────────────────────────────
 
 		function renderExitConfirm(width: number): string[] {
-			const ui = makeUI(theme, width);
+			const contentWidth = dialogContentWidth(width);
+			const title = opts.exitHeadline ?? "End interview?";
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
 			push(
-				ui.bar(),
-				ui.blank(),
-				ui.header(`  ${opts.exitHeadline ?? "End interview?"}`),
 				ui.blank(),
 				ui.subtitle("  Answers from this batch won't be saved."),
 				ui.blank(),
@@ -538,13 +541,10 @@ export async function showInterviewRound(
 			} else {
 				push(ui.actionUnselected(2, exitActionLabel, "Exit and discard this batch of answers."));
 			}
-			push(
-				ui.blank(),
-				ui.hints(["↑/↓ to choose", "1/2 to quick-select", "enter to confirm"]),
-				ui.bar(),
-			);
+			push(ui.blank());
 
-			return lines;
+			const footer = ui.hints(["↑/↓ to choose", "1/2 to quick-select", "enter to confirm"])[0] ?? "";
+			return renderSharedDialogFrame(theme, title, lines, width, { footer });
 		}
 
 		// ── Preview helpers ──────────────────────────────────────────────
@@ -648,17 +648,17 @@ export async function showInterviewRound(
 			if (showingExitConfirm) { cachedLines = renderExitConfirm(width); return cachedLines; }
 			if (showingReview) { cachedLines = renderReviewScreen(width); return cachedLines; }
 
+			const contentWidth = dialogContentWidth(width);
+			const title = questions[currentIdx]?.header || "GSD Interview";
 			const useSideBySide = questionHasAnyPreview()
-				&& width >= (MIN_OPTIONS_WIDTH + MIN_PREVIEW_WIDTH + DIVIDER_WIDTH);
+				&& contentWidth >= (MIN_OPTIONS_WIDTH + MIN_PREVIEW_WIDTH + DIVIDER_WIDTH);
 
 			if (useSideBySide) {
 				// ── Preview path ──────────────────────────────────────
-				const ui = makeUI(theme, width);
+				const ui = makeUI(theme, contentWidth);
 				const lines: string[] = [];
 				const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
-				push(ui.bar());
-
 				if (isMultiQuestion) {
 					const unanswered = questions.filter((_, i) => !isQuestionAnswered(i)).length;
 					const answeredSet = new Set(questions.map((_, i) => i).filter(i => isQuestionAnswered(i)));
@@ -680,12 +680,15 @@ export async function showInterviewRound(
 				// component: spinner/loader (1-2), status line (1), tool header (1),
 				// plus a safety margin for future additions.
 				const termRows = (typeof process !== "undefined" && process.stdout?.rows) || 24;
-				const footerLines = 3; // blank + hints + bar
+				const footerLines = 5; // body spacer + frame top/footer/bottom chrome
 				const tuiChrome = 5;
 				const maxBody = Math.min(PREVIEW_MAX_LINES, Math.max(6, termRows - lines.length - footerLines - tuiChrome));
 
-				const previewWidth = Math.max(MIN_PREVIEW_WIDTH, Math.floor(width * PREVIEW_RATIO));
-				const leftWidth = Math.max(MIN_OPTIONS_WIDTH, width - previewWidth - DIVIDER_WIDTH);
+				const previewWidth = Math.max(
+					MIN_PREVIEW_WIDTH,
+					Math.min(contentWidth - MIN_OPTIONS_WIDTH - DIVIDER_WIDTH, Math.floor(contentWidth * PREVIEW_RATIO)),
+				);
+				const leftWidth = Math.max(MIN_OPTIONS_WIDTH, contentWidth - previewWidth - DIVIDER_WIDTH);
 
 				const fullLeft = renderOptionsColumn(leftWidth);
 				const leftLines = fullLeft.slice(0, maxBody);
@@ -709,7 +712,7 @@ export async function showInterviewRound(
 				while (leftLines.length < maxBody) leftLines.push("");
 				while (rightLines.length < maxBody) rightLines.push("");
 				const divider = theme.fg("dim", DIVIDER_CHARS);
-				lines.push(...mergeSideBySide(leftLines, rightLines, leftWidth, divider, width));
+				lines.push(...mergeSideBySide(leftLines, rightLines, leftWidth, divider, contentWidth));
 
 				// Footer
 				push(ui.blank());
@@ -729,15 +732,15 @@ export async function showInterviewRound(
 					hints.push(isLast && allAnswered() ? "enter to review" : "enter to next");
 				}
 				hints.push("esc to exit");
-				push(ui.hints(hints), ui.bar());
+				const footer = ui.hints(hints)[0] ?? "";
 
-				cachedLines = lines;
-				return lines;
+				cachedLines = renderSharedDialogFrame(theme, title, lines, width, { footer });
+				return cachedLines;
 			}
 
 			// ── Original path — no preview, untouched ────────────────
 
-			const ui = makeUI(theme, width);
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
@@ -745,8 +748,6 @@ export async function showInterviewRound(
 			const st = states[currentIdx];
 			const multiSel = isMultiSelect(currentIdx);
 
-			push(ui.bar());
-
 			// ── Progress header ────────────────────────────────────────────
 			if (isMultiQuestion) {
 				const unanswered = questions.filter((_, i) => !isQuestionAnswered(i)).length;
@@ -809,7 +810,7 @@ export async function showInterviewRound(
 			if (st.notesVisible || focusNotes) {
 				push(ui.blank(), ui.notesLabel(focusNotes));
 				if (focusNotes) {
-					for (const line of getEditor().render(width - 2)) lines.push(truncateToWidth(` ${line}`, width));
+					for (const line of getEditor().render(contentWidth - 2)) lines.push(truncateToWidth(` ${line}`, contentWidth));
 				} else if (st.notes) {
 					push(ui.notesText(st.notes));
 				}
@@ -833,10 +834,10 @@ export async function showInterviewRound(
 				hints.push(isLast && allAnswered() ? "enter to review" : "enter to next");
 			}
 			hints.push("esc to exit");
-			push(ui.hints(hints), ui.bar());
+			const footer = ui.hints(hints)[0] ?? "";
 
-			cachedLines = lines;
-			return lines;
+			cachedLines = renderSharedDialogFrame(theme, title, lines, width, { footer });
+			return cachedLines;
 		}
 
 		return {

package/src/resources/extensions/shared/next-action-ui.ts

@@ -44,6 +44,7 @@
 import type { ExtensionCommandContext } from "@gsd/pi-coding-agent";
 import { type Theme } from "@gsd/pi-coding-agent";
 import { Key, matchesKey, type TUI } from "@gsd/pi-tui";
+import { renderSharedDialogFrame } from "./dialog-frame.js";
 import { makeUI } from "./ui.js";
 
 // ─── Public API ───────────────────────────────────────────────────────────────
@@ -142,14 +143,14 @@ export async function showNextAction(
 
 		function render(width: number): string[] {
 			if (cachedLines) return cachedLines;
-			const ui = makeUI(theme, width);
+			const contentWidth = Math.max(1, width - 4);
+			const ui = makeUI(theme, contentWidth);
 			const lines: string[] = [];
 			const push = (...rows: string[][]) => { for (const r of rows) lines.push(...r); };
 
 			// ── Header — uses success colour to signal completion ────────────
 			// Note: next-action intentionally uses "success" for its bar/title
 			// to distinguish it from regular accent-coloured screens.
-			push(ui.bar());
 			push(ui.blank());
 			push(ui.header(`  ✓  ${opts.title}`));
 
@@ -192,11 +193,10 @@ export async function showNextAction(
 
 			// ── Footer ────────────────────────────────────────────────────────
 			const numHint = allActions.map((_, i) => `${i + 1}`).join("/");
-			push(ui.hints([`↑/↓ to choose`, `${numHint} to quick-select`, `enter to confirm`]));
-			push(ui.bar());
+			const footer = ui.hints([`↑/↓ to choose`, `${numHint} to quick-select`, `enter to confirm`])[0] ?? "";
 
-			cachedLines = lines;
-			return lines;
+			cachedLines = renderSharedDialogFrame(theme, "GSD Next Action", lines, width, { footer });
+			return cachedLines;
 		}
 
 		return { render, invalidate: () => { cachedLines = undefined; }, handleInput };