ompchamber 0.7.0 → 1.0.0

package/src/client/components/workspace/terminal-panel/mount.ts

@@ -0,0 +1,275 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * Mounts an xterm instance on a container and keeps it bound to a PTY.
+ *
+ * Extracted from the view component so the mount lifecycle (xterm import, fit
+ * addon, input wiring, observers) stays readable and the component remains a
+ * render layer. Everything the caller must know travels through `callbacks`;
+ * the returned handle is the only way back in.
+ *
+ * Two behaviours here are deliberate:
+ *
+ * - **Attach waits for a real grid.** The terminal panel stays mounted while
+ *   its view is CSS-hidden (that is what keeps a shell alive across panel
+ *   switches), and a hidden container measures 0px — fitting is skipped and
+ *   xterm keeps its 80x24 default. Attaching then would create the shell at a
+ *   size the panel never had, and the retained scrollback would replay at that
+ *   width forever. So attach is driven by the same ResizeObserver that detects
+ *   the panel becoming visible.
+ * - **Raw bytes in, raw bytes out.** `onData`/`onBinary` forward keystrokes
+ *   untouched, and `write` takes a `Uint8Array` so xterm's streaming UTF-8
+ *   decoder reassembles a character split across two PTY reads.
+ * - **xterm and the WebGL addon are dynamically imported on purpose.** xterm is
+ *   ~300 KB and the addon pulls a WebGL context into the panel; both stay out
+ *   of the initial client bundle until the terminal panel is actually opened.
+ *   The module shape varies by build, hence the probe pattern below.
+ */
+
+import type { Terminal } from '@xterm/xterm';
+import type { FitAddon } from '@xterm/addon-fit';
+import type { WebglAddon } from '@xterm/addon-webgl';
+import {
+  getXtermTheme,
+  XTERM_FONT_FAMILY,
+  safePatchFitAddon,
+  safePatchRenderService,
+  type XtermCore,
+  type XtermModule,
+} from '@/client/data/theme/terminal';
+
+export interface XtermMountCallbacks {
+  /** Keystrokes, paste, mouse reports — straight to the PTY. */
+  onInput: (data: string) => void;
+  /** Non-UTF-8 payloads xterm reports separately (some mouse reports). */
+  onBinaryInput: (data: string) => void;
+  /** The grid changed; the PTY must be resized to match. */
+  onGridChange: (cols: number, rows: number) => void;
+  /** The terminal is measurable and knows its size; attach with these. */
+  onReady: (cols: number, rows: number) => void;
+  /** Viewport scrolled away from the live bottom. */
+  onScrolledUpChange: (scrolledUp: boolean) => void;
+}
+
+export interface XtermMount {
+  term: Terminal;
+  fitAddon: FitAddon;
+  /**
+   * Lay the retained scrollback out at the size it was drawn for, then fit the
+   * panel. Grid reports are suppressed until the replay has been consumed.
+   */
+  writeReplay: (bytes: Uint8Array, cols: number, rows: number) => void;
+  dispose: () => void;
+}
+
+/**
+ * Mount xterm inside `container`. Resolves to null when the module could not be
+ * loaded or the component unmounted while importing.
+ */
+export async function mountXterm(
+  container: HTMLElement,
+  isDark: boolean,
+  callbacks: XtermMountCallbacks,
+  isCancelled: () => boolean,
+): Promise<XtermMount | null> {
+  // Dynamic on purpose: xterm is ~300 KB and is only needed once the terminal
+  // panel is actually opened, so it stays out of the initial client bundle
+  // (the module shape varies by build, hence the probes).
+  const xtermModule = (await import('@xterm/xterm')) as unknown as XtermModule<typeof Terminal>;
+  const fitModule = (await import('@xterm/addon-fit')) as unknown as XtermModule<typeof FitAddon>;
+
+  const TerminalClass = xtermModule.Terminal || xtermModule.default?.Terminal || xtermModule.default;
+  const FitAddonClass = fitModule.FitAddon || fitModule.default?.FitAddon || fitModule.default;
+  if (!TerminalClass || !FitAddonClass || isCancelled()) return null;
+
+  safePatchFitAddon(FitAddonClass);
+
+  const term = new TerminalClass({
+    cursorBlink: true,
+    cursorStyle: 'block',
+    fontSize: 12,
+    lineHeight: 1.25,
+    fontFamily: XTERM_FONT_FAMILY,
+    theme: getXtermTheme(isDark),
+    // No `convertEol`: the PTY already emits CRLF, and converting a lone LF
+    // would re-introduce the line-feed doubling a real terminal avoids.
+    scrollback: 10000,
+    scrollSensitivity: 1.5,
+    fastScrollSensitivity: 5,
+    smoothScrollDuration: 0,
+    allowProposedApi: true,
+  }) as Terminal;
+
+  term.open(container);
+  safePatchRenderService(term);
+
+  // WebGL renderer: draws powerline glyphs (U+E0B0 etc.) as full-cell vector
+  // paths, so segmented prompts stay seamless the way a local terminal does.
+  // The DOM renderer draws them as ordinary glyphs inside the font box, which
+  // leaves notches at every segment joint. WebGL can fail (no GPU context,
+  // context-lost), and the DOM renderer is the automatic fallback.
+  try {
+    const webglModule = (await import('@xterm/addon-webgl')) as unknown as {
+      WebglAddon?: typeof WebglAddon;
+      default?: { WebglAddon?: typeof WebglAddon } & typeof WebglAddon;
+    };
+    const WebglAddonClass = webglModule.WebglAddon || webglModule.default?.WebglAddon || webglModule.default;
+    if (WebglAddonClass) {
+      const webgl = new WebglAddonClass() as WebglAddon;
+      webgl.onContextLoss(() => webgl.dispose());
+      term.loadAddon(webgl);
+    }
+  } catch {}
+
+  const fitAddon = new FitAddonClass() as FitAddon;
+  term.loadAddon(fitAddon);
+
+  term.attachCustomKeyEventHandler((event: globalThis.KeyboardEvent) => handleKeyNavigation(term, event));
+
+  const disposables = [
+    term.onScroll(() => {
+      const buffer = term.buffer.active;
+      callbacks.onScrolledUpChange(buffer.viewportY < buffer.baseY);
+    }),
+    term.onData((data: string) => callbacks.onInput(data)),
+    term.onBinary((data: string) => callbacks.onBinaryInput(data)),
+    // FitAddon changes the grid on fit; the shell has to hear about it or a TUI
+    // keeps drawing at the old width. Reports are dropped while the replay is
+    // being laid out: that grid belongs to the recorded history, not the panel.
+    term.onResize(({ cols, rows }) => {
+      if (replaying) return;
+      callbacks.onGridChange(cols, rows);
+    }),
+  ];
+
+  let attached = false;
+  let fitTimer: ReturnType<typeof setTimeout> | null = null;
+  let frame: number | null = null;
+  /**
+   * Set while the retained scrollback is being laid out at its recorded size.
+   * That transient grid is not the panel's, so it must not be reported as a
+   * resize — the shell would answer with a prompt repaint for a size the user
+   * never chose, which is how a reattach used to print a second prompt.
+   */
+  let replaying = false;
+
+  const safeFit = () => {
+    if (isCancelled()) return;
+    if (container.clientWidth <= 0 || container.clientHeight <= 0) return;
+    const core = (term as unknown as XtermCore)._core;
+    const dims = core?._renderService?.dimensions;
+    if (!dims?.css?.cell?.width || !dims?.css?.cell?.height) return;
+    try {
+      fitAddon.fit();
+    } catch {}
+  };
+
+  /** Fit now, once xterm has consumed everything already queued. */
+  const fitAfterWrites = () => {
+    term.write('', () => {
+      if (isCancelled()) return;
+      replaying = false;
+      safeFit();
+    });
+  };
+
+  /**
+   * Lay the retained scrollback out at the size it was drawn for, then converge
+   * on the panel's grid. Re-wrapping history at another width leaves wrapped
+   * fragments the shell's own redraw never clears.
+   */
+  const writeReplay = (bytes: Uint8Array, cols: number, rows: number) => {
+    replaying = true;
+    if (term.cols !== cols || term.rows !== rows) term.resize(cols, rows);
+    if (bytes.length === 0) {
+      fitAfterWrites();
+      return;
+    }
+    term.write(bytes, fitAfterWrites);
+  };
+
+  const attachIfSized = () => {
+    if (attached || isCancelled()) return;
+    if (container.clientWidth <= 0 || container.clientHeight <= 0) return;
+    const core = (term as unknown as XtermCore)._core;
+    if (!core?._renderService?.dimensions?.css?.cell?.width) return;
+    attached = true;
+    callbacks.onReady(term.cols, term.rows);
+    term.focus();
+  };
+
+  const resizeObserver = new ResizeObserver(() => {
+    if (fitTimer) clearTimeout(fitTimer);
+    fitTimer = setTimeout(() => {
+      safeFit();
+      // A panel that was hidden at mount becomes measurable here, which is when
+      // the shell should be created — at its real size.
+      attachIfSized();
+    }, 35);
+  });
+  resizeObserver.observe(container);
+
+  const touch = attachTouchScroll(container, term);
+
+  // The container may already be measurable (the view was active at mount), in
+  // which case the observer never fires a first time.
+  frame = requestAnimationFrame(() => {
+    safeFit();
+    attachIfSized();
+  });
+
+  return {
+    term,
+    fitAddon,
+    writeReplay,
+    dispose() {
+      if (frame !== null) cancelAnimationFrame(frame);
+      clearTimeout(fitTimer ?? undefined);
+      touch();
+      for (const disposable of disposables) disposable.dispose();
+      resizeObserver.disconnect();
+      try {
+        fitAddon.dispose();
+      } catch {}
+      try {
+        term.dispose();
+      } catch {}
+    },
+  };
+}
+
+/** Shift+PageUp/Home/End scroll the viewport instead of reaching the shell. */
+function handleKeyNavigation(term: Terminal, event: globalThis.KeyboardEvent): boolean {
+  if (event.type !== 'keydown' || !event.shiftKey) return true;
+  if (event.key === 'PageUp') { term.scrollPages(-1); return false; }
+  if (event.key === 'PageDown') { term.scrollPages(1); return false; }
+  if (event.key === 'Home') { term.scrollToTop(); return false; }
+  if (event.key === 'End') { term.scrollToBottom(); return false; }
+  if (event.key === 'ArrowUp') { term.scrollLines(-1); return false; }
+  if (event.key === 'ArrowDown') { term.scrollLines(1); return false; }
+  return true;
+}
+
+/** Touch drags scroll the scrollback; xterm has no touch handling of its own. */
+function attachTouchScroll(container: HTMLElement, term: Terminal): () => void {
+  let startY = 0;
+  const onStart = (event: globalThis.TouchEvent) => {
+    if (event.touches.length === 1) startY = event.touches[0].clientY;
+  };
+  const onMove = (event: globalThis.TouchEvent) => {
+    if (event.touches.length !== 1) return;
+    const deltaY = startY - event.touches[0].clientY;
+    if (Math.abs(deltaY) < 16) return;
+    term.scrollLines(Math.trunc(deltaY / 16));
+    startY = event.touches[0].clientY;
+  };
+  container.addEventListener('touchstart', onStart, { passive: true });
+  container.addEventListener('touchmove', onMove, { passive: true });
+  return () => {
+    container.removeEventListener('touchstart', onStart);
+    container.removeEventListener('touchmove', onMove);
+  };
+}

package/src/client/data/theme/terminal.ts

@@ -54,7 +54,33 @@ export function getXtermTheme(isDark: boolean) {
 
 export const XTERM_THEME = XTERM_DARK_THEME;
 
-export const XTERM_FONT_FAMILY = "'Fira Code', Menlo, Monaco, 'Courier New', monospace";
+/**
+ * Font stack for the terminal canvas.
+ *
+ * The glyph fallbacks after the text faces are load-bearing. A shell prompt is
+ * usually drawn with private-use symbols (powerline separators, devicons,
+ * Material Design icons) that **no** coding webfont contains — `@fontsource/
+ * fira-code`'s latin subset maps 226 codepoints and not one of them is above
+ * U+FFFF — so without a face that supplies them the browser paints a hollow
+ * tofu box for every prompt segment. The names below cover the Nerd Font
+ * families a user is most likely to have installed (plus the *fontconfig*
+ * symbol faces on Linux); a face that is absent is simply skipped by the
+ * normal fallback chain, so listing many costs nothing.
+ *
+ * This is the same shape OpenChamber ships (`TERMINAL_GLYPH_FALLBACKS` in its
+ * `ghostty/surface.ts`), which additionally bundles `SymbolsNerdFontMono` as a
+ * webfont so the coverage never depends on the machine.
+ *
+ * Only glyphs the text face lacks reach these entries, so Latin metrics are
+ * untouched — verified: `A`/`m`/`W` keep identical advance and ink.
+ */
+export const XTERM_GLYPH_FALLBACKS =
+  "'FiraCode Nerd Font Mono', 'FiraCode Nerd Font', 'JetBrainsMono Nerd Font', " +
+  "'JetBrainsMono NF', 'JetBrains Mono Nerd Font', 'Hack Nerd Font', 'MesloLGS NF', " +
+  "'MesloLGM Nerd Font', 'CaskaydiaCove Nerd Font', 'SauceCodePro Nerd Font', " +
+  "'Symbols Nerd Font Mono', 'Symbols Nerd Font', 'PowerlineSymbols'";
+
+export const XTERM_FONT_FAMILY = `'Fira Code', ${XTERM_GLYPH_FALLBACKS}, Menlo, Monaco, 'Courier New', monospace`;
 
 /** xterm's private render service, read only to size-check before fitting. */
 export interface XtermCore {
@@ -120,31 +146,3 @@ export function safePatchRenderService(term: any) {
     }
   } catch {}
 }
-
-let terminalSessionOutput = '';
-
-export function getTerminalSessionOutput(): string {
-  return terminalSessionOutput;
-}
-
-export function appendTerminalSessionOutput(chunk: string): void {
-  terminalSessionOutput += chunk;
-  if (terminalSessionOutput.length > 250000) {
-    terminalSessionOutput = terminalSessionOutput.slice(-200000);
-  }
-}
-
-export function clearTerminalSessionOutput(): void {
-  terminalSessionOutput = '';
-}
-
-const TERMINAL_OUTPUT_SNAPSHOT_LIMIT = 8000;
-
-export function getTerminalOutputSnapshot(): string {
-  if (terminalSessionOutput.length <= TERMINAL_OUTPUT_SNAPSHOT_LIMIT) return terminalSessionOutput;
-  return terminalSessionOutput.slice(-TERMINAL_OUTPUT_SNAPSHOT_LIMIT);
-}
-
-export function setTerminalOutputSnapshot(value: string): void {
-  terminalSessionOutput = value;
-}

package/src/client/hooks/chat/omp/session-list.tsx

@@ -21,6 +21,7 @@ import type { ReactNode } from 'preact/compat';
 import { useFetcher } from '@/client/lib/router/fetcher';
 import { usePanelRefresh } from '@/client/hooks/workspace/panel-refresh';
 import { SIDEBAR_IDLE_REFRESH_MS } from '@/shared/lib/workspace/refresh-cadence';
+import { useInputRequiredAlert } from '@/client/hooks/ui/input-required-alert';
 import type { WorkspaceFolderData } from '@/shared/types';
 import type { SessionListPayload } from '@/server/lib/omp/session/sidebar-data.server';
 
@@ -87,6 +88,9 @@ export function SidebarDataProvider({ children, initialFolders = [] }: { childre
       folder.sessions?.some((session) => session.streamStatus === 'stream'),
     ),
   );
+  // Fires for ANY session, including one this tab never opened — the cue that an
+  // agent is blocked on an answer must not depend on the open timeline.
+  useInputRequiredAlert(fetcher.data?.folders ?? []);
   usePanelRefresh(refresh, !hasStreaming, SIDEBAR_IDLE_REFRESH_MS);
 
   const markSeen = useCallback((sessionId: number | string) => {
@@ -112,11 +116,28 @@ export function SidebarDataProvider({ children, initialFolders = [] }: { childre
   const value = useMemo<SidebarDataHandle>(() => {
     const data = fetcher.data;
     const seen = seenRef.current;
+    // A session that streams again earns a fresh badge lifecycle: forget the
+    // ack from an earlier run. Without this, a session opened with a terminal
+    // badge stays stripped for the whole mount — its spinner never renders no
+    // matter how many times the list refetches, and only a page reload (fresh
+    // mount) brings it back.
+    if (seen.size && data?.folders) {
+      for (const folder of data.folders) {
+        for (const session of folder.sessions ?? []) {
+          if (session.streamStatus === 'stream') seen.delete(String(session.id));
+        }
+      }
+    }
     return {
       folders: ((data?.folders ?? initialFolders) as WorkspaceFolderData[])
-        // Optimistic badge strip for sessions marked seen this mount.
+        // Optimistic badge strip for sessions marked seen this mount. NEVER
+        // strip a live `stream` row — the spinner must always render.
         .map((f) => seen.size
-          ? { ...f, sessions: (f.sessions ?? []).map((s) => (seen.has(String(s.id)) ? { ...s, streamStatus: undefined } : s)) }
+          ? { ...f, sessions: (f.sessions ?? []).map((s) => (
+              seen.has(String(s.id)) && s.streamStatus && s.streamStatus !== 'stream'
+                ? { ...s, streamStatus: undefined }
+                : s
+            )) }
           : f),
       isMock: data?.isMock ?? false,
       initializing: !hasLoaded,

package/src/client/hooks/chat/omp/session-sidebar-controller.ts

@@ -62,7 +62,7 @@ export interface SessionSidebarController {
   sortOption: SessionSortOption;
   handleSortChange: (opt: SessionSortOption) => void;
   processedFolders: WorkspaceFolderData[];
-  sessionStatus: Record<string, 'stream' | 'finish' | 'abort' | 'error'>;
+  sessionStatus: Record<string, 'stream' | 'finish' | 'abort'>;
   handleSelectSession: (id: number | string) => void;
 }
 

package/src/client/hooks/chat/timeline/actions.ts

@@ -28,7 +28,9 @@ export interface ChatTimelineActionsDeps {
   sessionId: string | null;
   appSettings: Record<string, any>;
   messageQueue: QueuedMessage[];
-  setMessageQueue: (updater: SetStateAction<QueuedMessage[]>) => void;
+  /** Server-backed per-item queue ops (append/remove/reorder). */
+  enqueueMessage: (item: Omit<QueuedMessage, 'id'>) => void;
+  removeMessage: (id: string) => void;
   executeSend: (text: string, attachments: Attachment[], options?: { model?: QueuedMessageModel | null }) => Promise<void>;
   steerOmpAgent: (text: string, attachments: Attachment[]) => Promise<void>;
   ompAgent: OmpAgentHandle;
@@ -49,8 +51,6 @@ export interface ChatTimelineActionsDeps {
   /** Global access-control mode, snapshotted onto queued items. */
   accessModeRef: { current: ApprovalMode };
   setSearchParams: (fn: (prev: URLSearchParams) => URLSearchParams, opts?: { replace?: boolean }) => void;
-  /** Advance the pending-dialog queue after the head was answered. */
-  dismissExtensionDialog: () => void;
 }
 
 export interface ChatTimelineActionsResult {
@@ -64,7 +64,6 @@ export interface ChatTimelineActionsResult {
   stopGenerating: () => number;
   handleThinkingLevelChange: (level: string) => void;
   handleModelChange: (provider: string, modelId: string) => void;
-  closeExtensionDialog: () => void;
 }
 
 export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimelineActionsResult {
@@ -77,7 +76,8 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
     sessionId,
     appSettings,
     messageQueue,
-    setMessageQueue,
+    enqueueMessage,
+    removeMessage,
     executeSend,
     steerOmpAgent,
     ompAgent,
@@ -91,7 +91,6 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
     composerModelRef,
     accessModeRef,
     setSearchParams,
-    dismissExtensionDialog,
   } = deps;
 
   const handleSend = useCallback(async (attachments: Attachment[], options?: { steering?: boolean }) => {
@@ -127,41 +126,36 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
         return;
       }
       const composerPick = composerModelRef.current;
-      const queuedItem: QueuedMessage = {
-        id: `queue-${Date.now()}`,
-        text: textToSend,
-        attachments,
-        // Snapshot the composer's model/thinking plus the live access mode so
-        // auto-delivery runs the item with exactly these settings.
-        model: composerPick
-          ? { ...composerPick, accessMode: accessModeRef.current }
-          : null,
-      };
-      // Both modes: hold the follow-up in the client queue. The panel is the
-      // source of truth (editable, removable, survives reload via the
-      // session-state blob); delivery happens when the run ends — the
-      // auto-process effect sends the head item. For omp this replaces the
-      // old immediate `follow_up` RPC, whose server-side queue the client
-      // could never cancel (Stop kept executing it).
+      // Snapshot the composer's model/thinking plus the live access mode so
+      // server-side auto-delivery runs the item with exactly these settings.
+      const model = composerPick
+        ? { ...composerPick, accessMode: accessModeRef.current }
+        : null;
+      // Both modes: the item is stored server-side (`queued_messages`) and the
+      // panel is a view of it. Delivery happens when the run ends — the
+      // wrapper's terminal `agent_end` claims the head and dispatches it.
       setInputValue('');
-      setMessageQueue(prev => [...prev, queuedItem]);
+      enqueueMessage({ text: textToSend, attachments, model });
       return;
     }
 
     setInputValue('');
     executeSend(textToSend, attachments);
-  }, [inputValue, isGenerating, executeSend, setMessageQueue, isOmpSession, appSettings, steerOmpAgent, setInputValue, abortControllerRef, setGenerating, stopHoldRef, composerModelRef, accessModeRef]);
+  }, [inputValue, isGenerating, executeSend, enqueueMessage, isOmpSession, appSettings, steerOmpAgent, setInputValue, abortControllerRef, setGenerating, stopHoldRef, composerModelRef, accessModeRef]);
 
   const handleEditQueueItem = useCallback((item: QueuedMessage) => {
-    setMessageQueue(q => q.filter(i => i.id !== item.id));
+    // Lift the text into the composer and drop the row. If the user never
+    // re-submits, the delete (below) already removed it — the old flow had a
+    // dead window here where removing from the local list was the only edit.
     setInputValue(item.text);
     setInputAttachments(item.attachments);
-  }, [setMessageQueue, setInputValue, setInputAttachments]);
+    removeMessage(item.id);
+  }, [removeMessage, setInputValue, setInputAttachments]);
 
   const handleSendNowQueueItem = useCallback(async (item: QueuedMessage) => {
-    // Explicit delivery also lifts the Stop hold.
+    // Explicit delivery also lifts the Stop hold (mock path).
     stopHoldRef.current = false;
-    setMessageQueue(q => q.filter(i => i.id !== item.id));
+    removeMessage(item.id);
 
     if (isGenerating) {
       if (isOmpSession) {
@@ -177,7 +171,7 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
     } else {
       executeSend(item.text, item.attachments, { model: item.model });
     }
-  }, [isGenerating, executeSend, setMessageQueue, isOmpSession, steerOmpAgent, abortControllerRef, setGenerating, stopHoldRef]);
+  }, [isGenerating, executeSend, removeMessage, isOmpSession, steerOmpAgent, abortControllerRef, setGenerating, stopHoldRef]);
 
   const handleUndo = useCallback(async (msgId: string, content?: string): Promise<boolean> => {
     if (isGenerating) {
@@ -302,10 +296,6 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
     void ompAgent.setModel(provider, modelId);
   }, [isOmpSession, ompAgent, pendingComposerModelRef]);
 
-  const closeExtensionDialog = useCallback(() => {
-    dismissExtensionDialog();
-  }, [dismissExtensionDialog]);
-
   return {
     handleSend,
     handleEditQueueItem,
@@ -316,6 +306,5 @@ export function useChatTimelineActions(deps: ChatTimelineActionsDeps): ChatTimel
     stopGenerating,
     handleThinkingLevelChange,
     handleModelChange,
-    closeExtensionDialog,
   };
 }

package/src/client/hooks/chat/timeline/ask-frames.ts

@@ -0,0 +1,102 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * Routes omp's pending answerable dialogs to their renderer.
+ *
+ * `ask` dialogs belong on the tool card that raised them — a modal would hide
+ * every question but the one in flight, and the tool's own result (all questions
+ * and their answers) is what the user reads afterwards. Everything else
+ * (approval gates under `always-ask`, extension pickers) has no card of its own
+ * and keeps the modal.
+ *
+ * The two are told apart by the running ask tool calls: a frame whose title
+ * names one of their questions is theirs, and a frame that follows such a frame
+ * (the `editor` omp opens after "Other (type your own)") belongs with it too.
+ * Any frame left over is modal material — including an ask-shaped frame whose
+ * tool call the timeline has not seen, which must stay answerable rather than
+ * silently vanish.
+ */
+
+import { createContext, useContext } from 'preact/compat';
+import type { ChatMessageData } from '@/shared/types';
+import type { ExtensionUiDialogRequest } from '@/shared/types/omp/agent';
+import { groupAskFrames, isAskToolCall, normalizeAskText, parseAskQuestions, type AskQuestion } from '@/shared/lib/chat/ask-questions';
+import type { ExtensionDialogResponse } from '@/client/components/workspace/chat-timeline/tool-renderers/extension-dialog/Lazy';
+
+export interface AskFramesSplit {
+  /** The ask's dialogs, bucketed per question, keyed by ask tool-call id. */
+  framesByTool: Map<string, ExtensionUiDialogRequest[][]>;
+  /** Oldest request no ask card owns — the one the modal renders, if any. */
+  modalRequest: ExtensionUiDialogRequest | null;
+}
+
+export interface AskFramesHandle {
+  framesByTool: AskFramesSplit['framesByTool'];
+  /** Answer one ask dialog and drop it from the pending queue. */
+  respond: (request: ExtensionUiDialogRequest, response: ExtensionDialogResponse) => void;
+}
+
+const EMPTY: AskFramesHandle = { framesByTool: new Map(), respond: () => {} };
+
+export const AskFramesContext = createContext<AskFramesHandle>(EMPTY);
+
+/** Pending ask dialogs for the timeline that provides them. */
+export function useAskFrames(): AskFramesHandle {
+  return useContext(AskFramesContext);
+}
+
+export function splitAskFrames(
+  messages: ChatMessageData[],
+  pending: ExtensionUiDialogRequest[],
+): AskFramesSplit {
+  const framesByTool = new Map<string, ExtensionUiDialogRequest[][]>();
+  if (pending.length === 0) return { framesByTool, modalRequest: null };
+
+  // Match against EVERY ask the timeline knows, not just the running ones: a
+  // reloaded session reads its tool calls back from the JSONL, where a call
+  // still parked on a question has no result yet and so cannot be told from a
+  // finished one. The pending queue is the part that is authoritative — it only
+  // ever holds frames omp is still blocked on — so a title match is enough.
+  const openAsks = new Map<string, AskQuestion[]>();
+  for (const message of messages) {
+    for (const tool of message.toolCalls ?? []) {
+      if (!isAskToolCall(tool)) continue;
+      const questions = parseAskQuestions(tool);
+      if (questions.length > 0) openAsks.set(tool.id, questions);
+    }
+  }
+
+  const owned = new Map<string, ExtensionUiDialogRequest[]>();
+  const claimed = new Set<ExtensionUiDialogRequest>();
+  let lastOwner: string | null = null;
+
+  for (const request of pending) {
+    const title = typeof request.title === 'string' ? normalizeAskText(request.title) : '';
+    let owner: string | null = null;
+    if (title) {
+      for (const [toolId, questions] of openAsks) {
+        if (questions.some((question) => normalizeAskText(question.question) === title)) {
+          owner = toolId;
+          break;
+        }
+      }
+    }
+    // The dialog omp opens after "Other (type your own)" names the question in
+    // its title only loosely; it continues whichever ask spoke last. An
+    // approval gate is never part of an ask, so it keeps its own modal.
+    if (!owner && request.method !== 'confirm') owner = lastOwner;
+    if (!owner) continue;
+    claimed.add(request);
+    lastOwner = owner;
+    owned.set(owner, [...(owned.get(owner) ?? []), request]);
+  }
+
+  for (const [toolId, frames] of owned) {
+    framesByTool.set(toolId, groupAskFrames(openAsks.get(toolId) ?? [], frames));
+  }
+
+  return { framesByTool, modalRequest: pending.find((request) => !claimed.has(request)) ?? null };
+}