@kabmo-labs/kabmo 0.3.1 → 0.4.0

package/src/client/components/workspace/plugin-panel/resolve.tsx

@@ -1,18 +1,13 @@
 import { useMemo } from 'preact/hooks';
-import type { ComponentType, ReactNode } from 'preact/compat';
+import type { ComponentType } from 'preact/compat';
 import type { RightPanelProps } from '@kabmo-labs/kabmo-sdk/app';
 import { usePanelRegistry, usePanelSlots } from '@/client/hooks/workspace/panel-registry';
-import { usePanelOrder } from '@/client/hooks/workspace/panel-order';
-import { pluginIdOf, pluginPanelKey } from '@/shared/lib/workspace/panel-ids';
-import { resolvePluginPanelWidths } from '@/shared/lib/workspace/panel-widths';
-import { PluginIdProvider } from '@kabmo-labs/kabmo-ui';
+import { pluginEnablementKey, pluginIdOf, pluginPanelKey } from '@/shared/lib/workspace/panel-ids';
+import { panelSideOf } from '@/shared/lib/workspace/left-dock';
+import { useLeftDock } from '@/client/hooks/workspace/left-dock';
 import { panelOf, rightPanelOf } from '@/client/lib/plugins/slots';
 import { PluginError } from '@/client/components/workspace/plugin-panel/Error';
-import {
-  enabledBuiltinPanels,
-  type BuiltinPanelView,
-  type PanelBodyProps,
-} from '@/client/components/workspace/panels/builtin';
+import type { PanelBodyProps } from '@/client/components/workspace/panels/builtin';
 
 export type { PanelBodyProps };
 
@@ -60,7 +55,7 @@ export function usePluginPanels(activePanel: string): PluginPanels {
       if (!Component) continue;
       const size = entry?.sizing.rightPanel;
       out.push({
-        panelKey: pluginPanelKey(panel.pluginId),
+        panelKey: pluginPanelKey(panel.pluginId, 'rightPanel'),
         pluginId: panel.pluginId,
         name: panel.name,
         title: entry?.titles.rightPanel ?? panel.name,
@@ -114,8 +109,9 @@ export function PluginPanelBody({ panelKey }: { panelKey: string }) {
  * it renders, so nothing here assumes what it contains.
  */
 export function usePanelSlotPlugins(): ResolvedPluginPanel[] {
-  const { panels } = usePanelRegistry();
+  const { panels, disabledPanels } = usePanelRegistry();
   const { slots } = usePanelSlots();
+  const dock = useLeftDock();
 
   return useMemo(() => {
     const out: ResolvedPluginPanel[] = [];
@@ -123,9 +119,17 @@ export function usePanelSlotPlugins(): ResolvedPluginPanel[] {
       const entry = slots.get(panel.pluginId);
       const Component = entry ? panelOf(entry) : undefined;
       if (!Component) continue;
+      // Enablement is per PLUGIN, so a switched-off plugin contributes nothing
+      // to any column — the same rule the right-panel catalog uses.
+      if (disabledPanels.includes(pluginEnablementKey(panel.pluginId))) continue;
+      const key = pluginPanelKey(panel.pluginId, 'panel');
+      // The column is one destination, and a `panel` slot only rides it. A row
+      // in the dock's placement list naming this instance is therefore ignored
+      // by `panelSideOf`'s slot rule rather than honoured.
+      if (panelSideOf(key, dock) !== 'editor') continue;
       const size = entry?.sizing.panel;
       out.push({
-        panelKey: pluginPanelKey(panel.pluginId),
+        panelKey: key,
         pluginId: panel.pluginId,
         name: panel.name,
         title: entry?.titles.panel ?? panel.name,
@@ -136,7 +140,7 @@ export function usePanelSlotPlugins(): ResolvedPluginPanel[] {
       });
     }
     return out;
-  }, [panels, slots]);
+  }, [panels, slots, disabledPanels, dock]);
 }
 
 /**
@@ -153,111 +157,4 @@ export function useActiveEditorPanel(activeKey: string | null): ResolvedPluginPa
   return activeKey ? plugins.find((panel) => panel.panelKey === activeKey) ?? null : null;
 }
 
-/** A built-in view's catalog entry, with its renderer closed over its component. */
-function builtinEntry(view: BuiltinPanelView): ResolvedPanel {
-  const View = view.Component;
-  return {
-    id: view.id,
-    title: view.title,
-    label: view.label,
-    icon: view.icon,
-    name: '',
-    builtin: true,
-    requiresWorkspace: view.requiresWorkspace,
-    liveWhileHidden: view.liveWhileHidden === true,
-    minWidth: view.minWidth,
-    defaultWidth: view.defaultWidth,
-    defaultFraction: view.defaultFraction,
-    render: (props) => <View {...props} />,
-  };
-}
-
-/** One panel in the merged catalog — a built-in view or an installed plugin. */
-export interface ResolvedPanel {
-  /** The panel id: a bare built-in view id, or `plugin:<pluginId>`. */
-  id: string;
-  /** The activity bar's tooltip. */
-  title: string;
-  /** The phone's chip label. */
-  label: string;
-  /** A built-in view's own icon; a plugin draws its mark instead. */
-  icon?: ReactNode;
-  /** A plugin's icon URL, when its manifest declares one. */
-  iconUrl?: string;
-  /** The plugin's display name; empty for a built-in view. */
-  name: string;
-  builtin: boolean;
-  requiresWorkspace: boolean;
-  liveWhileHidden: boolean;
-  minWidth: number;
-  /** The px width the view opens at before the group's area is measured. */
-  defaultWidth: number;
-  defaultFraction: number;
-  /** Render the body. One call, so both layouts draw a view the same way. */
-  render: (props: PanelBodyProps) => ReactNode;
-}
-
-/**
- * The panel catalog the activity bar and the panel stack render.
- *
- * ONE list, two sources: the built-in views (in `RIGHT_PANEL_TYPES` order) and
- * the installed plugins (in the registry's order). Enablement is ONE set of ids
- * — a built-in view is off by its bare id and a plugin by `plugin:<id>` — so a
- * view the user switched off disappears from the bar, the phone's strip and the
- * right-click menu alike, whichever kind it is.
- *
- * The BASE order is built-ins then plugins, which is what makes the bar stable
- * across reloads rather than following whichever import finished first; the
- * user's own order (`usePanelOrder`) is laid over it, so a dragged button stays
- * where it was put and a panel the order does not name keeps its base position.
- * Applied HERE rather than in the bar, because the desktop stack and the phone's
- * tab strip render from this same list — ordering at one call site would leave
- * the other two drawing the base order.
- */
-export function usePanelCatalog(): ResolvedPanel[] {
-  const { panels, disabledPanels } = usePanelRegistry();
-  const { slots } = usePanelSlots();
-  const { apply } = usePanelOrder();
-
-  return useMemo(() => {
-    const out: ResolvedPanel[] = [];
-
-    for (const view of enabledBuiltinPanels(disabledPanels)) {
-      out.push(builtinEntry(view));
-    }
-
-    for (const panel of panels) {
-      const entry = slots.get(panel.pluginId);
-      const Component = entry ? rightPanelOf(entry) : undefined;
-      if (!Component) continue;
-      const key = pluginPanelKey(panel.pluginId);
-      if (disabledPanels.includes(key)) continue;
-      const size = entry?.sizing.rightPanel;
-      const widths = resolvePluginPanelWidths({ ...size });
-      out.push({
-        id: key,
-        title: `${entry?.titles.rightPanel ?? panel.name} — ${panel.name}`,
-        label: entry?.titles.rightPanel ?? panel.name,
-        name: panel.name,
-        builtin: false,
-        // A plugin reads whatever the host published and draws what it can, so
-        // gating it on a workspace folder would hide a panel that works.
-        requiresWorkspace: false,
-        liveWhileHidden: false,
-        minWidth: widths.min,
-        defaultWidth: widths.px,
-        defaultFraction: widths.fraction,
-        ...(panel.iconUrl ? { iconUrl: panel.iconUrl } : {}),
-        // Wrapped so the kit's participant hooks resolve THIS plugin's id while
-        // its panel renders — the scope is what `useRpc`/`useRealtime` read.
-        render: (props) => (
-          <PluginIdProvider pluginId={panel.pluginId}>
-            <Component sessionId={props.sessionId ?? null} workspacePath={null} />
-          </PluginIdProvider>
-        ),
-      });
-    }
-
-    return apply(out);
-  }, [panels, slots, disabledPanels, apply]);
-}
+export { usePanelCatalog, isSessionsPanel, type PanelCatalogSide, type ResolvedPanel } from '@/client/components/workspace/plugin-panel/catalog';

package/src/client/hooks/chat/composer/compact.ts

@@ -0,0 +1,119 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The phone composer's "give the height back" state, and the tap that ends it.
+ *
+ * A reader scrolled back through the transcript with an empty draft gets the
+ * conversation's height back — the textarea is REMOVED rather than shrunk (a
+ * shrunk one keeps a focusable element with no usable pixels and a
+ * sentence-long placeholder clipped mid-word). `AttachmentToolbar` then carries
+ * the "Type here" target that brings the box back.
+ *
+ * Two properties are load-bearing and each was a bug first:
+ *
+ *  - **The reopen flag is not derived from focus.** Re-opening removes the
+ *    button that was tapped, so the browser emits a `focusout` for it in the
+ *    same frame the textarea is being inserted — measured order:
+ *    `focusin:BUTTON, focusout:BUTTON, ta-added, ta-removed`. Any flag derived
+ *    from focus collapses the composer it just opened.
+ *  - **The decision is made on POINTERDOWN, not click.** Pressing the target
+ *    fires `focusin`, which expands the composer, which removes the button the
+ *    finger is still on — so the pointerup lands on a different target and the
+ *    browser emits no click at all (measured: `pd:BUTTON` with no `click:`
+ *    line after it).
+ *
+ * Only reaching for something OUTSIDE the card takes the composer back to
+ * compact: the reader asked for the box, and nothing the focus system does on
+ * the way to it may take that back.
+ */
+
+import { useEffect, useState } from 'preact/hooks';
+import type { RefObject } from 'preact/compat';
+import type { Attachment } from '@/shared/types';
+
+export interface ComposerCompactInput {
+  /** The composer's card — the element the tap handler is bound to. */
+  cardRef: RefObject<HTMLDivElement>;
+  /** Only a phone gives its height back; a desktop sits beside the chat. */
+  isMobile: boolean;
+  /** The timeline says the reader is back through the transcript. */
+  shrinkWhileReading: boolean;
+  /** Anything inside the card has focus. */
+  composerFocused: boolean;
+  setComposerFocused: (focused: boolean) => void;
+  value: string;
+  attachments: Attachment[];
+}
+
+export interface ComposerCompact {
+  /** True when the textarea must not be rendered. */
+  compact: boolean;
+  /** The reader tapped the card to get the box back. */
+  reopen: () => void;
+  /** The card's `onPointerDown`, for every state (focuses the draft when open). */
+  onCardPointerDown: (event: PointerEvent) => void;
+}
+
+/** Controls that own their own press — a tap on one must not re-open the card. */
+const OWN_PRESS = 'button, input, textarea, a, label, [role="button"]';
+
+export function useComposerCompact({
+  cardRef,
+  isMobile,
+  shrinkWhileReading,
+  composerFocused,
+  setComposerFocused,
+  value,
+  attachments,
+}: ComposerCompactInput): ComposerCompact {
+  const [reopenRequested, setReopenRequested] = useState(false);
+
+  // A draft means the reader is writing, and a focused composer is the same
+  // rule from the other side: the tap that re-opens it must not be undone by
+  // the scroll position it was tapped from.
+  const compact = isMobile
+    && shrinkWhileReading
+    && !composerFocused
+    && !reopenRequested
+    && !value.trim()
+    && attachments.length === 0;
+
+  // The tap ends with the caret where the reader aimed it. Runs on the commit
+  // that put the textarea back in the DOM, which is why it cannot live in the
+  // press handler. The flag is NOT cleared here — see the module note.
+  useEffect(() => {
+    if (!reopenRequested) return;
+    cardRef.current?.querySelector('textarea')?.focus();
+  }, [reopenRequested, cardRef]);
+
+  useEffect(() => {
+    if (!reopenRequested) return;
+    const onOutside = (event: Event) => {
+      if (cardRef.current?.contains(event.target as Node)) return;
+      setReopenRequested(false);
+      setComposerFocused(false);
+    };
+    document.addEventListener('pointerdown', onOutside);
+    return () => document.removeEventListener('pointerdown', onOutside);
+  }, [reopenRequested, cardRef, setComposerFocused]);
+
+  const onCardPointerDown = (event: PointerEvent) => {
+    const target = event.target as HTMLElement;
+    if (target.closest(OWN_PRESS)) {
+      // The "Type here" target is the ONE control that must open the box; it is
+      // marked rather than special-cased by its text.
+      if (target.closest('[data-composer-reopen]')) setReopenRequested(true);
+      return;
+    }
+    if (compact) {
+      setReopenRequested(true);
+      return;
+    }
+    cardRef.current?.querySelector('textarea')?.focus();
+  };
+
+  return { compact, reopen: () => setReopenRequested(true), onCardPointerDown };
+}

package/src/client/hooks/chat/omp/pending-rows.ts

@@ -64,6 +64,10 @@ export function withPendingRows(
       // newest and reshuffled LATEST_SESSION ordering mid-run.
       created_at: stamp,
       updated_at: stamp,
+      // The row's own reason for existing past the click: its prompt is held.
+      ...(entry.waiting
+        ? { waitingFor: { waitId: entry.waiting.waitId, sessionId: entry.waiting.dependsOn, title: entry.waiting.dependsOnTitle } }
+        : {}),
     };
     result = result.map((folder) => (
       folder.id === target.id

package/src/client/hooks/chat/omp/pending-sessions.ts

@@ -57,6 +57,19 @@ export interface PendingSessionEntry {
   /** Epoch ms a prompt was dispatched for this chat, or null while it is a
    *  draft the user has not sent in. */
   sentAt: number | null;
+  /**
+   * Set while this chat's prompt is HELD for another session to finish.
+   *
+   * The row is drawn exactly as it was before the send — same id, same folder —
+   * because the session does not exist yet: what the user asked for is that the
+   * row stays put and says what it is waiting on. `waitId` is the server row
+   * that owns the wait, so cancelling from the row reaches it.
+   */
+  waiting?: {
+    waitId: string;
+    dependsOn: string;
+    dependsOnTitle: string | null;
+  };
 }
 
 /** How long a SENT entry may outlive its switch with no real row behind it.
@@ -90,11 +103,15 @@ function createdAtFor(id: string): number {
 /** Write an entry, emitting only when it actually moved. */
 function upsert(entry: PendingSessionEntry): void {
   const current = entries.get(entry.id);
+  const sameWait = current?.waiting?.waitId === entry.waiting?.waitId
+    && current?.waiting?.dependsOn === entry.waiting?.dependsOn
+    && current?.waiting?.dependsOnTitle === entry.waiting?.dependsOnTitle;
   if (
     current
     && current.folderId === entry.folderId
     && current.createdAt === entry.createdAt
     && current.sentAt === entry.sentAt
+    && sameWait
   ) {
     return;
   }
@@ -160,6 +177,8 @@ export function adoptPendingSession(
     folderId: from?.folderId ?? folderId ?? null,
     createdAt: from?.createdAt ?? createdAtFor(toId),
     sentAt: from?.sentAt ?? Date.now(),
+    // The wait ended when the spawn answered: the new row is a real session
+    // from this moment, and a cue left on it would say it is still held.
   });
 }
 
@@ -216,6 +235,28 @@ export function hydratePendingSession(
   upsert({ id, folderId, createdAt: createdAtFor(id), sentAt: running ? Date.now() : null });
 }
 
+/**
+ * Rewrite one entry through the store's own write path.
+ *
+ * Exported for the WAITING half (`pending-waiting.ts`): the field is a normal
+ * part of the entry, so it must go through the same no-op check and the same
+ * emit rather than mutating the map behind the store's back.
+ */
+export function patchPendingEntry(
+  id: string,
+  update: (entry: PendingSessionEntry) => PendingSessionEntry | null,
+): void {
+  const entry = entries.get(id);
+  if (!entry) return;
+  const next = update(entry);
+  if (next === null) {
+    entries.delete(id);
+    emit();
+    return;
+  }
+  upsert(next);
+}
+
 /** Drop an entry (a released draft, a session that went away). */
 export function releasePendingSession(id: string): void {
   if (entries.delete(id)) emit();
@@ -252,6 +293,12 @@ export function reconcilePendingSessions(input: {
     // A live run holds its row wherever the user navigates: the spinner and
     // the row it belongs to are the same fact.
     if (input.running.has(id)) continue;
+    // A HELD prompt holds its row for as long as the wait lasts. The settle
+    // window below exists because a sent prompt's transcript is seconds away;
+    // a held prompt has no transcript at all yet, so expiring it after 30s
+    // would delete the very row the user is waiting on. The server's own list
+    // is what ends this — the dispatch watcher clears the cue.
+    if (entry.waiting) continue;
     if (entry.sentAt !== null) {
       if (now - entry.sentAt > PENDING_SETTLE_MS) {
         entries.delete(id);

package/src/client/hooks/chat/omp/pending-sessions.waiting.test.ts

@@ -0,0 +1,102 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The pending store's WAITING rules.
+ *
+ * A held prompt's row is the only thing on screen for a chat that has no
+ * transcript and no omp id, so the store has to keep it for as long as the wait
+ * lasts — and drop the cue the moment the wait ends, or the row keeps claiming
+ * something the server no longer holds.
+ */
+
+import { afterEach, describe, expect, test } from 'bun:test';
+import {
+  adoptPendingSession,
+  listPendingSessions,
+  markPendingSessionSent,
+  reconcilePendingSessions,
+  releasePendingSession,
+  startPendingSession,
+  subscribePendingSessions,
+} from '@/client/hooks/chat/omp/pending-sessions';
+import {
+  clearPendingSessionWaiting,
+  markPendingSessionWaiting,
+  pendingSessionWait,
+  releasePendingSessionByWait,
+} from '@/client/hooks/chat/omp/pending-waiting';
+
+afterEach(() => {
+  for (const entry of listPendingSessions()) releasePendingSession(entry.id);
+});
+
+describe('pending session waiting state', () => {
+  test('a held prompt keeps its row past the settle window', () => {
+    const id = startPendingSession(1);
+    markPendingSessionWaiting(id, { waitId: 'wait-1', dependsOn: 'sess-a', dependsOnTitle: 'Session A' });
+
+    // Far past PENDING_SETTLE_MS, which is the bound a SENT prompt gets.
+    reconcilePendingSessions({
+      listed: new Set(),
+      running: new Set(),
+      activeId: null,
+      now: Date.now() + 10 * 60_000,
+    });
+    expect(listPendingSessions().map((entry) => entry.id)).toContain(id);
+  });
+
+  // The contrast case: a SENT prompt with no wait behind it is released on the
+  // settle window, which is what makes the waiting rule a deliberate exception
+  // rather than a disabled timer.
+  test('an ordinary sent prompt still expires on the settle window', () => {
+    const id = startPendingSession(1);
+    markPendingSessionSent(id);
+    reconcilePendingSessions({ listed: new Set(), running: new Set(), activeId: null, now: Date.now() + 10 * 60_000 });
+    expect(listPendingSessions().map((entry) => entry.id)).not.toContain(id);
+  });
+
+  test('clearing the wait keeps the row but drops the cue', () => {
+    const id = startPendingSession(1);
+    markPendingSessionWaiting(id, { waitId: 'wait-1', dependsOn: 'sess-a', dependsOnTitle: 'Session A' });
+    clearPendingSessionWaiting(id);
+    expect(pendingSessionWait(id)).toBeNull();
+    expect(listPendingSessions().map((entry) => entry.id)).toContain(id);
+  });
+
+  test('a cancelled wait drops its row by the wait id', () => {
+    const first = startPendingSession(1);
+    const second = startPendingSession(1);
+    markPendingSessionWaiting(first, { waitId: 'wait-1', dependsOn: 'sess-a', dependsOnTitle: 'A' });
+    markPendingSessionWaiting(second, { waitId: 'wait-2', dependsOn: 'sess-b', dependsOnTitle: 'B' });
+
+    releasePendingSessionByWait('wait-1');
+    const ids = listPendingSessions().map((entry) => entry.id);
+    expect(ids).not.toContain(first);
+    expect(ids).toContain(second);
+  });
+
+  // The wait ends where the spawn answers: the new row is a real session from
+  // that moment, so a cue carried across would say it is still held.
+  test('adoption drops the waiting cue', () => {
+    const id = startPendingSession(1);
+    markPendingSessionWaiting(id, { waitId: 'wait-1', dependsOn: 'sess-a', dependsOnTitle: 'A' });
+    adoptPendingSession(id, 'omp-session-9', 1);
+    expect(pendingSessionWait('omp-session-9')).toBeNull();
+  });
+
+  // The cue is re-stamped from the server list on every publish, so an identical
+  // write must be a no-op — otherwise every sidebar re-renders on every frame.
+  test('re-stamping the same wait does not notify', () => {
+    const id = startPendingSession(1);
+    const wait = { waitId: 'wait-1', dependsOn: 'sess-a', dependsOnTitle: 'A' };
+    markPendingSessionWaiting(id, wait);
+    let notifications = 0;
+    const stop = subscribePendingSessions(() => { notifications += 1; });
+    markPendingSessionWaiting(id, { ...wait });
+    stop();
+    expect(notifications).toBe(0);
+  });
+});

package/src/client/hooks/chat/omp/pending-waiting.ts

@@ -0,0 +1,48 @@
+/**
+ * @license
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+/**
+ * The WAITING half of the pending store.
+ *
+ * Split from `pending-sessions.ts` for the repo's per-file ceiling, and it is a
+ * clean seam: that file owns an entry's LIFETIME (mint, adopt, retain, drop),
+ * this one owns the single field that says the chat's prompt is deferred. The
+ * store exposes one write hook (`patchPendingEntry`) so the field is still
+ * written through the same map, the same emit and the same no-op check.
+ */
+
+import type { PendingSessionEntry } from '@/client/hooks/chat/omp/pending-sessions';
+import { listPendingSessions, patchPendingEntry } from '@/client/hooks/chat/omp/pending-sessions';
+
+export type PendingWait = NonNullable<PendingSessionEntry['waiting']>;
+
+/**
+ * The chat's prompt is held until another session finishes.
+ *
+ * `sentAt` is set as well, deliberately: the row now stands for a real prompt
+ * the user has committed, so the "an unsent draft with nothing in it may go"
+ * rule must not reclaim it. The waiting half is what survives the switch —
+ * `reconcilePendingSessions` keeps it while the server still reports the row.
+ */
+export function markPendingSessionWaiting(id: string, waiting: PendingWait): void {
+  patchPendingEntry(id, (entry) => ({ ...entry, sentAt: entry.sentAt ?? Date.now(), waiting }));
+}
+
+/** The wait ended (dispatched, cancelled, failed): keep the row, drop the cue. */
+export function clearPendingSessionWaiting(id: string): void {
+  patchPendingEntry(id, (entry) => (entry.waiting ? { ...entry, waiting: undefined } : entry));
+}
+
+/** The waiting half of one entry, or null when the row is not waiting. */
+export function pendingSessionWait(id: string): PendingWait | null {
+  return listPendingSessions().find((entry) => entry.id === id)?.waiting ?? null;
+}
+
+/** Drop the entry whose prompt was held by `waitId` (the wait was cancelled). */
+export function releasePendingSessionByWait(waitId: string): void {
+  for (const entry of listPendingSessions()) {
+    if (entry.waiting?.waitId === waitId) patchPendingEntry(entry.id, () => null);
+  }
+}

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

@@ -30,6 +30,8 @@ import {
   reconcilePendingSessions,
   usePendingSessions,
 } from '@/client/hooks/chat/omp/pending-sessions';
+import { markPendingSessionWaiting } from '@/client/hooks/chat/omp/pending-waiting';
+import { useWaitingPrompts } from '@/client/hooks/chat/waiting/store';
 import { withPendingRows } from '@/client/hooks/chat/omp/pending-rows';
 import { writeSetting } from '@/shared/lib/settings/client';
 import { subscribeSessionKey } from '@/shared/lib/workspace/session-state/listeners';
@@ -150,6 +152,11 @@ export function useSessionSidebarController(
   // A chat omp has not written a transcript for yet. The store owns the row's
   // whole life — see `pending-sessions.ts` — so the sidebar only reads it here.
   const pendingEntries = usePendingSessions();
+  // A held prompt is a property of the SERVER row, not of this tab: a reload (or
+  // a second tab) re-enters a pending chat whose wait it never created, and the
+  // row has to keep saying what it waits for. The cue is therefore re-stamped
+  // from the list on every publish, and cleared when the row is gone.
+  const { prompts: waitingPrompts, loaded: waitingLoaded } = useWaitingPrompts();
   const runningIds = useMemo(
     () => new Set(Object.entries(sessionStatus).filter(([, status]) => status === 'stream').map(([id]) => id)),
     [sessionStatus],
@@ -165,6 +172,28 @@ export function useSessionSidebarController(
     hydratePendingSession(sessionParam, folderIdParam, sessionStatus[sessionParam] === 'stream');
   }, [sessionParam, folders, initializing, folderIdParam, sessionStatus]);
 
+  // The cue is STAMPED from the server list, never cleared from an absence.
+  //
+  // An absence is not evidence: the effect runs on the render a hold triggers,
+  // one frame before the topic's first snapshot, and a snapshot resolved before
+  // the create does not carry the row either. Clearing on that deleted the cue
+  // the user had just made — and, with it, the id the dispatch watcher needs to
+  // adopt. A wait ENDS through a terminal row, which the watcher
+  // (`waiting/dispatch.ts`) reads: dispatched, cancelled or failed.
+  useEffect(() => {
+    if (initializing || !waitingLoaded) return;
+    for (const entry of pendingEntries) {
+      const id = String(entry.id);
+      const held = waitingPrompts.find((prompt) => prompt.pendingId === id && prompt.status === 'waiting');
+      if (!held || entry.waiting?.waitId === held.id) continue;
+      markPendingSessionWaiting(id, {
+        waitId: held.id,
+        dependsOn: held.dependsOn,
+        dependsOnTitle: held.dependsOnTitle,
+      });
+    }
+  }, [pendingEntries, waitingPrompts, waitingLoaded, initializing]);
+
   // A pending chat's row is kept only while its draft still holds something,
   // so the reconcile below has to re-run when a draft SLOT moves — the blob
   // arriving is the common case (a chat opened and left empty has its entry