fix(desktop): reliable composer message queue (#40221)

* fix(desktop): make composer message queue reliable

The queue felt 'dumb' because of three real bugs:

1. Drained-after-interrupt sends went silent. cancelRun sets
   interrupted:true and nothing reset it; submitPromptText's optimistic
   seed preserved it, and the message stream drops every delta while
   interrupted. So Send-now-while-busy and any interrupt+drain submitted
   the next turn into a muted session. Fix: a fresh submit is a new turn —
   seed interrupted:false.

2. Back-to-back queue drains stalled. The drain fires on the busy->false
   settle edge, but busyRef (synced from the busy store by a separate
   effect) can still read true on that same edge, so the drained send hit
   the busy guard, returned false, and the entry was never removed. Fix:
   fromQueue sends bypass the busyRef guard (the queue drain lock
   serializes them); the user path keeps the guard.

3. Double-enter-to-interrupt killed single non-queue turns. The hidden
   450ms timer meant a natural double-tap after sending stopped the agent.
   Fix: empty Enter while busy is a no-op; interrupting is explicit —
   Stop button or Esc.

Also: clean stop (no [interrupted] marker), Send-now works while busy
(promote + interrupt + auto-drain), settle on the interrupted completion
path. Adds regression tests and unblocks the prompt-actions suite by
completing its stale @/hermes mock.

* fix(desktop): float the queue panel as an overlay so the chat doesn't resize

The queue list rendered in-flow inside the composer root, so its height
fed --composer-measured-height (the composer rect drives the thread's
bottom padding + last-message clearance). Queuing a message grew that
rect and the whole chat visibly resized.

Anchor the panel out of flow above the composer (absolute bottom-full,
capped at 40vh with internal scroll). It no longer contributes to the
measured height, so the thread layout stays put and the list overlays the
(already faded) chat. Still collapsible via the panel's own
disclosure header.

* fix(desktop): queue panel collapsed by default + shared border with composer

- Default the queue disclosure to collapsed (compact 'N queued' pill)
  instead of expanded.
- Drop the gap and merge the panel into the composer: square bottom
  corners, no bottom border/radius, and overlap down by the Root's pt-2
  (-mb-2) so the panel's borderless bottom lands on the composer surface's
  top border — one continuous bordered shape.

* style(desktop): tighten queue panel padding

* style(desktop): trim queue-ux comments to house style

* style(desktop): drop 'Cursor' references from comments

apps/desktop/src/app/chat/composer/index.tsx

@@ -27,6 +27,7 @@ import { $composerAttachments, clearComposerAttachments, type ComposerAttachment
 import {
   $queuedPromptsBySession,
   enqueueQueuedPrompt,
+  promoteQueuedPrompt,
   type QueuedPromptEntry,
   removeQueuedPrompt,
   shouldAutoDrainOnSettle,
@@ -136,12 +137,6 @@ export function ChatBar({
   const draftRef = useRef(draft)
   const previousBusyRef = useRef(busy)
   const drainingQueueRef = useRef(false)
-  // Set when the user explicitly interrupts the running turn via the Stop
-  // button (busy + empty composer). It suppresses the next busy→false
-  // auto-drain so an explicit Stop actually halts instead of immediately
-  // firing the head of the queue. The queue is preserved; the user resumes
-  // it deliberately via Cmd/Ctrl+K, Enter, or the per-row "send now" arrow.
-  const userInterruptedRef = useRef(false)
   const urlInputRef = useRef<HTMLInputElement | null>(null)
 
   const [urlOpen, setUrlOpen] = useState(false)
@@ -729,7 +724,22 @@ export function ChatBar({
         return
       }
 
+      // Empty Enter while busy is a no-op — interrupting is explicit (Stop/Esc),
+      // never a stray Enter after sending. With a payload, submitDraft queues it.
+      if (busy && !hasComposerPayload) {
+        return
+      }
+
       submitDraft()
+
+      return
+    }
+
+    // Esc interrupts the running turn (Stop-button parity).
+    if (event.key === 'Escape' && busy) {
+      event.preventDefault()
+      triggerHaptic('cancel')
+      void Promise.resolve(onCancel())
     }
   }
 
@@ -983,41 +993,40 @@ export function ChatBar({
   )
 
   const sendQueuedNow = useCallback(
-    (id: string) => runDrain(entries => entries.find(e => e.id === id && id !== queueEdit?.entryId)),
-    [queueEdit, runDrain]
+    (id: string) => {
+      if (!activeQueueSessionKey || id === queueEdit?.entryId) {
+        return false
+      }
+
+      if (busy) {
+        // Promote to the head, then interrupt. The gateway always emits a
+        // settle (message.complete + session.info running:false) when the
+        // turn unwinds, and the busy→false auto-drain below sends this entry.
+        promoteQueuedPrompt(activeQueueSessionKey, id)
+        triggerHaptic('selection')
+        void Promise.resolve(onCancel())
+
+        return true
+      }
+
+      return runDrain(entries => entries.find(e => e.id === id))
+    },
+    [activeQueueSessionKey, busy, onCancel, queueEdit, runDrain]
   )
 
-  // Auto-drain on busy → false (turn settled). An explicit user interrupt
-  // (Stop button) sets userInterruptedRef so we skip exactly one auto-drain:
-  // the user asked to halt, so we must not immediately re-send the queue.
-  // The queued turns stay intact and the user resumes them on demand.
+  // Auto-drain on busy → false (turn settled). Queued turns always flow once
+  // the session is idle again — whether the turn finished naturally or the
+  // user interrupted it. Interrupting to reach a queued message is the whole
+  // point of the queue, so we never suppress the drain. To cancel queued
+  // turns, the user deletes them from the panel.
   useEffect(() => {
     const wasBusy = previousBusyRef.current
     previousBusyRef.current = busy
 
-    // Clear the interrupt latch when a new turn starts (false → true). This
-    // guards the sub-frame race where a Stop click lands after busy already
-    // flipped false (button not yet unmounted): the stale latch can no longer
-    // survive into the next turn and wrongly suppress its natural auto-drain.
-    if (busy && !wasBusy) {
-      userInterruptedRef.current = false
-
-      return
-    }
-
-    const interrupted = userInterruptedRef.current
-
-    // Consume the interrupt latch on any settle so a later natural completion
-    // is not wrongly suppressed.
-    if (!busy && wasBusy && interrupted) {
-      userInterruptedRef.current = false
-    }
-
     if (
       shouldAutoDrainOnSettle({
         isBusy: busy,
         queueLength: queuedPrompts.length,
-        userInterrupted: interrupted,
         wasBusy
       })
     ) {
@@ -1058,12 +1067,8 @@ export function ChatBar({
       } else if (hasComposerPayload) {
         queueCurrentDraft()
       } else {
-        // Stop button: an explicit interrupt must actually halt the running
-        // turn. Mark the interrupt so the busy→false auto-drain effect skips
-        // re-sending the queue — otherwise a queued follow-up would fire the
-        // instant we cancel and Stop would appear to "never work". Queued
-        // turns are preserved; the user sends them on demand.
-        userInterruptedRef.current = true
+        // Stop button (the only way to reach here while busy with an empty
+        // composer — empty Enter is short-circuited in the keydown handler).
         triggerHaptic('cancel')
         void Promise.resolve(onCancel())
       }
@@ -1298,7 +1303,11 @@ export function ChatBar({
           )}
           <SkinSlashPopover draft={draft} onSelect={selectSkinSlashCommand} />
           {activeQueueSessionKey && queuedPrompts.length > 0 && (
-            <div className="relative z-6 mb-1 px-0.5">
+            // Out of flow so the queue never inflates the composer's measured
+            // height (that drives thread bottom padding → chat resizes on
+            // queue). Overlaps -mb-2 onto the surface's top border for a shared
+            // edge; capped + scrollable. Overlays the chat instead of pushing it.
+            <div className="absolute inset-x-0 bottom-full z-6 -mb-2 max-h-[40vh] overflow-y-auto">
               <QueuePanel
                 busy={busy}
                 editingId={queueEdit?.entryId ?? null}

apps/desktop/src/app/chat/composer/queue-panel.tsx

@@ -23,16 +23,16 @@ const entryPreview = (entry: QueuedPromptEntry, c: Translations['composer']) =>
 export function QueuePanel({ busy, editingId, entries, onDelete, onEdit, onSendNow }: QueuePanelProps) {
   const { t } = useI18n()
   const c = t.composer
-  const [collapsed, setCollapsed] = useState(false)
+  const [collapsed, setCollapsed] = useState(true)
 
   if (entries.length === 0) {
     return null
   }
 
   return (
-    <div className="rounded-2xl border border-border/65 bg-[color-mix(in_srgb,var(--dt-card)_70%,transparent)] py-0.5 shadow-[0_0_0_1px_color-mix(in_srgb,var(--dt-card)_30%,transparent)_inset]">
+    <div className="rounded-t-2xl border border-b-0 border-border/65 bg-[color-mix(in_srgb,var(--dt-card)_70%,transparent)] pt-0.5 pb-1">
       <button
-        className="flex w-full items-center gap-1.5 px-2.5 py-1 text-left text-[0.72rem] font-medium text-muted-foreground/92 transition-colors hover:text-foreground/90"
+        className="flex w-full items-center gap-1.5 px-2 py-0.5 text-left text-[0.72rem] font-medium text-muted-foreground/92 transition-colors hover:text-foreground/90"
         onClick={() => setCollapsed(open => !open)}
         type="button"
       >
@@ -41,15 +41,16 @@ export function QueuePanel({ busy, editingId, entries, onDelete, onEdit, onSendN
       </button>
 
       {!collapsed && (
-        <div className="space-y-0.5 px-1.5 pb-0.5">
+        <div className="space-y-0.5 px-1 pb-0.5">
           {entries.map(entry => {
             const isEditing = editingId === entry.id
             const attachmentsCount = entry.attachments.length
+            const sendLabel = busy ? c.sendQueuedNext : c.sendQueuedNow
 
             return (
               <div
                 className={cn(
-                  'group/queue-row flex items-center gap-1.5 rounded-lg border border-transparent px-1.5 py-1',
+                  'group/queue-row flex items-center gap-1.5 rounded-lg border border-transparent px-1.5 py-0.5',
                   'transition-colors duration-300 ease-out hover:bg-(--chrome-action-hover) hover:transition-none',
                   isEditing && 'border-[color-mix(in_srgb,var(--dt-composer-ring)_40%,transparent)] bg-accent/25'
                 )}
@@ -97,11 +98,11 @@ export function QueuePanel({ busy, editingId, entries, onDelete, onEdit, onSendN
                       <Pencil size={11} />
                     </Button>
                   </Tip>
-                  <Tip label={c.sendQueuedNow}>
+                  <Tip label={sendLabel}>
                     <Button
-                      aria-label={c.sendQueuedNow}
+                      aria-label={sendLabel}
                       className="h-5 w-5 rounded-md"
-                      disabled={busy || isEditing}
+                      disabled={isEditing}
                       onClick={() => onSendNow(entry.id)}
                       size="icon-xs"
                       type="button"

apps/desktop/src/app/gateway/hooks/use-gateway-boot.test.tsx

@@ -0,0 +1,265 @@
+import { act, cleanup, render } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest'
+
+import { $desktopBoot } from '@/store/boot'
+import { $gatewayState } from '@/store/session'
+
+import { useGatewayBoot } from './use-gateway-boot'
+
+// End-to-end-ish repro of the "remote VPS → stuck on CONNECTING, no Settings"
+// bug that drives the REAL useGatewayBoot hook + REAL HermesGateway through a
+// fake WebSocket we fully control. No Docker / no real port: from the desktop's
+// point of view a "remote VPS" is just a WebSocket that opens once and later
+// refuses to reopen, so that is exactly (and only) what we fake.
+//
+// The previous test (gateway-connecting-overlay.test.tsx) hand-set the stores
+// and asserted the overlays; this one proves the HOOK actually PRODUCES that
+// stuck store combo — closing the "inferred by reading code" gap on the
+// post-boot reconnect loop.
+
+type Listener = (ev: unknown) => void
+
+// Minimal WebSocket stand-in implementing only what json-rpc-gateway.connect()
+// touches: readyState, add/removeEventListener('open'|'error'|'close'), close().
+class FakeWebSocket {
+  static OPEN = 1
+  static CLOSED = 3
+  // Flipped by the test: 'open' = next socket connects; 'fail' = next socket
+  // errors (a dead remote). Mirrors a VPS going away after the first connect.
+  static mode: 'open' | 'fail' = 'open'
+  static instances: FakeWebSocket[] = []
+
+  readyState = 0
+  private listeners: Record<string, Set<Listener>> = {}
+
+  constructor(public url: string) {
+    FakeWebSocket.instances.push(this)
+    const willOpen = FakeWebSocket.mode === 'open'
+    // Resolve on the next microtask/macrotask so connect()'s promise wiring is
+    // in place before open/error fires (matches real async socket handshake).
+    setTimeout(() => {
+      if (willOpen) {
+        this.readyState = FakeWebSocket.OPEN
+        this.emit('open', {})
+      } else {
+        this.readyState = FakeWebSocket.CLOSED
+        this.emit('error', {})
+      }
+    }, 0)
+  }
+
+  addEventListener(type: string, fn: Listener) {
+    ;(this.listeners[type] ??= new Set()).add(fn)
+  }
+
+  removeEventListener(type: string, fn: Listener) {
+    this.listeners[type]?.delete(fn)
+  }
+
+  close() {
+    this.readyState = FakeWebSocket.CLOSED
+    this.emit('close', {})
+  }
+
+  // Force-drop an open socket, as a sleeping laptop / restarted remote would.
+  drop() {
+    this.readyState = FakeWebSocket.CLOSED
+    this.emit('close', {})
+  }
+
+  private emit(type: string, ev: unknown) {
+    for (const fn of this.listeners[type] ?? []) fn(ev)
+  }
+}
+
+function fakeDesktop() {
+  const conn = {
+    authMode: 'token' as const,
+    baseUrl: 'https://vps.example.com',
+    profile: 'default',
+    token: 't',
+    wsUrl: 'wss://vps.example.com/api/ws?token=t'
+  }
+
+  return {
+    getConnection: vi.fn(async () => conn),
+    getGatewayWsUrl: vi.fn(async () => conn.wsUrl),
+    getBootProgress: vi.fn(async () => ({
+      error: null,
+      fakeMode: false,
+      message: '',
+      phase: 'init',
+      progress: 0,
+      running: true,
+      timestamp: Date.now()
+    })),
+    onBootProgress: vi.fn(() => () => undefined),
+    onBackendExit: vi.fn(() => () => undefined),
+    onPowerResume: vi.fn(() => () => undefined),
+    onWindowStateChanged: vi.fn(() => () => undefined),
+    touchBackend: vi.fn(async () => undefined),
+    profile: { get: vi.fn(async () => ({ profile: 'default' })) }
+  }
+}
+
+function Harness() {
+  useGatewayBoot({
+    handleGatewayEvent: () => undefined,
+    onConnectionReady: () => undefined,
+    onGatewayReady: () => undefined,
+    refreshHermesConfig: async () => undefined,
+    refreshSessions: async () => undefined
+  })
+
+  return null
+}
+
+const originalWebSocket = globalThis.WebSocket
+
+beforeEach(() => {
+  vi.useFakeTimers()
+  FakeWebSocket.mode = 'open'
+  FakeWebSocket.instances = []
+  ;(globalThis as { WebSocket: unknown }).WebSocket = FakeWebSocket
+  ;(window as { hermesDesktop?: unknown }).hermesDesktop = fakeDesktop()
+  $gatewayState.set('idle')
+  $desktopBoot.set({
+    error: null,
+    fakeMode: false,
+    message: '',
+    phase: 'init',
+    progress: 0,
+    running: true,
+    timestamp: Date.now(),
+    visible: true
+  })
+})
+
+afterEach(() => {
+  cleanup()
+  vi.useRealTimers()
+  ;(globalThis as { WebSocket: unknown }).WebSocket = originalWebSocket
+  delete (window as { hermesDesktop?: unknown }).hermesDesktop
+})
+
+// Let pending microtasks (awaits) AND the queued 0ms socket open/error fire.
+async function flushAsync() {
+  await act(async () => {
+    await vi.advanceTimersByTimeAsync(0)
+  })
+}
+
+// Drive the exponential backoff forward by its full cap so the next scheduled
+// reconnect attempt actually runs (1s,2s,4s,8s,15s,15s…). Returns after the
+// attempt's async work settles.
+async function advanceBackoff() {
+  await act(async () => {
+    await vi.advanceTimersByTimeAsync(15_000)
+  })
+}
+
+describe('useGatewayBoot remote reconnect loop (real hook, fake socket)', () => {
+  it('INITIAL boot against a dead VPS: getConnection hangs (waitForHermes) → app sits in the connecting combo, then fails', async () => {
+    // The report's actual path: a fresh launch pointed at an unreachable VPS.
+    // startHermes()'s remote branch awaits waitForHermes() for 45s before it
+    // throws, so the renderer's `await desktop.getConnection()` stays pending
+    // that whole window. During it: gatewayState is still 'idle' (connect was
+    // never reached) and boot.error is null → connecting=true → the fullscreen
+    // CONNECTING overlay, latched, blocking Settings.
+    let rejectConn: (e: Error) => void = () => undefined
+    const desktop = fakeDesktop()
+    desktop.getConnection = vi.fn(
+      () =>
+        new Promise((_resolve, reject) => {
+          rejectConn = reject
+        })
+    )
+    ;(window as { hermesDesktop?: unknown }).hermesDesktop = desktop
+
+    render(<Harness />)
+    await flushAsync()
+
+    // getConnection is still pending — the dead-VPS wait. No socket was ever
+    // created, gatewayState never left idle, boot.error is null.
+    expect(FakeWebSocket.instances).toHaveLength(0)
+    expect($gatewayState.get()).not.toBe('open')
+    expect($desktopBoot.get().error).toBeNull()
+    // ^ connecting === true here → fullscreen CONNECTING, no Settings.
+
+    // After ~45s waitForHermes gives up and getConnection rejects → boot()
+    // catch → failDesktopBoot → the BootFailureOverlay recovery surface.
+    await act(async () => {
+      rejectConn(new Error('Hermes backend did not become ready: timeout'))
+      await vi.advanceTimersByTimeAsync(0)
+    })
+
+    expect($desktopBoot.get().error).toBeTruthy()
+  })
+
+  it('a remote that drops post-boot keeps looping with NO boot.error (the dead-end CONNECTING combo)', async () => {
+    render(<Harness />)
+    await flushAsync()
+
+    // Initial boot connected.
+    expect($gatewayState.get()).toBe('open')
+    expect($desktopBoot.get().error).toBeNull()
+    expect(FakeWebSocket.instances).toHaveLength(1)
+
+    // The remote VPS goes away: drop the live socket, and make every reopen
+    // fail from here on.
+    FakeWebSocket.mode = 'fail'
+    act(() => FakeWebSocket.instances[0].drop())
+    await flushAsync()
+
+    // Burn a couple backoff cycles BEFORE the escalation threshold (<6 attempts,
+    // ~the first ~15s). This is the window where stock and fixed behave the
+    // same: socket down, hook retrying, gatewayState non-open, boot.error still
+    // null → CONNECTING covers the screen with no recovery surface. (Past ~45s
+    // the fix raises boot.error; that's asserted in the next test.)
+    await advanceBackoff()
+
+    expect($gatewayState.get()).not.toBe('open')
+    expect($desktopBoot.get().error).toBeNull()
+    // It is actively retrying, not idle — more sockets were minted.
+    expect(FakeWebSocket.instances.length).toBeGreaterThan(1)
+  })
+
+  it('FIX: after the prolonged drop the hook raises a recoverable boot error (the escape hatch)', async () => {
+    render(<Harness />)
+    await flushAsync()
+    expect($desktopBoot.get().error).toBeNull()
+
+    FakeWebSocket.mode = 'fail'
+    act(() => FakeWebSocket.instances[0].drop())
+    await flushAsync()
+
+    // Walk the backoff past the >=6 attempt threshold (~45s of failures).
+    for (let i = 0; i < 8; i += 1) {
+      await advanceBackoff()
+    }
+
+    // The hook surfaced the recoverable error → BootFailureOverlay (Use local
+    // gateway / Sign in / Retry) becomes reachable instead of CONNECTING.
+    expect($desktopBoot.get().error).toBeTruthy()
+  })
+
+  it('FIX: a successful reconnect clears the recoverable error', async () => {
+    render(<Harness />)
+    await flushAsync()
+
+    FakeWebSocket.mode = 'fail'
+    act(() => FakeWebSocket.instances[0].drop())
+    await flushAsync()
+    for (let i = 0; i < 8; i += 1) {
+      await advanceBackoff()
+    }
+    expect($desktopBoot.get().error).toBeTruthy()
+
+    // The remote comes back: next reconnect attempt opens.
+    FakeWebSocket.mode = 'open'
+    await advanceBackoff()
+
+    expect($gatewayState.get()).toBe('open')
+    expect($desktopBoot.get().error).toBeNull()
+  })
+})

apps/desktop/src/app/session/hooks/use-message-stream.ts

@@ -437,11 +437,18 @@ export function useMessageStream({
 
       const completedState = updateSessionState(sessionId, state => {
         // Late completion from an already-cancelled turn: cancelRun has
-        // already finalized the bubble and added the [interrupted] marker;
-        // re-running the dedupe below would erase that marker and replace
-        // the partial with the (just-cancelled) full text.
+        // already finalized the bubble (kept the partial text, dropped it if
+        // empty). Re-running the dedupe below would replace the partial with
+        // the just-cancelled full text, so we settle and bail instead.
         if (state.interrupted) {
-          return state
+          return {
+            ...state,
+            awaitingResponse: false,
+            busy: false,
+            needsInput: false,
+            pendingBranchGroup: null,
+            streamId: null
+          }
         }
 
         const streamId = state.streamId

apps/desktop/src/app/session/hooks/use-prompt-actions.test.tsx

@@ -9,6 +9,8 @@ import type { SessionInfo } from '@/types/hermes'
 import { usePromptActions } from './use-prompt-actions'
 
 vi.mock('@/hermes', () => ({
+  getProfiles: vi.fn(async () => ({ profiles: [] })),
+  setApiRequestProfile: vi.fn(),
   transcribeAudio: vi.fn()
 }))
 
@@ -39,27 +41,31 @@ function sessionInfo(overrides: Partial<SessionInfo> = {}): SessionInfo {
 }
 
 interface HarnessHandle {
-  submitText: (text: string) => Promise<boolean>
+  submitText: (text: string, options?: { attachments?: never[]; fromQueue?: boolean }) => Promise<boolean>
 }
 
 function Harness({
+  busyRef,
   onReady,
+  onSeedState,
   refreshSessions,
   requestGateway
 }: {
+  busyRef?: MutableRefObject<boolean>
   onReady: (handle: HarnessHandle) => void
+  onSeedState?: (state: Record<string, unknown>) => void
   refreshSessions: () => Promise<void>
   requestGateway: <T>(method: string, params?: Record<string, unknown>) => Promise<T>
 }) {
   const activeSessionIdRef: MutableRefObject<string | null> = { current: RUNTIME_SESSION_ID }
   const selectedStoredSessionIdRef: MutableRefObject<string | null> = { current: RUNTIME_SESSION_ID }
-  const busyRef = { current: false }
+  const localBusyRef = busyRef ?? { current: false }
 
   const actions = usePromptActions({
     activeSessionId: RUNTIME_SESSION_ID,
     activeSessionIdRef,
     branchCurrentSession: async () => true,
-    busyRef,
+    busyRef: localBusyRef,
     createBackendSessionForSend: async () => RUNTIME_SESSION_ID,
     handleSkinCommand: () => '',
     refreshSessions,
@@ -67,8 +73,18 @@ function Harness({
     selectedStoredSessionIdRef,
     startFreshSessionDraft: () => undefined,
     sttEnabled: false,
-    updateSessionState: (_sessionId, updater) =>
-      updater({ messages: [], busy: false, awaitingResponse: false } as never)
+    updateSessionState: (_sessionId, updater) => {
+      // Seed with interrupted:true so we can prove a fresh submit clears it.
+      const next = updater({
+        messages: [],
+        busy: false,
+        awaitingResponse: false,
+        interrupted: true
+      } as never) as unknown as Record<string, unknown>
+      onSeedState?.(next)
+
+      return next as never
+    }
   })
 
   useEffect(() => {
@@ -164,3 +180,82 @@ describe('usePromptActions /title', () => {
     expect($sessions.get()[0]?.title).toBe('Old title')
   })
 })
+
+describe('usePromptActions submit / queue drain semantics', () => {
+  afterEach(() => {
+    cleanup()
+    vi.restoreAllMocks()
+  })
+
+  it('clears a leftover interrupted flag on a fresh submit (so the new turn streams)', async () => {
+    const seeds: Record<string, unknown>[] = []
+    const requestGateway = vi.fn(async () => ({}) as never)
+
+    let handle: HarnessHandle | null = null
+    render(
+      <Harness
+        onReady={h => (handle = h)}
+        onSeedState={s => seeds.push(s)}
+        refreshSessions={async () => undefined}
+        requestGateway={requestGateway}
+      />
+    )
+
+    await handle!.submitText('hello after a stop')
+
+    // The optimistic seed must reset interrupted:false even though the prior
+    // session state had interrupted:true — otherwise the message stream drops
+    // every delta of this brand-new turn.
+    expect(seeds.length).toBeGreaterThan(0)
+    expect(seeds.every(s => s.interrupted === false)).toBe(true)
+    expect(requestGateway).toHaveBeenCalledWith('prompt.submit', {
+      session_id: RUNTIME_SESSION_ID,
+      text: 'hello after a stop'
+    })
+  })
+
+  it('a fromQueue drain sends even when busyRef is still true on the settle edge', async () => {
+    // busyRef lags $busy by one effect tick on the busy→false settle edge, so a
+    // drained queue send would otherwise hit the busy guard and silently no-op.
+    const busyRef = { current: true }
+    const requestGateway = vi.fn(async () => ({}) as never)
+
+    let handle: HarnessHandle | null = null
+    render(
+      <Harness
+        busyRef={busyRef}
+        onReady={h => (handle = h)}
+        refreshSessions={async () => undefined}
+        requestGateway={requestGateway}
+      />
+    )
+
+    const accepted = await handle!.submitText('queued message', { fromQueue: true })
+
+    expect(accepted).toBe(true)
+    expect(requestGateway).toHaveBeenCalledWith('prompt.submit', {
+      session_id: RUNTIME_SESSION_ID,
+      text: 'queued message'
+    })
+  })
+
+  it('a normal (non-queue) submit still respects the busyRef guard', async () => {
+    const busyRef = { current: true }
+    const requestGateway = vi.fn(async () => ({}) as never)
+
+    let handle: HarnessHandle | null = null
+    render(
+      <Harness
+        busyRef={busyRef}
+        onReady={h => (handle = h)}
+        refreshSessions={async () => undefined}
+        requestGateway={requestGateway}
+      />
+    )
+
+    const accepted = await handle!.submitText('should be blocked')
+
+    expect(accepted).toBe(false)
+    expect(requestGateway).not.toHaveBeenCalledWith('prompt.submit', expect.anything())
+  })
+})

apps/desktop/src/app/session/hooks/use-prompt-actions.ts

@@ -2,10 +2,9 @@ import type { AppendMessage, ThreadMessage } from '@assistant-ui/react'
 import { type MutableRefObject, useCallback } from 'react'
 
 import { getProfiles, transcribeAudio } from '@/hermes'
-import { appendTextPart, branchGroupForUser, type ChatMessage, chatMessageText, textPart } from '@/lib/chat-messages'
+import { branchGroupForUser, type ChatMessage, chatMessageText, textPart } from '@/lib/chat-messages'
 import {
   attachmentDisplayText,
-  INTERRUPTED_MARKER,
   parseCommandDispatch,
   parseSlashCommand,
   pathLabel,
@@ -237,7 +236,11 @@ export function usePromptActions({
         [contextRefs, terminalContextBlocks, visibleText].filter(Boolean).join('\n\n') ||
         (hasImage ? 'What do you see in this image?' : '')
 
-      if (!text || busyRef.current) {
+      // Queue drains fire on the busy→false settle edge, where busyRef (synced
+      // from $busy by a separate effect) may still read true — honoring it would
+      // bounce the drained send. The drain lock serializes them; the user path
+      // keeps the guard so a stray Enter mid-turn can't double-submit.
+      if (!text || (!options?.fromQueue && busyRef.current)) {
         return false
       }
 
@@ -270,7 +273,10 @@ export function usePromptActions({
             awaitingResponse: true,
             pendingBranchGroup: null,
             sawAssistantPayload: false,
-            interrupted: state.interrupted
+            // Fresh submit = new turn — clear any leftover interrupt flag, else
+            // mutateStream/completeAssistantMessage drop every delta of this turn
+            // (what made drained-after-interrupt sends go silent).
+            interrupted: false
           }),
           selectedStoredSessionIdRef.current
         )
@@ -689,24 +695,24 @@ export function usePromptActions({
   const cancelRun = useCallback(async () => {
     const sessionId = activeSessionId || activeSessionIdRef.current
 
-    setMutableRef(busyRef, false)
-    setBusy(false)
     setAwaitingResponse(false)
 
-    const finalizeMessages = (messages: ChatMessage[]) =>
-      messages.map(message =>
-        message.pending
-          ? {
-              ...message,
-              parts: chatMessageText(message).trim()
-                ? appendTextPart(message.parts, INTERRUPTED_MARKER)
-                : [...message.parts, textPart(INTERRUPTED_MARKER.trim())],
-              pending: false
-            }
-          : message
-      )
+    // Interrupting keeps whatever was already generated and just
+    // stops — no "[interrupted]" marker. A pending/streaming message with no
+    // body text is dropped entirely so we never leave an empty bubble behind.
+    const finalizeMessages = (messages: ChatMessage[], streamId?: string | null) =>
+      messages
+        .filter(
+          message =>
+            !((message.pending || message.id === streamId) && !chatMessageText(message).trim())
+        )
+        .map(message =>
+          message.pending || message.id === streamId ? { ...message, pending: false } : message
+        )
 
     if (!sessionId) {
+      setMutableRef(busyRef, false)
+      setBusy(false)
       setMessages(finalizeMessages($messages.get()))
 
       return
@@ -715,24 +721,12 @@ export function usePromptActions({
     updateSessionState(sessionId, state => {
       const streamId = state.streamId
 
-      const messages = streamId
-        ? state.messages.map(message =>
-            message.id === streamId
-              ? {
-                  ...message,
-                  parts: chatMessageText(message).trim()
-                    ? appendTextPart(message.parts, INTERRUPTED_MARKER)
-                    : [...message.parts, textPart(INTERRUPTED_MARKER.trim())],
-                  pending: false
-                }
-              : message
-          )
-        : finalizeMessages(state.messages)
+      const messages = finalizeMessages(state.messages, streamId)
 
       return {
         ...state,
         messages,
-        busy: false,
+        busy: true,
         awaitingResponse: false,
         streamId: null,
         pendingBranchGroup: null,
@@ -743,6 +737,8 @@ export function usePromptActions({
     try {
       await requestGateway('session.interrupt', { session_id: sessionId })
     } catch (err) {
+      setMutableRef(busyRef, false)
+      setBusy(false)
       notifyError(err, 'Stop failed')
     }
   }, [activeSessionId, activeSessionIdRef, busyRef, requestGateway, updateSessionState])

apps/desktop/src/components/assistant-ui/thread.tsx

@@ -117,10 +117,6 @@ function messageContentText(content: unknown): string {
   return Array.isArray(content) ? content.map(partText).join('').trim() : ''
 }
 
-const INTERRUPTED_ONLY_RE = /^_?\[interrupted\]_?$/i
-
-const isInterruptedOnlyMessage = (text: string) => INTERRUPTED_ONLY_RE.test(text.trim())
-
 export const Thread: FC<{
   clampToComposer?: boolean
   cwd?: string | null
@@ -220,7 +216,6 @@ const AssistantMessage: FC<{ onBranchInNewChat?: (messageId: string) => void }>
 
   const messageStatus = useAuiState(s => s.message.status?.type)
   const isPlaceholder = messageStatus === 'running' && content.length === 0
-  const interruptedOnly = useMemo(() => isInterruptedOnlyMessage(messageText), [messageText])
   const enterRef = useEnterAnimation(messageStatus === 'running', `assistant-message:${messageId}`)
 
   if (isPlaceholder) {
@@ -236,10 +231,7 @@ const AssistantMessage: FC<{ onBranchInNewChat?: (messageId: string) => void }>
       ref={enterRef}
     >
       <div
-        className={cn(
-          'wrap-anywhere min-w-0 max-w-full overflow-hidden text-pretty text-[length:var(--conversation-text-font-size)] leading-(--dt-line-height) text-foreground',
-          interruptedOnly && 'text-[0.8rem] leading-5 text-muted-foreground/82'
-        )}
+        className="wrap-anywhere min-w-0 max-w-full overflow-hidden text-pretty text-[length:var(--conversation-text-font-size)] leading-(--dt-line-height) text-foreground"
         data-slot="aui_assistant-message-content"
       >
         {hoistedTodos.length > 0 && <HoistedTodoPanel todos={hoistedTodos} />}
@@ -260,7 +252,7 @@ const AssistantMessage: FC<{ onBranchInNewChat?: (messageId: string) => void }>
           </ErrorPrimitive.Root>
         </MessagePrimitive.Error>
       </div>
-      {messageText.trim().length > 0 && !interruptedOnly && (
+      {messageText.trim().length > 0 && (
         <AssistantFooter messageId={messageId} messageText={messageText} onBranchInNewChat={onBranchInNewChat} />
       )}
     </MessagePrimitive.Root>

apps/desktop/src/components/gateway-connecting-overlay.test.tsx

@@ -0,0 +1,143 @@
+import { cleanup, render, screen } from '@testing-library/react'
+import { afterEach, beforeEach, describe, expect, it } from 'vitest'
+
+import { $desktopBoot } from '@/store/boot'
+import { $desktopOnboarding } from '@/store/onboarding'
+import { $gatewayState, setGatewayState } from '@/store/session'
+
+import { BootFailureOverlay } from './boot-failure-overlay'
+import { GatewayConnectingOverlay } from './gateway-connecting-overlay'
+
+// Repro for the "remote gateway → stuck on CONNECTING, no way to settings"
+// report. The connecting overlay (z-1200, full-screen, pointer-events on) is
+// shown whenever `gatewayState !== 'open' && !boot.error`. The ONLY escape
+// hatch — BootFailureOverlay, which has "Use local gateway" / "Sign in" /
+// "Retry" — only renders when `boot.error` is set.
+//
+// useGatewayBoot only calls failDesktopBoot() (which sets boot.error) when the
+// INITIAL boot() throws. After the first successful connect (bootCompleted),
+// any later socket drop goes through scheduleReconnect(), which loops FOREVER
+// against the dead remote and never sets boot.error. So gatewayState sits at
+// 'closed'/'error' with boot.error null → CONNECTING forever, recovery overlay
+// never appears, settings unreachable.
+
+function resetStores() {
+  setGatewayState('idle')
+  $desktopBoot.set({
+    error: null,
+    fakeMode: false,
+    message: 'ready',
+    phase: 'renderer.ready',
+    progress: 100,
+    running: false,
+    timestamp: Date.now(),
+    visible: false
+  })
+  $desktopOnboarding.set({
+    configured: true,
+    flow: { status: 'idle' },
+    mode: 'oauth',
+    providers: null,
+    reason: null,
+    requested: false,
+    firstRunSkipped: false,
+    manual: false
+  })
+}
+
+beforeEach(resetStores)
+afterEach(cleanup)
+
+// The connecting overlay renders "CONN" + a scrambled tail inside one
+// uppercase span; match that node specifically so the recovery overlay's
+// "Lost connection…" copy doesn't read as a false positive.
+const isConnectingShown = () =>
+  screen.queryAllByText((_, el) => /^CONN[/\\|\-_=+<>~:*A-Z]*$/.test(el?.textContent?.trim() ?? '')).length > 0
+const isRecoveryShown = () =>
+  Boolean(screen.queryByText(/use local gateway/i) || screen.queryByText(/retry/i) || screen.queryByText(/sign in/i))
+
+describe('connecting overlay vs recovery surface', () => {
+  it('hard initial-boot failure surfaces the recovery overlay (the working path)', () => {
+    // failDesktopBoot() ran: error set, gateway never opened.
+    $desktopBoot.set({ ...$desktopBoot.get(), error: 'Hermes backend did not become ready', running: false, visible: true })
+    setGatewayState('error')
+
+    render(
+      <>
+        <GatewayConnectingOverlay />
+        <BootFailureOverlay />
+      </>
+    )
+
+    expect(isRecoveryShown()).toBe(true)
+    // Connecting overlay bows out when boot.error is set.
+    expect(isConnectingShown()).toBe(false)
+  })
+
+  it('REPRO: remote socket drops AFTER a successful boot → stuck on CONNECTING, no recovery, no settings', () => {
+    // 1. Initial boot succeeded: gateway opened, boot completed (no error).
+    setGatewayState('open')
+    const { rerender } = render(
+      <>
+        <GatewayConnectingOverlay />
+        <BootFailureOverlay />
+      </>
+    )
+    expect(isConnectingShown()).toBe(false)
+
+    // 2. The remote VPS socket drops (sleep/wake, remote restart, network).
+    //    bootCompleted is true, so useGatewayBoot routes this through
+    //    scheduleReconnect() — boot.error stays NULL.
+    setGatewayState('closed')
+    rerender(
+      <>
+        <GatewayConnectingOverlay />
+        <BootFailureOverlay />
+      </>
+    )
+
+    // The connecting overlay reappears and latches...
+    expect(isConnectingShown()).toBe(true)
+    // ...with NO recovery surface, because boot.error was never set.
+    expect(isRecoveryShown()).toBe(false)
+
+    // 3. Reconnect loops forever against the dead remote: gatewayState bounces
+    //    closed → error → closed, boot.error never gets set. The user is
+    //    pinned on CONNECTING with no path to Settings indefinitely.
+    setGatewayState('error')
+    rerender(
+      <>
+        <GatewayConnectingOverlay />
+        <BootFailureOverlay />
+      </>
+    )
+    expect($desktopBoot.get().error).toBeNull()
+    expect(isConnectingShown()).toBe(true)
+    expect(isRecoveryShown()).toBe(false)
+  })
+
+  it('FIX: once the prolonged reconnect raises a recoverable boot error, the recovery overlay takes over', () => {
+    // Mirrors what useGatewayBoot.scheduleReconnect() now does after ~45s of
+    // failed post-boot reconnects: it calls failDesktopBoot(), flipping the UI
+    // from the dead-end CONNECTING overlay to the recovery surface.
+    setGatewayState('error')
+    $desktopBoot.set({
+      ...$desktopBoot.get(),
+      error: 'Lost connection to the Hermes gateway and could not reconnect.',
+      running: false,
+      visible: true
+    })
+
+    render(
+      <>
+        <GatewayConnectingOverlay />
+        <BootFailureOverlay />
+      </>
+    )
+
+    // Escape hatch is now reachable; the connecting overlay bows out.
+    expect(isRecoveryShown()).toBe(true)
+    expect(screen.getByText(/use local gateway/i)).toBeTruthy()
+    expect(isConnectingShown()).toBe(false)
+  })
+})

apps/desktop/src/i18n/en.ts

@@ -698,6 +698,7 @@ export const en: Translations = {
     attachments: count => `${count} attachment${count === 1 ? '' : 's'}`,
     editingInComposer: 'Editing in composer',
     editQueued: 'Edit queued turn',
+    sendQueuedNext: 'Send queued turn next',
     sendQueuedNow: 'Send queued turn now',
     deleteQueued: 'Delete queued turn',
     previewUnavailable: 'Preview unavailable',

apps/desktop/src/i18n/types.ts

@@ -580,6 +580,7 @@ export interface Translations {
     attachments: (count: number) => string
     editingInComposer: string
     editQueued: string
+    sendQueuedNext: string
     sendQueuedNow: string
     deleteQueued: string
     previewUnavailable: string

apps/desktop/src/i18n/zh.ts

@@ -827,6 +827,7 @@ export const zh: Translations = {
     attachments: count => `${count} 个附件`,
     editingInComposer: '正在输入框中编辑',
     editQueued: '编辑排队回合',
+    sendQueuedNext: '下一个发送排队回合',
     sendQueuedNow: '立即发送排队回合',
     deleteQueued: '删除排队回合',
     previewUnavailable: '预览不可用',

apps/desktop/src/lib/chat-runtime.ts

@@ -7,7 +7,6 @@ import { type ChatMessage, type ChatMessagePart, chatMessageText, textPart } fro
 import type { ComposerAttachment } from '@/store/composer'
 import type { ModelOptionsResponse, SessionInfo } from '@/types/hermes'
 
-export const INTERRUPTED_MARKER = '\n\n_[interrupted]_'
 export const SLASH_COMMAND_RE = /^\/[^\s/]*(?:\s|$)/
 export const BUILTIN_PERSONALITIES = [
   'helpful',

apps/desktop/src/store/composer-queue.test.ts

@@ -7,6 +7,7 @@ import {
   dequeueQueuedPrompt,
   enqueueQueuedPrompt,
   getQueuedPrompts,
+  promoteQueuedPrompt,
   removeQueuedPrompt,
   shouldAutoDrainOnSettle,
   updateQueuedPrompt,
@@ -63,6 +64,20 @@ describe('composer queue store', () => {
     expect(getQueuedPrompts(SESSION_KEY).map(entry => entry.text)).toEqual(['draft two'])
   })
 
+  it('promotes a queued entry to the front', () => {
+    const first = enqueueQueuedPrompt(SESSION_KEY, { attachments: [], text: 'first' })
+    const second = enqueueQueuedPrompt(SESSION_KEY, { attachments: [], text: 'second' })
+    const third = enqueueQueuedPrompt(SESSION_KEY, { attachments: [], text: 'third' })
+
+    expect(first).not.toBeNull()
+    expect(second).not.toBeNull()
+    expect(third).not.toBeNull()
+
+    expect(promoteQueuedPrompt(SESSION_KEY, third!.id)).toBe(true)
+    expect(getQueuedPrompts(SESSION_KEY).map(entry => entry.text)).toEqual(['third', 'first', 'second'])
+    expect(promoteQueuedPrompt(SESSION_KEY, third!.id)).toBe(false)
+  })
+
   it('updates queued text and attachment snapshot', () => {
     const first = enqueueQueuedPrompt(SESSION_KEY, { attachments: [attachment('f-1')], text: 'draft one' })
     const editedAttachments = [attachment('f-2'), attachment('f-3', 'image')]
@@ -103,26 +118,22 @@ describe('composer queue store', () => {
 })
 
 describe('shouldAutoDrainOnSettle', () => {
-  const base = { isBusy: false, queueLength: 1, userInterrupted: false, wasBusy: true }
+  const base = { isBusy: false, queueLength: 1, wasBusy: true }
 
-  it('drains the next queued prompt when a turn completes naturally', () => {
+  it('drains the next queued prompt when a turn settles', () => {
     expect(shouldAutoDrainOnSettle(base)).toBe(true)
   })
 
-  it('does NOT drain when the user explicitly interrupted (Stop button)', () => {
-    // Regression: previously the Stop button "never worked" because cancelling
-    // a turn flipped busy → false and the queue immediately re-fired its head.
-    expect(shouldAutoDrainOnSettle({ ...base, userInterrupted: true })).toBe(false)
+  it('drains after an interrupt — the settle edge is the same', () => {
+    // Interrupting to reach a queued message is the point of the queue; the
+    // gateway emits the same settle whether the turn finished or was stopped.
+    expect(shouldAutoDrainOnSettle(base)).toBe(true)
   })
 
   it('does not drain when the queue is empty', () => {
     expect(shouldAutoDrainOnSettle({ ...base, queueLength: 0 })).toBe(false)
   })
 
-  it('does not drain when interrupted even if the queue is also empty', () => {
-    expect(shouldAutoDrainOnSettle({ ...base, queueLength: 0, userInterrupted: true })).toBe(false)
-  })
-
   it('ignores steady busy state (no true → false transition)', () => {
     expect(shouldAutoDrainOnSettle({ ...base, isBusy: true })).toBe(false)
   })

apps/desktop/src/store/composer-queue.ts

@@ -137,6 +137,26 @@ export const removeQueuedPrompt = (key: string | null | undefined, id: string):
   return true
 }
 
+export const promoteQueuedPrompt = (key: string | null | undefined, id: string): boolean => {
+  const sid = sidOf(key)
+
+  if (!sid) {
+    return false
+  }
+
+  const queue = queueFor(sid)
+  const index = queue.findIndex(e => e.id === id)
+
+  if (index <= 0) {
+    return false
+  }
+
+  const entry = queue[index]!
+  writeSession(sid, [entry, ...queue.slice(0, index), ...queue.slice(index + 1)])
+
+  return true
+}
+
 export const updateQueuedPrompt = (
   key: string | null | undefined,
   id: string,
@@ -194,33 +214,26 @@ export interface AutoDrainSettleInput {
   wasBusy: boolean
   isBusy: boolean
   queueLength: number
-  userInterrupted: boolean
 }
 
 /**
  * Decide whether the composer should auto-drain the next queued prompt when a
  * turn settles (busy transitions true → false).
  *
- * The queue auto-advances when a turn *completes naturally*, but must NOT
- * advance when the user *explicitly interrupted* the turn via the Stop button.
- * Conflating the two made the Stop button appear to "never work": cancelling a
- * turn flipped busy → false, the queue immediately re-fired its head, and the
- * agent kept running. An explicit interrupt means stop — the queued turns are
- * preserved and the user resumes them deliberately (Cmd/Ctrl+K, Enter, or the
- * per-row "send now" arrow).
+ * Queued turns always advance once the session is idle again, whether the turn
+ * finished naturally or the user interrupted it. Interrupting to reach a queued
+ * message is the whole point of the queue, so we never suppress the drain. The
+ * gateway guarantees a settle (message.complete + session.info running:false)
+ * even after an interrupt, so this single edge reliably advances the queue. To
+ * cancel queued turns the user deletes them from the panel.
  */
 export const shouldAutoDrainOnSettle = (params: AutoDrainSettleInput): boolean => {
-  const { isBusy, queueLength, userInterrupted, wasBusy } = params
+  const { isBusy, queueLength, wasBusy } = params
 
   // Only react to a true → false transition; ignore steady state and entry.
   if (isBusy || !wasBusy) {
     return false
   }
 
-  // An explicit Stop suppresses exactly one auto-drain.
-  if (userInterrupted) {
-    return false
-  }
-
   return queueLength > 0
 }