"use client";

import {
  createContext,
  useContext,
  useEffect,
  useMemo,
  useState,
  type ReactNode,
} from "react";
import {
  siloStores,
  type FulfillMode,
  type SiloStore,
} from "@/data/silo-catalog";

type FulfillmentState = {
  mode: FulfillMode;
  store: SiloStore;
  zip: string;
  chooserOpen: boolean;
  setMode: (mode: FulfillMode) => void;
  setStore: (store: SiloStore) => void;
  setZip: (zip: string) => void;
  openChooser: () => void;
  closeChooser: () => void;
};

const FulfillmentContext = createContext<FulfillmentState | null>(null);
const KEY = "silomart-fulfillment-v1";

export function FulfillmentProvider({ children }: { children: ReactNode }) {
  const [mode, setMode] = useState<FulfillMode>("pickup");
  const [store, setStore] = useState<SiloStore>(siloStores[0]);
  const [zip, setZip] = useState(siloStores[0].zip);
  const [chooserOpen, setChooserOpen] = useState(false);
  const [hydrated, setHydrated] = useState(false);

  useEffect(() => {
    try {
      const raw = localStorage.getItem(KEY);
      if (raw) {
        const parsed = JSON.parse(raw) as {
          mode?: FulfillMode;
          storeId?: string;
          zip?: string;
        };
        if (parsed.mode) setMode(parsed.mode);
        if (parsed.zip) setZip(parsed.zip);
        const found = siloStores.find((s) => s.id === parsed.storeId);
        if (found) setStore(found);
      }
    } catch {
      // ignore
    }
    setHydrated(true);
  }, []);

  useEffect(() => {
    if (!hydrated) return;
    localStorage.setItem(
      KEY,
      JSON.stringify({ mode, storeId: store.id, zip }),
    );
  }, [hydrated, mode, store.id, zip]);

  const value = useMemo(
    () => ({
      mode,
      store,
      zip,
      chooserOpen,
      setMode,
      setStore,
      setZip,
      openChooser: () => setChooserOpen(true),
      closeChooser: () => setChooserOpen(false),
    }),
    [mode, store, zip, chooserOpen],
  );

  return (
    <FulfillmentContext.Provider value={value}>
      {children}
    </FulfillmentContext.Provider>
  );
}

export function useFulfillment() {
  const ctx = useContext(FulfillmentContext);
  if (!ctx) {
    throw new Error("useFulfillment must be used within FulfillmentProvider");
  }
  return ctx;
}