Data Table zustand Store Adapter

1/**
2 * Zustand Adapter for BYOS
3 *
4 * This adapter integrates with existing Zustand stores via a slice pattern.
5 * It is client-only and does not support SSR.
6 */
7 
8"use client";
9 
10import { useMemo, useRef } from "react";
11import type { StoreApi } from "zustand";
12import type { InternalStoreAdapter } from "../../adapter/types";
13import { getSchemaDefaults } from "../../schema/serialization";
14import type { SchemaDefinition, StoreSnapshot } from "../../schema/types";
15import { getFilterSliceKeys } from "./slice";
16import type { ZustandAdapterOptions } from "./types";
17 
18export type {
19  ZustandAdapterOptions,
20  FilterSlice,
21  FilterSliceState,
22  FilterSliceActions,
23} from "./types";
24export {
25  createFilterSlice,
26  getFilterSliceKeys,
27  getFilterSliceFromState,
28} from "./slice";
29 
30/**
31 * Create a Zustand adapter from an existing store
32 *
33 * @example
34 * ```typescript
35 * import { create } from 'zustand';
36 * import { createFilterSlice, useZustandAdapter } from '@/lib/store/adapters/zustand';
37 *
38 * const schema = createSchema({
39 *   regions: field.array(field.string()).default([]),
40 *   host: field.string(),
41 * });
42 *
43 * // Create store with filter slice
44 * const useAppStore = create((set, get) => ({
45 *   user: null,
46 *   ...createFilterSlice(schema.definition, 'my-table', set, get),
47 * }));
48 *
49 * // In component
50 * function MyComponent() {
51 *   const adapter = useZustandAdapter(useAppStore, schema.definition, { id: 'my-table' });
52 *   return (
53 *     <DataTableStoreProvider adapter={adapter}>
54 *       <DataTable />
55 *     </DataTableStoreProvider>
56 *   );
57 * }
58 * ```
59 */
60export function useZustandAdapter<
61  TStore extends Record<string, unknown>,
62  TFilters extends Record<string, unknown>,
63>(
64  useStore: {
65    (): TStore;
66    getState: () => TStore;
67    subscribe: (
68      listener: (state: TStore, prevState: TStore) => void,
69    ) => () => void;
70  },
71  schema: SchemaDefinition,
72  options: ZustandAdapterOptions<TFilters>,
73): InternalStoreAdapter<TFilters> {
74  const { id, initialState } = options;
75  const keys = getFilterSliceKeys(id);
76  const defaults = useMemo(
77    () => getSchemaDefaults(schema) as TFilters,
78    [schema],
79  );
80 
81  const versionRef = useRef(0);
82 
83  // Cache server snapshot to avoid infinite loop with useSyncExternalStore
84  const serverSnapshotRef = useRef<StoreSnapshot<TFilters>>({
85    state: { ...defaults, ...initialState } as TFilters,
86    version: 0,
87  });
88 
89  const adapter = useMemo<InternalStoreAdapter<TFilters>>(() => {
90// … truncated