31 lines
900 B
TypeScript
31 lines
900 B
TypeScript
|
import withHeaderItem from '@/utils/hoc/withHeaderItem'
|
||
|
|
import { useStoreState, useStoreActions } from '@/store'
|
||
|
|
import useResponsive from '@/utils/hooks/useResponsive'
|
||
|
|
import NavToggle from '@/components/shared/NavToggle'
|
||
|
|
import type { CommonProps } from '@/@types/common'
|
||
|
|
|
||
|
|
const _SideNavToggle = ({ className }: CommonProps) => {
|
||
|
|
const sideNavCollapse = useStoreState((state) => state.theme.layout.sideNavCollapse)
|
||
|
|
const { setSideNavCollapse } = useStoreActions((actions) => actions.theme)
|
||
|
|
|
||
|
|
const { larger } = useResponsive()
|
||
|
|
|
||
|
|
const onCollapse = () => {
|
||
|
|
setSideNavCollapse(!sideNavCollapse)
|
||
|
|
}
|
||
|
|
|
||
|
|
return (
|
||
|
|
<>
|
||
|
|
{larger.md && (
|
||
|
|
<div className={className} onClick={onCollapse}>
|
||
|
|
<NavToggle className="text-2xl" toggled={sideNavCollapse} />
|
||
|
|
</div>
|
||
|
|
)}
|
||
|
|
</>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
|
||
|
|
const SideNavToggle = withHeaderItem(_SideNavToggle)
|
||
|
|
|
||
|
|
export default SideNavToggle
|