Move theme toggle before search, relocate sidebar collapse control - #28
Conversation
…ontrol to sidebar footer
wakqasahmed
left a comment
There was a problem hiding this comment.
Cold-start review — verified against vendored Filament source (vendor/filament/filament), no local repro run.
Render hooks: PanelsRenderHook::GLOBAL_SEARCH_BEFORE (panels::global-search.before) and PanelsRenderHook::SIDEBAR_FOOTER (panels::sidebar.footer) are both real consts in this vendored Filament version (src/View/PanelsRenderHook.php), and SIDEBAR_FOOTER is actually rendered inside livewire/sidebar.blade.php:198. No typo/hallucinated hook risk.
CSS selector: .fi-topbar-collapse-sidebar-btn-ctn matches exactly what Filament's own livewire/topbar.blade.php:46 uses for the desktop collapse button container. Hiding it won't silently no-op — confirmed it's the correct, current class name for this vendored version. Note it only hides the desktop chevron container; the separate mobile hamburger toggle (fi-topbar-open-sidebar-btn / fi-topbar-close-sidebar-btn, lines 15-39) is untouched, which looks intentional per the PR description (only the desktop chevron is being relocated).
New toggle logic: the two buttons in sidebar-collapse-toggle.blade.php use x-show="$store.sidebar.isOpen" (Collapse) and x-show="! $store.sidebar.isOpen" (expand icon) — exact logical opposites, so exactly one is ever visible. This matches Filament's own pattern in topbar.blade.php lines 24/37 and 66/89 (same store, same open()/close() calls). No dead-both-visible or dead-neither-visible state.
Scope: only AdminPanelProvider.php (render hook registration) changed in app/ — no other PHP/behavior changes. Pure Blade/CSS relocation as described.
Minor, non-blocking: the collapsed-state icon button in sidebar-collapse-toggle.blade.php has no aria-label/screen-reader text, unlike Filament's own x-filament::icon-button which always sets a :label. Not a correctness issue, just an a11y gap worth a follow-up if this template gets reused elsewhere.
No blocking issues found. CI (tests) is green.
Two topbar/sidebar UX fixes:
Theme toggle position — moved from `TOPBAR_END` (after the search box) to `GLOBAL_SEARCH_BEFORE`, so it now sits before the search box.
Sidebar collapse control — Filament's built-in collapse/expand chevron is baked into its own topbar template (`fi-topbar-collapse-sidebar-btn-ctn`), appearing next to the logo in the header. Hidden that via CSS and added an equivalent control at the sidebar's own footer (`SIDEBAR_FOOTER` render hook) using the exact same Alpine directives (`$store.sidebar.open()`/`close()`), so it's no longer part of the header at all — it now lives with the sidebar it controls.
Test plan: