import { create } from "zustand";
import { persist, createJSONStorage } from "zustand/middleware";
import { produce } from "immer";
type SidebarSettings = { disabled: boolean; isHoverOpen: boolean };
type SidebarStore = {
isOpen: boolean;
isHover: boolean;
settings: SidebarSettings;
toggleOpen: () => void;
setIsOpen: (isOpen: boolean) => void;
setIsHover: (isHover: boolean) => void;
getOpenState: () => boolean;
setSettings: (settings: Partial<SidebarSettings>) => void;
};
export const useSidebar = create(
persist<SidebarStore>(
(set, get) => ({
isOpen: true,
isHover: false,
settings: { disabled: false, isHoverOpen: false },
toggleOpen: () => {
set({ isOpen: !get().isOpen });
},
setIsOpen: (isOpen: boolean) => {
set({ isOpen });
},
setIsHover: (isHover: boolean) => {
set({ isHover });
},
getOpenState: () => {
const state = get();
return state.isOpen || (state.settings.isHoverOpen && state.isHover);
},
setSettings: (settings: Partial<SidebarSettings>) => {
set(
produce((state: SidebarStore) => {
state.settings = { ...state.settings, ...settings };
})
);
}
}),
{
name: "sidebar",
storage: createJSONStorage(() => localStorage)
}
)
);