2025-12-03 17:02:13 +01:00

25 lines
810 B
TypeScript

import Bars3Icon from '@heroicons/react/16/solid/Bars3Icon'
import { useAppState, useSetAppState } from '#components/AppShell/hooks/useAppState'
// Converts leaflet.locatecontrol to a React Component
export const SidebarControl = () => {
const appState = useAppState()
const setAppState = useSetAppState()
const toggleSidebar = () => {
setAppState({ sideBarOpen: !appState.sideBarOpen })
}
return (
<>
<div
className='tw:card tw:justify-center tw:items-center tw:bg-base-100 tw:flex-none tw:shadow-xl tw:px-0 tw:hover:bg-slate-300 tw:hover:cursor-pointer tw:transition-all tw:duration-300 tw:mr-2 tw:h-12 tw:w-12 '
onClick={() => {
toggleSidebar()
}}
>
<Bars3Icon className='tw:inline-block tw:w-5 tw:h-5' />
</div>
</>
)
}