37 lines
1000 B
TypeScript
37 lines
1000 B
TypeScript
import { asideStateAtom } from "@/components/layouts/global/hooks/atoms/sidebar-atom";
|
|
import { useAtom } from "jotai";
|
|
|
|
export const ASIDE_PANEL_ID = "aside-panel";
|
|
|
|
const useToggleAside = () => {
|
|
const [asideState, setAsideState] = useAtom(asideStateAtom);
|
|
|
|
const toggleAside = (tab: string) => {
|
|
if (asideState.tab === tab) {
|
|
setAsideState({ tab, isAsideOpen: !asideState.isAsideOpen });
|
|
} else {
|
|
setAsideState({ tab, isAsideOpen: true });
|
|
}
|
|
};
|
|
|
|
return toggleAside;
|
|
};
|
|
|
|
export const useAsideTriggerProps = (tab: string) => {
|
|
const [asideState, setAsideState] = useAtom(asideStateAtom);
|
|
|
|
return {
|
|
onClick: () => {
|
|
if (asideState.tab === tab) {
|
|
setAsideState({ tab, isAsideOpen: !asideState.isAsideOpen });
|
|
} else {
|
|
setAsideState({ tab, isAsideOpen: true });
|
|
}
|
|
},
|
|
"aria-expanded": asideState.isAsideOpen && asideState.tab === tab,
|
|
"aria-controls": ASIDE_PANEL_ID,
|
|
} as const;
|
|
};
|
|
|
|
export default useToggleAside;
|