import { create } from 'zustand';
import { persist } from 'zustand/middleware';

interface SidebarState {
  /** Whether the sidebar is expanded (true) or collapsed (false) */
  isExpanded: boolean;

  /** Whether the mobile sidebar sheet is open */
  isMobileOpen: boolean;

  /** Toggle the sidebar expanded/collapsed state */
  toggleSidebar: () => void;

  /** Set the sidebar expanded state */
  setExpanded: (expanded: boolean) => void;

  /** Toggle the mobile sidebar sheet */
  toggleMobile: () => void;

  /** Set the mobile sidebar sheet open state */
  setMobileOpen: (open: boolean) => void;
}

/**
 * Zustand store for sidebar state management
 * Persists the expanded state to localStorage
 */
export const useSidebarStore = create<SidebarState>()(
  persist(
    (set) => ({
      isExpanded: true,
      isMobileOpen: false,

      toggleSidebar: () => set((state) => ({ isExpanded: !state.isExpanded })),

      setExpanded: (expanded) => set({ isExpanded: expanded }),

      toggleMobile: () => set((state) => ({ isMobileOpen: !state.isMobileOpen })),

      setMobileOpen: (open) => set({ isMobileOpen: open }),
    }),
    {
      name: 'tos-sidebar-state',
      partialize: (state) => ({ isExpanded: state.isExpanded }),
    }
  )
);
