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

// density: '1x1' | '2x1' | '2x2' | '4x1' | '4x2' | '4x3'
// ownerFilter: 'all' | 'mine'
// statusFilter: 'all' | 'free' | 'open' | 'paid'
// zoneFilter: Set of zone IDs (serialized as array in localStorage)
// activeZoneTab: zone id string or 'all'

const useTableViewStore = create(
  persist(
    (set, get) => ({
      density: '2x2',
      ownerFilter: 'all',
      statusFilter: 'all',
      zoneFilter: [],        // array of zone ids (serialized fine in JSON)
      activeZoneTab: 'all',

      setDensity: (density) => set({ density }),
      setOwnerFilter: (ownerFilter) => set({ ownerFilter }),
      setStatusFilter: (statusFilter) => set({ statusFilter }),
      setZoneFilter: (zoneFilter) => set({ zoneFilter }),
      setActiveZoneTab: (activeZoneTab) => set({ activeZoneTab }),

      clearFilters: () => set({
        ownerFilter: 'all',
        statusFilter: 'all',
        zoneFilter: [],
        activeZoneTab: 'all',
      }),
    }),
    {
      name: 'table-view-prefs',
      // future: could sync to backend here
    }
  )
)

export default useTableViewStore
