fix(ui): align sidebar menu state with visibility

[aliou]

Hello!

Noticed this UI bug while interacting with Hunk from a smaller terminal window:

• by default, the sidebar display state is set to displayed. this is what is used to show the checkbox in the View menu
• however, rendering also checks if the window can display the sidebar based on the width. if not, it doesn't render it
• the issue is that the menu item still says the sidebar is displayed even if it is not actually rendered

This PR makes the checkbox reflect whether the sidebar is actually rendered.

Research + code review session (gpt-5.5): https://pi.dev/session/#bcf0b5045252c82447828797ca8e013c
Implementation session (kimi k2.6): https://pi.dev/session/#758e5740c6f72a5289d28f0643937396
-> Some manual code tweaks were done outside of those two sessions (especially around tests)

Let me know if you need/want more changes!

---

Summary by GPT-5.5:

Summary

• Initialize sidebar visibility from the resolved responsive layout in src/ui/App.tsx instead of always defaulting to visible.
• Pass the effective renderSidebar state into buildAppMenus so the View menu checkmark reflects the sidebar currently rendered on screen.
• Update src/ui/lib/appMenus.ts and src/ui/lib/ui-lib.test.ts to use renderSidebar as the menu state input.
• Add AppHost responsive coverage in src/ui/AppHost.responsive.test.tsx for medium-width terminals where the sidebar is hidden by layout but can still be forced open.

Behavior

On medium-width terminals, the View menu now shows Sidebar unchecked when the sidebar is not visible. Pressing s still opens the hidden sidebar when there is enough room to force it open.

Validation

• bun test src/ui/AppHost.responsive.test.tsx
• bun test src/ui/lib/ui-lib.test.ts
• bun run typecheck

[greptile-apps]

Greptile Summary

This PR fixes a UI bug where the View menu's Sidebar checkbox reflected sidebarVisible state rather than whether the sidebar was actually rendered — on medium-width terminals the sidebar is hidden by the responsive layout even when sidebarVisible is true, so the checkmark was misleading. The fix passes renderSidebar (the computed, layout-aware value) to buildAppMenus instead.

• appMenus.ts / App.tsx (menu): renderSidebar replaces sidebarVisible as the input to buildAppMenus, so the checkbox now correctly reflects on-screen state.
• App.tsx (state init): sidebarVisible is additionally initialised from the responsive layout at mount time — this is unnecessary for the bug fix and introduces a regression where the sidebar no longer auto-shows when the terminal is resized from a narrow/medium viewport to full width.
• AppHost.responsive.test.tsx: New tests cover the menu checkmark and s-shortcut behaviour at width 180, but do not exercise the resize-from-narrow scenario that would catch the regression.

Confidence Score: 3/5

The menu-checkmark fix is correct, but initialising sidebarVisible to false on narrow/medium viewports removes the responsive auto-show behaviour when the terminal is widened.

The half of the change that passes renderSidebar to buildAppMenus correctly fixes the reported bug. The other half — deriving the initial sidebarVisible value from the responsive layout — silently changes a pre-existing behaviour: a user who starts on a narrow terminal and widens it will no longer see the sidebar reappear automatically, because sidebarVisible is now permanently false until they press s. The new tests verify the medium-viewport checkmark and shortcut, but they don't catch this resize scenario.

src/ui/App.tsx lines 112–113 — the sidebarVisible initialisation change should be revisited.

Important Files Changed

Filename	Overview
src/ui/App.tsx	Passes renderSidebar to buildAppMenus (correct fix), but also initializes sidebarVisible from the responsive layout, which breaks auto-show on terminal resize from narrow to full width.
src/ui/lib/appMenus.ts	Renames sidebarVisible to renderSidebar in both the interface and the function; the checkbox now correctly reflects whether the sidebar is actually rendered.
src/ui/AppHost.responsive.test.tsx	Adds two tests for the medium-viewport (width=180) case: one verifying the menu checkmark, one verifying the s shortcut forces the sidebar open. Both tests pass with the current implementation, but they would also pass if sidebarVisible were kept at true — they don't cover the resize regression.
src/ui/lib/ui-lib.test.ts	Test option field renamed from sidebarVisible to renderSidebar to match the updated interface — mechanical update, no logic change.

Flowchart

%%{init: {'theme': 'neutral'}}%%
flowchart TD
    A[terminal.width] --> B[resolveResponsiveLayout\nlayoutMode, width]
    B --> C{responsiveLayout\n.showSidebar}
    D[sidebarVisible state] --> E
    C --> E
    F[forceSidebarOpen state] --> E
    G[canForceShowSidebar] --> E
    E{renderSidebar =\nsidebarVisible &&\nshowSidebar OR forceSidebar} --> H[Sidebar rendered]
    E --> I[View menu checkbox\nchecked: renderSidebar]
    J["toggleSidebar()"] --> D
    J --> F

Loading

Prompt To Fix All With AI

Fix the following 1 code review issue. Work through them one at a time, proposing concise fixes.

---

### Issue 1 of 1
src/ui/App.tsx:112-113
Initializing `sidebarVisible` from the responsive layout at mount time breaks the existing auto-show behavior. With the old `useState(true)`, a user who opens the app on a narrow/medium terminal and later resizes to a full-width terminal (≥ 220 cols) would automatically see the sidebar appear — because `sidebarVisible` stayed `true` and `responsiveLayout.showSidebar` would flip to `true`, making `renderSidebar` true. With this change, `sidebarVisible` is set to `false` on narrow/medium viewports and is never reset on resize, so the sidebar never auto-shows even after widening the terminal.

The reported menu bug is fully fixed just by passing `renderSidebar` to `buildAppMenus` (the other half of this PR). The `sidebarVisible` initial value can stay `true` — the computed `renderSidebar` already accounts for the viewport width.

```suggestion
  const [sidebarVisible, setSidebarVisible] = useState(true);
```

_{Reviews (1): Last reviewed commit: "fix(ui): align sidebar menu state with v..." | Re-trigger Greptile}

[greptile-apps]

Initializing sidebarVisible from the responsive layout at mount time breaks the existing auto-show behavior. With the old useState(true), a user who opens the app on a narrow/medium terminal and later resizes to a full-width terminal (≥ 220 cols) would automatically see the sidebar appear — because sidebarVisible stayed true and responsiveLayout.showSidebar would flip to true, making renderSidebar true. With this change, sidebarVisible is set to false on narrow/medium viewports and is never reset on resize, so the sidebar never auto-shows even after widening the terminal.

The reported menu bug is fully fixed just by passing renderSidebar to buildAppMenus (the other half of this PR). The sidebarVisible initial value can stay true — the computed renderSidebar already accounts for the viewport width.

Suggested change

	const initialResponsiveLayout = resolveResponsiveLayout(bootstrap.initialMode, terminal.width);
	const [sidebarVisible, setSidebarVisible] = useState(initialResponsiveLayout.showSidebar);
	const [sidebarVisible, setSidebarVisible] = useState(true);

Prompt To Fix With AI

This is a comment left during a code review.
Path: src/ui/App.tsx
Line: 112-113

Comment:
Initializing `sidebarVisible` from the responsive layout at mount time breaks the existing auto-show behavior. With the old `useState(true)`, a user who opens the app on a narrow/medium terminal and later resizes to a full-width terminal (≥ 220 cols) would automatically see the sidebar appear — because `sidebarVisible` stayed `true` and `responsiveLayout.showSidebar` would flip to `true`, making `renderSidebar` true. With this change, `sidebarVisible` is set to `false` on narrow/medium viewports and is never reset on resize, so the sidebar never auto-shows even after widening the terminal.

The reported menu bug is fully fixed just by passing `renderSidebar` to `buildAppMenus` (the other half of this PR). The `sidebarVisible` initial value can stay `true` — the computed `renderSidebar` already accounts for the viewport width.

```suggestion
  const [sidebarVisible, setSidebarVisible] = useState(true);
```

How can I resolve this? If you propose a fix, please make it concise.

[benvinegar]

Thanks @aliou!