ubiquitous-invention/apps/web/lib/stores/view-store.ts

import { create } from "zustand";

import type { ViewConfig, ViewFilter, ViewSort } from "@/lib/hooks/use-view-data";

export type ActiveViewType = "list" | "board" | "table" | "embed" | "whiteboard";

const defaultConfig: ViewConfig = {
  filters: [],
  sorts: [],
  groupBy: null,
};

interface ViewState {
  activeView: ActiveViewType;
  setActiveView: (view: ActiveViewType) => void;
  config: ViewConfig;
  addFilter: (filter: ViewFilter) => void;
  removeFilter: (index: number) => void;
  updateFilter: (index: number, filter: ViewFilter) => void;
  addSort: (sort: ViewSort) => void;
  removeSort: (index: number) => void;
  updateSort: (index: number, sort: ViewSort) => void;
  setGroupBy: (field: string | null) => void;
  resetConfig: () => void;
}

export const useViewStore = create<ViewState>((set) => ({
  activeView: "list",
  setActiveView: (view) => set({ activeView: view }),
  config: defaultConfig,
  addFilter: (filter) =>
    set((s) => ({
      config: { ...s.config, filters: [...s.config.filters, filter] },
    })),
  removeFilter: (index) =>
    set((s) => ({
      config: {
        ...s.config,
        filters: s.config.filters.filter((_, i) => i !== index),
      },
    })),
  updateFilter: (index, filter) =>
    set((s) => ({
      config: {
        ...s.config,
        filters: s.config.filters.map((f, i) => (i === index ? filter : f)),
      },
    })),
  addSort: (sort) =>
    set((s) => ({
      config: { ...s.config, sorts: [...s.config.sorts, sort] },
    })),
  removeSort: (index) =>
    set((s) => ({
      config: {
        ...s.config,
        sorts: s.config.sorts.filter((_, i) => i !== index),
      },
    })),
  updateSort: (index, sort) =>
    set((s) => ({
      config: {
        ...s.config,
        sorts: s.config.sorts.map((x, i) => (i === index ? sort : x)),
      },
    })),
  setGroupBy: (field) =>
    set((s) => ({
      config: { ...s.config, groupBy: field },
    })),
  resetConfig: () => set({ config: { ...defaultConfig } }),
}));