PR #25220: fix(dashboard): constrain theme picker dropdown height so themes are scrollable (#25213)

• Repository: NousResearch/hermes-agent
• Author: briandevans
• State: open | merged: False
• Link: https://github.com/NousResearch/hermes-agent/pull/25220

Description (problem / solution / changelog)

Summary

• Adds max-h-[70dvh] overflow-y-auto to the ThemeSwitcher listbox so users with many community themes can scroll the dropdown instead of having themes overflow past the viewport.
• Scoped to the component, not a global div[role="listbox"] rule.

The bug

ThemeSwitcher.tsx renders a role="listbox" popup with no max-height or overflow constraint. With 20+ themes installed under ~/.hermes/dashboard-themes/, the list extends past the viewport edge and any theme above or below the visible band is unreachable. Reporter saw 15 of 26 themes visible — every theme alphabetically before "india" was hidden off-screen with no scrollbar.

Sibling header dropdowns already cap themselves:

• LanguageSwitcher.tsx:72 — max-h-80 overflow-y-auto
• SlashPopover.tsx:136 — max-h-64 overflow-y-auto

The theme picker was the only one missing the constraint, so it broke alone when the theme catalog grew.

The fix

One className change on the listbox container:

-            "absolute z-50 min-w-[240px]",
+            "absolute z-50 min-w-[240px] max-h-[70dvh] overflow-y-auto",

70dvh (dynamic viewport height) matches the reporter's tested workaround and behaves correctly on mobile browsers where chrome shrinks/grows (vh would over-allocate when the address bar is hidden).

Scoping to ThemeSwitcher rather than the user's suggested global div[role="listbox"]{...} CSS keeps SlashPopover, LanguageSwitcher, and any future listbox dropdowns on their own height budgets.

Test plan

• npx eslint src/components/ThemeSwitcher.tsx — clean
• npx tsc -p tsconfig.app.json --noEmit — clean
• Visual: with dropUp=false (header use, default), the dropdown is bounded at 70% of viewport height and gets a scrollbar once content exceeds that — themes before "india" become reachable.
• Visual: with dropUp=true (sidebar rail), the same cap applies so the upward-opening menu also stays inside the viewport.
• No test infrastructure under web/ (web/package.json has no test script and no vitest/jest dep), so no unit test added.

Related

• Fixes #25213.
• Same pattern already in web/src/components/LanguageSwitcher.tsx:72 and web/src/components/SlashPopover.tsx:136.

Changed files

• web/src/components/ThemeSwitcher.tsx (modified, +1/-1)