Skip to content

Commit c24c2e1

Browse files
steevej-2077steevej-2077
committed
fix(app): add terminal toggle to session header
The v1 header had a terminal toggle; the v2 port only carried the review toggle over, and the legacy layout is retired, so no visible affordance remains to open the terminal. Add SessionTerminalToggle next to the review toggle. It triggers the terminal extension's own terminal.toggle command (same as the View menu), reflects the dock region as its pressed state, and reuses the existing terminal icon and desktop.menu.toggleTerminal label.
1 parent d2905b8 commit c24c2e1

2 files changed

Lines changed: 44 additions & 2 deletions

File tree

‎packages/app/src/session/header/session-header-actions.tsx‎

Lines changed: 41 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,47 @@ import { useCommand } from "@/shell/commands/command"
77
import { useLanguage } from "@/runtime/i18n/language"
88
import { useSessionLayout } from "@/session/session-layout"
99

10+
export function SessionTerminalToggle() {
11+
const command = useCommand()
12+
const language = useLanguage()
13+
const { view } = useSessionLayout()
14+
const keybind = command.keybindParts("terminal.toggle")
15+
const label = language.t("desktop.menu.toggleTerminal")
16+
17+
return (
18+
<Tooltip
19+
class="shrink-0"
20+
placement="bottom"
21+
value={
22+
<>
23+
{label}
24+
<Show when={keybind.length > 0}>
25+
<Keybind keys={keybind} variant="neutral" />
26+
</Show>
27+
</>
28+
}
29+
>
30+
<IconButton
31+
type="button"
32+
variant="ghost-muted"
33+
size="large"
34+
class="shrink-0"
35+
style={{
36+
// This fixed control sits above moving panel contents.
37+
"--v2-overlay-simple-overlay-hover": "var(--v2-background-bg-layer-01)",
38+
"--v2-overlay-simple-overlay-pressed": "var(--v2-background-bg-layer-02)",
39+
}}
40+
state={view().dock.opened() ? "pressed" : undefined}
41+
onClick={() => command.trigger("terminal.toggle")}
42+
aria-label={label}
43+
aria-expanded={view().dock.opened()}
44+
aria-controls="terminal-panel"
45+
icon={<Icon name="terminal" />}
46+
/>
47+
</Tooltip>
48+
)
49+
}
50+
1051
export function SessionReviewToggle() {
1152
const command = useCommand()
1253
const language = useLanguage()

‎packages/app/src/session/screen.tsx‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -34,7 +34,7 @@ import { createTimelineSearchController } from "./timeline/search-controller"
3434
import { TimelineSearchBar } from "./timeline/search-bar"
3535
import { ActiveSessionComposerRegion, createActiveSessionRegion } from "./composer/region"
3636
import { SessionIdentityHeader } from "./session-identity-header"
37-
import { SessionReviewToggle } from "./header/session-header-actions"
37+
import { SessionReviewToggle, SessionTerminalToggle } from "./header/session-header-actions"
3838
import { SessionRunningMenu } from "./header/session-running-menu"
3939
import { createAnimatedPresence } from "@/runtime/animated-presence"
4040
import { createTimelineCache } from "./timeline/cache"
@@ -371,12 +371,13 @@ function SessionScreenContent(props: {
371371
{/* Keep the control outside panel animations; a side dock's 52px header includes a 1px divider. */}
372372
<Show when={isDesktop() && messagesReady() && session.identity.params.id}>
373373
<div
374-
class="absolute end-3 top-0 z-30 flex items-center"
374+
class="absolute end-3 top-0 z-30 flex items-center gap-2"
375375
classList={{ "h-[51px]": sideDockVisible(), "h-12": !sideDockVisible() }}
376376
data-slot="session-review-toggle"
377377
onPointerDown={hideTimelineScrollbar}
378378
onClick={hideTimelineScrollbar}
379379
>
380+
<SessionTerminalToggle />
380381
<SessionReviewToggle />
381382
</div>
382383
</Show>

0 commit comments

Comments
 (0)