Make console sidebar controls scrollable

Merged
GJ
2mo ago
+47-27

What type of PR is this?

/kind feature

What this PR does / why we need it:

Moves New session, the namespace switcher, console navigation, and the conversation list into one scrollable sidebar region. The Kelos brand and Refresh/Sign out footer remain fixed, allowing long Session lists to use the space currently reserved by the controls after scrolling.

Before                              After
+----------------------+            +----------------------+
| Kelos                | fixed      | Kelos                | fixed
+----------------------+            +----------------------+
| New session          | fixed      | +------------------+ |
| Namespace            | fixed      | | New session      | |
| Overview             | fixed      | | Namespace        | |
| Sessions             | fixed      | | Overview         | | scrolls
| Resources            | fixed      | | Sessions         | |
+----------------------+            | | Resources        | |
| Conversations        | scrolls    | | Conversations    | |
| ...                  |            | | ...              | |
+----------------------+            | +------------------+ |
| Refresh | Sign out   | fixed      | Refresh | Sign out   | fixed
+----------------------+            +----------------------+

Adds a UI structure assertion covering every control expected inside the shared scroll region.

Which issue(s) this PR is related to:

N/A

Special notes for your reviewer:

  • make verify passes.
  • The internal/consoleserver unit tests pass as part of make test.
  • The full make test run has two unrelated failures in internal/controller because the local Codex environment injects config.toml content and does not provide the test skill reference at the expected temporary path.

Does this PR introduce a user-facing change?

Console sidebar controls now scroll with the Session list, leaving more space for conversations while keeping the brand and footer fixed.

Summary by cubic

Makes the console sidebar controls scroll with the Session list so they no longer reserve fixed space. Previously these controls were fixed above the list; now they scroll together, while the brand/header and footer remain fixed. Scrolling the sidebar now dismisses the session actions menu.

  • HTML: Groups New session, namespace switcher, console navigation, and the conversation list inside a .sidebar-scroll container placed before .sidebar-footer.
  • CSS: Adds .sidebar-scroll { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin }, sets .new-session-button to width: 100%, and removes the separate scroller from .session-list (and related .session-sidebar flex rules).
  • JS/TS: Selects sidebarScroll and moves the scroll listener from elements.list to elements.sidebarScroll to close the session actions menu on scroll.
  • Tests: Extends TestSessionUIAdaptsToPhoneViewport to assert the scroll region exists with expected contents, that the .sidebar-scroll CSS rule is present, and that the updated sidebar scroll listener is wired in the compiled JS.