/* ===========================================================
   Repetir Boutique — global store (React Context)
   One provider holds everything the header + pages share:
   country (region), spaces & XP, cart, orders, addresses, toast.
   All slices persist to localStorage with the SAME keys as the
   original prototype, so existing data carries over 1:1.
   Exposed as window.RepetirStore = { StoreProvider, useStore }.
   =========================================================== */
(function () {
  const { createContext, useContext, useState, useEffect, useCallback, useRef } = React;
  const D = window.RepetirData;

  const KEY = {
    country: "repetir_country",
    lang: "repetir_lang",
    space: "repetir_space",
    cart: "repetir_boutique_cart",
    orders: "repetir_orders",
    addresses: "repetir_addresses",
    seeded: "repetir_orders_seeded",
  };

  function load(key, fallback) {
    try { const v = JSON.parse(localStorage.getItem(key)); return v == null ? fallback : v; }
    catch (e) { return fallback; }
  }
  function save(key, val) { try { localStorage.setItem(key, JSON.stringify(val)); } catch (e) {} }

  const StoreContext = createContext(null);

  function seedOrders(existing) {
    if (localStorage.getItem(KEY.seeded)) return existing;
    const now = Date.now(), day = 86400000;
    const samples = [
      { id: "RP-2026-1042", date: new Date(now - 2 * day).toISOString(), status: "Expédiée", method: "Express",
        items: [{ name: "Peluche Stylo 24 cm", price: 34.90, qty: 1 }, { name: "Lot de 5 pin's", price: 16, qty: 1 }],
        subtotal: 50.90, shipping: 0, total: 50.90, address: { first: "Camille", last: "Dupont", city: "Paris" } },
      { id: "RP-2026-0987", date: new Date(now - 21 * day).toISOString(), status: "Livrée", method: "Standard",
        items: [{ name: "Carnet d'écriture Repetir", price: 16, qty: 2 }, { name: "Lot de 24 stickers", price: 7.90, qty: 1 }],
        subtotal: 39.90, shipping: 4.90, total: 44.80, address: { first: "Camille", last: "Dupont", city: "Paris" } },
      { id: "RP-2026-0641", date: new Date(now - 54 * day).toISOString(), status: "Livrée", method: "Standard",
        items: [{ name: "Casquette brodée Stylo", price: 24.90, qty: 1 }, { name: "Tee-shirt « Ne lâche rien »", price: 22, qty: 1 }],
        subtotal: 46.90, shipping: 4.90, total: 51.80, address: { first: "Camille", last: "Dupont", city: "Paris" } },
    ];
    const merged = existing.concat(samples);
    save(KEY.orders, merged);
    try { localStorage.setItem(KEY.seeded, "1"); } catch (e) {}
    return merged;
  }

  function StoreProvider({ children }) {
    const [countryCode, setCountryCode] = useState(() => {
      const c = load(KEY.country, "FR");
      return D.COUNTRIES.some(x => x.code === c) ? c : "FR";
    });
    const LANGUAGES = [{ code: "fr", label: "Français" }, { code: "en", label: "English" }, { code: "es", label: "Español" }];
    const [lang, setLang] = useState(() => {
      const l = load(KEY.lang, "fr");
      return LANGUAGES.some(x => x.code === l) ? l : "fr";
    });
    const [spaces, setSpaces] = useState(() => {
      // keep mutable XP balances in state, names/colors from data
      return D.SPACES.map(s => ({ ...s }));
    });
    const [spaceId, setSpaceId] = useState(() => {
      const s = load(KEY.space, D.SPACES[0].id);
      return D.SPACES.some(x => x.id === s) ? s : D.SPACES[0].id;
    });
    const [cart, setCart] = useState(() => {
      const c = load(KEY.cart, []); return Array.isArray(c) ? c : [];
    });
    const [orders, setOrders] = useState(() => seedOrders(load(KEY.orders, [])));
    const [addresses, setAddresses] = useState(() => {
      let a = load(KEY.addresses, null);
      if (!Array.isArray(a) || !a.length) {
        a = [{ first: "Camille", last: "Dupont", street: "12 rue des Crayons", zip: "75011", city: "Paris", country: "France", label: "Domicile" }];
        save(KEY.addresses, a);
      }
      return a;
    });
    const [toast, setToast] = useState(null);
    const toastTimer = useRef(null);

    useEffect(() => save(KEY.country, countryCode), [countryCode]);
    useEffect(() => save(KEY.lang, lang), [lang]);
    useEffect(() => save(KEY.space, spaceId), [spaceId]);
    useEffect(() => save(KEY.cart, cart), [cart]);
    useEffect(() => save(KEY.orders, orders), [orders]);
    useEffect(() => save(KEY.addresses, addresses), [addresses]);

    const country = D.COUNTRIES.find(c => c.code === countryCode) || D.COUNTRIES[0];
    const activeSpace = spaces.find(s => s.id === spaceId) || spaces[0];

    /* ---- money: prices are EUR base, converted by region rate ---- */
    const money = useCallback((eur) => {
      const v = (eur || 0) * country.rate;
      return v.toLocaleString("fr-FR", { minimumFractionDigits: 2, maximumFractionDigits: 2 }) + " " + country.symbol;
    }, [country]);

    /* ---- cart ops ---- */
    const cartQty = cart.reduce((n, i) => n + i.qty, 0);
    const showToast = useCallback((msg) => {
      setToast(msg);
      clearTimeout(toastTimer.current);
      toastTimer.current = setTimeout(() => setToast(null), 2400);
    }, []);
    const addToCart = useCallback((name, priceEur) => {
      setCart(prev => {
        const ex = prev.find(i => i.name === name);
        if (ex) return prev.map(i => i.name === name ? { ...i, qty: i.qty + 1 } : i);
        return [...prev, { name, price: priceEur, qty: 1 }];
      });
      showToast("🎉 " + name + " ajouté au panier !");
    }, [showToast]);
    const incItem = useCallback((idx) => setCart(p => p.map((i, k) => k === idx ? { ...i, qty: i.qty + 1 } : i)), []);
    const decItem = useCallback((idx) => setCart(p => p.flatMap((i, k) => k === idx ? (i.qty > 1 ? [{ ...i, qty: i.qty - 1 }] : []) : [i])), []);
    const removeItem = useCallback((idx) => setCart(p => p.filter((_, k) => k !== idx)), []);
    const clearCart = useCallback(() => setCart([]), []);

    /* ---- spaces / XP ---- */
    const selectSpace = useCallback((id) => { if (D.SPACES.some(s => s.id === id)) setSpaceId(id); }, []);
    const debitSpace = useCallback((id, amount) => {
      setSpaces(prev => prev.map(s => s.id === id ? { ...s, xp: Math.max(0, s.xp - amount) } : s));
    }, []);

    /* ---- orders / addresses ---- */
    const addOrder = useCallback((order) => setOrders(prev => [order, ...prev]), []);
    const addAddress = useCallback((addr) => {
      let newIndex = 0;
      setAddresses(prev => { newIndex = prev.length; return [...prev, addr]; });
      return newIndex;
    }, []);

    const value = {
      D,
      country, countryCode, setCountry: setCountryCode, countries: D.COUNTRIES,
      lang, setLang, languages: LANGUAGES,
      spaces, spaceId, activeSpace, selectSpace, debitSpace,
      cart, cartQty, addToCart, incItem, decItem, removeItem, clearCart,
      orders, addOrder,
      addresses, addAddress,
      money,
      toast, showToast,
    };
    return React.createElement(StoreContext.Provider, { value }, children);
  }

  function useStore() {
    const ctx = useContext(StoreContext);
    if (!ctx) throw new Error("useStore must be used within <StoreProvider>");
    return ctx;
  }

  window.RepetirStore = { StoreProvider, useStore };
})();