diff --git a/src/pages/_app.tsx b/src/pages/_app.tsx index 43dc219d..bdfc41d9 100644 --- a/src/pages/_app.tsx +++ b/src/pages/_app.tsx @@ -8,9 +8,11 @@ import "primeicons/primeicons.css"; import {useRouter} from "next/router"; import {useEffect} from "react"; import useExamStore from "@/stores/examStore"; +import usePreferencesStore from "@/stores/preferencesStore"; export default function App({Component, pageProps}: AppProps) { const reset = useExamStore((state) => state.reset); + const setIsSidebarMinimized = usePreferencesStore((state) => state.setSidebarMinimized); const router = useRouter(); @@ -18,5 +20,15 @@ export default function App({Component, pageProps}: AppProps) { if (router.pathname !== "/exercises") reset(); }, [router.pathname, reset]); + useEffect(() => { + if (localStorage.getItem("isSidebarMinimized")) { + if (localStorage.getItem("isSidebarMinimized") === "true") { + setIsSidebarMinimized(true); + } else { + setIsSidebarMinimized(false); + } + } + }, [setIsSidebarMinimized]); + return ; } diff --git a/src/stores/preferencesStore.ts b/src/stores/preferencesStore.ts index 9150be0b..077a1b1e 100644 --- a/src/stores/preferencesStore.ts +++ b/src/stores/preferencesStore.ts @@ -5,6 +5,7 @@ import {create} from "zustand"; export interface PreferencesState { isSidebarMinimized: boolean; toggleSidebarMinimized: () => void; + setSidebarMinimized: (isMinimized: boolean) => void; } export const initialState = { @@ -13,7 +14,18 @@ export const initialState = { const usePreferencesStore = create((set) => ({ ...initialState, - toggleSidebarMinimized: () => set((state) => ({isSidebarMinimized: !state.isSidebarMinimized})), + setSidebarMinimized: (isMinimized: boolean) => + set(() => { + localStorage.setItem("isSidebarMinimized", isMinimized.toString()); + + return {isSidebarMinimized: isMinimized}; + }), + toggleSidebarMinimized: () => + set((state) => { + localStorage.setItem("isSidebarMinimized", (!state.isSidebarMinimized).toString()); + + return {isSidebarMinimized: !state.isSidebarMinimized}; + }), reset: () => set(() => initialState), }));