talos-code 0.1.0 → 0.2.1

package/dist/tui/app.js

@@ -44,9 +44,10 @@ import { APPROVAL_DEFAULT_SELECTED, approvalDialogFit, approvalDialogModel, appr
 import { fitOverlay, renderFittedOverlay, renderOverlay } from "./overlays/scroll-window.js";
 import { commitModelSelection, createModelPickerModel, modelPickerOverlay } from "./overlays/model-picker.js";
 import { effortLineOverlay, orderedEfforts } from "./overlays/effort-line.js";
-import { consentQuestion, createProviderPickerModel, maskedSecret, providerConsentOverlay, providerKeyOverlay, providerKeySourceLabel, providerPickerEnter, providerPickerItems, providerPickerOverlay } from "./overlays/provider-picker.js";
+import { consentQuestion, createProviderPickerModel, maskedSecret, providerConsentOverlay, providerKeyOverlay, providerKeySourceLabel, providerPickerEnter, providerPickerItems, providerPickerOverlay, providerLoginChoiceOverlay, providerOAuthOverlay } from "./overlays/provider-picker.js";
 import { createSessionPickerModel, filterSessions, sessionPickerOverlay } from "./overlays/session-picker.js";
 import { agentTreeOverlay as agentTreeOverlayContent, createAgentTreeOverlayModel, moveAgentTreeSelection, selectedAgentRow } from "./overlays/agent-tree.js";
+import { createAgentView } from "./agent-view.js";
 import { agentRosterRows } from "./agent-roster.js";
 import { helpDialogOverlay } from "./overlays/help-dialog.js";
 import { queueEditorOverlay, queueEditorSelected } from "./overlays/queue-editor.js";
@@ -81,6 +82,7 @@ import { parseSlashCommand, SLASH_COMMANDS } from "./slash-commands.js";
 import { initialTuiState, reasoningUsageLabel, reduceTuiEvent } from "./state.js";
 import { appendTranscriptMessage, appendTranscriptWarning, createTranscriptModel, transcriptItemRaw, transcriptItemText } from "./transcript-model.js";
 import { createTuiTheme, themeColor } from "./theme.js";
+import { DEFAULT_THEME_ACCENT } from "./theme-catalog.js";
 import { THEME_CHOICES, createThemeStore, parseThemeChoice } from "./theme-store.js";
 import { themeLabel, themePickerOverlay } from "./overlays/theme-picker.js";
 import { checkpointFilesText, rangeFiles, undoPickerOverlay, undoRange } from "./overlays/checkpoint-picker.js";
@@ -99,6 +101,7 @@ import { decideShellInput } from "./shell-input.js";
 import { createRenderCoordinator } from "./render-coordinator.js";
 import { MOTION_FRAME_MS, frameIndex } from "./render-scheduler.js";
 import { onboardingSteps } from "./onboarding.js";
+import { setupEndLines, setupOverlay, setupStart } from "./setup-wizard.js";
 import { createVimState, handleVimInput, toggleVim, vimModeHint } from "./vim-mode.js";
 export { closeOverlay, createTuiAppState, permissionDryRunSlash, queuedActionPreview, reduceAppAction, slashCommandIntent, slashCommandToCliArgs, togglePlanMode } from "./shell-model.js";
 const execFileAsync = promisify(execFile);
@@ -141,6 +144,8 @@ export function reasoningEffortChoices(model) {
 export async function selectExplicitModel(id, catalog, setControllerModel) { await commitModelSelection({ id, catalog, setControllerModel }); }
 export async function runControllerSlashAction(name, controller) { if (name !== 'compact')
     return null; const result = await controller.compact(); return result?.compattato === false ? t('screen.compact.already') : t('screen.compact.done'); }
+/* P13: what still works while an agent is watched (the rest of the keys do nothing; Esc goes back). */
+const AGENT_VIEW_ACTIONS = new Set(['interrupt', 'exit', 'agent-tree', 'page-up', 'page-down', 'transcript-top', 'transcript-bottom', 'redraw', 'reasoning-toggle', 'tool-details', 'help']);
 function localMessage(state, text) { const id = `local-${Date.now()}-${Math.random()}`; const base = state.messages.length >= 511 ? state.messages.slice(-511) : state.messages; return { ...state, messages: [...base, { id, role: 'assistant', text }], transcript: appendTranscriptWarning(state.transcript, text) }; }
 function userMessage(state, text, id = `user-${Date.now()}-${Math.random()}`) { const base = state.messages.length >= 511 ? state.messages.slice(-511) : state.messages; return { ...state, messages: [...base, { id, role: 'user', text }], transcript: appendTranscriptMessage(state.transcript, { role: 'user', text }) }; }
 /* R5b D4 (Q-R5-14): the theme is live. run.ts hands the app the store it paints the background from; without one (tests,
@@ -148,7 +153,7 @@ function userMessage(state, text, id = `user-${Date.now()}-${Math.random()}`) {
    at every render, and a change of theme remounts the main tree (its key), so memoised rows are drawn again. */
 export function createTuiAppComponent(React, Ink, baseCapabilities = { interactive: true, color: true, motion: true, unicode: true }, accentId, givenThemeStore) {
     const h = React.createElement;
-    const themeStore = givenThemeStore ?? createThemeStore(baseCapabilities, accentId ?? 'calm');
+    const themeStore = givenThemeStore ?? createThemeStore(baseCapabilities, accentId ?? DEFAULT_THEME_ACCENT);
     let capabilities = baseCapabilities, theme = createTuiTheme(capabilities, accentId);
     let bootColor, transcriptColor, pickerColor, approvalColor, toolColor, footerColor;
     const applyLive = (live) => {
@@ -356,11 +361,26 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         const [sessionRows, setSessionRows] = React.useState([]);
         const [agentRows, setAgentRows] = React.useState([]);
         const [agentTreeOverlay, setAgentTreeOverlay] = React.useState(null);
+        /* P13 (owner decisions 2026-09-26): the agent whose transcript takes the main view (agent-view.ts), read-only. */
+        const [agentView, setAgentView] = React.useState(null);
+        const agentViewRef = React.useRef(null);
+        const mainViewportRef = React.useRef(null);
         const [providerStep, setProviderStep] = React.useState({ kind: 'list' });
         const [chosenProvider, setChosenProvider] = React.useState(null);
         const [selectionLoaded, setSelectionLoaded] = React.useState(false);
         const [keyMissing, setKeyMissing] = React.useState(false);
-        const [modelList, setModelList] = React.useState({ loading: false, verified: false, notice: '', label: '' });
+        const [modelList, setModelList] = React.useState({ loading: false, verified: false, notice: '', label: '', engineDown: false });
+        /* P17 (owner decisions 2026-09-26): the guided setup — first launch when something is missing, /setup, `talos setup`.
+           It chains the provider, key and model windows that exist; `setupTransitionRef` holds the setup open while one window
+           hands over to the next (the provider window closes, the model window opens). */
+        const [setupActive, setSetupActive] = React.useState(false);
+        const setupRef = React.useRef(false);
+        const setupTransitionRef = React.useRef(false);
+        /* A local engine chosen in the setup that did not answer: its model window says so (R retries, Esc goes back), and the
+           engine becomes the chosen provider only when one of its models is chosen. */
+        const setupPendingProviderRef = React.useRef(null);
+        /* P21: the OpenRouter sign-in under way (its loopback port closes on cancel, timeout or success). */
+        const oauthLoginRef = React.useRef(null);
         const [providerSecret, setProviderSecret] = React.useState('');
         const [auxCompletions, setAuxCompletions] = React.useState([]);
         const [fileCompletion, setFileCompletion] = React.useState(null);
@@ -575,6 +595,26 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             }
         }
         React.useEffect(() => { void refreshContextStatus(); }, [state.sessionId, state.running]);
+        function closeAgentView() {
+            const handle = agentViewRef.current;
+            agentViewRef.current = null;
+            handle?.close();
+            setAgentView(null);
+            const saved = mainViewportRef.current;
+            mainViewportRef.current = null;
+            setViewport((view) => saved ?? { ...view, offset: 0, unseen: 0, followingTail: true });
+        }
+        function openAgentView(row) {
+            agentViewRef.current?.close();
+            if (!mainViewportRef.current)
+                mainViewportRef.current = viewport;
+            setViewport((view) => ({ ...view, offset: 0, unseen: 0, followingTail: true }));
+            agentViewRef.current = createAgentView({ runtime, target: { sessionId: row.id, task: row.task }, secretValues: secretValuesFromEnvironment(process.env), onChange: (next) => setAgentView(next) });
+        }
+        /* Another session in use (resume, fork, /clear) and the app closing let go of the watched agent. */
+        React.useEffect(() => { if (agentViewRef.current)
+            closeAgentView(); }, [state.sessionId]);
+        React.useEffect(() => () => { agentViewRef.current?.close(); agentViewRef.current = null; }, []);
         async function refreshAgentRows() {
             try {
                 const tree = await controller.agentTree();
@@ -842,10 +882,34 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             if (!steps.length)
                 return;
             onboardingShownRef.current = true;
-            const info = steps.filter(step => step.kind === 'info').map(step => step.text), todo = steps.filter(step => step.kind !== 'info');
+            const info = steps.filter(step => step.kind === 'info').map(step => step.text);
+            /* P17: on the first launch the missing steps are the guided setup, not a list of commands to type. */
+            if (bootPlanRef.current?.firstLaunch && !initialPrompt?.trim() && !invocation.setup) {
+                void (async () => {
+                    let row;
+                    try {
+                        row = chosenProvider ? (await catalog.listProviders()).find((entry) => entry.id === chosenProvider) : undefined;
+                    }
+                    catch {
+                        row = undefined;
+                    }
+                    const plan = setupStart({ firstLaunch: true, providerChosen: Boolean(chosenProvider), providerUsable: Boolean(row?.configured), keyBenched: Boolean(row?.benched), modelChosen: Boolean(chosenProvider && providerOfModel(controller.model()) === chosenProvider) });
+                    if (info.length)
+                        setState((current) => localMessage(current, info.join('\n')));
+                    if (plan.start) {
+                        await startSetup(plan.from);
+                        return;
+                    }
+                    const todo = steps.filter(step => step.kind !== 'info');
+                    if (todo.length)
+                        setState((current) => localMessage(current, [t('screen.onboarding.setup'), ...todo.map(step => '• ' + step.text + (step.command ? ' ' + step.command : ''))].join('\n')));
+                })();
+                return;
+            }
+            const todo = steps.filter(step => step.kind !== 'info');
             setState((current) => localMessage(current, [...info, ...(todo.length ? [t('screen.onboarding.setup'), ...todo.map(step => '• ' + step.text + (step.command ? ' ' + step.command : ''))] : [])].join('\n')));
         }, [selectionLoaded, chosenProvider, currentModelMeta, keyMissing]);
-        const closeCurrentOverlay = () => { setTrustCenter(null); setMcpCenter(null); setHookCenter(null); setPluginCenter(null); setMemoryCenter(null); setNotesCenter(null); setTasksCenter(null); setLibraryCenter(null); setProviderSecret(''); setProviderStep({ kind: 'list' }); setModelEffortStep(null); setEffortOnly(false); setPickerQuery(''); setPickerSelection({ query: '', selected: 0, pageSize: 10 }); setAppState((current) => closeOverlay(current)); };
+        const closeCurrentOverlay = () => { oauthLoginRef.current?.cancel(); oauthLoginRef.current = null; setTrustCenter(null); setMcpCenter(null); setHookCenter(null); setPluginCenter(null); setMemoryCenter(null); setNotesCenter(null); setTasksCenter(null); setLibraryCenter(null); setProviderSecret(''); setProviderStep({ kind: 'list' }); setModelEffortStep(null); setEffortOnly(false); setPickerQuery(''); setPickerSelection({ query: '', selected: 0, pageSize: 10 }); setAppState((current) => closeOverlay(current)); };
         const applyOverlay = (overlay) => setAppState((current) => openOverlay(current, overlay));
         /* B1 slice 18: the models of the chosen provider only; with none chosen, /provider opens first and comes back here. */
         const loadModels = async (provider) => {
@@ -859,7 +923,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             setPickerQuery('');
             setPickerSelection({ query: '', selected: 0, pageSize: 10 });
             setModelRows([]);
-            setModelList({ loading: true, verified: false, notice: t('screen.model.loading'), label: target });
+            setModelList({ loading: true, verified: false, notice: t('screen.model.loading'), label: target, engineDown: false });
             modelPickerRef.current?.cancel();
             const model = createModelPickerModel(catalog, { provider: target, current: controller.model() });
             modelPickerRef.current = model;
@@ -868,7 +932,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 if (modelPickerRef.current !== model)
                     return;
                 setModelRows([...model.rows()]);
-                setModelList({ loading: false, verified: model.verified(), notice: model.notice(), label: model.label() });
+                setModelList({ loading: false, verified: model.verified(), notice: model.notice(), label: model.label(), engineDown: model.engineDown() });
             }
             catch (error) {
                 addLocal(screenErrorText(codeOnly(error), act('screen.action.modelPicker')));
@@ -884,11 +948,87 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             }
             setChosenProvider(row.id);
             showModel(row.id, controller.model());
-            setProviderStep({ kind: 'list' });
-            setProviderSecret('');
-            setAppState((current) => closeOverlay(current));
-            await loadModels(row.id);
+            setupTransitionRef.current = true;
+            try {
+                setProviderStep({ kind: 'list' });
+                setProviderSecret('');
+                setAppState((current) => closeOverlay(current));
+                await loadModels(row.id);
+            }
+            finally {
+                setupTransitionRef.current = false;
+            }
+        };
+        /* P17: the setup starts at the first missing step; it ends when its windows close (a model chosen, or Esc), and says
+           whether TALOS is ready — checked, not assumed: a provider, its key and the model's readiness. */
+        const startSetup = async (from) => {
+            setupRef.current = true;
+            setSetupActive(true);
+            setupTransitionRef.current = true;
+            try {
+                if (from === 'model' && chosenProvider) {
+                    await loadModels(chosenProvider);
+                    return;
+                }
+                await loadProviders();
+                /* The key step opens at once for the chosen provider (the consent first when its key is in the environment): no
+                   probe of a provider that has no usable key yet. */
+                if (from === 'key' && chosenProvider) {
+                    const row = (await catalog.listProviders()).find((entry) => entry.id === chosenProvider);
+                    if (row) {
+                        const preliminary = providerPickerEnter({ selectedProvider: row.id, configured: row.configured, requiresKey: row.requiresKey, keySource: row.keySource });
+                        setProviderSecret('');
+                        setProviderStep(preliminary.kind === 'environment-consent' ? { kind: 'consent', provider: row, choice: 'no' } : keyStepFor(row));
+                    }
+                }
+            }
+            catch (error) {
+                addLocal(screenErrorText(codeOnly(error), act('screen.action.providerPicker')));
+            }
+            finally {
+                setupTransitionRef.current = false;
+            }
+        };
+        const finishSetup = async () => {
+            if (!setupRef.current)
+                return;
+            setupRef.current = false;
+            setSetupActive(false);
+            const model = controller.model();
+            const pending = setupPendingProviderRef.current;
+            setupPendingProviderRef.current = null;
+            if (pending && providerOfModel(model) === pending.id) {
+                try {
+                    await catalog.chooseProvider(pending.id);
+                    setChosenProvider(pending.id);
+                    showModel(pending.id, model);
+                }
+                catch (error) {
+                    addLocal(screenErrorText(codeOnly(error), act('screen.action.providerChoice')));
+                }
+            }
+            let ready = false;
+            try {
+                const provider = typeof catalog?.chosenProvider === 'function' ? await catalog.chosenProvider() : null;
+                ready = Boolean(provider && providerOfModel(model) === provider && (await readinessFor(model)).ready);
+            }
+            catch {
+                ready = false;
+            }
+            addLocal(setupEndLines(ready ? { ready: true, model } : { ready: false }).join('\n'));
         };
+        React.useEffect(() => {
+            if (!setupRef.current || appState.overlay || setupTransitionRef.current)
+                return;
+            void finishSetup();
+        }, [appState.overlay]);
+        const setupAskedRef = React.useRef(false);
+        React.useEffect(() => {
+            if (!invocation.setup || !selectionLoaded || setupAskedRef.current)
+                return;
+            setupAskedRef.current = true;
+            void startSetup('provider');
+        }, [selectionLoaded]);
         const loadProviders = async () => {
             applyOverlay({ kind: 'provider' });
             setPickerQuery('');
@@ -905,6 +1045,63 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 addLocal(screenErrorText(error, act('screen.action.providerPicker')));
             }
         };
+        const keyStepFor = (row, remediation) => row.id === 'openrouter' && typeof catalog?.startOpenRouterLogin === 'function'
+            ? { kind: 'login-choice', provider: row, choice: 'browser', ...(remediation ? { remediation } : {}) }
+            : { kind: 'key', provider: row, testing: false, result: null, ...(remediation ? { remediation } : {}) };
+        const oauthErrorText = (provider, error) => {
+            const code = String(error?.code ?? '');
+            const status = error?.status ?? '?';
+            const known = ['OAUTH_TIMEOUT', 'OAUTH_SCAMBIO_RIFIUTATO', 'OAUTH_RETE', 'OAUTH_RISPOSTA_INATTESA', 'OAUTH_DENIED', 'OAUTH_CODE_MISSING'];
+            return known.includes(code) ? t(`screen.provider.oauthError.${code}`, { provider: provider.label, status }) : t('screen.provider.oauthError.other');
+        };
+        /* P21 (owner decisions 2026-09-26): the browser opens (the address is shown anyway), the loopback waits, a code can be
+           pasted instead; the key that comes back is tested and saved like a pasted one, then the models open. */
+        const completeOAuth = async (provider, key) => {
+            setProviderStep((current) => current.kind === 'oauth' ? { ...current, phase: 'exchanging', message: null } : current);
+            let result;
+            try {
+                result = await catalog.setProviderKey(provider.id, key);
+            }
+            catch (error) {
+                setProviderStep((current) => current.kind === 'oauth' ? { ...current, phase: 'failed', message: screenErrorText(codeOnly(error), act('screen.action.keyTest')) } : current);
+                return;
+            }
+            finally {
+                key = '';
+            }
+            if (!result.saved) {
+                setProviderStep((current) => current.kind === 'oauth' ? { ...current, phase: 'failed', message: result.message } : current);
+                return;
+            }
+            oauthLoginRef.current = null;
+            addLocal(t('screen.provider.oauthSaved', { provider: provider.label }));
+            const refreshed = (await catalog.listProviders()).find((entry) => entry.id === provider.id) ?? { ...provider, configured: true };
+            await chooseProviderAndOpenModels(refreshed);
+        };
+        const startOAuth = async (provider) => {
+            oauthLoginRef.current?.cancel();
+            oauthLoginRef.current = null;
+            setProviderSecret('');
+            let login;
+            try {
+                login = await catalog.startOpenRouterLogin();
+            }
+            catch (error) {
+                setProviderStep({ kind: 'oauth', provider, url: '', mode: 'browser', opened: false, phase: 'failed', message: oauthErrorText(provider, error) });
+                return;
+            }
+            oauthLoginRef.current = login;
+            /* The address also goes to the conversation, unboxed: a person copies it there without the window's borders. */
+            addLocal(t('screen.provider.oauthAddress', { provider: provider.label, url: login.url }));
+            setProviderStep({ kind: 'oauth', provider, url: login.url, mode: login.mode, opened: login.opened, phase: login.mode === 'paste' ? 'paste' : 'waiting', message: null });
+            login.key.then((key) => { if (oauthLoginRef.current === login)
+                void completeOAuth(provider, key); }, (error) => {
+                if (oauthLoginRef.current !== login || error?.code === 'OAUTH_CANCELLED')
+                    return;
+                oauthLoginRef.current = null;
+                setProviderStep((current) => current.kind === 'oauth' ? { ...current, phase: 'failed', message: oauthErrorText(provider, error) } : current);
+            });
+        };
         const routeProviderSelection = async (row, { allowEnvironmentConsent = true } = {}) => {
             const originalIndex = providerRows.findIndex((provider) => provider.id === row.id);
             if (originalIndex >= 0)
@@ -927,10 +1124,25 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             const next = providerPickerEnter({ selectedProvider: row.id, configured: row.configured, requiresKey: row.requiresKey, keySource: row.keySource, probe });
             if (next.kind === 'provider-setup') {
                 setProviderSecret('');
-                setProviderStep({ kind: 'key', provider: row, testing: false, result: null, ...(next.remediation ? { remediation: next.remediation } : {}) });
+                setProviderStep(keyStepFor(row, next.remediation ?? undefined));
                 return;
             }
             if (next.kind === 'provider-remediation') {
+                /* P17 (owner decision 8): in the setup, a local engine that is down opens its model window, which says how to start it. */
+                if (setupRef.current && row.local && !row.requiresKey) {
+                    setupPendingProviderRef.current = row;
+                    setupTransitionRef.current = true;
+                    try {
+                        setProviderStep({ kind: 'list' });
+                        setProviderSecret('');
+                        setAppState((current) => closeOverlay(current));
+                        await loadModels(row.id);
+                    }
+                    finally {
+                        setupTransitionRef.current = false;
+                    }
+                    return;
+                }
                 addLocal(next.remediation?.message || probe?.detail || t('screen.provider.notReady', { provider: row.label }));
                 return;
             }
@@ -1246,6 +1458,11 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 addLocal(parsed.suggestions.length ? t('screen.slash.unknownSuggest', { name: parsed.name, suggestions: parsed.suggestions.map(value => `/${value}`).join(', ') }) : t('screen.slash.unknown', { name: parsed.name }));
                 return;
             }
+            /* P17 (owner decision 4): /setup runs the guided setup again, from the provider. */
+            if (parsed.name === 'setup') {
+                await startSetup('provider');
+                return;
+            }
             const intent = slashCommandIntent(text);
             if (intent?.kind === 'open-overlay') {
                 if (intent.overlay.kind === 'model') {
@@ -2188,7 +2405,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 commandMenuSelectionStore.reset();
                 return;
             }
-            if (appState.focus.current === 'provider-picker' && providerStep.kind === 'key')
+            if (appState.focus.current === 'provider-picker' && (providerStep.kind === 'key' || providerStep.kind === 'oauth'))
                 setProviderSecret((value) => value.slice(0, -1));
             else if (appState.focus.current === 'provider-picker' && providerStep.kind === 'consent') { /* nothing to erase */ }
             else
@@ -2255,6 +2472,37 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 return;
             }
             if (appState.focus.current === 'provider-picker') {
+                if (providerStep.kind === 'login-choice') {
+                    const step = providerStep;
+                    if (step.choice === 'browser') {
+                        await startOAuth(step.provider);
+                        return;
+                    }
+                    setProviderSecret('');
+                    setProviderStep({ kind: 'key', provider: step.provider, testing: false, result: null, ...(step.remediation ? { remediation: step.remediation } : {}) });
+                    return;
+                }
+                if (providerStep.kind === 'oauth') {
+                    const step = providerStep;
+                    if (step.phase === 'failed') {
+                        await startOAuth(step.provider);
+                        return;
+                    }
+                    if (step.phase !== 'paste' || !oauthLoginRef.current)
+                        return;
+                    const pasted = providerSecret;
+                    setProviderSecret('');
+                    if (!pasted.trim())
+                        return;
+                    try {
+                        await oauthLoginRef.current.submit(pasted);
+                    }
+                    catch (error) {
+                        if (error?.code === 'OAUTH_CODE_MISSING')
+                            setProviderStep({ ...step, message: oauthErrorText(step.provider, error) });
+                    }
+                    return;
+                }
                 if (providerStep.kind === 'consent') {
                     const step = providerStep;
                     try {
@@ -2429,6 +2677,13 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 closeCurrentOverlay();
                 return;
             }
+            if (action === 'picker-cancel' && setupRef.current && appState.focus.current === 'model-picker' && modelList.engineDown && !modelEffortStep) {
+                modelPickerRef.current?.cancel();
+                setupTransitionRef.current = true;
+                setupPendingProviderRef.current = null;
+                void loadProviders().finally(() => { setupTransitionRef.current = false; });
+                return;
+            }
             if (action === 'picker-cancel') {
                 if (appState.focus.current === 'provider-picker')
                     providerPickerRef.current?.cancel();
@@ -2439,6 +2694,14 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                 closeCurrentOverlay();
                 return;
             }
+            if (appState.focus.current === 'provider-picker' && providerStep.kind === 'login-choice' && (action === 'picker-up' || action === 'picker-home')) {
+                setProviderStep({ ...providerStep, choice: 'browser' });
+                return;
+            }
+            if (appState.focus.current === 'provider-picker' && providerStep.kind === 'login-choice' && (action === 'picker-down' || action === 'picker-end')) {
+                setProviderStep({ ...providerStep, choice: 'paste-key' });
+                return;
+            }
             if (appState.focus.current === 'provider-picker' && providerStep.kind === 'consent' && (action === 'picker-up' || action === 'picker-home')) {
                 setProviderStep({ ...providerStep, choice: 'no' });
                 return;
@@ -2719,7 +2982,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         const pasteOwner = composerOwnsPaste({
             bootPhase: boot.phase,
             focus: appState.focus.current,
-            modalOwner: Boolean(appState.overlay || queueEditor || transcriptSearch || contextInspector || themePicker || undoPicker || historyPicker || agentTreeOverlay || trustCenter || mcpCenter || hookCenter || pluginCenter || memoryCenter || notesCenter || tasksCenter || libraryCenter || researchCenter || automationCenter || forgeCenter || pending),
+            modalOwner: Boolean(appState.overlay || queueEditor || transcriptSearch || contextInspector || themePicker || undoPicker || historyPicker || agentTreeOverlay || agentView || trustCenter || mcpCenter || hookCenter || pluginCenter || memoryCenter || notesCenter || tasksCenter || libraryCenter || researchCenter || automationCenter || forgeCenter || pending),
             vimMode: vim.enabled ? vim.mode : 'disabled',
             auxCount,
         });
@@ -2781,13 +3044,18 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             const focusNow = graceComposer && appState.focus.current === 'approval' ? (appState.focus.stack.at(-1) ?? 'composer') : appState.focus.current;
             if (graceComposer && focusNow !== 'composer')
                 return;
-            const modalOwner = Boolean((appState.overlay && !(graceComposer && appState.overlay.kind === 'approval')) || queueEditor || transcriptSearch || contextInspector || themePicker || undoPicker || historyPicker || agentTreeOverlay || trustCenter || mcpCenter || hookCenter || pluginCenter || memoryCenter || notesCenter || tasksCenter || libraryCenter || researchCenter || automationCenter || forgeCenter || (pending && !graceComposer));
+            const modalOwner = Boolean((appState.overlay && !(graceComposer && appState.overlay.kind === 'approval')) || queueEditor || transcriptSearch || contextInspector || themePicker || undoPicker || historyPicker || agentTreeOverlay || agentView || trustCenter || mcpCenter || hookCenter || pluginCenter || memoryCenter || notesCenter || tasksCenter || libraryCenter || researchCenter || automationCenter || forgeCenter || (pending && !graceComposer));
             /* R1 E15 / Q-R1-7 (no mouse capture): Ctrl+Home and Ctrl+End move the transcript to its first and newest rows, as in
                Claude Code fullscreen and Qwen Code. The keymap resolver drops Ctrl on Home/End, so they are read here first. */
             if (key?.ctrl && (key.home || key.end) && !modalOwner && boot.phase === 'ready') {
                 scrollTranscript(key.home ? 'top' : 'jump-tail');
                 return;
             }
+            /* P13: the watched agent's transcript scrolls the same way (the view owns the composer, not the transcript). */
+            if (agentView && !agentTreeOverlay && !appState.overlay && key?.ctrl && (key.home || key.end) && boot.phase === 'ready') {
+                scrollTranscript(key.home ? 'top' : 'jump-tail');
+                return;
+            }
             /* Lane O: the help overlay scrolls inside its budget; the keymap has no help-context scroll keys, so they are read here. */
             if (appState.overlay?.kind === 'help' && (key.pageUp || key.pageDown || key.upArrow || key.downArrow)) {
                 const step = key.pageUp || key.pageDown ? helpPageRef.current : 1, delta = key.pageUp || key.upArrow ? -step : step;
@@ -3352,6 +3620,18 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                         setAgentTreeOverlay(null);
                         return;
                     }
+                    /* P13: Enter watches the selected agent live; on the session in use it goes back to it. */
+                    if (key.return) {
+                        const row = selectedAgentRow(agentTreeOverlay);
+                        setAgentTreeOverlay(null);
+                        if (!row || row.id === agentView?.sessionId)
+                            return;
+                        if (row.id === controller.current())
+                            closeAgentView();
+                        else
+                            openAgentView(row);
+                        return;
+                    }
                     if (key.upArrow) {
                         setAgentTreeOverlay((current) => current ? moveAgentTreeSelection(current, -1) : current);
                         return;
@@ -3509,6 +3789,21 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                     }
                     return;
                 }
+                /* P13 (owner decisions 2 and 7): watching an agent is read-only. Esc goes back to the main session and does NOT
+                   interrupt the turn (Claude Code fixed exactly that); Ctrl+C still stops the whole turn; the agent tree, scrolling,
+                   redraw, reasoning and tool details still work; typing does nothing. */
+                if (agentView) {
+                    if (key.escape) {
+                        closeAgentView();
+                        return;
+                    }
+                    const viewAction = resolveKeybinding(ch, key, ['global', 'transcript', 'composer'], effectiveKeymap);
+                    if (viewAction && AGENT_VIEW_ACTIONS.has(viewAction)) {
+                        handleSemanticAction(viewAction, key);
+                        return;
+                    }
+                    return;
+                }
                 const vimOwnsInput = boot.phase === 'ready' && !trustCenter && !mcpCenter && !hookCenter && !pluginCenter && !memoryCenter && !notesCenter && !tasksCenter && !libraryCenter && !researchCenter && !automationCenter && !forgeCenter && focusNow === 'composer' && vim.enabled && (vim.mode === 'normal' || Boolean(key.escape));
                 if (vimOwnsInput) {
                     const vimResult = handleVimInput({ state: vim, editor: currentEditor(), ch, key });
@@ -3551,6 +3846,20 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                         }
                         return;
                     }
+                    if (focusNow === 'provider-picker' && providerStep.kind === 'login-choice')
+                        return;
+                    if (focusNow === 'provider-picker' && providerStep.kind === 'oauth') {
+                        if (providerStep.phase === 'waiting') {
+                            if (routed.text.trim().toLowerCase() === 'c')
+                                setProviderStep({ ...providerStep, phase: 'paste', message: null });
+                            return;
+                        }
+                        if (providerStep.phase === 'paste') {
+                            setProviderSecret((value) => value + routed.text);
+                            return;
+                        }
+                        return;
+                    }
                     if (focusNow === 'provider-picker' && providerStep.kind === 'consent') {
                         const letter = routed.text.trim().toLowerCase();
                         if (letter === 'y' || letter === 'n')
@@ -3559,6 +3868,10 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
                     }
                     if (focusNow === 'model-picker' && modelEffortStep)
                         return;
+                    if (focusNow === 'model-picker' && setupRef.current && modelList.engineDown && !pickerQuery && (routed.text === 'r' || routed.text === 'R') && appState.overlay?.kind === 'model') {
+                        void loadModels(appState.overlay.provider);
+                        return;
+                    }
                     if (focusNow === 'model-picker' || focusNow === 'provider-picker' || focusNow === 'session-picker') {
                         setPickerQuery((value) => value + routed.text);
                         setPickerSelection((current) => ({ ...current, selected: 0 }));
@@ -3591,13 +3904,18 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         });
         const { columns, activity, shortcutLine, rosterLine, queueLine, footerLine, statusBar: statusRow } = layout;
         /* R3 Q-R3-9: no `Run · …` rows; R5a S8: a collapsed reasoning block is drawn once it has ended (thinking-row.ts). */
-        const visibleTranscriptItems = React.useMemo(() => visibleItemsOf(state.transcript.items, appState.reasoningVisible), [state.transcript.items, appState.reasoningVisible]);
+        /* P13: the watched agent's transcript takes the main view; the main session's is kept as it was. */
+        const shownTranscriptItems = (agentView ? agentView.transcript.items : state.transcript.items);
+        /* In an agent's transcript its prompt is the task the main session gave it, not the person's words, and the answers are
+           the agent's: "You" and "TALOS" would say otherwise. */
+        const watchingAgent = Boolean(agentView);
+        const visibleTranscriptItems = React.useMemo(() => visibleItemsOf(shownTranscriptItems, appState.reasoningVisible), [shownTranscriptItems, appState.reasoningVisible]);
         const renderTranscriptItem = React.useCallback((item) => {
             const selected = item.id === transcriptSelectedId, prefix = selected ? '› ' : '';
             if (transcriptRaw)
                 return h(Ink.Text, { key: item.id, inverse: selected, dimColor: !selected }, prefix + transcriptItemRaw(item));
             if (item.kind === 'message')
-                return h(Ink.Box, { key: item.id, flexDirection: 'column' }, h(Ink.Text, { bold: item.role === 'user', color: transcriptColor, inverse: selected }, prefix + t(item.role === 'user' ? 'screen.transcript.you' : 'screen.transcript.assistant')), h(MarkdownView, { text: item.text, width: columns }));
+                return h(Ink.Box, { key: item.id, flexDirection: 'column' }, h(Ink.Text, { bold: item.role === 'user', color: transcriptColor, inverse: selected }, prefix + t(item.role === 'user' ? (watchingAgent ? 'screen.agentView.task' : 'screen.transcript.you') : (watchingAgent ? 'screen.agentView.agent' : 'screen.transcript.assistant'))), h(MarkdownView, { text: item.text, width: columns }));
             if (item.kind === 'reasoning')
                 return appState.reasoningVisible ? h(Ink.Box, { key: item.id, borderStyle: 'single', flexDirection: 'column' }, h(Ink.Text, { dimColor: true, inverse: selected }, prefix + t('screen.transcript.reasoning')), h(Ink.Text, { dimColor: true }, item.text || ' ')) : h(Ink.Text, { key: item.id, dimColor: true, inverse: selected }, prefix + thoughtLine(item));
             /* The selected row carries a two-cell prefix: its header is drawn two cells narrower so it never wraps (lane RD). */
@@ -3608,7 +3926,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             if (item.kind === 'warning')
                 return h(Ink.Text, { key: item.id, dimColor: true, inverse: selected }, prefix + item.text);
             return null;
-        }, [transcriptSelectedId, transcriptRaw, columns, appState.expandedTools, appState.reasoningVisible, toolNow]);
+        }, [transcriptSelectedId, transcriptRaw, columns, appState.expandedTools, appState.reasoningVisible, toolNow, watchingAgent]);
         const diffView = diff ? renderDiffModel(parseUnifiedDiff(diff), columns) : null;
         const vimHint = vimModeHint(vim);
         React.useEffect(() => {
@@ -3637,11 +3955,11 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         const statusStartedAt = activity.startedAt ?? busySince;
         const statusElapsed = typeof activity.frozenMs === 'number' ? activity.frozenMs : Math.max(0, motionNow - statusStartedAt);
         const statusFrame = frameIndex(statusElapsed, MOTION_FRAME_MS, theme.glyphs.spinner.length);
-        const statusText = exitHint ? exitHintText(exitHintKey) : busyIndicatorText({ kind: activity.kind, elapsedMs: statusElapsed, frame: statusFrame, unicode: capabilities.unicode, frames: theme.glyphs.spinner, ...(activity.tool ? { tool: activity.tool } : {}), retry: state.retry, nowMs: Math.max(toolNow, state.retry?.at ?? 0) });
+        const statusText = exitHint ? exitHintText(exitHintKey) : busyIndicatorText({ kind: activity.kind, elapsedMs: statusElapsed, frame: statusFrame, unicode: capabilities.unicode, frames: theme.glyphs.spinner, ...(activity.tool ? { tool: activity.tool } : {}), ...(activity.agents ? { agents: activity.agents } : {}), retry: state.retry, nowMs: Math.max(toolNow, state.retry?.at ?? 0) });
         /* R3 gate E7: the main roster row says what the CLI knows while a turn is open (the kernel list says `unknown` or `running`),
            and after the turn done / interrupted / failed like the status row (owner decision, R3 follow-up: one vocabulary). */
         const turnOpen = state.running || typeof state.sentAt === 'number';
-        const mainRowStatus = turnOpen ? activityWord(activity.kind, activity.tool) : state.lastTurn ? activityWord(state.lastTurn.outcome) : undefined;
+        const mainRowStatus = turnOpen ? activityWord(activity.kind, activity.tool, activity.agents) : state.lastTurn ? activityWord(state.lastTurn.outcome) : undefined;
         /*
          * R1 gate E1: one height budget per frame. The composer's row count comes from its store as a primitive, so the
          * fast input path still re-renders only the composer on a key and the whole screen only when the composer gains or
@@ -3674,6 +3992,18 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
          */
         const fittedPanel = (fitted) => ({ element: renderFittedOverlay(h, Ink, fitted, { accentColor: pickerColor }), rows: fitted.rows.length + (fitted.border ? 2 : 0) });
         const overlayOf = (content) => fittedPanel(fitOverlay(content, { maxRows, columns }));
+        /* P17: in the guided setup, each window says its step; a local engine that is down offers R and Esc (decision 8). */
+        const setupWrap = (content, step) => {
+            if (!setupActive)
+                return content;
+            /* On a local engine that is down, Esc goes back to the providers: the step line does not also say it skips. */
+            if (step === 'model' && modelList.engineDown) {
+                const wrapped = setupOverlay(content, step, { escSkips: false });
+                return { ...wrapped, foot: [...(wrapped.foot ?? []), { text: t('firstrun.setup.retryHint'), tone: 'dim' }] };
+            }
+            /* The key and consent windows say what Esc does in their own line ("Esc cancels"): one wording per window. */
+            return setupOverlay(content, step, { escSkips: step !== 'key' });
+        };
         let overlayNode = null;
         if (historyPicker)
             overlayNode = overlayOf(historyPickerOverlay({ rows: history, picker: historyPicker, width: columns }));
@@ -3684,7 +4014,7 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         else if (contextInspector)
             overlayNode = overlayOf(contextInspectorOverlay(contextInspector));
         else if (agentTreeOverlay)
-            overlayNode = overlayOf(agentTreeOverlayContent(agentTreeOverlay, { width: Math.max(1, columns - 2), nowMs: motionNow, currentSessionId: controller.current(), running: state.running }));
+            overlayNode = overlayOf(agentTreeOverlayContent(agentTreeOverlay, { width: Math.max(1, columns - 2), nowMs: motionNow, currentSessionId: controller.current(), running: state.running, viewingId: agentView?.sessionId ?? null }));
         else if (trustCenter)
             overlayNode = overlayOf(trustCenterOverlay(trustCenter));
         else if (mcpCenter)
@@ -3726,9 +4056,13 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         else if (appState.overlay?.kind === 'model')
             overlayNode = modelEffortStep
                 ? overlayOf(effortLineOverlay({ name: modelEffortStep.name, choices: effortRows, selected: pickerSelection.selected, current: state.status.model === modelEffortStep.id ? (reasoningEffort ?? 'default') : null, width: Math.max(20, columns - 6), unicode: capabilities.unicode }))
-                : overlayOf(modelPickerOverlay({ label: modelList.label, provider: appState.overlay.provider, loading: modelList.loading, verified: modelList.verified, notice: modelList.notice ?? '', query: pickerQuery, rows: filteredModels, selected: pickerSelection.selected }));
+                : overlayOf(setupWrap(modelPickerOverlay({ label: modelList.label, provider: appState.overlay.provider, loading: modelList.loading, verified: modelList.verified, notice: modelList.notice ?? '', query: pickerQuery, rows: filteredModels, selected: pickerSelection.selected }), 'model'));
+        else if (appState.overlay?.kind === 'provider' && providerStep.kind === 'login-choice')
+            overlayNode = overlayOf(setupWrap(providerLoginChoiceOverlay({ label: providerStep.provider.label, choice: providerStep.choice, notice: providerStep.remediation?.message ?? (providerStep.provider.benched ? t('screen.provider.benchedRetry', { benched: benchedKeyText(providerStep.provider.label, providerStep.provider.benched) }) : null) }), 'key'));
+        else if (appState.overlay?.kind === 'provider' && providerStep.kind === 'oauth')
+            overlayNode = overlayOf(setupWrap(providerOAuthOverlay({ label: providerStep.provider.label, url: providerStep.url, mode: providerStep.mode, opened: providerStep.opened, phase: providerStep.phase, masked: maskedSecret(providerSecret), message: providerStep.message }), 'key'));
         else if (appState.overlay?.kind === 'provider' && providerStep.kind === 'consent')
-            overlayNode = overlayOf(providerConsentOverlay({ provider: providerStep.provider, choice: providerStep.choice }));
+            overlayNode = overlayOf(setupWrap(providerConsentOverlay({ provider: providerStep.provider, choice: providerStep.choice }), 'key'));
         else if (appState.overlay?.kind === 'provider' && providerStep.kind === 'key') {
             const label = providerStep.provider.label;
             /* B1 slice 18: a one-token key test is stated on this step, before Enter sends it; no further question is asked. */
@@ -3736,10 +4070,10 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
             /* B1 slice 25: a provider whose saved key is benched says so here, with the cause and until when, before another key is typed. */
             const remediation = providerStep.remediation?.message ?? null;
             const benched = !remediation && providerStep.provider.benched ? t('screen.provider.benchedRetry', { benched: benchedKeyText(label, providerStep.provider.benched) }) : null;
-            overlayNode = overlayOf(providerKeyOverlay({ label, remediation, benched, masked: maskedSecret(providerSecret), keyTestNotice, testing: providerStep.testing, result: providerStep.result?.message ?? null }));
+            overlayNode = overlayOf(setupWrap(providerKeyOverlay({ label, remediation, benched, masked: maskedSecret(providerSecret), keyTestNotice, testing: providerStep.testing, result: providerStep.result?.message ?? null }), 'key'));
         }
         else if (appState.overlay?.kind === 'provider')
-            overlayNode = overlayOf(providerPickerOverlay({ query: pickerQuery, rows: filteredProviders, selected: pickerSelection.selected, chosen: chosenProvider, reachable: id => providerPickerRef.current?.reachable(id) ?? null }));
+            overlayNode = overlayOf(setupWrap(providerPickerOverlay({ query: pickerQuery, rows: filteredProviders, selected: pickerSelection.selected, chosen: chosenProvider, reachable: id => providerPickerRef.current?.reachable(id) ?? null }), 'provider'));
         else if (appState.overlay?.kind === 'session')
             overlayNode = overlayOf(sessionPickerOverlay({ action: appState.overlay.action, query: pickerQuery, rows: filteredSessions, selected: pickerSelection.selected }));
         const diffPanel = diffView ? overlayOf({ head: [{ text: t('screen.diff.title', { mode: diffView.mode }), tone: 'title' }], sections: [{ lines: diffView.lines.map(line => ({ text: line.text, tone: line.kind === 'file' || line.kind === 'hunk' || line.kind === 'add' || line.kind === 'remove' ? 'strong' : 'dim' })), offset: 0 }] }) : null;
@@ -3751,11 +4085,14 @@ export function createTuiAppComponent(React, Ink, baseCapabilities = { interacti
         const auxNodes = completionPanel ? [completionPanel.element] : auxLines;
         const b = layoutBudget({ ...budgetInput, overlay: overlayNode?.rows ?? null, menu: menuRows || null, diff: diffPanel?.rows ?? null, aux: completionPanel?.rows ?? (auxLines.length || null) });
         /* R5a S9 (review D-14): the header names the folder once; `interactive` said nothing, `degraded` still does. */
-        const headerStatus = boot.phase === 'error' ? t('screen.header.degraded') : '';
+        const agentViewTask = agentView ? (agentView.task ?? t('screen.agentView.unnamed')) : '';
+        const headerStatus = agentView ? t(agentView.done ? 'screen.agentView.done' : 'screen.agentView.watching', { task: agentViewTask }) : boot.phase === 'error' ? t('screen.header.degraded') : '';
         const header = headerLine({ workspace: truncateMiddle(projectRoot, Math.max(1, columns - displayWidth(headerLine({ workspace: '', status: headerStatus })) - 3)), status: headerStatus });
         /* E1/E2: the root is exactly the frame; every region below is a box of the height the budget gave it, in this order,
            so the composer, the status row and the chrome sit at the bottom of the screen (D-03) and nothing overwrites
            anything (D-02). */
-        return h(Ink.Box, { key: `main-${appState.redrawNonce}-${live.id}`, flexDirection: 'column', height: b.frameRows, flexShrink: 0, overflowY: 'hidden' }, h(Regions.Header, { key: 'header', rows: b.header, text: header, color: bootColor }), h(TranscriptView, { key: 'transcript', items: visibleTranscriptItems, scrollRows: viewport.offset, rowBudget: b.transcript, width: columns, raw: transcriptRaw, expandedTools: appState.expandedTools, reasoningVisible: appState.reasoningVisible, now: toolNow, revealId: transcriptRevealId, measurementStore: transcriptMeasurementStore, renderItem: renderTranscriptItem, onPlan: onTranscriptPlan, dimColor: footerColor }), h(Regions.Panels, { key: 'panels', budget: b, diff: diffPanel?.element ?? null, overlay: overlayNode?.element ?? null, aux: auxNodes, menu: menuOpen ? h(CommandMenuView, { composerStore, selectionStore: commandMenuSelectionStore, maxRows: b.menu, columns }) : null }), b.status ? h(Ink.Text, { key: 'status', color: footerColor, dimColor: exitHint, wrap: 'truncate-end' }, statusText) : null, b.composer ? h(ComposerView, { key: 'composer', store: composerStore, vimHint, contentRows: b.composerContent, hintRows: b.composerHints, columns }) : null, h(Regions.StatusBar, { key: 'status-bar', budget: b, shortcutLine, rosterLines, queueLine, reasoningLine, footerLine, statusSegments: statusRow.segments, toneColors: { warn: theme.colors.warning, high: theme.colors.danger, critical: theme.colors.danger }, color: footerColor }));
+        return h(Ink.Box, { key: `main-${appState.redrawNonce}-${live.id}`, flexDirection: 'column', height: b.frameRows, flexShrink: 0, overflowY: 'hidden' }, h(Regions.Header, { key: 'header', rows: b.header, text: header, color: bootColor }), h(TranscriptView, { key: 'transcript', items: visibleTranscriptItems, scrollRows: viewport.offset, rowBudget: b.transcript, width: columns, raw: transcriptRaw, expandedTools: appState.expandedTools, reasoningVisible: appState.reasoningVisible, now: toolNow, revealId: transcriptRevealId, measurementStore: transcriptMeasurementStore, renderItem: renderTranscriptItem, onPlan: onTranscriptPlan, dimColor: footerColor }), h(Regions.Panels, { key: 'panels', budget: b, diff: diffPanel?.element ?? null, overlay: overlayNode?.element ?? null, aux: auxNodes, menu: menuOpen ? h(CommandMenuView, { composerStore, selectionStore: commandMenuSelectionStore, maxRows: b.menu, columns }) : null }), b.status ? h(Ink.Text, { key: 'status', color: footerColor, dimColor: exitHint, wrap: 'truncate-end' }, statusText) : null, b.composer ? (agentView
+            ? h(Ink.Box, { key: 'composer', borderStyle: 'single', flexDirection: 'column', flexShrink: 0, height: 2 + b.composerContent + b.composerHints, overflowY: 'hidden' }, h(Ink.Text, { dimColor: true, wrap: 'truncate-end' }, t('screen.agentView.readOnly')))
+            : h(ComposerView, { key: 'composer', store: composerStore, vimHint, contentRows: b.composerContent, hintRows: b.composerHints, columns })) : null, h(Regions.StatusBar, { key: 'status-bar', budget: b, shortcutLine: agentView ? truncateDisplay(t('screen.agentView.shortcuts'), Math.max(1, columns)) : shortcutLine, rosterLines, queueLine, reasoningLine, footerLine, statusSegments: statusRow.segments, toneColors: { warn: theme.colors.warning, high: theme.colors.danger, critical: theme.colors.danger }, color: footerColor }));
     };
 }