Skip to content

feat(shell): fixed panel toggles and back/forward session navigation - #936

Merged
pascalandr merged 2 commits into
devfrom
feat/session-history-nav
Oct 13, 2026
Merged

pascalandr merged 2 commits into
devfrom
feat/session-history-nav

Conversation

@pascalandr

Copy link
Copy Markdown
Contributor

Summary

Fixed panel toggles. Previously, an arrow inside each panel header closed the panel, and a separate button in the conversation header reopened it.

  • Each panel now has a single toggle with a panel icon (PanelLeft/PanelRight, mirrored for RTL).
  • It sits at a fixed outer top corner of the shell, 4 px from the window edge, whether the panel is docked, an overlay or closed.
  • Headers under a toggle reserve its space, so nothing overlaps at any width.
  • The toggles sit outside the drawer containers, so overlays never hide them from assistive technology.
  • They use the shared icon-toggle state with aria-expanded/aria-controls and keep the existing labels. The View-menu panel commands use the same logic.
  • Opening one overlay closes the other. Both toggles hide in mobile fullscreen.

Back/Forward session navigation. The session-list header now holds Previous and Next session buttons, where the close arrow used to be.

  • History is per project tab and per window, kept in memory, at most 50 entries.
  • It records every conversation shown, however it was selected.
  • Back and Forward do not add entries, and a new selection after going back drops the forward stack.
  • Deleted or unavailable conversations are skipped. Info and no-session drafts are not entries.
  • No keyboard shortcuts on purpose: bracket shortcuts only suit QWERTY layouts.

The rounded-corner exception for the old floating open buttons is removed; the toggles are square like other header buttons. At the 220 px minimum sidebar width, the "Sessions" title truncates.

Validation

  • Unit tests for session-navigation-history.
  • New shell-navigation browser suite (5/5):
    • fixed toggle positions and the 4 px edge inset on desktop and phone, LTR and RTL;
    • overlay exclusivity;
    • no overlap down to the 220 px sidebar minimum;
    • history semantics and disabled states.
  • drawer-width 5/5 and header-windows 41/41.
  • Other shell suites pass, except 2 panel-extensions API2 tests that fail identically on unmodified origin/dev.
  • UI typecheck clean.

Oversized files touched: instance-shell2.tsx (~1,334 lines) and styles/panels/session-layout.css (~678 lines). The new toggle styles live in their own file, styles/panels/shell-panel-toggles.css.

An independent gatekeeper review will be published before the admin merge.

Panel open/close moved between places: an arrow inside each panel header
closed it, and a separate button in the conversation header reopened it.
Each panel now has one toggle with a panel icon (PanelLeft/PanelRight,
mirrored for RTL) at a fixed outer top corner of the shell, 4 px from the
window edge, whether the panel is docked, an overlay or closed. Headers under
a toggle reserve its space so nothing overlaps at any width. Toggles live
outside the drawer containers so overlays never hide them from assistive
technology; they use the shared icon-toggle state with aria-expanded and
aria-controls, keep the existing labels, and drive the View-menu commands.
Opening one overlay closes the other, and both hide in mobile fullscreen.

Freed from the close arrow, the session-list header now holds Previous and
Next session buttons. History is per project tab and window, in memory and
bounded to 50 entries; it records every conversation shown however it was
selected, Back/Forward do not add entries, a new selection after going back
drops the forward stack, deleted or unavailable conversations are skipped,
and Info / no-session drafts are not entries. There are deliberately no
keyboard shortcuts (bracket shortcuts only suit QWERTY layouts).

Covered by session-navigation-history unit tests and a new shell-navigation
browser suite (fixed toggle positions and edge inset on desktop and phone in
LTR/RTL, overlay exclusivity, no overlap down to the 220 px sidebar minimum,
history semantics and disabled states); drawer-width, header-windows and the
other shell suites pass, and the UI typecheck is clean.

@pascalandr pascalandr left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Independent gatekeeper pass 1 on 61728df: 2 P2 + 3 P3, merge held. The history logic and modal isolation are fine.

  • P2-1 shell-panel-toggles.css:4-11,23: .session-shell-frame has no stacking context, so the toggles (z 70) paint above body-portaled dialogs, scrims and dragged utility windows (z 50–60). Repro: the rename dialog leaves both toggles undimmed; a dragged search window's Close button is covered by the right toggle. Fix: isolation: isolate on the frame, plus regression tests.
  • P2-2: on coarse pointers the five sidebar header actions plus the toggle reserve need about 272 px. At the 220 px minimum, or at 820 px with both panels docked, "Previous" is clipped, "Next" is hidden and the title collapses. Fix: compact touch targets with zero gap (as in session-toolbar-touch.css), and add a touch-context minimum-width test.
  • P3-1: the labels "Previous/Next session" collide with the existing palette commands and the Ctrl/Cmd+Shift+[ ] hint shown right below them, which cycle the list instead of the history. Fix: history wording (Back/Forward) in 10 locales.
  • P3-2: the fixed top: 27px misaligns the toggles with the adjacent row (about 12 px with the native shortcut-hint row, about 3 px elsewhere). Fix: align with the row each toggle sits beside.
  • P3-3: the right toggle is the last element in tab order. Fix: render it before sessionLayout. Also use a fixed label with aria-expanded to avoid announcing the state twice.

Validation: typecheck clean; history unit tests 7/7; shell, drawer, header, view-menu and tab suites pass; mobile-interruption 23/23 when run alone; mission suites pass. panel-extensions API2 shows 2 failures, which the PR reports as also failing on dev (not re-run on base). Fixes and another pass follow.

…t cover

Address the first independent review of the fixed panel toggles and
back/forward navigation.

- Stacking: `.session-shell-frame` now isolates its stacking context, so the
  corner toggles stay above in-frame floating drawers but below body-portaled
  scrims, dialogs and dragged utility windows (rename dialog, search window
  close button were covered before).
- Strictly fixed toggles: every header action row and both toggles share one
  vertical centre token (`--panel-header-action-center`). The native
  shortcut-hint row moved from the session-list header to a compact footer
  at the bottom of the list panel (the list scrolls above it), so toggles no
  longer shift when panels open or close; per-state measurement is avoided.
- Touch: the session-list header uses compact touch targets with zero gap,
  so all five actions fit the 220 px minimum width on coarse pointers.
- Wording: the history buttons are "Back" / "Forward" with explicit
  tooltips in all 10 locales, distinct from the existing "Previous/Next
  Session" list-cycling commands and their shortcuts.
- Accessibility: toggles render before the shell content in tab order and
  use fixed "Left panel" / "Right panel" labels with aria-expanded only.

Regression tests cover the dialog scrim and a dragged window over the corner,
identical toggle positions (±0.5 px) across all panel states and layouts with
and without the hint row, the hint footer, and the touch 220 px header; each
fails with its fix reverted. shell-navigation 13/13, drawer-width,
drawer-accessibility, header-windows, view-menu, tab-chrome,
mobile-interruption and mission-native-family pass; UI typecheck clean.

@pascalandr pascalandr left a comment

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Independent gatekeeper pass 2 on aa4f31d: ZERO FINDINGS.

All five pass-1 findings are fixed and verified against the running components:

  • Stacking: the shell frame isolates its stacking context; the dragged window's close button receives the click.
  • Touch header: compact touch targets with zero gap; all five actions fit at 220 px, and at 230 px with both panels docked on an 820 px touch window.
  • Wording: Back/Forward wording and tooltips in all 10 locales.
  • Alignment: one shared action-row token. Toggles, the sidebar row, the right-panel gear and the conversation header sides all sit on the 27 px line in RTL at DPR 1.25 and 1.5, with and without the native hint row, which is now a footer.
  • Keyboard: toggles come first in tab order, with fixed labels and aria-expanded.

No regressions found in header density and overflow, long phone titles, footer visibility and scrolling, the right panel or the browser preview.

Validation: typecheck clean; history unit tests 7/7; shell-navigation 13/13; drawer-width 5/5; drawer-accessibility 2/2; header-windows 41/41; view-menu 2/2; tab-chrome 10/10 (+1 Electron-only skip); mobile-interruption 23/23; mission-native-family 11/11.

Proceeding with the requested admin merge.

@pascalandr
pascalandr merged commit 0d70361 into dev Oct 13, 2026
12 of 13 checks passed
@pascalandr
pascalandr deleted the feat/session-history-nav branch October 13, 2026 09:21
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant