apunkt/rowboat
1
0
Fork 0
mirror of https://github.com/rowboatlabs/rowboat.git synced 2026-04-25 00:16:29 +02:00
Code Issues Projects Releases Packages Wiki Activity Actions

refactor(sidebar): simplify auto-collapse logic and improve sidebar toggle behavior

Browse source
This commit is contained in:
tusharmagar 2026-04-09 20:58:59 +05:30
parent 79a21c715e
commit 1d29ca8886
1 changed files with 3 additions and 18 deletions
Download patch file Download diff file Expand all files Collapse all files

21
apps/x/apps/renderer/src/components/ui/sidebar.tsx
View file

@ -81,33 +81,18 @@ function SidebarProvider({
[setOpenProp, open]
)
// Auto-collapse sidebar when window is too narrow, re-expand when wide enough
const autoCollapsedRef = React.useRef(false)
// Auto-collapse sidebar when window crosses below the threshold
React.useEffect(() => {
const mql = window.matchMedia(`(max-width: ${SIDEBAR_AUTO_COLLAPSE_WIDTH - 1}px)`)
const onChange = () => {
if (mql.matches && open) {
// Window became narrow — auto-collapse
autoCollapsedRef.current = true
setOpen(false)
} else if (!mql.matches && !open && autoCollapsedRef.current) {
// Window became wide again — restore if we auto-collapsed it
autoCollapsedRef.current = false
setOpen(true)
}
}
// Check on mount
if (mql.matches && open) {
autoCollapsedRef.current = true
setOpen(false)
if (mql.matches) setOpen(false)
}
mql.addEventListener("change", onChange)
return () => mql.removeEventListener("change", onChange)
}, [open, setOpen])
}, [setOpen])
// Helper to toggle the sidebar.
const toggleSidebar = React.useCallback(() => {
autoCollapsedRef.current = false // User manually toggled, don't auto-restore
return setOpen((open) => !open)
}, [setOpen])