cli-jaw 2.17.62 → 2.17.63

package/public/manager/src/code/CodeTranscript.tsx

@@ -1,13 +1,15 @@
-import { lazy, Suspense, useCallback, useMemo, useRef, useState, type KeyboardEvent } from 'react';
+import { lazy, Suspense, useCallback, useEffect, useMemo, useRef, useState, type KeyboardEvent } from 'react';
 import type { CodeItem, CodeItemKind, CodeProviderId } from '../../../../src/code-mode/wire';
 import { useCodeTranscriptVirtualRows } from './useCodeTranscriptVirtualRows';
 import { useCodeTranscriptScroll } from './use-code-transcript-scroll';
 import { useThrottledMarkdown } from './use-throttled-markdown';
 import { CODE_RUNTIME_LABELS, codeItemStatus } from './code-types';
-import { noteworthyStatus, toolSummary } from './tool-summary';
+import { noteworthyStatus, toolInputDescription, toolInputDisplay, toolSummary } from './tool-summary';
+import { copyText } from '../clipboard/copy-text';
 import { PENDING_USER_ITEM_ID } from './pending-user-item';
 
 const MarkdownRenderer = lazy(() => import('../notes/rendering/MarkdownRenderer').then(m => ({ default: m.MarkdownRenderer })));
+export const CODE_ROLLBACK_CONFIRM = 'Later turns are removed from this conversation. Workspace files are not changed. No prompt is sent.';
 
 /**
  * Turn boundaries are bookkeeping, not conversation. A one-line answer framed by
@@ -24,15 +26,22 @@ const HIDDEN_KINDS: ReadonlySet<CodeItemKind> = new Set<CodeItemKind>(['turn_sta
 /**
  * What a collapsible row measures before it has been measured. Collapsed is one
  * line and exact. Expanded is a guess and deliberately only that: the panes are
- * capped at 200px each by `.code-tool-output` / `.code-tool-args`, so a call
- * with both is far taller, and the real number arrives from the ResizeObserver
- * a frame later. This only has to be closer than one line.
+ * capped at min(18rem,50dvh) each by `.code-tool-output` / `.code-tool-args`,
+ * so a call with both is far taller, and the real number arrives from the
+ * ResizeObserver a frame later. This only has to be closer than one line.
  */
 const COLLAPSED_ROW_PX = 44;
-const EXPANDED_ROW_PX = 320;
+const EXPANDED_ROW_PX = 480;
 /** Same bound the scroll anchors use, for the same reason. */
 const MAX_OPEN_ROWS = 64;
 
+// Past ~15 wrapped lines the capped scroll height already engages; only then
+// is a Show-all toggle worth showing (jsdom cannot measure overflow either, so
+// this estimates by length the same way the activity rows do).
+function isTallToolText(value: string): boolean {
+    return value.length > 1400 || value.split('\n').length > 14;
+}
+
 /**
  * A failed call opens itself, because the reader has to see why it failed. That
  * is a default, not a lock: once the reader has said what they want for this
@@ -52,11 +61,13 @@ function ItemMarkdown({ item, identity, onOpenLocalFile }: { item: CodeItem; ide
     </Suspense>;
 }
 
-export function CodeTranscriptItem({ item, provider, sessionKey, workingDir = '', onOpenLocalFile, expanded, onExpandedChange }: {
+export function CodeTranscriptItem({ item, provider, sessionKey, workingDir = '', onOpenLocalFile, expanded, onExpandedChange, onRollback }: {
     item: CodeItem; provider: CodeProviderId; sessionKey: string; workingDir?: string;
     onOpenLocalFile?: ((path: string) => void) | undefined;
     expanded?: boolean;
     onExpandedChange?: ((itemId: string, open: boolean) => void) | undefined;
+    /** Present only on a row the conversation may be rolled back to; asks before calling. */
+    onRollback?: ((itemId: string) => void) | undefined;
 }) {
     const tool = item.kind === 'tool_call' || item.kind === 'file_change';
     const reasoning = item.kind === 'reasoning';
@@ -78,6 +89,53 @@ export function CodeTranscriptItem({ item, provider, sessionKey, workingDir = ''
     // the duplicate back. Failure and cancellation still get a word, because
     // those change what to do next.
     const toolNote = running ? null : note;
+    const description = tool ? toolInputDescription(item.tool?.input) : '';
+    const inputDisplay = tool ? toolInputDisplay(item.tool?.input) : null;
+    const toolBlocks: Array<{ key: string; label: string; content: string; className: string; copyable: boolean }> = [];
+    if (tool) {
+        if (inputDisplay) toolBlocks.push({ key: 'input', label: 'Input', content: inputDisplay.content, className: 'code-tool-args', copyable: true });
+        if (inputDisplay?.parameters) toolBlocks.push({ key: 'params', label: 'Parameters', content: inputDisplay.parameters, className: 'code-tool-json', copyable: false });
+        if (inputDisplay?.description) toolBlocks.push({ key: 'description', label: 'Description', content: inputDisplay.description, className: 'code-tool-text', copyable: false });
+        if (item.tool?.output !== undefined) toolBlocks.push({ key: 'output', label: 'Output', content: item.tool.output, className: 'code-tool-output', copyable: false });
+    }
+    const toolBodyTall = toolBlocks.some(block => isTallToolText(block.content))
+        || (item.tool?.detail !== undefined && isTallToolText(item.tool.detail))
+        || (item.text !== undefined && isTallToolText(item.text));
+    const [showAll, setShowAll] = useState(false);
+    const bodyRef = useRef<HTMLDivElement | null>(null);
+    const [measuredTall, setMeasuredTall] = useState<boolean | null>(null);
+    // A measurement describes the body it was taken from, and the estimate is
+    // what moves when that body changes, so a number taken while the content was
+    // taller is dropped instead of deciding for the shorter content in its place.
+    useEffect(() => { setMeasuredTall(null); }, [toolBodyTall]);
+    // The toggle measures real overflow once the body lays out (browser); where
+    // layout cannot be measured (jsdom reports 0 everywhere) the character
+    // estimate stands in, the same rule the activity rows use. Every capped pane
+    // is measured, not only the <pre> ones: the call's own detail is a paragraph
+    // under the same cap. While expanded the cap is off, so measuring is skipped
+    // — the button must stay to toggle back — and closing the body resets the
+    // measure for the next open.
+    useEffect(() => {
+        if (!open || showAll) return;
+        const panes = bodyRef.current?.querySelectorAll('pre, .code-tool-body > .code-tool-text');
+        if (!panes || panes.length === 0) { setMeasuredTall(null); return; }
+        const list = [...panes];
+        const measured = list.some(pane => pane.scrollHeight > pane.clientHeight + 2);
+        setMeasuredTall(measured || (list.every(pane => pane.scrollHeight === 0) && toolBodyTall));
+    }, [open, showAll, toolBodyTall]);
+    const toolBodyOverflowing = measuredTall ?? toolBodyTall;
+    // Content that no longer overflows has nothing left to disclose: leaving the
+    // disclosure set would hold a "Show less" button, and an uncapped body, over
+    // a call that already fits.
+    useEffect(() => { if (!toolBodyOverflowing) setShowAll(false); }, [toolBodyOverflowing]);
+    const [copied, setCopied] = useState(false);
+    const copiedTimerRef = useRef<number | null>(null);
+    useEffect(() => () => { if (copiedTimerRef.current !== null) window.clearTimeout(copiedTimerRef.current); }, []);
+    const markCopied = useCallback(() => {
+        setCopied(true);
+        if (copiedTimerRef.current !== null) window.clearTimeout(copiedTimerRef.current);
+        copiedTimerRef.current = window.setTimeout(() => { copiedTimerRef.current = null; setCopied(false); }, 1200);
+    }, []);
     const label = user ? 'You' : assistant ? CODE_RUNTIME_LABELS[provider] : reasoning ? 'Reasoning'
         : item.kind === 'turn_started' ? 'Turn started' : item.kind === 'session_runtime' ? 'Runtime'
             : item.kind === 'permission_request' ? 'Permission record' : item.kind === 'notice' ? 'Notice' : status;
@@ -86,36 +144,60 @@ export function CodeTranscriptItem({ item, provider, sessionKey, workingDir = ''
         {tool ? <details className={`code-tool-card code-tool-${item.status}`} open={open}
             onToggle={event => onExpandedChange?.(item.itemId, event.currentTarget.open)}>
             <summary className="code-tool-summary"><span className="code-tool-chevron" aria-hidden="true">›</span>
-                <span className={`code-tool-name${running ? ' code-tool-name-running' : ''}`}>{toolSummary(item, workingDir)}</span>
+                <span className="code-tool-summary-text">
+                    <span className={`code-tool-name${running ? ' code-tool-name-running' : ''}`}>{toolSummary(item, workingDir)}</span>
+                    {description !== '' && <span className="code-tool-desc">{description}</span>}
+                </span>
                 {toolNote && <span className="code-tool-status">{toolNote}</span>}</summary>
             {/* Built only while open: a collapsed call's output can be megabytes,
                 and constructing it costs the same whether or not it is painted. */}
-            {open && <>
+            {open && <div ref={bodyRef} className="code-tool-body" data-expanded={showAll}>
                 {item.tool?.detail !== undefined && <p className="code-tool-text">{item.tool.detail}</p>}
-                {item.tool?.input !== undefined && <section className="code-tool-section"><span className="code-tool-section-label">Input</span><pre className="code-tool-args">{item.tool.input}</pre></section>}
-                {item.tool?.output !== undefined && <section className="code-tool-section"><span className="code-tool-section-label">Output</span><pre className="code-tool-output">{item.tool.output}</pre></section>}
+                {toolBlocks.map(block => <section key={block.key} className="code-tool-section">
+                    <div className="code-tool-section-head">
+                        <span className="code-tool-section-label">{block.label}</span>
+                        {block.copyable && <button type="button" className={`code-tool-copy${copied ? ' copied' : ''}`}
+                            aria-label={`Copy ${block.label.toLowerCase()}`}
+                            onClick={() => void copyText(block.content).then(result => { if (result.ok) markCopied(); })}>
+                            {copied ? 'Copied' : 'Copy'}
+                        </button>}
+                    </div>
+                    <pre className={block.className}>{block.content}</pre>
+                </section>)}
                 {item.text !== undefined && <pre className="code-tool-text">{item.text}</pre>}
-            </>}
+                {running && item.tool?.output === undefined && item.tool?.detail === undefined
+                    && <p className="code-tool-waiting">Waiting for output…</p>}
+                {toolBodyOverflowing && <button type="button" className="code-tool-toggle" aria-expanded={showAll}
+                    onClick={() => setShowAll(value => !value)}>{showAll ? 'Show less' : 'Show all'}</button>}
+            </div>}
         </details> : reasoning ? <details className="code-thinking" open={open}
             onToggle={event => onExpandedChange?.(item.itemId, event.currentTarget.open)}>
             <summary className={`code-thinking-summary${item.status === 'running' ? ' code-tool-name-running' : ''}`}>{item.status === 'running' ? 'Thinking…' : 'Reasoning'}</summary>
             {open && <div className="code-thinking-text">{item.text}</div>}
         </details> : <>
             <span className="code-message-role">{label}{assistant && item.phase === 'commentary' ? ' · Commentary' : ''}
-                {note && ` · ${unsent ? 'Sending' : note}`}</span>
+                {note && ` · ${unsent ? 'Sending' : note}`}
+                {/* A follow-up no native result consumed before the turn ended. */}
+                {user && !unsent && item.phase === 'unknown' && ' · Delivery not confirmed'}</span>
             <div className="code-message-text">{assistant ? <ItemMarkdown item={item} identity={`${sessionKey}:${item.itemId}`} onOpenLocalFile={onOpenLocalFile} />
                 : <span className="code-plain-text">{item.text ?? item.permission?.title ?? ''}</span>}</div>
             {item.permission?.detail && <p className="code-plain-text">{item.permission.detail}</p>}
+            {onRollback && user && !unsent && <button type="button" className="code-message-rollback"
+                onClick={() => { if (window.confirm(CODE_ROLLBACK_CONFIRM)) onRollback(item.itemId); }}>Roll back conversation to here</button>}
         </>}
         {(assistant || reasoning) && (item.status === 'cancelled' || item.status === 'error') && <span className="code-partial-label">Partial output · {status}</span>}
         {item.truncation && <p className="code-truncation" role="note">Output truncated: {item.truncation.storedChars.toLocaleString()} of {item.truncation.sourceChars.toLocaleString()} characters retained.</p>}
     </article>;
 }
 
-export function CodeTranscript({ items, provider, sessionKey, workingDir, loading, hasOlderHistory, loadOlderHistory, permissionCount, onOpenLocalFile }: {
-    items: CodeItem[]; provider: CodeProviderId; sessionKey: string; workingDir: string; loading: boolean;
+export function CodeTranscript({ items, provider, sessionKey, workingDir, loading, hasOlderHistory, loadOlderHistory, permissionCount, onOpenLocalFile, working = false,
+    rollbackRows, onRollback }: {
+    items: CodeItem[]; provider: CodeProviderId; sessionKey: string; workingDir: string; loading: boolean; working?: boolean;
     hasOlderHistory: boolean; loadOlderHistory(): Promise<void>; permissionCount: number;
     onOpenLocalFile?: ((path: string) => void) | undefined;
+    /** Opaque user row ids that may be rollback targets; the transcript never sees native ids. */
+    rollbackRows?: ReadonlySet<string> | undefined;
+    onRollback?: ((itemId: string) => void) | undefined;
 }) {
     const transcriptRef = useRef<HTMLDivElement>(null);
     const visible = useMemo(() => items.filter(item => !HIDDEN_KINDS.has(item.kind)), [items]);
@@ -209,10 +291,16 @@ export function CodeTranscript({ items, provider, sessionKey, workingDir, loadin
                             <CodeTranscriptItem item={item} provider={provider} sessionKey={sessionKey}
                                 workingDir={workingDir} onOpenLocalFile={onOpenLocalFile}
                                 expanded={isRowOpen(openRows, sessionKey, item)}
-                                onExpandedChange={setExpanded} />
+                                onExpandedChange={setExpanded}
+                                onRollback={rollbackRows?.has(item.itemId) ? onRollback : undefined} />
                         </div> : null;
                     })}
                 </div>}
+            {/* From Send until the turn ends. A running tool or reasoning row already
+                animates, so the line would only repeat it. */}
+            {working && visible[visible.length - 1]?.status !== 'running'
+                && <div className="code-transcript-working" role="status" aria-live="polite">
+                    <span className="code-session-spinner" aria-hidden="true" />Working…</div>}
         </div>
     </>;
 }

package/public/manager/src/code/CodeWorkbench.tsx

@@ -2,12 +2,13 @@ import { useCallback, useRef, useState } from 'react';
 import type { CodeControllerModel } from './code-controller-types';
 import { CodeComposer } from './CodeComposer';
 import { ComposerFooter } from './ComposerFooter';
+import { CodeDraftEmptyState } from './CodeDraftEmptyState';
 import { CodePermissionQueue } from './CodePermissionQueue';
 import { CodeTranscript } from './CodeTranscript';
 import { CodeToastHost } from './CodeToastHost';
 import { applyCodeNotice, dismissCodeToast, type CodeNotice, type CodeToast } from './code-toasts';
 import { CodeWorkspaceHeader } from './CodeWorkspaceHeader';
-import { codeCanResume } from './code-types';
+import { codeCanResume, codeCanRollback, codeResendCopy, codeRollbackRows } from './code-types';
 
 type Props = { controller: CodeControllerModel; endpointKey: string; onOpenLocalFile?: ((path: string) => void) | undefined };
 export function CodeWorkbench({ controller: c, endpointKey, onOpenLocalFile }: Props) {
@@ -26,15 +27,20 @@ export function CodeWorkbench({ controller: c, endpointKey, onOpenLocalFile }: P
     const dismiss = useCallback((id: string) => setToasts(current => dismissCodeToast(current, id)), []);
     const archived = c.session?.archivedAt != null;
     const stopping = c.session?.status === 'stopping' || c.operation.kind === 'stopping';
-    const busy = c.busy || stopping || c.session?.status === 'starting' || c.session?.status === 'streaming';
+    const busy = c.busy || c.working || stopping || c.session?.status === 'starting' || c.session?.status === 'streaming';
     const provider = c.catalog?.providers.find(p => p.id === c.selection.provider);
     const unknownSend = c.operation.kind === 'unknown-send';
-    const canSend = !busy && !c.pending && !c.creationUnknown && !archived && c.operation.kind === 'idle' && !!provider?.available
+    // A streaming Claude turn takes one follow-up beside Stop; any other busy session offers Stop only.
+    const canSend = !c.steering && (c.followUp ? !c.followUpSent && !stopping && !c.pending && !archived && c.operation.kind === 'idle'
+        : !busy && !c.pending && !c.creationUnknown && !archived && c.operation.kind === 'idle' && !!provider?.available
         && !!c.selection.cwd.trim() && !!c.selection.model.trim()
-        && (c.selectedId === null || (c.synced && c.session?.status === 'idle'));
+        // A suspended or recoverably failed session can be sent to: send attaches it first.
+        && (c.selectedId === null || (c.synced && (c.session?.status === 'idle' || (!!c.session && codeCanResume(c.session))))));
     const canStop = !!c.session?.turnId && c.session.capabilities.interrupt && busy && !stopping;
     const canResume = !!c.session && codeCanResume(c.session) && c.synced && !c.pending && !unknownSend;
     const error = c.operation.error || c.error || (actionError?.key === sessionKey ? actionError.message : null);
+    const rollbackRows = codeCanRollback(c.session, c.synced, c.operation.kind === 'idle' && !c.steering)
+        ? codeRollbackRows(c.items, c.session?.rollback?.sinceSequence) : undefined;
     const terminal = [...c.items].reverse().find(item => item.kind === 'turn_cancelled' || item.kind === 'turn_failed' || item.kind === 'turn_completed');
     const failedInput = terminal && terminal.kind !== 'turn_completed'
         ? c.items.find(item => item.kind === 'user_message' && item.turnId === terminal.turnId)?.text : undefined;
@@ -67,12 +73,12 @@ export function CodeWorkbench({ controller: c, endpointKey, onOpenLocalFile }: P
             <button type="button" onClick={c.startAnotherSession}>Start another session</button>
         </section>}
         {unknownSend && <section className="code-recovery-strip"
-            aria-label={c.resendRequired ? 'Send not started' : 'Unconfirmed send'}>
-            <strong>{c.resendRequired ? 'Send did not start' : 'Send outcome not confirmed'}</strong>
+            aria-label={c.resendRequired ? (c.resendReason === 'rolled-back' ? 'Send rolled back' : 'Send not started') : 'Unconfirmed send'}>
+            <strong>{c.resendRequired ? codeResendCopy(c.resendReason ?? undefined).heading : 'Send outcome not confirmed'}</strong>
             {/* Once the server has spent the key, acceptance is no longer unknown,
                 so this must stop offering the weaker, hedged explanation. */}
             <p>{c.resendRequired
-                ? 'The original attempt ended on the server without running. Retry sends this as a new message.'
+                ? codeResendCopy(c.resendReason ?? undefined).detail
                 : 'Retry uses the original request. It may submit it if the server has not already accepted it.'}</p>
             <pre className="code-retry-preview" aria-label="Original prompt">{c.retryText}</pre>
             <button type="button" disabled={!c.canRetrySameSend || retrying === sessionKey} onClick={() => void retry()}>
@@ -90,9 +96,12 @@ export function CodeWorkbench({ controller: c, endpointKey, onOpenLocalFile }: P
         {/* Directly above the transcript, so a notice sits over the conversation
             rather than over the workspace header and its picker. */}
         <CodeToastHost toasts={toasts} onDismiss={dismiss} />
-        <CodeTranscript items={c.items} provider={c.session?.provider ?? c.selection.provider} sessionKey={sessionKey}
-            workingDir={c.session?.cwd ?? c.selection.cwd} loading={c.loading} hasOlderHistory={c.hasOlderHistory}
-            loadOlderHistory={c.loadOlderHistory} permissionCount={c.permissions.length} onOpenLocalFile={onOpenLocalFile} />
+        {c.selectedId === null && c.items.length === 0
+            ? <CodeDraftEmptyState controller={c} />
+            : <CodeTranscript items={c.items} provider={c.session?.provider ?? c.selection.provider} sessionKey={sessionKey}
+                workingDir={c.session?.cwd ?? c.selection.cwd} loading={c.loading} hasOlderHistory={c.hasOlderHistory}
+                loadOlderHistory={c.loadOlderHistory} permissionCount={c.permissions.length} onOpenLocalFile={onOpenLocalFile}
+                working={c.working} rollbackRows={rollbackRows} onRollback={itemId => perform(() => c.rollbackSession(itemId))} />}
         <CodePermissionQueue permissions={c.permissions} operations={c.permissionOperations} session={c.session} synced={c.synced} onAnswer={c.answer} />
         <div className="code-composer-dock">
             {failedInput !== undefined && !busy && !archived && <div className="code-input-recovery">
@@ -102,7 +111,8 @@ export function CodeWorkbench({ controller: c, endpointKey, onOpenLocalFile }: P
             </div>}
             <div className="code-composer-surface" aria-label="Code composer controls">
                 <CodeComposer key={`composer:${sessionKey}`} inputText={c.input} canSend={canSend} busy={busy} canStop={canStop} stopping={stopping}
-                    pending={c.pending} readOnly={archived} onInputChange={c.setInput} onSubmit={c.send} onStop={c.stop} />
+                    pending={c.pending} followUp={c.followUp} followUpSent={c.followUpSent} steering={c.steering} readOnly={archived} autoFocus={c.selectedId === null} onInputChange={c.setInput} onSubmit={c.send} onStop={c.stop}
+                    {...(c.operation.kind === 'rolling-back' ? { pendingLabel: 'Rolling back conversation…' } : {})} />
                 <ComposerFooter key={`footer:${sessionKey}`} controller={c} onNotice={notify} />
             </div>
         </div>

package/public/manager/src/code/CodeWorkspaceHeader.tsx

@@ -1,18 +1,14 @@
-import { useState } from 'react';
 import type { CodeControllerModel } from './code-controller-types';
 import { CODE_RUNTIME_LABELS, CODE_SESSION_LABELS } from './code-types';
 
 export function CodeWorkspaceHeader({ controller: c }: { controller: CodeControllerModel }) {
-    const [picking, setPicking] = useState(false);
-    const [error, setError] = useState<string | null>(null);
     const cwd = c.session?.cwd ?? c.selection.cwd;
     const frozen = c.selectedId !== null || c.pending || c.creationUnknown || c.operation.kind !== 'idle';
-    async function pick() {
+    // Shared with CodeDraftEmptyState's picker so only one folder dialog can be open.
+    const picking = c.workspacePicking;
+    function pick() {
         if (frozen || picking) return;
-        setPicking(true); setError(null);
-        try { await c.pickWorkspace(); }
-        catch (err) { setError(err instanceof Error ? err.message : String(err)); }
-        finally { setPicking(false); }
+        void c.pickWorkspace();
     }
     return <header className="code-workspace-header">
         <div className="code-session-header">
@@ -23,7 +19,7 @@ export function CodeWorkspaceHeader({ controller: c }: { controller: CodeControl
         <div className="code-workspace-primary">
             {frozen ? <span className="code-workspace-chip" title={cwd}>{cwd || 'Workspace not set'}</span>
                 : <button type="button" className="code-workspace-picker" aria-label="Choose Code workspace" disabled={picking}
-                    title={cwd || 'Choose a folder'} onClick={() => void pick()}>
+                    title={cwd || 'Choose a folder'} onClick={pick}>
                     <span className="code-workspace-picker-label">{picking ? 'Choosing folder…' : cwd || 'Choose workspace'}</span>
                 </button>}
             {c.gitInfo?.isRepo && <>
@@ -32,7 +28,6 @@ export function CodeWorkspaceHeader({ controller: c }: { controller: CodeControl
                     {c.gitInfo.status.dirty ? `${c.gitInfo.status.changed} changed · ${c.gitInfo.status.untracked} untracked` : 'clean'}
                 </span>}
             </>}
-            {error && <span className="code-action-error" role="alert">{error}</span>}
         </div>
     </header>;
 }

package/public/manager/src/code/ComposerFooter.tsx

@@ -121,6 +121,9 @@ export function ComposerFooter({ controller: c, onNotice }: {
     const selection = c.selection;
     const provider = c.catalog?.providers.find(entry => entry.id === selection.provider);
     const capabilities = c.session?.capabilities ?? provider?.capabilities;
+    // Claude switches permission modes live, so its menu follows today's catalog rather
+    // than the snapshot a session was created with; other runtimes keep their snapshot.
+    const permissionModes = (selection.provider === 'claude' ? provider?.capabilities : capabilities)?.permissionModes ?? [];
     const locked = c.selectedId !== null;
     const disabled = c.pending || c.busy || c.creationUnknown || c.operation.kind !== 'idle' || (locked && (!c.synced || c.session?.status !== 'idle' || c.session?.archivedAt !== null));
     const [saving, setSaving] = useState(false);
@@ -183,7 +186,7 @@ export function ComposerFooter({ controller: c, onNotice }: {
                 }} />
             <CodeFooterMenu label="Permission" value={selection.permissionMode} displayValue={CODE_POLICY_LABELS[selection.permissionMode]}
                 disabled={controlsDisabled || !capabilities?.permissions}
-                options={(capabilities?.permissionModes ?? []).map(value => ({ value, label: CODE_POLICY_LABELS[value], detail: CODE_POLICY_DETAILS[value] }))}
+                options={permissionModes.map(value => ({ value, label: CODE_POLICY_LABELS[value], detail: CODE_POLICY_DETAILS[value] }))}
                 onChange={value => void change({ permissionMode: value })} />
             <span className="code-composer-footer-spacer" aria-hidden="true" />
             <ContextUsageMeter usage={c.session?.contextUsage} />
@@ -196,6 +199,11 @@ export function ComposerFooter({ controller: c, onNotice }: {
                 className="code-footer-effort" displayValue={selection.effort ?? 'Default'}
                 options={[{ value: '', label: 'Native default' }, ...modelEfforts.map(value => ({ value, label: value }))]}
                 disabled={controlsDisabled} onChange={value => void change({ effort: value || null })} />}
+            {selection.provider === 'claude' && <CodeFooterMenu label="Thinking" value={selection.thinking === false ? 'off' : 'on'}
+                className="code-footer-thinking"
+                options={[{ value: 'on', label: 'Thinking on', detail: 'Adaptive thinking with summaries' },
+                    { value: 'off', label: 'Thinking off', detail: 'Answer without extended thinking' }]}
+                disabled={controlsDisabled} onChange={value => void change({ thinking: value === 'on' })} />}
             {locked && <button type="button" className="code-inline-action" onClick={c.newSession}>New session</button>}
         </div>
         {models.length === 0 && provider?.available && <div className="code-selection-notice">This runtime published no models.

package/public/manager/src/code/code-composer.css

@@ -110,7 +110,7 @@
 .code-composer-stop:focus-visible,
 .code-composer-send:focus-visible { outline: 2px solid var(--ring); outline-offset: 2px; }
 
-/* Footer: [runtime icon] [permission] ····· [model] [effort] */
+/* Footer: [runtime icon] [permission] ····· [model] [effort] [thinking] */
 .code-composer-footer {
     display: flex;
     gap: 4px;

package/public/manager/src/code/code-controller-draft-storage.ts

@@ -1,5 +1,6 @@
 import type { CodeCreateSessionRequest } from '../../../../src/code-mode/wire';
 import type { CodeDraft, CodeDraftBook } from './code-controller-drafts';
+import type { CodeResendReason } from './code-types';
 
 const STORAGE_KEY = 'cli-jaw:code-drafts:v1';
 const WARNING_KEY = 'cli-jaw:code-draft-warnings:v1';
@@ -13,14 +14,14 @@ const STORAGE_WARNING = 'Draft recovery is unavailable in this tab. Your current
 const INCOMPLETE_WARNING = 'Draft recovery is incomplete: some recent text or request state was not saved for reload. Check your draft before sending.';
 const LIMIT_WARNING = 'Draft recovery is incomplete: some text was not saved for reload because this tab reached its recovery limit.';
 
-type DraftSelection = Pick<CodeCreateSessionRequest, 'provider' | 'cwd' | 'model' | 'effort' | 'permissionMode'>;
+type DraftSelection = Pick<CodeCreateSessionRequest, 'provider' | 'cwd' | 'model' | 'effort' | 'permissionMode' | 'thinking'>;
 export interface StoredCodeDraft {
     input: string;
     edit: number;
     selection: DraftSelection;
     selectionEdit: number;
     creating: boolean;
-    retry: { text: string; key: string; edit: number; resend?: boolean } | null;
+    retry: { text: string; key: string; edit: number; resend?: boolean; resendReason?: CodeResendReason } | null;
     stop: { turnId: string; epoch: number } | null;
 }
 export interface StoredCodeEndpoint {
@@ -41,18 +42,23 @@ function parseDraft(value: unknown): StoredCodeDraft | null {
     if (!object(selection) || !['codex-app', 'claude', 'cursor', 'grok'].includes(String(selection['provider']))
         || !text(selection['cwd'], 4096) || !text(selection['model'], 1024)
         || !(selection['effort'] === null || text(selection['effort'], 80))
-        || !['ask', 'auto', 'read-only'].includes(String(selection['permissionMode']))) return null;
+        || !['ask', 'auto', 'read-only', 'plan', 'accept-edits', 'dont-ask', 'auto-review'].includes(String(selection['permissionMode']))
+        || !(selection['thinking'] === undefined || typeof selection['thinking'] === 'boolean')) return null;
     const retry = value['retry'], stop = value['stop'];
     if (retry !== null && (!object(retry) || !text(retry['text'], MAX_TEXT_CHARS)
         || !text(retry['key'], 240) || !retry['key'] || !count(retry['edit']) || retry['edit'] > value['edit'])) return null;
     if (stop !== null && (!object(stop) || !text(stop['turnId'], 240) || !stop['turnId'] || !count(stop['epoch']))) return null;
     return {
         input: value['input'], edit: value['edit'], selectionEdit: value['selectionEdit'], creating: value['creating'],
-        selection: { provider: selection['provider'] as DraftSelection['provider'], cwd: selection['cwd'], model: selection['model'], effort: selection['effort'], permissionMode: selection['permissionMode'] as DraftSelection['permissionMode'] },
+        selection: { provider: selection['provider'] as DraftSelection['provider'], cwd: selection['cwd'], model: selection['model'], effort: selection['effort'], permissionMode: selection['permissionMode'] as DraftSelection['permissionMode'],
+            // Optional: drafts stored before the Thinking switch carry none.
+            ...(typeof selection['thinking'] === 'boolean' ? { thinking: selection['thinking'] } : {}) },
         // `resend` is optional on purpose: a draft stored before this field existed
         // must still parse, or recovery is wiped instead of downgraded.
         retry: retry === null ? null : { text: retry['text'] as string, key: retry['key'] as string, edit: retry['edit'] as number,
-            ...(retry['resend'] === true ? { resend: true } : {}) },
+            ...(retry['resend'] === true ? { resend: true } : {}),
+            // An unknown reason downgrades to the generic spent-key copy instead of wiping recovery.
+            ...(retry['resend'] === true && retry['resendReason'] === 'rolled-back' ? { resendReason: 'rolled-back' as const } : {}) },
         stop: stop === null ? null : { turnId: stop['turnId'] as string, epoch: stop['epoch'] as number },
     };
 }
@@ -116,11 +122,13 @@ export function loadCodeDraftStorage(storage: Storage, endpoint: string): { data
 function pack(draft: CodeDraft): StoredCodeDraft | null {
     // Whitelist draft intent only. No permission answers, errors,
     // credentials, transcript, native cursor, metadata revision or live cursor.
-    const { provider, cwd, model, effort, permissionMode } = draft.selection;
-    return parseDraft({ input: draft.input, edit: draft.edit, selection: { provider, cwd, model, effort, permissionMode }, selectionEdit: draft.selectionEdit,
+    const { provider, cwd, model, effort, permissionMode, thinking } = draft.selection;
+    return parseDraft({ input: draft.input, edit: draft.edit, selection: { provider, cwd, model, effort, permissionMode,
+        ...(thinking === undefined ? {} : { thinking }) }, selectionEdit: draft.selectionEdit,
         creating: draft.createUnknown || draft.operation.kind === 'creating',
         retry: draft.retry ? { text: draft.retry.text, key: draft.retry.key, edit: draft.retry.edit,
-            ...(draft.retry.resend ? { resend: true } : {}) } : null,
+            ...(draft.retry.resend ? { resend: true } : {}),
+            ...(draft.retry.resend && draft.retry.resendReason ? { resendReason: draft.retry.resendReason } : {}) } : null,
         stop: draft.stopTarget ? { turnId: draft.stopTarget.turnId, epoch: draft.stopTarget.epoch } : null });
 }
 export function saveCodeDraftStorage(storage: Storage, endpoint: string, book: CodeDraftBook): string | null {

package/public/manager/src/code/code-controller-drafts.ts

@@ -1,6 +1,7 @@
 import type { CodeCreateSessionRequest, CodeModelCatalog, CodeSessionInfo } from '../../../../src/code-mode/wire';
 import type { CodeControllerModel } from './code-controller-types';
 import { browserCodeDraftStorage, loadCodeDraftStorage, saveCodeDraftStorage, type StoredCodeDraft } from './code-controller-draft-storage';
+import { codeResendCopy, type CodeResendReason } from './code-types';
 
 export interface CodeDraft {
     input: string;
@@ -11,13 +12,30 @@ export interface CodeDraft {
     /**
      * `resend` marks an attempt whose key the server already spent. Acceptance is
      * then known — it failed — so the surfaces that describe an unconfirmed send
-     * must stop hedging.
+     * must stop hedging. `resendReason` says why, when it was not the server's own settlement.
      */
-    retry: { text: string; key: string; edit: number; resend?: boolean } | null;
+    retry: { text: string; key: string; edit: number; resend?: boolean; resendReason?: CodeResendReason } | null;
     createUnknown: boolean;
     requiredSequence: number;
     stopTarget: { turnId: string; epoch: number; outcome: 'pending' | 'unknown' | 'retryable' | 'accepted' } | null;
     permissionOperations: CodeControllerModel['permissionOperations'];
+    /**
+     * The clientTurnKey of a send whose turn has not visibly started or ended yet.
+     * Bridges the gap between pressing Send and the server reporting the turn, so
+     * the session reads as working the whole time. In-memory only: a reloaded page
+     * must not show a phantom spinner.
+     */
+    awaitingTurn: string | null;
+    /**
+     * A follow-up for the running Claude turn, captured with that turn's owner. In-memory only
+     * and never the send's `operation`/`retry`: it settles on its receipt or on its own
+     * `user_message`, and `unknown` means acceptance could not be confirmed (never resent).
+     */
+    steer: {
+        key: string; text: string; edit: number; turnId: string; epoch: number; state: 'sending' | 'unknown';
+        /** The server answered `steer_outcome_unknown`: Claude may have it, but the transcript never will. */
+        unrecorded?: boolean;
+    } | null;
 }
 export interface CodeDraftBook {
     endpoint: string;
@@ -37,7 +55,7 @@ const tabBooks = new WeakMap<Storage, Map<string, CodeDraftBook>>();
 export function createCodeDraft(selection: CodeCreateSessionRequest): CodeDraft {
     return { input: '', edit: 0, selection: { ...selection }, selectionEdit: 0,
         operation: { kind: 'idle', error: null }, retry: null, createUnknown: false, requiredSequence: 0,
-        stopTarget: null, permissionOperations: {} };
+        stopTarget: null, permissionOperations: {}, awaitingTurn: null, steer: null };
 }
 function restoreDraft(saved: StoredCodeDraft): CodeDraft {
     const draft = createCodeDraft(saved.selection);
@@ -46,7 +64,7 @@ function restoreDraft(saved: StoredCodeDraft): CodeDraft {
     draft.retry = saved.retry;
     if (saved.creating) draft.operation = { kind: 'creating', error: 'Creation was interrupted by reload. The original session may exist; no request has been retried.' };
     if (saved.retry) draft.operation = { kind: 'unknown-send', error: saved.retry.resend
-        ? 'The original attempt ended on the server without running. The message was not resent; Retry will submit it as a new message.'
+        ? codeResendCopy(saved.retry.resendReason).error
         : 'The original message has not been reconciled after reload. It will not be sent automatically.' };
     if (saved.stop) {
         draft.stopTarget = { ...saved.stop, outcome: 'unknown' };
@@ -75,13 +93,16 @@ export function persistCodeDraftBook(book: CodeDraftBook): void {
 }
 export function sessionSelection(session: CodeSessionInfo): CodeCreateSessionRequest {
     return { provider: session.provider, cwd: session.cwd, model: session.model,
-        effort: session.effort, permissionMode: session.permissionMode };
+        effort: session.effort, permissionMode: session.permissionMode,
+        ...(session.thinking === null ? {} : { thinking: session.thinking }) };
 }
 export function catalogSelection(catalog: CodeModelCatalog, previous: CodeCreateSessionRequest, changedProvider = false): CodeCreateSessionRequest {
     const provider = catalog.providers.find(row => row.id === previous.provider);
     if (!provider) return previous;
     const capabilities = provider.capabilities;
-    return { ...previous,
+    // Thinking is a Claude switch; it must not travel into a create for another runtime.
+    const { thinking, ...rest } = previous;
+    return { ...rest, ...(provider.id === 'claude' && thinking !== undefined ? { thinking } : {}),
         model: !changedProvider && provider.models.includes(previous.model) ? previous.model : provider.defaultModel,
         effort: !changedProvider && previous.effort !== null && capabilities.efforts.includes(previous.effort)
             ? previous.effort : null,
@@ -91,6 +112,12 @@ export function catalogSelection(catalog: CodeModelCatalog, previous: CodeCreate
                 : capabilities.permissionModes.includes('auto') ? 'auto' : 'read-only',
     };
 }
+/** The follow-up is in the transcript: clear the input only if it was not edited since. */
+export function acknowledgeCodeSteer(draft: CodeDraft, key: string): void {
+    if (draft.steer?.key !== key) return;
+    if (draft.edit === draft.steer.edit) { draft.input = ''; draft.edit++; }
+    draft.steer = null;
+}
 export function acknowledgeCodeSend(draft: CodeDraft, key: string): void {
     if (draft.retry?.key !== key) return;
     if (draft.edit === draft.retry.edit) { draft.input = ''; draft.edit++; }