tweak: make the subagent header have clickable nav

This commit is contained in:
Aiden Cline
2026-01-11 22:41:10 -06:00
parent 65724b693b
commit a5b6c57a76

View File

@@ -1,10 +1,11 @@
import { type Accessor, createMemo, Match, Show, Switch } from "solid-js" import { type Accessor, createMemo, createSignal, Match, Show, Switch } from "solid-js"
import { useRouteData } from "@tui/context/route" import { useRouteData } from "@tui/context/route"
import { useSync } from "@tui/context/sync" import { useSync } from "@tui/context/sync"
import { pipe, sumBy } from "remeda" import { pipe, sumBy } from "remeda"
import { useTheme } from "@tui/context/theme" import { useTheme } from "@tui/context/theme"
import { SplitBorder } from "@tui/component/border" import { SplitBorder } from "@tui/component/border"
import type { AssistantMessage, Session } from "@opencode-ai/sdk/v2" import type { AssistantMessage, Session } from "@opencode-ai/sdk/v2"
import { useCommandDialog } from "@tui/component/dialog-command"
import { useKeybind } from "../../context/keybind" import { useKeybind } from "../../context/keybind"
const Title = (props: { session: Accessor<Session> }) => { const Title = (props: { session: Accessor<Session> }) => {
@@ -59,6 +60,8 @@ export function Header() {
const { theme } = useTheme() const { theme } = useTheme()
const keybind = useKeybind() const keybind = useKeybind()
const command = useCommandDialog()
const [hover, setHover] = createSignal<"parent" | "prev" | "next" | null>(null)
return ( return (
<box flexShrink={0}> <box flexShrink={0}>
@@ -79,15 +82,36 @@ export function Header() {
<text fg={theme.text}> <text fg={theme.text}>
<b>Subagent session</b> <b>Subagent session</b>
</text> </text>
<text fg={theme.text}> <box
Parent <span style={{ fg: theme.textMuted }}>{keybind.print("session_parent")}</span> onMouseOver={() => setHover("parent")}
</text> onMouseOut={() => setHover(null)}
<text fg={theme.text}> onMouseUp={() => command.trigger("session.parent")}
Prev <span style={{ fg: theme.textMuted }}>{keybind.print("session_child_cycle_reverse")}</span> backgroundColor={hover() === "parent" ? theme.backgroundElement : theme.backgroundPanel}
</text> >
<text fg={theme.text}> <text fg={theme.text}>
Next <span style={{ fg: theme.textMuted }}>{keybind.print("session_child_cycle")}</span> Parent <span style={{ fg: theme.textMuted }}>{keybind.print("session_parent")}</span>
</text> </text>
</box>
<box
onMouseOver={() => setHover("prev")}
onMouseOut={() => setHover(null)}
onMouseUp={() => command.trigger("session.child.previous")}
backgroundColor={hover() === "prev" ? theme.backgroundElement : theme.backgroundPanel}
>
<text fg={theme.text}>
Prev <span style={{ fg: theme.textMuted }}>{keybind.print("session_child_cycle_reverse")}</span>
</text>
</box>
<box
onMouseOver={() => setHover("next")}
onMouseOut={() => setHover(null)}
onMouseUp={() => command.trigger("session.child.next")}
backgroundColor={hover() === "next" ? theme.backgroundElement : theme.backgroundPanel}
>
<text fg={theme.text}>
Next <span style={{ fg: theme.textMuted }}>{keybind.print("session_child_cycle")}</span>
</text>
</box>
<box flexGrow={1} flexShrink={1} /> <box flexGrow={1} flexShrink={1} />
<ContextInfo context={context} cost={cost} /> <ContextInfo context={context} cost={cost} />
</box> </box>