import { create } from 'zustand';

type Layout = null | 'layout1' | 'layout2' ;

type LayoutState = {
    currentLayout: Layout;
    setLayout: (layout: Layout) => void;
    resetLayout: () => void;
};

const LAYOUT_STORAGE_KEY = 'currentLayout';

const useLayoutStore = create<LayoutState>((set) => ({
    currentLayout: (() => {
        if (typeof window !== 'undefined') {
            const storedLayout = localStorage.getItem(LAYOUT_STORAGE_KEY);
            return storedLayout ? (JSON.parse(storedLayout) as Layout) : null;
        }
        return null;
    })(),
    
    setLayout: (layout) => {
        if (typeof window !== 'undefined') {
            localStorage.setItem(LAYOUT_STORAGE_KEY, JSON.stringify(layout));
        }
        set({ currentLayout: layout });
    },
    
    resetLayout: () => {
        if (typeof window !== 'undefined') {
            localStorage.removeItem(LAYOUT_STORAGE_KEY);
        }
        set({ currentLayout: null });
    },
}));

export default useLayoutStore;