import { createContext, useContext, useEffect, useMemo, useState, type ReactNode } from "react";
import { PRODUCT_BY_ID, type Product } from "@/lib/catalog";

type CartCtx = {
  items: Product[];
  add: (id: string) => void;
  remove: (id: string) => void;
  clear: () => void;
  has: (id: string) => boolean;
  total: number;
  open: boolean;
  setOpen: (o: boolean) => void;
};

const Ctx = createContext<CartCtx | null>(null);
const KEY = "pc-cart";

export function CartProvider({ children }: { children: ReactNode }) {
  const [ids, setIds] = useState<string[]>([]);
  const [open, setOpen] = useState(false);

  useEffect(() => {
    try {
      const saved = JSON.parse(localStorage.getItem(KEY) ?? "[]");
      if (Array.isArray(saved)) setIds(saved.filter((id) => PRODUCT_BY_ID[id]));
    } catch {
      /* ignore */
    }
  }, []);

  useEffect(() => {
    localStorage.setItem(KEY, JSON.stringify(ids));
  }, [ids]);

  const value = useMemo<CartCtx>(() => {
    const items = ids.map((id) => PRODUCT_BY_ID[id]).filter((p): p is Product => !!p);
    return {
      items,
      add: (id) => setIds((c) => (c.includes(id) ? c : [...c, id])),
      remove: (id) => setIds((c) => c.filter((x) => x !== id)),
      clear: () => setIds([]),
      has: (id) => ids.includes(id),
      total: items.reduce((s, p) => s + p.price, 0),
      open,
      setOpen,
    };
  }, [ids, open]);

  return <Ctx.Provider value={value}>{children}</Ctx.Provider>;
}

export function useCart() {
  const c = useContext(Ctx);
  if (!c) throw new Error("useCart must be used within CartProvider");
  return c;
}
