import { e as createComponent, l as renderHead, k as renderComponent, r as renderTemplate } from '../../chunks/astro/server_DePCulMI.mjs';
import 'piccolore';
/* empty css                                     */
import { jsx, jsxs } from 'react/jsx-runtime';
import { useState, useEffect } from 'react';
import { A as AuthProvider, a as AuthGuard, u as useAuth } from '../../chunks/AdminAuth_CWvmd3cU.mjs';
import { A as AdminLayout } from '../../chunks/AdminLayout_CZSIXmew.mjs';
export { renderers } from '../../renderers.mjs';

const RULE_FIELDS = ["brand", "category", "price", "offer_count", "is_sneaker", "name"];
const RULE_OPS = ["equals", "not_equals", "contains", "greater_than", "less_than", "in"];
function RuleRow({ rule, onChange, onRemove }) {
  return /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-2", children: [
    /* @__PURE__ */ jsx(
      "select",
      {
        value: rule.field,
        onChange: (e) => onChange({ ...rule, field: e.target.value }),
        className: "bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]",
        children: RULE_FIELDS.map((f) => /* @__PURE__ */ jsx("option", { value: f, children: f }, f))
      }
    ),
    /* @__PURE__ */ jsx(
      "select",
      {
        value: rule.operator,
        onChange: (e) => onChange({ ...rule, operator: e.target.value }),
        className: "bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]",
        children: RULE_OPS.map((o) => /* @__PURE__ */ jsx("option", { value: o, children: o.replace("_", " ") }, o))
      }
    ),
    /* @__PURE__ */ jsx(
      "input",
      {
        type: "text",
        value: rule.value,
        onChange: (e) => onChange({ ...rule, value: e.target.value }),
        className: "bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5] flex-1",
        placeholder: "Waarde"
      }
    ),
    /* @__PURE__ */ jsx("button", { onClick: onRemove, className: "text-[#FF3B3B] hover:text-[#FF6666] text-lg", children: "🗑" })
  ] });
}
function CollectionBuilderContent() {
  const { token } = useAuth();
  const [collections, setCollections] = useState([]);
  const [loading, setLoading] = useState(true);
  const [editing, setEditing] = useState(null);
  const [rules, setRules] = useState([]);
  const [showForm, setShowForm] = useState(false);
  const [refreshing, setRefreshing] = useState(/* @__PURE__ */ new Set());
  const [message, setMessage] = useState("");
  const headers = { Authorization: `Bearer ${token}`, "Content-Type": "application/json" };
  const flash = (msg) => {
    setMessage(msg);
    setTimeout(() => setMessage(""), 3e3);
  };
  const loadCollections = () => {
    fetch("/api/admin/collections", { headers: { Authorization: `Bearer ${token}` } }).then((r) => r.json()).then((d) => setCollections(d.collections || [])).catch(() => {
    }).finally(() => setLoading(false));
  };
  useEffect(() => {
    loadCollections();
  }, [token]);
  const rulesFromJson = (json) => {
    if (!json || !json.rules) return [];
    return (json.rules || []).map((r) => ({
      field: r.field || "brand",
      operator: r.operator || "equals",
      value: String(r.value || "")
    }));
  };
  const rulesToJson = (rules2) => ({
    operator: "AND",
    rules: rules2.map((r) => ({ field: r.field, operator: r.operator, value: r.value }))
  });
  const startEdit = (c) => {
    setEditing({ ...c });
    setRules(rulesFromJson(c.rules_json));
    setShowForm(true);
  };
  const startNew = () => {
    setEditing({
      id: "",
      slug: "",
      name_en: "",
      name_nl: "",
      description: null,
      type: "smart",
      rules_json: null,
      sort_by: "relevance",
      is_active: true,
      is_featured: false,
      max_products: 50
    });
    setRules([{ field: "brand", operator: "equals", value: "" }]);
    setShowForm(true);
  };
  const save = async () => {
    if (!editing) return;
    const data = {
      ...editing,
      rules_json: rules.length > 0 ? rulesToJson(rules) : null
    };
    try {
      if (editing.id) {
        await fetch("/api/admin/collections", {
          method: "PUT",
          headers,
          body: JSON.stringify({ id: data.id, name_en: data.name_en, name_nl: data.name_nl, description: data.description, rules_json: data.rules_json, sort_by: data.sort_by, is_active: data.is_active, is_featured: data.is_featured, max_products: data.max_products })
        });
      } else {
        await fetch("/api/admin/collections", {
          method: "POST",
          headers,
          body: JSON.stringify({ slug: data.slug, name_en: data.name_en, name_nl: data.name_nl, description: data.description, type: data.type, rules_json: data.rules_json, sort_by: data.sort_by, is_featured: data.is_featured, max_products: data.max_products })
        });
      }
      flash("Opgeslagen ✓");
      loadCollections();
      setShowForm(false);
      setEditing(null);
    } catch {
      flash("Fout bij opslaan");
    }
  };
  const deleteCollection = async (id) => {
    if (!confirm("Collection verwijderen?")) return;
    await fetch("/api/admin/collections", { method: "DELETE", headers, body: JSON.stringify({ id }) });
    loadCollections();
    flash("Verwijderd ✓");
  };
  const refreshCollection = async (id) => {
    setRefreshing((prev) => new Set(prev).add(id));
    try {
      const res = await fetch(`/api/admin/collections/${id}/refresh`, { method: "POST", headers });
      const d = await res.json();
      flash(`Vernieuwd: ${d.products || 0} producten`);
    } catch {
      flash("Fout bij vernieuwen");
    }
    setRefreshing((prev) => {
      const n = new Set(prev);
      n.delete(id);
      return n;
    });
  };
  if (loading) return /* @__PURE__ */ jsx(AdminLayout, { title: "Collections", children: /* @__PURE__ */ jsx("div", { className: "text-[#666] text-center py-12", children: "Laden..." }) });
  return /* @__PURE__ */ jsxs(AdminLayout, { title: "Collections", children: [
    message && /* @__PURE__ */ jsx("div", { className: "mb-4 bg-[#00FF6A]/10 border border-[#00FF6A]/30 text-[#00FF6A] text-sm px-4 py-2 rounded-lg", children: message }),
    /* @__PURE__ */ jsx("div", { className: "flex justify-end mb-6", children: /* @__PURE__ */ jsx("button", { onClick: startNew, className: "bg-[#00FF6A] text-[#0A0A0A] font-semibold px-4 py-2 rounded-lg text-sm hover:bg-[#00CC55]", children: "+ Nieuwe Collection" }) }),
    showForm && editing && /* @__PURE__ */ jsxs("div", { className: "bg-[#141414] border border-[#333] rounded-xl p-6 mb-6", children: [
      /* @__PURE__ */ jsxs("h3", { className: "text-lg font-semibold text-[#F5F5F5] mb-4", children: [
        editing.id ? "Bewerken" : "Nieuwe",
        " Collection"
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-4 mb-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Naam (EN)" }),
          /* @__PURE__ */ jsx(
            "input",
            {
              value: editing.name_en,
              onChange: (e) => setEditing({ ...editing, name_en: e.target.value }),
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Naam (NL)" }),
          /* @__PURE__ */ jsx(
            "input",
            {
              value: editing.name_nl,
              onChange: (e) => setEditing({ ...editing, name_nl: e.target.value }),
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Slug" }),
          /* @__PURE__ */ jsx(
            "input",
            {
              value: editing.slug,
              onChange: (e) => setEditing({ ...editing, slug: e.target.value }),
              disabled: !!editing.id,
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5] disabled:opacity-50"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Type" }),
          /* @__PURE__ */ jsxs(
            "select",
            {
              value: editing.type,
              onChange: (e) => setEditing({ ...editing, type: e.target.value }),
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]",
              children: [
                /* @__PURE__ */ jsx("option", { value: "smart", children: "Smart (auto-rules)" }),
                /* @__PURE__ */ jsx("option", { value: "manual", children: "Manual" }),
                /* @__PURE__ */ jsx("option", { value: "hybrid", children: "Hybrid" })
              ]
            }
          )
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
        /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Beschrijving" }),
        /* @__PURE__ */ jsx(
          "textarea",
          {
            value: editing.description || "",
            onChange: (e) => setEditing({ ...editing, description: e.target.value }),
            className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5] h-20"
          }
        )
      ] }),
      (editing.type === "smart" || editing.type === "hybrid") && /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
        /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-2", children: "Rules (alle moeten matchen)" }),
        /* @__PURE__ */ jsxs("div", { className: "space-y-2 bg-[#0A0A0A] border border-[#333] rounded-lg p-4", children: [
          rules.map((rule, i) => /* @__PURE__ */ jsx(
            RuleRow,
            {
              rule,
              onChange: (r) => {
                const n = [...rules];
                n[i] = r;
                setRules(n);
              },
              onRemove: () => setRules(rules.filter((_, idx) => idx !== i))
            },
            i
          )),
          /* @__PURE__ */ jsx(
            "button",
            {
              onClick: () => setRules([...rules, { field: "brand", operator: "equals", value: "" }]),
              className: "text-sm text-[#00FF6A] hover:text-[#00CC55]",
              children: "+ Regel toevoegen"
            }
          )
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-3 gap-4 mb-4", children: [
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Sorteer op" }),
          /* @__PURE__ */ jsxs(
            "select",
            {
              value: editing.sort_by,
              onChange: (e) => setEditing({ ...editing, sort_by: e.target.value }),
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]",
              children: [
                /* @__PURE__ */ jsx("option", { value: "relevance", children: "Relevantie" }),
                /* @__PURE__ */ jsx("option", { value: "price_asc", children: "Prijs (laag-hoog)" }),
                /* @__PURE__ */ jsx("option", { value: "price_desc", children: "Prijs (hoog-laag)" }),
                /* @__PURE__ */ jsx("option", { value: "newest", children: "Nieuwste" }),
                /* @__PURE__ */ jsx("option", { value: "popular", children: "Populair" })
              ]
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { children: [
          /* @__PURE__ */ jsx("label", { className: "block text-xs text-[#999] mb-1", children: "Max producten" }),
          /* @__PURE__ */ jsx(
            "input",
            {
              type: "number",
              value: editing.max_products || "",
              onChange: (e) => setEditing({ ...editing, max_products: parseInt(e.target.value) || null }),
              className: "w-full bg-[#0A0A0A] border border-[#333] rounded-lg px-3 py-2 text-sm text-[#F5F5F5]"
            }
          )
        ] }),
        /* @__PURE__ */ jsxs("div", { className: "flex items-end gap-4", children: [
          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm text-[#999]", children: [
            /* @__PURE__ */ jsx("input", { type: "checkbox", checked: editing.is_featured, onChange: (e) => setEditing({ ...editing, is_featured: e.target.checked }), className: "accent-[#00FF6A]" }),
            "Featured"
          ] }),
          /* @__PURE__ */ jsxs("label", { className: "flex items-center gap-2 text-sm text-[#999]", children: [
            /* @__PURE__ */ jsx("input", { type: "checkbox", checked: editing.is_active, onChange: (e) => setEditing({ ...editing, is_active: e.target.checked }), className: "accent-[#00FF6A]" }),
            "Actief"
          ] })
        ] })
      ] }),
      /* @__PURE__ */ jsxs("div", { className: "flex gap-3", children: [
        /* @__PURE__ */ jsx("button", { onClick: save, className: "bg-[#00FF6A] text-[#0A0A0A] font-semibold px-4 py-2 rounded-lg text-sm hover:bg-[#00CC55]", children: "Opslaan" }),
        /* @__PURE__ */ jsx("button", { onClick: () => {
          setShowForm(false);
          setEditing(null);
        }, className: "text-[#999] hover:text-[#F5F5F5] text-sm", children: "Annuleren" })
      ] })
    ] }),
    collections.length === 0 ? /* @__PURE__ */ jsxs("div", { className: "bg-[#141414] border border-[#333] rounded-xl p-8 text-center", children: [
      /* @__PURE__ */ jsx("div", { className: "text-[#666] text-lg mb-2", children: "📁" }),
      /* @__PURE__ */ jsx("div", { className: "text-[#999] text-sm", children: "Nog geen collections" }),
      /* @__PURE__ */ jsx("div", { className: "text-[#666] text-xs mt-1", children: "Maak een nieuwe collection om te beginnen" })
    ] }) : /* @__PURE__ */ jsx("div", { className: "bg-[#141414] border border-[#333] rounded-xl overflow-hidden", children: /* @__PURE__ */ jsxs("table", { className: "w-full text-sm", children: [
      /* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { className: "border-b border-[#333] text-[#999] text-left", children: [
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Naam" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Slug" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Type" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Rules" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Max" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Status" }),
        /* @__PURE__ */ jsx("th", { className: "px-5 py-3 font-medium", children: "Acties" })
      ] }) }),
      /* @__PURE__ */ jsx("tbody", { children: collections.map((c) => /* @__PURE__ */ jsxs("tr", { className: "border-b border-[#222] hover:bg-[#1A1A1A] transition-colors", children: [
        /* @__PURE__ */ jsxs("td", { className: "px-5 py-3", children: [
          /* @__PURE__ */ jsx("div", { className: "text-[#F5F5F5] font-medium", children: c.name_nl || c.name_en }),
          c.is_featured && /* @__PURE__ */ jsx("span", { className: "text-xs text-[#FFD700]", children: "⭐ Featured" })
        ] }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3 text-[#666] text-xs font-mono", children: c.slug }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3", children: /* @__PURE__ */ jsx("span", { className: `text-xs px-2 py-1 rounded-full ${c.type === "smart" ? "bg-[#00FF6A]/10 text-[#00FF6A]" : c.type === "hybrid" ? "bg-[#FFD700]/10 text-[#FFD700]" : "bg-[#666]/10 text-[#999]"}`, children: c.type }) }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3 text-[#999] text-xs max-w-[200px] truncate", children: c.rules_json?.rules?.map((r) => `${r.field} ${r.operator} ${r.value}`).join(" & ") || "-" }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3 text-[#999]", children: c.max_products || "∞" }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3", children: /* @__PURE__ */ jsx("span", { className: `text-xs px-2 py-1 rounded ${c.is_active ? "bg-[#00FF6A]/10 text-[#00FF6A]" : "bg-[#333] text-[#666]"}`, children: c.is_active ? "Actief" : "Inactief" }) }),
        /* @__PURE__ */ jsx("td", { className: "px-5 py-3", children: /* @__PURE__ */ jsxs("div", { className: "flex gap-2", children: [
          /* @__PURE__ */ jsx("button", { onClick: () => startEdit(c), className: "text-[#999] hover:text-[#00FF6A] transition-colors", title: "Bewerken", children: "✏️" }),
          /* @__PURE__ */ jsx(
            "button",
            {
              onClick: () => refreshCollection(c.id),
              disabled: refreshing.has(c.id),
              className: "text-[#999] hover:text-[#00FF6A] transition-colors disabled:opacity-30",
              title: "Vernieuwen",
              children: refreshing.has(c.id) ? "⏳" : "🔄"
            }
          ),
          /* @__PURE__ */ jsx("button", { onClick: () => deleteCollection(c.id), className: "text-[#666] hover:text-[#FF3B3B] transition-colors", title: "Verwijderen", children: "🗑" })
        ] }) })
      ] }, c.id)) })
    ] }) })
  ] });
}
function CollectionBuilderPage() {
  return /* @__PURE__ */ jsx(AuthProvider, { children: /* @__PURE__ */ jsx(AuthGuard, { children: /* @__PURE__ */ jsx(CollectionBuilderContent, {}) }) });
}

const $$Collections = createComponent(($$result, $$props, $$slots) => {
  return renderTemplate`<html lang="nl" class="dark"> <head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Collections — SneakerPicks Admin</title>${renderHead()}</head> <body class="min-h-screen bg-[#0A0A0A] text-[#F5F5F5]"> ${renderComponent($$result, "CollectionBuilder", CollectionBuilderPage, { "client:load": true, "client:component-hydration": "load", "client:component-path": "C:/Users/Roel/clawd/sneakerpicks/src/components/admin/CollectionBuilder", "client:component-export": "default" })} </body></html>`;
}, "C:/Users/Roel/clawd/sneakerpicks/src/pages/admin/collections.astro", void 0);

const $$file = "C:/Users/Roel/clawd/sneakerpicks/src/pages/admin/collections.astro";
const $$url = "/admin/collections";

const _page = /*#__PURE__*/Object.freeze(/*#__PURE__*/Object.defineProperty({
  __proto__: null,
  default: $$Collections,
  file: $$file,
  url: $$url
}, Symbol.toStringTag, { value: 'Module' }));

const page = () => _page;

export { page };
