Files
tolaria/src/hooks/useViewMode.ts
lucaronin 486c0faa6f feat: collapsible sidebar and note list with ⌥1/2/3 shortcuts
- Add useViewMode hook: manages panel visibility state (editor-only, editor-list, all)
- Persist view mode preference in localStorage
- Add Option+1 (editor only), Option+2 (editor + note list), Option+3 (all panels)
- Add collapse button (CaretLeft icon) in sidebar title bar
- Extract useDialogs hook from App to reduce component size
- Extract SidebarTitleBar component to reduce Sidebar complexity
- Listen for Tauri menu events to support macOS View menu (wired next)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-02-23 08:35:51 +01:00

46 lines
1.5 KiB
TypeScript

import { useState, useCallback, useEffect } from 'react'
import { isTauri } from '../mock-tauri'
export type ViewMode = 'editor-only' | 'editor-list' | 'all'
const STORAGE_KEY = 'laputa-view-mode'
function loadViewMode(): ViewMode {
try {
const stored = localStorage.getItem(STORAGE_KEY)
if (stored === 'editor-only' || stored === 'editor-list' || stored === 'all') return stored
} catch { /* ignore */ }
return 'all'
}
export function useViewMode() {
const [viewMode, setViewModeState] = useState<ViewMode>(loadViewMode)
const setViewMode = useCallback((mode: ViewMode) => {
setViewModeState(mode)
try { localStorage.setItem(STORAGE_KEY, mode) } catch { /* ignore */ }
}, [])
const sidebarVisible = viewMode === 'all'
const noteListVisible = viewMode === 'all' || viewMode === 'editor-list'
// Listen for Tauri menu events
useEffect(() => {
if (!isTauri()) return
let cleanup: (() => void) | undefined
import('@tauri-apps/api/event').then(({ listen }) => {
const unlisten = listen<string>('menu-event', (event) => {
if (event.payload === 'view-editor-only') setViewMode('editor-only')
else if (event.payload === 'view-editor-list') setViewMode('editor-list')
else if (event.payload === 'view-all') setViewMode('all')
})
cleanup = () => { unlisten.then((fn) => fn()) }
}).catch(() => { /* not in Tauri */ })
return () => cleanup?.()
}, [setViewMode])
return { viewMode, setViewMode, sidebarVisible, noteListVisible }
}