dsh-code 0.7.0 → 0.9.0

package/src/kernel-panels.ts

@@ -2,14 +2,17 @@
 
 import { createElement, useEffect, useMemo, useRef, useState, type ReactElement } from 'react'
 import { Box, Text, useInput, useStdout } from 'ink'
-import type { ModelRow } from './models.ts'
+import type { ModelDirectory, ModelRow } from './models.ts'
+import type { SubagentRow } from './subagents.ts'
+import type { PermissionRow } from './permissions.ts'
 import type { PresetRow } from './presets.ts'
 import type { PluginRow } from './plugin-inventory.ts'
 import type { SessionDirectoryOptions, SessionRow } from './session-directory.ts'
+import { formatRelativeTime } from './session-directory.ts'
 import { panelViewport, revealRow } from './render/inspector.ts'
 import { textLines } from './render/lines.ts'
 import { DEFAULT_STATUSLINE_ITEMS, STATUS_ITEMS, type StatusItemId } from './render/status.ts'
-import { displayText, singleLineText, truncateColumns } from './render/text.ts'
+import { singleLineText, truncateColumns } from './render/text.ts'
 import { getPalette, inkColor } from './theme.ts'
 
 interface ListFrameProps {
@@ -19,15 +22,32 @@ interface ListFrameProps {
   readonly loading: boolean
   readonly error?: string
   readonly query: string
+  /** Ctrl+F-gated search focus for this panel: typing edits the query only
+   * while true. `undefined` keeps the plain "type to filter" prompt (the
+   * panel filters by typing directly). */
+  readonly searching?: boolean
   readonly footer: string
 }
 
+/** True for the Ctrl+F search-focus toggle. */
+function isSearchToggle(input: string, key: { ctrl?: boolean }): boolean {
+  return key.ctrl === true && input === 'f'
+}
+
+/** The search-state line: gated panels show only an ACTIVE filter (the ctrl+f
+ * toggle lives in the footer), direct-typing panels keep the plain prompt. */
+function searchLine(searching: boolean | undefined, query: string): string {
+  if (searching === true) return `search: ${query === '' ? 'type to filter · esc stops' : query}`
+  if (searching === false) return query === '' ? '' : `search: ${query}`
+  return `search: ${query === '' ? 'type to filter' : query}`
+}
+
 function ListFrame(props: ListFrameProps): ReactElement {
   const stdout = useStdout().stdout
   const viewport = panelViewport(stdout?.columns ?? 80, stdout?.rows ?? 30)
   if (viewport.maxHeight === 0) return createElement(Box, { display: 'none' })
   if (viewport.compact) {
-    return createElement(Text, { wrap: 'truncate-end' }, truncateColumns(`${props.title} · esc close`, viewport.contentColumns))
+    return createElement(Text, { wrap: 'truncate-end' }, truncateColumns(singleLineText(`${props.title} · esc close`), viewport.contentColumns))
   }
   const stateRows = props.loading
     ? [{ key: 'loading', text: '  loading…' }]
@@ -42,8 +62,8 @@ function ListFrame(props: ListFrameProps): ReactElement {
   return createElement(
     Box,
     { width: viewport.outerColumns, borderStyle: 'round', borderColor: inkColor(getPalette().dim), flexDirection: 'column', paddingX: 1 },
-    createElement(Text, { color: inkColor(getPalette().brandBright), wrap: 'truncate-end' }, truncateColumns(props.title, viewport.contentColumns)),
-    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(`search: ${props.query === '' ? 'type to filter' : props.query}`, viewport.contentColumns)),
+    createElement(Text, { color: inkColor(getPalette().brandBright), wrap: 'truncate-end' }, truncateColumns(singleLineText(props.title), viewport.contentColumns)),
+    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(singleLineText(searchLine(props.searching, props.query)), viewport.contentColumns)),
     ...visible.map((row, index) => {
       const absolute = offset + index
       const selected = !props.loading && props.error === undefined && props.rows.length > 0 && absolute === props.cursor
@@ -52,9 +72,9 @@ function ListFrame(props: ListFrameProps): ReactElement {
         color: selected ? inkColor(getPalette().brandBright) : row.disabled ? inkColor(getPalette().dim) : undefined,
         dimColor: row.disabled,
         wrap: 'truncate-end',
-      }, truncateColumns(`${selected ? '› ' : '  '}${row.text}`, viewport.contentColumns))
+      }, truncateColumns(`${selected ? '› ' : '  '}${singleLineText(row.text)}`, viewport.contentColumns))
     }),
-    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(props.footer, viewport.contentColumns)),
+    createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(singleLineText(props.footer), viewport.contentColumns)),
   )
 }
 
@@ -100,6 +120,42 @@ export function ModePanel({ current, load, select, close }: {
   })
 }
 
+export function PermissionPanel({ current, load, select, close }: {
+  current: string
+  load(): Promise<readonly PermissionRow[]>
+  select(id: string): void
+  close(): void
+}): ReactElement {
+  const [rows, setRows] = useState<readonly PermissionRow[]>([])
+  const [query, setQuery] = useState('')
+  const [cursor, setCursor] = useState(0)
+  const [loading, setLoading] = useState(true)
+  const [error, setError] = useState<string>()
+  const refresh = (): void => {
+    setLoading(true); setError(undefined)
+    Promise.resolve().then(load).then(value => { setRows(value); setLoading(false) }, reason => {
+      setError(reason instanceof Error ? reason.message : String(reason)); setLoading(false)
+    })
+  }
+  useEffect(refresh, [])
+  const visible = useMemo(() => rows.filter(row => `${row.id} ${row.description ?? ''}`.toLowerCase().includes(query.toLowerCase())), [rows, query])
+  useEffect(() => setCursor(value => Math.min(value, Math.max(0, visible.length - 1))), [visible.length])
+  useInput((input, key) => {
+    if (key.escape || input === 'q') return close()
+    if (input === 'r' && query === '') return refresh()
+    if (key.upArrow) return setCursor(value => visible.length === 0 ? 0 : (value + visible.length - 1) % visible.length)
+    if (key.downArrow) return setCursor(value => visible.length === 0 ? 0 : (value + 1) % visible.length)
+    if (key.return && visible[cursor] !== undefined) return select(visible[cursor]!.id)
+    const next = editQuery(query, input, key)
+    if (next !== undefined) { setQuery(next); setCursor(0) }
+  })
+  return createElement(ListFrame, {
+    title: `/permission · current ${current}`,
+    rows: visible.map(row => ({ key: row.id, text: `${row.id === current ? '●' : '○'} ${row.id}${row.description === undefined ? '' : ` · ${row.description}`}` })),
+    cursor, loading, error, query, footer: '↑↓ choose · enter select · r refresh · esc close',
+  })
+}
+
 export function PluginPanel({ load, close, initialQuery = '' }: { load(): readonly PluginRow[]; close(): void; initialQuery?: string }): ReactElement {
   const [epoch, setEpoch] = useState(0)
   const [query, setQuery] = useState(initialQuery)
@@ -126,14 +182,25 @@ export function PluginPanel({ load, close, initialQuery = '' }: { load(): readon
   })
 }
 
-export function ResumePanel({ currentCwd, load, readTranscript, select, close }: {
+export function ResumePanel({ currentCwd, load, readTranscript, select, requestDelete, deleteConfirmId, reloadToken = 0, deleteMode = false, close }: {
   currentCwd: string
   load(options: SessionDirectoryOptions, signal?: AbortSignal): Promise<readonly SessionRow[]>
   readTranscript(id: string, signal?: AbortSignal): Promise<string>
   select(row: SessionRow): void
+  /** Arm the composer-based delete confirm for one row (App owns the keys). */
+  requestDelete?(row: SessionRow): void
+  /** The row id awaiting y/n in the composer, when any (App-owned). */
+  deleteConfirmId?: string
+  /** Bump to reload the listing (e.g. after a deletion). */
+  reloadToken?: number
+  /** Opened via /delete: hint-first delete mode. */
+  deleteMode?: boolean
   close(): void
 }): ReactElement {
-  const [options, setOptions] = useState<SessionDirectoryOptions>({ sessions: 'roots', cwd: 'all', sort: 'newest', currentCwd, query: '' })
+  // Codex resume-picker default: the CURRENT directory's root sessions; the
+  // cwd filter widens to all only on request (the old default leaked every
+  // directory's sessions into what read as a current-directory view).
+  const [options, setOptions] = useState<SessionDirectoryOptions>({ sessions: 'roots', cwd: 'current', sort: 'newest', currentCwd, query: '' })
   const [focus, setFocus] = useState(0)
   const [density, setDensity] = useState<'comfortable' | 'dense'>('comfortable')
   const [rows, setRows] = useState<readonly SessionRow[]>([])
@@ -142,6 +209,10 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
   const [error, setError] = useState<string>()
   const [expanded, setExpanded] = useState<string>()
   const [transcript, setTranscript] = useState<{ id: string; text?: string; error?: string }>()
+  /** Ctrl+F-gated search: typing filters only while searching (codex). */
+  const [searching, setSearching] = useState(false)
+  /** Reference clock pinned per row render, so relative times never drift mid-list. */
+  const now = useMemo(() => Date.now(), [rows, options])
   const transcriptLoad = useRef<AbortController>()
   useEffect(() => () => transcriptLoad.current?.abort(), [])
   useEffect(() => {
@@ -153,7 +224,7 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
       if (!controller.signal.aborted) { setError(reason instanceof Error ? reason.message : String(reason)); setLoading(false) }
     })
     return () => controller.abort()
-  }, [options])
+  }, [options, reloadToken])
   useEffect(() => setCursor(value => Math.min(value, Math.max(0, rows.length - 1))), [rows.length])
   const cycle = (): void => {
     if (focus === 3) {
@@ -167,7 +238,21 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
     })
   }
   useInput((input, key) => {
-    if (key.escape || input === 'q') return close()
+    // While a deletion awaits y/n, the COMPOSER owns every key (App routes
+    // them); the panel yields so y/n cannot be handled twice.
+    if (deleteConfirmId !== undefined) return
+    if (key.escape) {
+      if (searching) { setSearching(false); return }
+      return close()
+    }
+    if (isSearchToggle(input, key)) { setSearching(current => !current); return }
+    if (searching) {
+      if (key.return) { setSearching(false); return }
+      const next = editQuery(options.query, input, key)
+      if (next !== undefined) { setOptions(value => ({ ...value, query: next })); setCursor(0) }
+      return
+    }
+    if (input === 'q') return close()
     if (key.tab) return setFocus(value => (value + (key.shift ? 3 : 1)) % 4)
     if (key.leftArrow) return cycle()
     if (key.rightArrow) return cycle()
@@ -177,7 +262,7 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
     if (key.pageDown) return setCursor(value => Math.min(rows.length - 1, value + 8))
     if (input === 'g') return setCursor(0)
     if (input === 'G') return setCursor(Math.max(0, rows.length - 1))
-    if (input === 'd') return setDensity(value => value === 'comfortable' ? 'dense' : 'comfortable')
+    if (input === 'd' && rows[cursor] !== undefined && requestDelete !== undefined) return requestDelete(rows[cursor]!)
     if (input === 'e' && rows[cursor] !== undefined) {
       return setExpanded(value => value === rows[cursor]!.id ? undefined : rows[cursor]!.id)
     }
@@ -194,8 +279,6 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
       return
     }
     if (key.return && rows[cursor]?.resumable === true) return select(rows[cursor]!)
-    const next = editQuery(options.query, input, key)
-    if (next !== undefined) { setOptions(value => ({ ...value, query: next })); setCursor(0) }
   }, { isActive: transcript === undefined })
   if (transcript !== undefined) {
     return createElement(DocumentPanel, {
@@ -205,15 +288,18 @@ export function ResumePanel({ currentCwd, load, readTranscript, select, close }:
       close: () => { transcriptLoad.current?.abort(); setTranscript(undefined) },
     })
   }
+  const pendingRow = deleteConfirmId === undefined ? undefined : rows.find(row => row.id === deleteConfirmId)
   const toolbar = `[${focus === 0 ? '>' : ''}${options.sessions}] [${focus === 1 ? '>' : ''}${options.cwd} cwd] [${focus === 2 ? '>' : ''}${options.sort}] [${focus === 3 ? '>' : ''}${density}]`
   return createElement(ListFrame, {
-    title: `/resume · ${toolbar}`,
+    title: deleteConfirmId === undefined
+      ? `/resume${deleteMode ? ' — delete mode' : ''}${searching ? ' — searching' : ''} · ${toolbar}`
+      : `permanently delete ${pendingRow === undefined ? deleteConfirmId.slice(-12) : pendingRow.title ?? pendingRow.id}? this cannot be undone · subagent threads go too`,
     rows: rows.map(row => ({
       key: row.id,
       disabled: !row.resumable,
-      text: `${row.subagent ? '↳' : '○'} ${row.title ?? row.id.slice(-12)}${density === 'comfortable' ? ` · ${row.workspace} · ${row.preset}` : ''}${row.live ? ' · live' : ''}${expanded === row.id ? ` · ${row.id} · ${row.cwd}${row.parent === undefined ? '' : ` · parent ${row.parent}`}` : ''}`,
-    })), cursor, loading, error, query: options.query,
-    footer: 'type search · tab/←→ filters · ↑↓/pg navigate · e details · t transcript · enter resume',
+      text: `${row.subagent ? '↳' : '○'} ${row.title ?? row.id.slice(-12)}${density === 'comfortable' ? ` · ${formatRelativeTime(row.updatedAt ?? row.createdAt, now)} · ${row.workspace} · ${row.preset}` : ''}${row.live ? ' · live' : ''}${expanded === row.id ? ` · ${row.id} · ${row.cwd}${row.parent === undefined ? '' : ` · parent ${row.parent}`}` : ''}`,
+    })), cursor, loading, error, query: options.query, searching,
+    footer: 'tab/←→ filters · ↑↓/pg navigate · ctrl+f search · e details · t transcript · d delete · enter resume',
   })
 }
 
@@ -245,7 +331,7 @@ function DocumentPanel({ title, text, error, close }: {
   return createElement(
     Box,
     { width: viewport.outerColumns, borderStyle: 'round', borderColor: inkColor(getPalette().dim), flexDirection: 'column', paddingX: 1 },
-    createElement(Text, { color: inkColor(getPalette().brandBright), wrap: 'truncate-end' }, truncateColumns(title, viewport.contentColumns)),
+    createElement(Text, { color: inkColor(getPalette().brandBright), wrap: 'truncate-end' }, truncateColumns(singleLineText(title), viewport.contentColumns)),
     ...body.map((line, index) => createElement(Text, { key: `${scroll}-${index}`, wrap: 'truncate-end' }, truncateColumns(line, viewport.contentColumns))),
     createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns(`lines ${lines.length === 0 ? 0 : scroll + 1}-${Math.min(lines.length, scroll + viewport.bodyRows)}/${lines.length} · ↑↓/pg/g/G · t/esc close`, viewport.contentColumns)),
   )
@@ -319,7 +405,7 @@ export function HistoryPanel({ entries, fill, close }: {
             color: selected ? inkColor(getPalette().brandBright) : undefined,
             wrap: 'truncate-end',
           },
-          truncateColumns((selected ? '› ' : '  ') + displayText(entry), viewport.contentColumns),
+          truncateColumns((selected ? '› ' : '  ') + singleLineText(entry), viewport.contentColumns),
         )
       })),
     createElement(Text, { dimColor: true, wrap: 'truncate-end' }, truncateColumns('↑↓ move · g/G ends · enter fill · esc close', viewport.contentColumns)),
@@ -418,12 +504,15 @@ export function StatuslinePanel({ enabled, change, close }: {
 /**
  * The `/model` reasoning-effort stage (the Codex model → reasoning popup
  * contract): one bounded list over the selected model's adapter-advertised
- * effort levels, with the effective effort and the model default marked.
- * A model WITHOUT an adapter-declared default leads with a "Default"
- * (provider-default) row — the web effort pane's first entry — so the user
- * can clear a picked level back to provider behavior instead of being forced
- * to choose an advertised one. Enter applies one level; Esc returns to the
- * model list without applying.
+ * effort levels — in the adapter's own display order, ids verbatim (the
+ * kernel treats them as opaque and rejects anything else) — with the
+ * effective effort and the model default marked. A model WITHOUT an
+ * adapter-declared default leads with a "Default" (provider-default) row —
+ * the web effort pane's first entry — so the user can clear a picked level
+ * back to provider behavior. A model advertising no levels opens the same
+ * stage with an explicit empty state (the web pane's "no levels" copy)
+ * instead of a bare failure notice. Enter applies one level; Esc returns to
+ * the model list without applying.
  */
 export function EffortPanel({ row, current, select, back }: {
   /** The model row whose advertised levels this stage lists. */
@@ -435,16 +524,23 @@ export function EffortPanel({ row, current, select, back }: {
   /** Return to the model list without applying. */
   back(): void
 }): ReactElement {
-  const [cursor, setCursor] = useState(0)
-  const efforts = row.reasoning?.efforts ?? []
+  const advertised = row.reasoning?.efforts ?? []
+  const empty = row.reasoning === undefined || advertised.length === 0
   // The provider-default row only exists when the adapter declares no default
   // effort: with one, the default is an advertised level already in the list.
   const hasDefaultRow = row.reasoning !== undefined && row.reasoning.defaultEffort === undefined
-  const rows = hasDefaultRow
-    ? [{ id: '', name: 'Default' }, ...efforts]
-    : efforts
+  const rows = empty
+    ? [{ id: '', name: '' }]
+    : hasDefaultRow
+      ? [{ id: '', name: 'Default' }, ...advertised]
+      : advertised
   // An absent or cleared effort is the Default row's current state.
   const effective = current === undefined || current === '' ? '' : current
+  // The list opens ON the effective level (or the model's default row), so a
+  // quick re-pick never restarts the cursor from the top.
+  const wanted = effective === '' ? row.reasoning?.defaultEffort ?? '' : effective
+  const initialCursor = Math.max(0, rows.findIndex(effort => effort.id === wanted))
+  const [cursor, setCursor] = useState(initialCursor)
   useEffect(() => {
     if (rows.length === 0) {
       if (cursor !== 0) setCursor(0)
@@ -454,7 +550,15 @@ export function EffortPanel({ row, current, select, back }: {
   }, [rows.length, cursor])
   useInput((input, key) => {
     if (key.escape || input === 'q') return back()
-    if (rows.length === 0) return
+    if (empty) return
+    if (input === 'g') {
+      setCursor(0)
+      return
+    }
+    if (input === 'G') {
+      setCursor(rows.length - 1)
+      return
+    }
     if (key.upArrow) {
       setCursor(cursor > 0 ? cursor - 1 : rows.length - 1)
       return
@@ -469,13 +573,226 @@ export function EffortPanel({ row, current, select, back }: {
   })
   return createElement(ListFrame, {
     title: `/model — effort for ${row.providerName} · ${row.modelName}`,
-    rows: rows.map(effort => ({
-      key: effort.id,
-      text: `${effort.id === effective ? '●' : '○'} ${effort.name}${effort.id === row.reasoning?.defaultEffort ? ' · default' : ''}${effort.description === undefined ? '' : ` · ${effort.description}`}`,
-    })),
+    rows: empty
+      ? [{ key: 'empty', disabled: true, text: 'this model advertises no reasoning effort levels — the provider default applies' }]
+      : rows.map(effort => ({
+        key: effort.id,
+        text: `${effort.id === effective ? '●' : '○'} ${effort.name}${effort.id === row.reasoning?.defaultEffort ? ' · default' : ''}${effort.description === undefined ? '' : ` · ${effort.description}`}`,
+      })),
     cursor,
     loading: false,
     query: '',
-    footer: '↑↓ choose · enter apply · esc/q back',
+    footer: empty ? 'esc back' : '↑↓ choose · enter apply · esc/q back',
+  })
+}
+
+/** One merged /agents row: live feed state or a persisted child session. */
+interface AgentsEntry {
+  readonly id: string
+  readonly label: string
+  readonly activity: string
+  readonly running: boolean
+  readonly done: boolean
+  readonly live: boolean
+}
+
+/**
+ * The /agents panel (the Codex agent-picker contract, read-only): this
+ * conversation's subagent conversations — live rows from the activity feed
+ * first, persisted children the feed has not seen this process after — with
+ * Enter/t opening the child's full transcript in the shared read-only
+ * document view (the same projection the exporter uses).
+ */
+export function AgentsPanel({ live, load, readTranscript, close }: {
+  /** Live feed rows (child sessions observed this process). */
+  live: readonly SubagentRow[]
+  /** Load this session's persisted child sessions by lineage. */
+  load(): Promise<readonly SessionRow[]>
+  /** Read one child session's full transcript as markdown. */
+  readTranscript(id: string, signal?: AbortSignal): Promise<string>
+  close(): void
+}): ReactElement {
+  const [dirRows, setDirRows] = useState<readonly SessionRow[] | undefined>(undefined)
+  const [error, setError] = useState<string>()
+  const [loading, setLoading] = useState(true)
+  const [cursor, setCursor] = useState(0)
+  const [transcript, setTranscript] = useState<{ id: string; text?: string; error?: string }>()
+  const transcriptLoad = useRef<AbortController>()
+  useEffect(() => () => transcriptLoad.current?.abort(), [])
+  const refresh = (): void => {
+    setLoading(true)
+    setError(undefined)
+    Promise.resolve().then(load).then(value => {
+      setDirRows(value)
+      setLoading(false)
+    }, reason => {
+      setError(reason instanceof Error ? reason.message : String(reason))
+      setLoading(false)
+    })
+  }
+  useEffect(refresh, [])
+  // Live feed rows first (they carry the running state), then persisted
+  // children only the directory knows — settled subagents from earlier turns.
+  const rows = useMemo<readonly AgentsEntry[]>(() => {
+    const seen = new Set(live.map(row => row.id))
+    const feedRows: AgentsEntry[] = live.map(row => ({
+      id: row.id,
+      label: row.label,
+      activity: row.activity,
+      running: row.state === 'running',
+      done: row.state === 'done',
+      live: true,
+    }))
+    const persisted: AgentsEntry[] = (dirRows ?? [])
+      .filter(row => !seen.has(row.id))
+      .map(row => ({
+        id: row.id,
+        label: row.title ?? row.id.slice(-12),
+        activity: row.workspace,
+        running: false,
+        done: !row.live,
+        live: row.live,
+      }))
+    return [...feedRows, ...persisted]
+  }, [live, dirRows])
+  useEffect(() => setCursor(value => Math.min(value, Math.max(0, rows.length - 1))), [rows.length])
+  const openTranscript = (): void => {
+    const row = rows[cursor]
+    if (row === undefined) return
+    transcriptLoad.current?.abort()
+    setTranscript({ id: row.id })
+    const controller = new AbortController()
+    transcriptLoad.current = controller
+    Promise.resolve().then(() => readTranscript(row.id, controller.signal)).then(
+      text => {
+        if (!controller.signal.aborted) setTranscript({ id: row.id, text })
+      },
+      reason => {
+        if (!controller.signal.aborted) setTranscript({ id: row.id, error: reason instanceof Error ? reason.message : String(reason) })
+      },
+    )
+  }
+  useInput((input, key) => {
+    if (key.escape || input === 'q') return close()
+    if (input === 'r') return refresh()
+    if (key.upArrow) return setCursor(value => rows.length === 0 ? 0 : (value + rows.length - 1) % rows.length)
+    if (key.downArrow) return setCursor(value => rows.length === 0 ? 0 : (value + 1) % rows.length)
+    if ((key.return || input === 't') && rows[cursor] !== undefined) return openTranscript()
+  }, { isActive: transcript === undefined })
+  if (transcript !== undefined) {
+    return createElement(DocumentPanel, {
+      title: `subagent · ${transcript.id.slice(-12)}`,
+      text: transcript.text,
+      error: transcript.error,
+      close: () => {
+        transcriptLoad.current?.abort()
+        setTranscript(undefined)
+      },
+    })
+  }
+  return createElement(ListFrame, {
+    title: `/agents · ${live.length} live · ${rows.length} total`,
+    rows: rows.map(row => ({
+      key: row.id,
+      text: `${row.running ? '●' : row.done ? '✓' : row.live ? '⏸' : '○'} ${row.label} · ${row.activity}${row.live ? ' · live' : ''}`,
+    })),
+    cursor,
+    loading,
+    ...error === undefined ? {} : { error },
+    query: '',
+    footer: '↑↓ choose · enter/t transcript · r refresh · esc close',
+  })
+}
+
+/**
+ * The /subagent model panel: which model configuration delegated subagents
+ * run on. The kernel seeds child agents from the parent's CREATE-TIME
+ * AgentOptions, so a mid-session /model switch would otherwise leave them on
+ * the launch-time route; the TUI mirrors the selection onto subagent-origin
+ * requests (or an explicit override picked here) via an agent/request
+ * listener. The leading "inherit" row restores follow-the-current-model
+ * behavior; picking a model with several advertised efforts opens the same
+ * effort stage /model uses. Effort overrides are not offered separately —
+ * the kernel's AgentOptions has no effort channel for children, so the level
+ * rides the selected model exactly as /model applies it.
+ */
+export function SubagentPanel({ current, load, pick, inherit, close }: {
+  /** Display label of the override in force, '' when following the current model. */
+  current: string
+  load(): Promise<ModelDirectory>
+  /** Apply one model (with an advertised effort, when picked) as the override. */
+  pick(row: ModelRow, effortId?: string): void
+  /** Drop the override: subagents follow the current model again. */
+  inherit(): void
+  close(): void
+}): ReactElement {
+  const [directory, setDirectory] = useState<ModelDirectory | undefined>(undefined)
+  const [error, setError] = useState<string>()
+  const [loading, setLoading] = useState(true)
+  const [cursor, setCursor] = useState(0)
+  const [effortFor, setEffortFor] = useState<ModelRow | undefined>(undefined)
+  const refresh = (): void => {
+    setLoading(true)
+    setError(undefined)
+    Promise.resolve().then(load).then(value => {
+      setDirectory(value)
+      setLoading(false)
+    }, reason => {
+      setError(reason instanceof Error ? reason.message : String(reason))
+      setLoading(false)
+    })
+  }
+  useEffect(refresh, [])
+  const rows = useMemo(() => directory?.rows ?? [], [directory])
+  // The list opens on the override's own row (index 0 is the inherit row).
+  useEffect(() => {
+    if (current === '' || rows.length === 0) return
+    const index = rows.findIndex(row => current.startsWith(`${row.provider}/${row.model}`))
+    if (index >= 0) setCursor(index + 1)
+  }, [rows, current])
+  useEffect(() => setCursor(value => Math.min(value, rows.length)), [rows.length])
+  // Hooks stay unconditional: the effort stage below swaps the rendered
+  // subtree but must never skip the input hook (an early return here would
+  // change the hook count when the stage opens and closes).
+  useInput((input, key) => {
+    if (effortFor !== undefined) return
+    if (key.escape || input === 'q') return close()
+    if (input === 'r' && !loading) return refresh()
+    if (key.upArrow) return setCursor(value => (value + rows.length) % (rows.length + 1))
+    if (key.downArrow) return setCursor(value => (value + 1) % (rows.length + 1))
+    if (key.return) {
+      if (cursor === 0) return inherit()
+      const row = rows[cursor - 1]
+      if (row === undefined) return
+      if (row.reasoning !== undefined && row.reasoning.efforts.length > 1) {
+        setEffortFor(row)
+        return
+      }
+      const effortId = row.reasoning?.efforts.length === 1 ? row.reasoning.efforts[0]!.id : undefined
+      pick(row, effortId)
+    }
+  })
+  if (effortFor !== undefined) {
+    return createElement(EffortPanel, {
+      row: effortFor,
+      current: current === '' ? undefined : current.split('@')[1],
+      select: effortId => pick(effortFor, effortId),
+      back: () => setEffortFor(undefined),
+    })
+  }
+  return createElement(ListFrame, {
+    title: `/subagent — model for delegated agents${current === '' ? '' : ` · override ${current}`}`,
+    rows: [
+      { key: '__inherit__', text: `${current === '' ? '●' : '○'} inherit — follow the current model (/model switches apply)` },
+      ...rows.map(row => ({
+        key: `${row.provider}/${row.model}`,
+        text: `${current.startsWith(`${row.provider}/${row.model}`) ? '●' : '○'} ${row.providerName} · ${row.modelName}`,
+      })),
+    ],
+    cursor,
+    loading,
+    ...error === undefined ? {} : { error },
+    query: '',
+    footer: '↑↓ choose · enter apply · r refresh · esc close',
   })
 }

package/src/models.ts

@@ -12,6 +12,7 @@ import type { Context } from '@deepseek-ai/cordis'
 import type { ModelSelection } from '@deepseek-ai/dsh-agent'
 import {
   ReasoningEffortId,
+  type LlmCallConfig,
   type LlmModelInfo,
   type LlmModelReasoningInfo,
   type LlmResolvedModelInfo,
@@ -138,6 +139,31 @@ export function modelSelectionLabel(selection: ModelSelection): string {
     : `${selection.provider}/${selection.model}@${selection.reasoningEffort}`
 }
 
+/**
+ * Apply one model selection onto a resolved request config — the exact
+ * semantics of the kernel's `installModelSelection` request listener,
+ * extracted so the TUI can mirror it for subagent-origin requests: children
+ * spawned by the subagent tool inherit the parent's CREATE-TIME AgentOptions,
+ * which a mid-session /model switch never touches, so delegated work would
+ * otherwise keep running on the launch-time route. An absent effort strips
+ * any inherited effort (restoring the selected model's provider default),
+ * matching the kernel listener field-for-field.
+ * @param resolved - the config the inner chain produced.
+ * @param selection - the selection to enforce.
+ * @returns the overridden config.
+ */
+export function applyModelSelectionToConfig(resolved: LlmCallConfig, selection: ModelSelection): LlmCallConfig {
+  const { reasoningEffort: _inheritedEffort, ...withoutInheritedEffort } = resolved
+  return {
+    ...withoutInheritedEffort,
+    provider: selection.provider,
+    model: selection.model,
+    ...selection.reasoningEffort === undefined
+      ? {}
+      : { reasoningEffort: selection.reasoningEffort },
+  }
+}
+
 /**
  * Load the selectable model directory from the live `ctx.llm` registry.
  * Providers are listed synchronously; each provider's models are discovered