Merge branch 'feat/drawer-wide-default-by-viewport' into 'main'

feat(ui): RecordDrawer wide-mode default по viewport

See merge request 2-6/2-6-4/terravault/ordinis!284
This commit is contained in:
Александр Зимин
2026-06-02 11:14:48 +00:00
@@ -55,12 +55,22 @@ import { cn } from '@/lib/utils'
*/ */
const LS_KEY = 'ord-drawer-wide' const LS_KEY = 'ord-drawer-wide'
// Tailwind lg breakpoint = 1024px. Desktop ≥ lg → wide drawer (880px max
// vs 520px). Mobile < lg → narrow чтобы не давить контент. User-toggle
// persists в localStorage и побеждает auto-detection.
const DESKTOP_BREAKPOINT_PX = 1024
/** Hook: persisted boolean (drawer wide mode). */ /** Hook: persisted boolean (drawer wide mode). На первый визит default —
* viewport-aware (desktop wide, mobile collapsed). После toggle'а
* localStorage value побеждает viewport. */
function useDrawerWide(): [boolean, () => void] { function useDrawerWide(): [boolean, () => void] {
const [wide, setWide] = useState<boolean>(() => { const [wide, setWide] = useState<boolean>(() => {
if (typeof window === 'undefined') return false if (typeof window === 'undefined') return false
return window.localStorage.getItem(LS_KEY) === '1' const stored = window.localStorage.getItem(LS_KEY)
if (stored === '1') return true
if (stored === '0') return false
// First visit: viewport-aware. Desktop = wide, mobile = narrow.
return window.innerWidth >= DESKTOP_BREAKPOINT_PX
}) })
const toggle = useCallback(() => { const toggle = useCallback(() => {
setWide((prev) => { setWide((prev) => {