import {createStore} from 'zustand/vanilla'
import {persist} from 'zustand/middleware'

export type LayoutStore = LayoutState & LayoutActions

export type LayoutState = {
  navbar: boolean
}

export type LayoutActions = {
  toggleNavbar: () => void
  setNavbar: (navbar: boolean) => void
}

export const createLayoutStore = () => {
  return createStore<LayoutStore>()(persist(
    setState => ({
      navbar: false,

      toggleNavbar: () => setState((state) => {
        return {navbar: !state.navbar}
      }),

      setNavbar: navbar => setState((_) => {
        return {navbar}
      }),
    }),

    {
      name: 'layout-store',
      partialize: state => ({
        navbar: state.navbar,
      }),
    },
  ))
}
