SettingsButton.tsx raw

   1  import { toSettings } from '@/lib/link'
   2  import { usePrimaryPage, useSecondaryPage } from '@/PageManager'
   3  import { useKeyboardNavigation } from '@/providers/KeyboardNavigationProvider'
   4  import { useUserPreferences } from '@/providers/UserPreferencesProvider'
   5  import { Settings } from 'lucide-react'
   6  import SidebarItem from './SidebarItem'
   7  
   8  export default function SettingsButton({ collapse, navIndex }: { collapse: boolean; navIndex?: number }) {
   9    const { current, navigate, display } = usePrimaryPage()
  10    const { push } = useSecondaryPage()
  11    const { enableSingleColumnLayout } = useUserPreferences()
  12    const { clearColumn } = useKeyboardNavigation()
  13  
  14    const handleClick = () => {
  15      if (enableSingleColumnLayout) {
  16        navigate('settings')
  17        clearColumn(1)
  18      } else {
  19        push(toSettings())
  20      }
  21    }
  22  
  23    return (
  24      <SidebarItem
  25        title="Settings"
  26        onClick={handleClick}
  27        collapse={collapse}
  28        active={display && current === 'settings'}
  29        navIndex={navIndex}
  30      >
  31        <Settings />
  32      </SidebarItem>
  33    )
  34  }
  35