@xiwebdesign/xicms-core 7.16.0 → 7.16.2

package/dist/admin/dashboard/DashboardPanel.js

@@ -20,9 +20,18 @@ import { formatCents } from "../../schema/shop.js";
 import { Badge, Button, Card, Input } from "../ui/primitives.js";
 import { useToast } from "../ui/toast.js";
 import { useAdminNav } from "../navContext.js";
-function fmtDatum(t) {
-  if (!t?.toDate) return "\u2014";
-  return t.toDate().toLocaleString("nl-NL", { dateStyle: "short", timeStyle: "short" });
+function updatedMs(v) {
+  if (v && typeof v.toDate === "function") return v.toDate().getTime();
+  if (typeof v === "string") {
+    const t = Date.parse(v);
+    return Number.isNaN(t) ? 0 : t;
+  }
+  return 0;
+}
+function fmtDatum(v) {
+  const ms = updatedMs(v);
+  if (!ms) return "\u2014";
+  return new Date(ms).toLocaleString("nl-NL", { dateStyle: "short", timeStyle: "short" });
 }
 function WidgetKop({ titel, tab, tabLabel }) {
   const gaNaar = useAdminNav();
@@ -65,7 +74,11 @@ function DashboardPanel({ siteId }) {
       setFormulieren([]);
       return;
     }
-    getDocs(query(collection(db, "sites", siteId, "drafts"), orderBy("updatedAt", "desc"), limit(5))).then((snap) => setPaginas(snap.docs.map((d) => ({ id: d.id, ...d.data() })))).catch(() => setPaginas([]));
+    getDocs(collection(db, "sites", siteId, "drafts")).then(
+      (snap) => setPaginas(
+        snap.docs.map((d) => ({ id: d.id, ...d.data() })).sort((a, b) => updatedMs(b.updatedAt) - updatedMs(a.updatedAt)).slice(0, 5)
+      )
+    ).catch(() => setPaginas([]));
     const nu = /* @__PURE__ */ new Date();
     const maandId = `${nu.getUTCFullYear()}-${String(nu.getUTCMonth() + 1).padStart(2, "0")}`;
     getDoc(doc(db, "sites", siteId, "stats", maandId)).then((snap) => setMaand(snap.exists() ? snap.data() : null)).catch(() => setMaand(null));

package/dist/admin/dashboard/DashboardPanel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/dashboard/DashboardPanel.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Startpagina van /beheer (7.16).\n *\n * /beheer opende recht in het pagina-overzicht: een lijst technische titels als eerste indruk, en\n * nergens een plek die uitlegt hoe het systeem in elkaar zit. Deze startpagina doet drie dingen:\n * uitleggen hoe je de site bewerkt (op de site zelf, niet hier), in één oogopslag tonen wat er\n * gebeurt (bezoek, bestellingen, inzendingen, laatst bewerkt), en snelkoppelingen bieden die de\n * siteadmin zelf kan instellen.\n *\n * Bewust eenmalige reads (geen live listeners): dit is een overzicht bij binnenkomst, geen\n * monitor. Elke widget vangt zijn eigen fouten — een dichtgezette collectie (rules, module uit)\n * mag nooit de hele startpagina blokkeren.\n */\nimport { useEffect, useMemo, useState } from \"react\";\nimport {\n  collection,\n  doc,\n  getCountFromServer,\n  getDoc,\n  getDocs,\n  limit,\n  orderBy,\n  query,\n} from \"firebase/firestore\";\nimport type { Timestamp } from \"firebase/firestore\";\nimport { getDb, getFirebaseApp } from \"../../firebase/client\";\nimport { callable } from \"../../firebase/functionsClient\";\nimport { useAuth } from \"../../auth/AuthProvider\";\nimport { canManageSite } from \"../../auth/roles\";\nimport { useModules } from \"../../modules/context\";\nimport { formatCents } from \"../../schema/shop\";\nimport { Badge, Button, Card, Input } from \"../ui/primitives\";\nimport { useToast } from \"../ui/toast\";\nimport { useAdminNav } from \"../navContext\";\n\ninterface RecentePagina {\n  id: string;\n  title?: string;\n  path?: string;\n  updatedAt?: Timestamp;\n}\ninterface MaandStat {\n  total?: number;\n  days?: Record<string, number>;\n  paths?: Record<string, number>;\n}\ninterface RecenteOrder {\n  id: string;\n  status?: string;\n  createdAt?: Timestamp;\n  customer?: { name?: string };\n  amount?: { totalCents?: number };\n}\ninterface FormOverzicht {\n  id: string;\n  name: string;\n  aantal: number;\n  laatste?: Timestamp;\n}\ninterface Snelkoppeling {\n  label: string;\n  href: string;\n}\n\nfunction fmtDatum(t?: Timestamp): string {\n  if (!t?.toDate) return \"—\";\n  return t.toDate().toLocaleString(\"nl-NL\", { dateStyle: \"short\", timeStyle: \"short\" });\n}\n\n/** Kop van een widget met een \"ga ernaartoe\"-pijl die naar het bijbehorende paneel springt. */\nfunction WidgetKop({ titel, tab, tabLabel }: { titel: string; tab?: string; tabLabel?: string }) {\n  const gaNaar = useAdminNav();\n  return (\n    <div className=\"mb-3 flex items-center justify-between gap-2\">\n      <h2 className=\"text-sm font-semibold text-slate-800\">{titel}</h2>\n      {tab && (\n        <button\n          type=\"button\"\n          onClick={() => gaNaar(tab)}\n          className=\"shrink-0 text-xs font-medium text-brand-700 hover:underline focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:outline-none\"\n        >\n          {tabLabel ?? \"Bekijk alles\"} →\n        </button>\n      )}\n    </div>\n  );\n}\n\nexport function DashboardPanel({ siteId }: { siteId: string }) {\n  const { role } = useAuth();\n  const { activeIds } = useModules();\n  const { toast } = useToast();\n  const gaNaar = useAdminNav();\n  const heeftShop = activeIds.has(\"shop\");\n  const magInstellen = canManageSite(role);\n\n  const [paginas, setPaginas] = useState<RecentePagina[] | null>(null);\n  const [maand, setMaand] = useState<MaandStat | null | undefined>(undefined);\n  const [orders, setOrders] = useState<RecenteOrder[] | null>(null);\n  const [formulieren, setFormulieren] = useState<FormOverzicht[] | null>(null);\n  const [links, setLinks] = useState<Snelkoppeling[]>([]);\n  const [linksBewerken, setLinksBewerken] = useState<Snelkoppeling[] | null>(null);\n  const [linksOpslaan, setLinksOpslaan] = useState(false);\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) {\n      setPaginas([]);\n      setMaand(null);\n      setOrders([]);\n      setFormulieren([]);\n      return;\n    }\n\n    // Laatst bewerkte pagina's. orderBy laat docs zónder updatedAt weg — dat zijn alleen\n    // stok­oude drafts die nooit meer zijn aangeraakt, en die horen hier ook niet bovenaan.\n    getDocs(query(collection(db, \"sites\", siteId, \"drafts\"), orderBy(\"updatedAt\", \"desc\"), limit(5)))\n      .then((snap) => setPaginas(snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<RecentePagina, \"id\">) }))))\n      .catch(() => setPaginas([]));\n\n    // Bezoek deze maand (zelfde bron als het Statistieken-paneel).\n    const nu = new Date();\n    const maandId = `${nu.getUTCFullYear()}-${String(nu.getUTCMonth() + 1).padStart(2, \"0\")}`;\n    getDoc(doc(db, \"sites\", siteId, \"stats\", maandId))\n      .then((snap) => setMaand(snap.exists() ? (snap.data() as MaandStat) : null))\n      .catch(() => setMaand(null));\n\n    // Laatste bestellingen — alleen als de shop-module actief is.\n    if (heeftShop) {\n      getDocs(query(collection(db, \"sites\", siteId, \"orders\"), orderBy(\"createdAt\", \"desc\"), limit(5)))\n        .then((snap) => setOrders(snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<RecenteOrder, \"id\">) }))))\n        .catch(() => setOrders([]));\n    } else {\n      setOrders([]);\n    }\n\n    // Formulieren: naam + aantal inzendingen + laatste inzending (aggregatie-count, geen\n    // volledige submissions-download). Max vier formulieren — de widget is een signaal, geen lijst.\n    getDocs(collection(db, \"sites\", siteId, \"forms\"))\n      .then(async (snap) => {\n        const forms = snap.docs.slice(0, 4);\n        const uit = await Promise.all(\n          forms.map(async (f) => {\n            const subs = collection(db, \"sites\", siteId, \"forms\", f.id, \"submissions\");\n            const [count, laatste] = await Promise.all([\n              getCountFromServer(subs).then((c) => c.data().count).catch(() => 0),\n              getDocs(query(subs, orderBy(\"createdAt\", \"desc\"), limit(1)))\n                .then((s) => (s.docs[0]?.data() as { createdAt?: Timestamp } | undefined)?.createdAt)\n                .catch(() => undefined),\n            ]);\n            return { id: f.id, name: (f.data() as { name?: string }).name ?? f.id, aantal: count, laatste };\n          }),\n        );\n        setFormulieren(uit);\n      })\n      .catch(() => setFormulieren([]));\n\n    // Snelkoppelingen uit settings/site (editor mag lezen; instellen is siteadmin-werk).\n    getDoc(doc(db, \"sites\", siteId, \"settings\", \"site\"))\n      .then((snap) => {\n        const d = snap.exists() ? (snap.data() as { dashboardLinks?: Snelkoppeling[] }) : {};\n        setLinks(Array.isArray(d.dashboardLinks) ? d.dashboardLinks : []);\n      })\n      .catch(() => setLinks([]));\n  }, [siteId, heeftShop]);\n\n  const vandaag = useMemo(() => {\n    const dag = String(new Date().getUTCDate()).padStart(2, \"0\");\n    return maand?.days?.[dag] ?? 0;\n  }, [maand]);\n  const topPaden = useMemo(\n    () => Object.entries(maand?.paths ?? {}).sort((a, b) => b[1] - a[1]).slice(0, 3),\n    [maand],\n  );\n\n  async function slaLinksOp() {\n    if (!linksBewerken) return;\n    const schoon = linksBewerken.filter((l) => l.label.trim() && l.href.trim());\n    const app = getFirebaseApp();\n    if (!app) return;\n    setLinksOpslaan(true);\n    try {\n      // Zelfde route als de rest van de instellingen: de saveSiteSettings-callable (merge).\n      const fn = callable(app, \"saveSiteSettings\");\n      await fn({ siteId, settings: { dashboardLinks: schoon } });\n      setLinks(schoon);\n      setLinksBewerken(null);\n      toast({ title: \"Snelkoppelingen opgeslagen\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: (e as Error).message, tone: \"error\" });\n    } finally {\n      setLinksOpslaan(false);\n    }\n  }\n\n  return (\n    <div className=\"grid gap-4\">\n      {/* ── Zo werkt het ── */}\n      <Card>\n        <h2 className=\"text-sm font-semibold text-slate-800\">Zo werkt je site</h2>\n        <div className=\"mt-2 grid gap-2 text-sm text-slate-600 md:grid-cols-3\">\n          <p>\n            <strong className=\"text-slate-800\">1 · Bewerk op de site zelf.</strong> Klik rechtsboven op{\" \"}\n            <em>Bekijk site</em> en kies <em>Bewerken</em> in de zwarte balk. Elk blok krijgt een{\" \"}\n            potlood (tekst) en een tandwiel (instellingen) — je typt gewoon in de pagina.\n          </p>\n          <p>\n            <strong className=\"text-slate-800\">2 · Publiceer als het goed is.</strong> Alles wat je\n            wijzigt is eerst een <em>werkversie</em>: bezoekers zien er niets van. Pas de knop{\" \"}\n            <em>Publiceren</em> (rechtsonder) zet het live — en <em>Verwerpen</em> gooit het weg.\n          </p>\n          <p>\n            <strong className=\"text-slate-800\">3 · De rest staat hier.</strong> Nieuwe pagina&apos;s, het\n            menu, foto&apos;s, formulieren{heeftShop ? \", de webwinkel\" : \"\"} en statistieken vind je in\n            de secties hiernaast. Onderaan de zijbalk staat ook een korte helptekst.\n          </p>\n        </div>\n      </Card>\n\n      <div className=\"grid gap-4 md:grid-cols-2\">\n        {/* ── Statistieken ── */}\n        <Card>\n          <WidgetKop titel=\"Bezoek deze maand\" tab=\"stats\" tabLabel=\"Statistieken\" />\n          {maand === undefined ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : maand === null ? (\n            <p className=\"text-sm text-slate-500\">Nog geen bezoekersdata deze maand.</p>\n          ) : (\n            <div className=\"grid gap-3\">\n              <div className=\"flex items-baseline gap-4\">\n                <p><span className=\"text-2xl font-semibold text-slate-900\">{maand.total ?? 0}</span>{\" \"}\n                  <span className=\"text-xs text-slate-500\">weergaven deze maand</span></p>\n                <p><span className=\"text-lg font-semibold text-slate-700\">{vandaag}</span>{\" \"}\n                  <span className=\"text-xs text-slate-500\">vandaag</span></p>\n              </div>\n              {topPaden.length > 0 && (\n                <ul className=\"grid gap-1 text-sm text-slate-600\">\n                  {topPaden.map(([pad, n]) => (\n                    <li key={pad} className=\"flex justify-between gap-2\">\n                      <span className=\"truncate\" title={pad}>{pad}</span>\n                      <span className=\"shrink-0 text-slate-400\">{n}</span>\n                    </li>\n                  ))}\n                </ul>\n              )}\n            </div>\n          )}\n        </Card>\n\n        {/* ── Laatst bewerkte pagina's ── */}\n        <Card>\n          <WidgetKop titel=\"Laatst bewerkt\" tab=\"pages\" tabLabel=\"Pagina's\" />\n          {paginas === null ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : paginas.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">Nog geen bewerkte pagina&apos;s.</p>\n          ) : (\n            <ul className=\"grid gap-1\">\n              {paginas.map((p) => (\n                <li key={p.id}>\n                  <button\n                    type=\"button\"\n                    onClick={() => gaNaar(\"pages\")}\n                    className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                    title={`${p.title ?? p.id} — ${p.path ?? \"\"}`}\n                  >\n                    <span className=\"min-w-0\">\n                      <span className=\"block truncate text-slate-800\">{p.title ?? p.id}</span>\n                      <span className=\"block truncate text-xs text-slate-400\">{p.path}</span>\n                    </span>\n                    <span className=\"shrink-0 text-xs text-slate-400\">{fmtDatum(p.updatedAt)}</span>\n                  </button>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n\n        {/* ── Bestellingen (alleen met shop) ── */}\n        {heeftShop && (\n          <Card>\n            <WidgetKop titel=\"Laatste bestellingen\" tab=\"shop\" tabLabel=\"Webwinkel\" />\n            {orders === null ? (\n              <p className=\"text-sm text-slate-500\">Laden…</p>\n            ) : orders.length === 0 ? (\n              <p className=\"text-sm text-slate-500\">Nog geen bestellingen.</p>\n            ) : (\n              <ul className=\"grid gap-1\">\n                {orders.map((o) => (\n                  <li key={o.id}>\n                    <button\n                      type=\"button\"\n                      onClick={() => gaNaar(\"shop\")}\n                      className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                    >\n                      <span className=\"min-w-0\">\n                        <span className=\"block truncate text-slate-800\">{o.customer?.name ?? \"Onbekend\"}</span>\n                        <span className=\"block text-xs text-slate-400\">{fmtDatum(o.createdAt)}</span>\n                      </span>\n                      <span className=\"flex shrink-0 items-center gap-2\">\n                        {typeof o.amount?.totalCents === \"number\" && (\n                          <span className=\"text-sm font-medium text-slate-700\">{formatCents(o.amount.totalCents)}</span>\n                        )}\n                        <Badge tone={o.status === \"paid\" || o.status === \"shipped\" ? \"green\" : \"amber\"}>\n                          {o.status ?? \"?\"}\n                        </Badge>\n                      </span>\n                    </button>\n                  </li>\n                ))}\n              </ul>\n            )}\n          </Card>\n        )}\n\n        {/* ── Formulieren ── */}\n        <Card>\n          <WidgetKop titel=\"Formulieren\" tab=\"forms\" tabLabel=\"Formulieren\" />\n          {formulieren === null ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : formulieren.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">Nog geen formulieren.</p>\n          ) : (\n            <ul className=\"grid gap-1\">\n              {formulieren.map((f) => (\n                <li key={f.id}>\n                  <button\n                    type=\"button\"\n                    onClick={() => gaNaar(\"forms\")}\n                    className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                  >\n                    <span className=\"truncate text-slate-800\" title={f.name}>{f.name}</span>\n                    <span className=\"shrink-0 text-xs text-slate-500\">\n                      {f.aantal} {f.aantal === 1 ? \"inzending\" : \"inzendingen\"}\n                      {f.laatste ? ` · laatste ${fmtDatum(f.laatste)}` : \"\"}\n                    </span>\n                  </button>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n\n        {/* ── Snelkoppelingen ── */}\n        <Card>\n          <div className=\"mb-3 flex items-center justify-between gap-2\">\n            <h2 className=\"text-sm font-semibold text-slate-800\">Snelkoppelingen</h2>\n            {magInstellen && linksBewerken === null && (\n              <Button variant=\"secondary\" size=\"sm\" onClick={() => setLinksBewerken(links.length ? [...links] : [{ label: \"\", href: \"\" }])}>\n                Instellen\n              </Button>\n            )}\n          </div>\n          {linksBewerken ? (\n            <div className=\"grid gap-2\">\n              <div className=\"grid grid-cols-[1fr_1.4fr_auto] gap-2 text-xs font-medium text-slate-500\">\n                <span>Naam</span>\n                <span>Adres</span>\n                <span aria-hidden=\"true\" />\n              </div>\n              {linksBewerken.map((l, i) => (\n                <div key={i} className=\"grid grid-cols-[1fr_1.4fr_auto] gap-2\">\n                  <Input value={l.label} placeholder=\"bv. Webwinkel\" aria-label=\"Naam van de snelkoppeling\"\n                    onChange={(e) => setLinksBewerken(linksBewerken.map((x, j) => (j === i ? { ...x, label: e.target.value } : x)))} />\n                  <Input value={l.href} placeholder=\"/webwinkel of https://…\" aria-label=\"Adres van de snelkoppeling\"\n                    onChange={(e) => setLinksBewerken(linksBewerken.map((x, j) => (j === i ? { ...x, href: e.target.value } : x)))} />\n                  <Button variant=\"ghost\" size=\"sm\" aria-label=\"Verwijderen\"\n                    onClick={() => setLinksBewerken(linksBewerken.filter((_, j) => j !== i))}>✕</Button>\n                </div>\n              ))}\n              <div className=\"flex items-center justify-between gap-2\">\n                <Button variant=\"secondary\" size=\"sm\" disabled={linksBewerken.length >= 12}\n                  onClick={() => setLinksBewerken([...linksBewerken, { label: \"\", href: \"\" }])}>\n                  + Snelkoppeling\n                </Button>\n                <div className=\"flex gap-2\">\n                  <Button variant=\"secondary\" size=\"sm\" onClick={() => setLinksBewerken(null)}>Annuleren</Button>\n                  <Button size=\"sm\" disabled={linksOpslaan} onClick={() => void slaLinksOp()}>\n                    {linksOpslaan ? \"Bezig…\" : \"Opslaan\"}\n                  </Button>\n                </div>\n              </div>\n            </div>\n          ) : links.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">\n              {magInstellen\n                ? \"Nog geen snelkoppelingen. Zet hier de plekken waar je vaak moet zijn — je webwinkel, een pagina, een extern systeem.\"\n                : \"Nog geen snelkoppelingen ingesteld.\"}\n            </p>\n          ) : (\n            <ul className=\"flex flex-wrap gap-2\">\n              {links.map((l, i) => (\n                <li key={i}>\n                  <a\n                    href={l.href}\n                    target={/^https?:\\/\\//i.test(l.href) ? \"_blank\" : undefined}\n                    rel=\"noreferrer\"\n                    className=\"inline-flex items-center gap-1.5 rounded-lg border border-slate-200 px-3 py-1.5 text-sm text-slate-700 hover:bg-slate-100\"\n                  >\n                    {l.label} <span aria-hidden=\"true\" className=\"text-slate-400\">↗</span>\n                  </a>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA4EM,cAEE,YAFF;AA7DN,SAAS,WAAW,SAAS,gBAAgB;AAC7C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,OAAO,sBAAsB;AACtC,SAAS,gBAAgB;AACzB,SAAS,eAAe;AACxB,SAAS,qBAAqB;AAC9B,SAAS,kBAAkB;AAC3B,SAAS,mBAAmB;AAC5B,SAAS,OAAO,QAAQ,MAAM,aAAa;AAC3C,SAAS,gBAAgB;AACzB,SAAS,mBAAmB;AA+B5B,SAAS,SAAS,GAAuB;AACvC,MAAI,CAAC,GAAG,OAAQ,QAAO;AACvB,SAAO,EAAE,OAAO,EAAE,eAAe,SAAS,EAAE,WAAW,SAAS,WAAW,QAAQ,CAAC;AACtF;AAGA,SAAS,UAAU,EAAE,OAAO,KAAK,SAAS,GAAuD;AAC/F,QAAM,SAAS,YAAY;AAC3B,SACE,qBAAC,SAAI,WAAU,gDACb;AAAA,wBAAC,QAAG,WAAU,wCAAwC,iBAAM;AAAA,IAC3D,OACC;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,SAAS,MAAM,OAAO,GAAG;AAAA,QACzB,WAAU;AAAA,QAET;AAAA,sBAAY;AAAA,UAAe;AAAA;AAAA;AAAA,IAC9B;AAAA,KAEJ;AAEJ;AAEO,SAAS,eAAe,EAAE,OAAO,GAAuB;AAC7D,QAAM,EAAE,KAAK,IAAI,QAAQ;AACzB,QAAM,EAAE,UAAU,IAAI,WAAW;AACjC,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,SAAS,YAAY;AAC3B,QAAM,YAAY,UAAU,IAAI,MAAM;AACtC,QAAM,eAAe,cAAc,IAAI;AAEvC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAiC,IAAI;AACnE,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAuC,MAAS;AAC1E,QAAM,CAAC,QAAQ,SAAS,IAAI,SAAgC,IAAI;AAChE,QAAM,CAAC,aAAa,cAAc,IAAI,SAAiC,IAAI;AAC3E,QAAM,CAAC,OAAO,QAAQ,IAAI,SAA0B,CAAC,CAAC;AACtD,QAAM,CAAC,eAAe,gBAAgB,IAAI,SAAiC,IAAI;AAC/E,QAAM,CAAC,cAAc,eAAe,IAAI,SAAS,KAAK;AAEtD,YAAU,MAAM;AACd,UAAM,KAAK,MAAM;AACjB,QAAI,CAAC,IAAI;AACP,iBAAW,CAAC,CAAC;AACb,eAAS,IAAI;AACb,gBAAU,CAAC,CAAC;AACZ,qBAAe,CAAC,CAAC;AACjB;AAAA,IACF;AAIA,YAAQ,MAAM,WAAW,IAAI,SAAS,QAAQ,QAAQ,GAAG,QAAQ,aAAa,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,EAC7F,KAAK,CAAC,SAAS,WAAW,KAAK,KAAK,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,GAAI,EAAE,KAAK,EAAgC,EAAE,CAAC,CAAC,EAC3G,MAAM,MAAM,WAAW,CAAC,CAAC,CAAC;AAG7B,UAAM,KAAK,oBAAI,KAAK;AACpB,UAAM,UAAU,GAAG,GAAG,eAAe,CAAC,IAAI,OAAO,GAAG,YAAY,IAAI,CAAC,EAAE,SAAS,GAAG,GAAG,CAAC;AACvF,WAAO,IAAI,IAAI,SAAS,QAAQ,SAAS,OAAO,CAAC,EAC9C,KAAK,CAAC,SAAS,SAAS,KAAK,OAAO,IAAK,KAAK,KAAK,IAAkB,IAAI,CAAC,EAC1E,MAAM,MAAM,SAAS,IAAI,CAAC;AAG7B,QAAI,WAAW;AACb,cAAQ,MAAM,WAAW,IAAI,SAAS,QAAQ,QAAQ,GAAG,QAAQ,aAAa,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,EAC7F,KAAK,CAAC,SAAS,UAAU,KAAK,KAAK,IAAI,CAAC,OAAO,EAAE,IAAI,EAAE,IAAI,GAAI,EAAE,KAAK,EAA+B,EAAE,CAAC,CAAC,EACzG,MAAM,MAAM,UAAU,CAAC,CAAC,CAAC;AAAA,IAC9B,OAAO;AACL,gBAAU,CAAC,CAAC;AAAA,IACd;AAIA,YAAQ,WAAW,IAAI,SAAS,QAAQ,OAAO,CAAC,EAC7C,KAAK,OAAO,SAAS;AACpB,YAAM,QAAQ,KAAK,KAAK,MAAM,GAAG,CAAC;AAClC,YAAM,MAAM,MAAM,QAAQ;AAAA,QACxB,MAAM,IAAI,OAAO,MAAM;AACrB,gBAAM,OAAO,WAAW,IAAI,SAAS,QAAQ,SAAS,EAAE,IAAI,aAAa;AACzE,gBAAM,CAAC,OAAO,OAAO,IAAI,MAAM,QAAQ,IAAI;AAAA,YACzC,mBAAmB,IAAI,EAAE,KAAK,CAAC,MAAM,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,MAAM,CAAC;AAAA,YAClE,QAAQ,MAAM,MAAM,QAAQ,aAAa,MAAM,GAAG,MAAM,CAAC,CAAC,CAAC,EACxD,KAAK,CAAC,MAAO,EAAE,KAAK,CAAC,GAAG,KAAK,GAA6C,SAAS,EACnF,MAAM,MAAM,MAAS;AAAA,UAC1B,CAAC;AACD,iBAAO,EAAE,IAAI,EAAE,IAAI,MAAO,EAAE,KAAK,EAAwB,QAAQ,EAAE,IAAI,QAAQ,OAAO,QAAQ;AAAA,QAChG,CAAC;AAAA,MACH;AACA,qBAAe,GAAG;AAAA,IACpB,CAAC,EACA,MAAM,MAAM,eAAe,CAAC,CAAC,CAAC;AAGjC,WAAO,IAAI,IAAI,SAAS,QAAQ,YAAY,MAAM,CAAC,EAChD,KAAK,CAAC,SAAS;AACd,YAAM,IAAI,KAAK,OAAO,IAAK,KAAK,KAAK,IAA6C,CAAC;AACnF,eAAS,MAAM,QAAQ,EAAE,cAAc,IAAI,EAAE,iBAAiB,CAAC,CAAC;AAAA,IAClE,CAAC,EACA,MAAM,MAAM,SAAS,CAAC,CAAC,CAAC;AAAA,EAC7B,GAAG,CAAC,QAAQ,SAAS,CAAC;AAEtB,QAAM,UAAU,QAAQ,MAAM;AAC5B,UAAM,MAAM,QAAO,oBAAI,KAAK,GAAE,WAAW,CAAC,EAAE,SAAS,GAAG,GAAG;AAC3D,WAAO,OAAO,OAAO,GAAG,KAAK;AAAA,EAC/B,GAAG,CAAC,KAAK,CAAC;AACV,QAAM,WAAW;AAAA,IACf,MAAM,OAAO,QAAQ,OAAO,SAAS,CAAC,CAAC,EAAE,KAAK,CAAC,GAAG,MAAM,EAAE,CAAC,IAAI,EAAE,CAAC,CAAC,EAAE,MAAM,GAAG,CAAC;AAAA,IAC/E,CAAC,KAAK;AAAA,EACR;AAEA,iBAAe,aAAa;AAC1B,QAAI,CAAC,cAAe;AACpB,UAAM,SAAS,cAAc,OAAO,CAAC,MAAM,EAAE,MAAM,KAAK,KAAK,EAAE,KAAK,KAAK,CAAC;AAC1E,UAAM,MAAM,eAAe;AAC3B,QAAI,CAAC,IAAK;AACV,oBAAgB,IAAI;AACpB,QAAI;AAEF,YAAM,KAAK,SAAS,KAAK,kBAAkB;AAC3C,YAAM,GAAG,EAAE,QAAQ,UAAU,EAAE,gBAAgB,OAAO,EAAE,CAAC;AACzD,eAAS,MAAM;AACf,uBAAiB,IAAI;AACrB,YAAM,EAAE,OAAO,8BAA8B,MAAM,UAAU,CAAC;AAAA,IAChE,SAAS,GAAG;AACV,YAAM,EAAE,OAAO,mBAAmB,aAAc,EAAY,SAAS,MAAM,QAAQ,CAAC;AAAA,IACtF,UAAE;AACA,sBAAgB,KAAK;AAAA,IACvB;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,cAEb;AAAA,yBAAC,QACC;AAAA,0BAAC,QAAG,WAAU,wCAAuC,8BAAgB;AAAA,MACrE,qBAAC,SAAI,WAAU,yDACb;AAAA,6BAAC,OACC;AAAA,8BAAC,YAAO,WAAU,kBAAiB,4CAA2B;AAAA,UAAS;AAAA,UAAqB;AAAA,UAC5F,oBAAC,QAAG,yBAAW;AAAA,UAAK;AAAA,UAAS,oBAAC,QAAG,sBAAQ;AAAA,UAAK;AAAA,UAAwC;AAAA,UAAI;AAAA,WAE5F;AAAA,QACA,qBAAC,OACC;AAAA,8BAAC,YAAO,WAAU,kBAAiB,+CAA8B;AAAA,UAAS;AAAA,UACrD,oBAAC,QAAG,wBAAU;AAAA,UAAK;AAAA,UAA2C;AAAA,UACnF,oBAAC,QAAG,wBAAU;AAAA,UAAK;AAAA,UAAiC,oBAAC,QAAG,uBAAS;AAAA,UAAK;AAAA,WACxE;AAAA,QACA,qBAAC,OACC;AAAA,8BAAC,YAAO,WAAU,kBAAiB,wCAAuB;AAAA,UAAS;AAAA,UACpC,YAAY,mBAAmB;AAAA,UAAG;AAAA,WAEnE;AAAA,SACF;AAAA,OACF;AAAA,IAEA,qBAAC,SAAI,WAAU,6BAEb;AAAA,2BAAC,QACC;AAAA,4BAAC,aAAU,OAAM,qBAAoB,KAAI,SAAQ,UAAS,gBAAe;AAAA,QACxE,UAAU,SACT,oBAAC,OAAE,WAAU,0BAAyB,yBAAM,IAC1C,UAAU,OACZ,oBAAC,OAAE,WAAU,0BAAyB,gDAAkC,IAExE,qBAAC,SAAI,WAAU,cACb;AAAA,+BAAC,SAAI,WAAU,6BACb;AAAA,iCAAC,OAAE;AAAA,kCAAC,UAAK,WAAU,yCAAyC,gBAAM,SAAS,GAAE;AAAA,cAAQ;AAAA,cACnF,oBAAC,UAAK,WAAU,0BAAyB,kCAAoB;AAAA,eAAO;AAAA,YACtE,qBAAC,OAAE;AAAA,kCAAC,UAAK,WAAU,wCAAwC,mBAAQ;AAAA,cAAQ;AAAA,cACzE,oBAAC,UAAK,WAAU,0BAAyB,qBAAO;AAAA,eAAO;AAAA,aAC3D;AAAA,UACC,SAAS,SAAS,KACjB,oBAAC,QAAG,WAAU,qCACX,mBAAS,IAAI,CAAC,CAAC,KAAK,CAAC,MACpB,qBAAC,QAAa,WAAU,8BACtB;AAAA,gCAAC,UAAK,WAAU,YAAW,OAAO,KAAM,eAAI;AAAA,YAC5C,oBAAC,UAAK,WAAU,2BAA2B,aAAE;AAAA,eAFtC,GAGT,CACD,GACH;AAAA,WAEJ;AAAA,SAEJ;AAAA,MAGA,qBAAC,QACC;AAAA,4BAAC,aAAU,OAAM,kBAAiB,KAAI,SAAQ,UAAS,YAAW;AAAA,QACjE,YAAY,OACX,oBAAC,OAAE,WAAU,0BAAyB,yBAAM,IAC1C,QAAQ,WAAW,IACrB,oBAAC,OAAE,WAAU,0BAAyB,yCAAgC,IAEtE,oBAAC,QAAG,WAAU,cACX,kBAAQ,IAAI,CAAC,MACZ,oBAAC,QACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM,OAAO,OAAO;AAAA,YAC7B,WAAU;AAAA,YACV,OAAO,GAAG,EAAE,SAAS,EAAE,EAAE,WAAM,EAAE,QAAQ,EAAE;AAAA,YAE3C;AAAA,mCAAC,UAAK,WAAU,WACd;AAAA,oCAAC,UAAK,WAAU,iCAAiC,YAAE,SAAS,EAAE,IAAG;AAAA,gBACjE,oBAAC,UAAK,WAAU,yCAAyC,YAAE,MAAK;AAAA,iBAClE;AAAA,cACA,oBAAC,UAAK,WAAU,mCAAmC,mBAAS,EAAE,SAAS,GAAE;AAAA;AAAA;AAAA,QAC3E,KAZO,EAAE,EAaX,CACD,GACH;AAAA,SAEJ;AAAA,MAGC,aACC,qBAAC,QACC;AAAA,4BAAC,aAAU,OAAM,wBAAuB,KAAI,QAAO,UAAS,aAAY;AAAA,QACvE,WAAW,OACV,oBAAC,OAAE,WAAU,0BAAyB,yBAAM,IAC1C,OAAO,WAAW,IACpB,oBAAC,OAAE,WAAU,0BAAyB,oCAAsB,IAE5D,oBAAC,QAAG,WAAU,cACX,iBAAO,IAAI,CAAC,MACX,oBAAC,QACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM,OAAO,MAAM;AAAA,YAC5B,WAAU;AAAA,YAEV;AAAA,mCAAC,UAAK,WAAU,WACd;AAAA,oCAAC,UAAK,WAAU,iCAAiC,YAAE,UAAU,QAAQ,YAAW;AAAA,gBAChF,oBAAC,UAAK,WAAU,gCAAgC,mBAAS,EAAE,SAAS,GAAE;AAAA,iBACxE;AAAA,cACA,qBAAC,UAAK,WAAU,oCACb;AAAA,uBAAO,EAAE,QAAQ,eAAe,YAC/B,oBAAC,UAAK,WAAU,sCAAsC,sBAAY,EAAE,OAAO,UAAU,GAAE;AAAA,gBAEzF,oBAAC,SAAM,MAAM,EAAE,WAAW,UAAU,EAAE,WAAW,YAAY,UAAU,SACpE,YAAE,UAAU,KACf;AAAA,iBACF;AAAA;AAAA;AAAA,QACF,KAlBO,EAAE,EAmBX,CACD,GACH;AAAA,SAEJ;AAAA,MAIF,qBAAC,QACC;AAAA,4BAAC,aAAU,OAAM,eAAc,KAAI,SAAQ,UAAS,eAAc;AAAA,QACjE,gBAAgB,OACf,oBAAC,OAAE,WAAU,0BAAyB,yBAAM,IAC1C,YAAY,WAAW,IACzB,oBAAC,OAAE,WAAU,0BAAyB,mCAAqB,IAE3D,oBAAC,QAAG,WAAU,cACX,sBAAY,IAAI,CAAC,MAChB,oBAAC,QACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAK;AAAA,YACL,SAAS,MAAM,OAAO,OAAO;AAAA,YAC7B,WAAU;AAAA,YAEV;AAAA,kCAAC,UAAK,WAAU,2BAA0B,OAAO,EAAE,MAAO,YAAE,MAAK;AAAA,cACjE,qBAAC,UAAK,WAAU,mCACb;AAAA,kBAAE;AAAA,gBAAO;AAAA,gBAAE,EAAE,WAAW,IAAI,cAAc;AAAA,gBAC1C,EAAE,UAAU,iBAAc,SAAS,EAAE,OAAO,CAAC,KAAK;AAAA,iBACrD;AAAA;AAAA;AAAA,QACF,KAXO,EAAE,EAYX,CACD,GACH;AAAA,SAEJ;AAAA,MAGA,qBAAC,QACC;AAAA,6BAAC,SAAI,WAAU,gDACb;AAAA,8BAAC,QAAG,WAAU,wCAAuC,6BAAe;AAAA,UACnE,gBAAgB,kBAAkB,QACjC,oBAAC,UAAO,SAAQ,aAAY,MAAK,MAAK,SAAS,MAAM,iBAAiB,MAAM,SAAS,CAAC,GAAG,KAAK,IAAI,CAAC,EAAE,OAAO,IAAI,MAAM,GAAG,CAAC,CAAC,GAAG,uBAE9H;AAAA,WAEJ;AAAA,QACC,gBACC,qBAAC,SAAI,WAAU,cACb;AAAA,+BAAC,SAAI,WAAU,4EACb;AAAA,gCAAC,UAAK,kBAAI;AAAA,YACV,oBAAC,UAAK,mBAAK;AAAA,YACX,oBAAC,UAAK,eAAY,QAAO;AAAA,aAC3B;AAAA,UACC,cAAc,IAAI,CAAC,GAAG,MACrB,qBAAC,SAAY,WAAU,yCACrB;AAAA;AAAA,cAAC;AAAA;AAAA,gBAAM,OAAO,EAAE;AAAA,gBAAO,aAAY;AAAA,gBAAgB,cAAW;AAAA,gBAC5D,UAAU,CAAC,MAAM,iBAAiB,cAAc,IAAI,CAAC,GAAG,MAAO,MAAM,IAAI,EAAE,GAAG,GAAG,OAAO,EAAE,OAAO,MAAM,IAAI,CAAE,CAAC;AAAA;AAAA,YAAG;AAAA,YACnH;AAAA,cAAC;AAAA;AAAA,gBAAM,OAAO,EAAE;AAAA,gBAAM,aAAY;AAAA,gBAA0B,cAAW;AAAA,gBACrE,UAAU,CAAC,MAAM,iBAAiB,cAAc,IAAI,CAAC,GAAG,MAAO,MAAM,IAAI,EAAE,GAAG,GAAG,MAAM,EAAE,OAAO,MAAM,IAAI,CAAE,CAAC;AAAA;AAAA,YAAG;AAAA,YAClH;AAAA,cAAC;AAAA;AAAA,gBAAO,SAAQ;AAAA,gBAAQ,MAAK;AAAA,gBAAK,cAAW;AAAA,gBAC3C,SAAS,MAAM,iBAAiB,cAAc,OAAO,CAAC,GAAG,MAAM,MAAM,CAAC,CAAC;AAAA,gBAAG;AAAA;AAAA,YAAC;AAAA,eANrE,CAOV,CACD;AAAA,UACD,qBAAC,SAAI,WAAU,2CACb;AAAA;AAAA,cAAC;AAAA;AAAA,gBAAO,SAAQ;AAAA,gBAAY,MAAK;AAAA,gBAAK,UAAU,cAAc,UAAU;AAAA,gBACtE,SAAS,MAAM,iBAAiB,CAAC,GAAG,eAAe,EAAE,OAAO,IAAI,MAAM,GAAG,CAAC,CAAC;AAAA,gBAAG;AAAA;AAAA,YAEhF;AAAA,YACA,qBAAC,SAAI,WAAU,cACb;AAAA,kCAAC,UAAO,SAAQ,aAAY,MAAK,MAAK,SAAS,MAAM,iBAAiB,IAAI,GAAG,uBAAS;AAAA,cACtF,oBAAC,UAAO,MAAK,MAAK,UAAU,cAAc,SAAS,MAAM,KAAK,WAAW,GACtE,yBAAe,gBAAW,WAC7B;AAAA,eACF;AAAA,aACF;AAAA,WACF,IACE,MAAM,WAAW,IACnB,oBAAC,OAAE,WAAU,0BACV,yBACG,8HACA,uCACN,IAEA,oBAAC,QAAG,WAAU,wBACX,gBAAM,IAAI,CAAC,GAAG,MACb,oBAAC,QACC;AAAA,UAAC;AAAA;AAAA,YACC,MAAM,EAAE;AAAA,YACR,QAAQ,gBAAgB,KAAK,EAAE,IAAI,IAAI,WAAW;AAAA,YAClD,KAAI;AAAA,YACJ,WAAU;AAAA,YAET;AAAA,gBAAE;AAAA,cAAM;AAAA,cAAC,oBAAC,UAAK,eAAY,QAAO,WAAU,kBAAiB,oBAAC;AAAA;AAAA;AAAA,QACjE,KARO,CAST,CACD,GACH;AAAA,SAEJ;AAAA,OACF;AAAA,KACF;AAEJ;","names":[]}
+{"version":3,"sources":["../../../src/admin/dashboard/DashboardPanel.tsx"],"sourcesContent":["\"use client\";\n\n/**\n * Startpagina van /beheer (7.16).\n *\n * /beheer opende recht in het pagina-overzicht: een lijst technische titels als eerste indruk, en\n * nergens een plek die uitlegt hoe het systeem in elkaar zit. Deze startpagina doet drie dingen:\n * uitleggen hoe je de site bewerkt (op de site zelf, niet hier), in één oogopslag tonen wat er\n * gebeurt (bezoek, bestellingen, inzendingen, laatst bewerkt), en snelkoppelingen bieden die de\n * siteadmin zelf kan instellen.\n *\n * Bewust eenmalige reads (geen live listeners): dit is een overzicht bij binnenkomst, geen\n * monitor. Elke widget vangt zijn eigen fouten — een dichtgezette collectie (rules, module uit)\n * mag nooit de hele startpagina blokkeren.\n */\nimport { useEffect, useMemo, useState } from \"react\";\nimport {\n  collection,\n  doc,\n  getCountFromServer,\n  getDoc,\n  getDocs,\n  limit,\n  orderBy,\n  query,\n} from \"firebase/firestore\";\nimport type { Timestamp } from \"firebase/firestore\";\nimport { getDb, getFirebaseApp } from \"../../firebase/client\";\nimport { callable } from \"../../firebase/functionsClient\";\nimport { useAuth } from \"../../auth/AuthProvider\";\nimport { canManageSite } from \"../../auth/roles\";\nimport { useModules } from \"../../modules/context\";\nimport { formatCents } from \"../../schema/shop\";\nimport { Badge, Button, Card, Input } from \"../ui/primitives\";\nimport { useToast } from \"../ui/toast\";\nimport { useAdminNav } from \"../navContext\";\n\ninterface RecentePagina {\n  id: string;\n  title?: string;\n  path?: string;\n  /** Timestamp uit de editor, ISO-string uit import-scripts — zie updatedMs(). */\n  updatedAt?: unknown;\n}\ninterface MaandStat {\n  total?: number;\n  days?: Record<string, number>;\n  paths?: Record<string, number>;\n}\ninterface RecenteOrder {\n  id: string;\n  status?: string;\n  createdAt?: Timestamp;\n  customer?: { name?: string };\n  amount?: { totalCents?: number };\n}\ninterface FormOverzicht {\n  id: string;\n  name: string;\n  aantal: number;\n  laatste?: Timestamp;\n}\ninterface Snelkoppeling {\n  label: string;\n  href: string;\n}\n\n/**\n * `updatedAt` is in de praktijk een Firestore-Timestamp (editor-saves) ÓF een ISO-string\n * (import-/migratiescripts schrijven via REST) — live aangetroffen op christelijkkraamcadeau,\n * dóór elkaar in dezelfde collectie. Firestore sorteert die in aparte typegroepen, dus een\n * server-side orderBy geeft dan een fout beeld; we normaliseren en sorteren daarom client-side.\n */\nfunction updatedMs(v: unknown): number {\n  if (v && typeof (v as Timestamp).toDate === \"function\") return (v as Timestamp).toDate().getTime();\n  if (typeof v === \"string\") {\n    const t = Date.parse(v);\n    return Number.isNaN(t) ? 0 : t;\n  }\n  return 0;\n}\n\nfunction fmtDatum(v: unknown): string {\n  const ms = updatedMs(v);\n  if (!ms) return \"—\";\n  return new Date(ms).toLocaleString(\"nl-NL\", { dateStyle: \"short\", timeStyle: \"short\" });\n}\n\n/** Kop van een widget met een \"ga ernaartoe\"-pijl die naar het bijbehorende paneel springt. */\nfunction WidgetKop({ titel, tab, tabLabel }: { titel: string; tab?: string; tabLabel?: string }) {\n  const gaNaar = useAdminNav();\n  return (\n    <div className=\"mb-3 flex items-center justify-between gap-2\">\n      <h2 className=\"text-sm font-semibold text-slate-800\">{titel}</h2>\n      {tab && (\n        <button\n          type=\"button\"\n          onClick={() => gaNaar(tab)}\n          className=\"shrink-0 text-xs font-medium text-brand-700 hover:underline focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:outline-none\"\n        >\n          {tabLabel ?? \"Bekijk alles\"} →\n        </button>\n      )}\n    </div>\n  );\n}\n\nexport function DashboardPanel({ siteId }: { siteId: string }) {\n  const { role } = useAuth();\n  const { activeIds } = useModules();\n  const { toast } = useToast();\n  const gaNaar = useAdminNav();\n  const heeftShop = activeIds.has(\"shop\");\n  const magInstellen = canManageSite(role);\n\n  const [paginas, setPaginas] = useState<RecentePagina[] | null>(null);\n  const [maand, setMaand] = useState<MaandStat | null | undefined>(undefined);\n  const [orders, setOrders] = useState<RecenteOrder[] | null>(null);\n  const [formulieren, setFormulieren] = useState<FormOverzicht[] | null>(null);\n  const [links, setLinks] = useState<Snelkoppeling[]>([]);\n  const [linksBewerken, setLinksBewerken] = useState<Snelkoppeling[] | null>(null);\n  const [linksOpslaan, setLinksOpslaan] = useState(false);\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) {\n      setPaginas([]);\n      setMaand(null);\n      setOrders([]);\n      setFormulieren([]);\n      return;\n    }\n\n    // Laatst bewerkte pagina's. Bewust GEEN server-side orderBy op updatedAt: dat veld is een\n    // mengsel van Timestamps en ISO-strings (zie updatedMs) en Firestore sorteert per typegroep.\n    // Drafts-collecties zijn klein; alles ophalen en zelf sorteren is hier de betrouwbare weg.\n    getDocs(collection(db, \"sites\", siteId, \"drafts\"))\n      .then((snap) =>\n        setPaginas(\n          snap.docs\n            .map((d) => ({ id: d.id, ...(d.data() as Omit<RecentePagina, \"id\">) }))\n            .sort((a, b) => updatedMs(b.updatedAt) - updatedMs(a.updatedAt))\n            .slice(0, 5),\n        ),\n      )\n      .catch(() => setPaginas([]));\n\n    // Bezoek deze maand (zelfde bron als het Statistieken-paneel).\n    const nu = new Date();\n    const maandId = `${nu.getUTCFullYear()}-${String(nu.getUTCMonth() + 1).padStart(2, \"0\")}`;\n    getDoc(doc(db, \"sites\", siteId, \"stats\", maandId))\n      .then((snap) => setMaand(snap.exists() ? (snap.data() as MaandStat) : null))\n      .catch(() => setMaand(null));\n\n    // Laatste bestellingen — alleen als de shop-module actief is.\n    if (heeftShop) {\n      getDocs(query(collection(db, \"sites\", siteId, \"orders\"), orderBy(\"createdAt\", \"desc\"), limit(5)))\n        .then((snap) => setOrders(snap.docs.map((d) => ({ id: d.id, ...(d.data() as Omit<RecenteOrder, \"id\">) }))))\n        .catch(() => setOrders([]));\n    } else {\n      setOrders([]);\n    }\n\n    // Formulieren: naam + aantal inzendingen + laatste inzending (aggregatie-count, geen\n    // volledige submissions-download). Max vier formulieren — de widget is een signaal, geen lijst.\n    getDocs(collection(db, \"sites\", siteId, \"forms\"))\n      .then(async (snap) => {\n        const forms = snap.docs.slice(0, 4);\n        const uit = await Promise.all(\n          forms.map(async (f) => {\n            const subs = collection(db, \"sites\", siteId, \"forms\", f.id, \"submissions\");\n            const [count, laatste] = await Promise.all([\n              getCountFromServer(subs).then((c) => c.data().count).catch(() => 0),\n              getDocs(query(subs, orderBy(\"createdAt\", \"desc\"), limit(1)))\n                .then((s) => (s.docs[0]?.data() as { createdAt?: Timestamp } | undefined)?.createdAt)\n                .catch(() => undefined),\n            ]);\n            return { id: f.id, name: (f.data() as { name?: string }).name ?? f.id, aantal: count, laatste };\n          }),\n        );\n        setFormulieren(uit);\n      })\n      .catch(() => setFormulieren([]));\n\n    // Snelkoppelingen uit settings/site (editor mag lezen; instellen is siteadmin-werk).\n    getDoc(doc(db, \"sites\", siteId, \"settings\", \"site\"))\n      .then((snap) => {\n        const d = snap.exists() ? (snap.data() as { dashboardLinks?: Snelkoppeling[] }) : {};\n        setLinks(Array.isArray(d.dashboardLinks) ? d.dashboardLinks : []);\n      })\n      .catch(() => setLinks([]));\n  }, [siteId, heeftShop]);\n\n  const vandaag = useMemo(() => {\n    const dag = String(new Date().getUTCDate()).padStart(2, \"0\");\n    return maand?.days?.[dag] ?? 0;\n  }, [maand]);\n  const topPaden = useMemo(\n    () => Object.entries(maand?.paths ?? {}).sort((a, b) => b[1] - a[1]).slice(0, 3),\n    [maand],\n  );\n\n  async function slaLinksOp() {\n    if (!linksBewerken) return;\n    const schoon = linksBewerken.filter((l) => l.label.trim() && l.href.trim());\n    const app = getFirebaseApp();\n    if (!app) return;\n    setLinksOpslaan(true);\n    try {\n      // Zelfde route als de rest van de instellingen: de saveSiteSettings-callable (merge).\n      const fn = callable(app, \"saveSiteSettings\");\n      await fn({ siteId, settings: { dashboardLinks: schoon } });\n      setLinks(schoon);\n      setLinksBewerken(null);\n      toast({ title: \"Snelkoppelingen opgeslagen\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: (e as Error).message, tone: \"error\" });\n    } finally {\n      setLinksOpslaan(false);\n    }\n  }\n\n  return (\n    <div className=\"grid gap-4\">\n      {/* ── Zo werkt het ── */}\n      <Card>\n        <h2 className=\"text-sm font-semibold text-slate-800\">Zo werkt je site</h2>\n        <div className=\"mt-2 grid gap-2 text-sm text-slate-600 md:grid-cols-3\">\n          <p>\n            <strong className=\"text-slate-800\">1 · Bewerk op de site zelf.</strong> Klik rechtsboven op{\" \"}\n            <em>Bekijk site</em> en kies <em>Bewerken</em> in de zwarte balk. Elk blok krijgt een{\" \"}\n            potlood (tekst) en een tandwiel (instellingen) — je typt gewoon in de pagina.\n          </p>\n          <p>\n            <strong className=\"text-slate-800\">2 · Publiceer als het goed is.</strong> Alles wat je\n            wijzigt is eerst een <em>werkversie</em>: bezoekers zien er niets van. Pas de knop{\" \"}\n            <em>Publiceren</em> (rechtsonder) zet het live — en <em>Verwerpen</em> gooit het weg.\n          </p>\n          <p>\n            <strong className=\"text-slate-800\">3 · De rest staat hier.</strong> Nieuwe pagina&apos;s, het\n            menu, foto&apos;s, formulieren{heeftShop ? \", de webwinkel\" : \"\"} en statistieken vind je in\n            de secties hiernaast. Onderaan de zijbalk staat ook een korte helptekst.\n          </p>\n        </div>\n      </Card>\n\n      <div className=\"grid gap-4 md:grid-cols-2\">\n        {/* ── Statistieken ── */}\n        <Card>\n          <WidgetKop titel=\"Bezoek deze maand\" tab=\"stats\" tabLabel=\"Statistieken\" />\n          {maand === undefined ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : maand === null ? (\n            <p className=\"text-sm text-slate-500\">Nog geen bezoekersdata deze maand.</p>\n          ) : (\n            <div className=\"grid gap-3\">\n              <div className=\"flex items-baseline gap-4\">\n                <p><span className=\"text-2xl font-semibold text-slate-900\">{maand.total ?? 0}</span>{\" \"}\n                  <span className=\"text-xs text-slate-500\">weergaven deze maand</span></p>\n                <p><span className=\"text-lg font-semibold text-slate-700\">{vandaag}</span>{\" \"}\n                  <span className=\"text-xs text-slate-500\">vandaag</span></p>\n              </div>\n              {topPaden.length > 0 && (\n                <ul className=\"grid gap-1 text-sm text-slate-600\">\n                  {topPaden.map(([pad, n]) => (\n                    <li key={pad} className=\"flex justify-between gap-2\">\n                      <span className=\"truncate\" title={pad}>{pad}</span>\n                      <span className=\"shrink-0 text-slate-400\">{n}</span>\n                    </li>\n                  ))}\n                </ul>\n              )}\n            </div>\n          )}\n        </Card>\n\n        {/* ── Laatst bewerkte pagina's ── */}\n        <Card>\n          <WidgetKop titel=\"Laatst bewerkt\" tab=\"pages\" tabLabel=\"Pagina's\" />\n          {paginas === null ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : paginas.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">Nog geen bewerkte pagina&apos;s.</p>\n          ) : (\n            <ul className=\"grid gap-1\">\n              {paginas.map((p) => (\n                <li key={p.id}>\n                  <button\n                    type=\"button\"\n                    onClick={() => gaNaar(\"pages\")}\n                    className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                    title={`${p.title ?? p.id} — ${p.path ?? \"\"}`}\n                  >\n                    <span className=\"min-w-0\">\n                      <span className=\"block truncate text-slate-800\">{p.title ?? p.id}</span>\n                      <span className=\"block truncate text-xs text-slate-400\">{p.path}</span>\n                    </span>\n                    <span className=\"shrink-0 text-xs text-slate-400\">{fmtDatum(p.updatedAt)}</span>\n                  </button>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n\n        {/* ── Bestellingen (alleen met shop) ── */}\n        {heeftShop && (\n          <Card>\n            <WidgetKop titel=\"Laatste bestellingen\" tab=\"shop\" tabLabel=\"Webwinkel\" />\n            {orders === null ? (\n              <p className=\"text-sm text-slate-500\">Laden…</p>\n            ) : orders.length === 0 ? (\n              <p className=\"text-sm text-slate-500\">Nog geen bestellingen.</p>\n            ) : (\n              <ul className=\"grid gap-1\">\n                {orders.map((o) => (\n                  <li key={o.id}>\n                    <button\n                      type=\"button\"\n                      onClick={() => gaNaar(\"shop\")}\n                      className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                    >\n                      <span className=\"min-w-0\">\n                        <span className=\"block truncate text-slate-800\">{o.customer?.name ?? \"Onbekend\"}</span>\n                        <span className=\"block text-xs text-slate-400\">{fmtDatum(o.createdAt)}</span>\n                      </span>\n                      <span className=\"flex shrink-0 items-center gap-2\">\n                        {typeof o.amount?.totalCents === \"number\" && (\n                          <span className=\"text-sm font-medium text-slate-700\">{formatCents(o.amount.totalCents)}</span>\n                        )}\n                        <Badge tone={o.status === \"paid\" || o.status === \"shipped\" ? \"green\" : \"amber\"}>\n                          {o.status ?? \"?\"}\n                        </Badge>\n                      </span>\n                    </button>\n                  </li>\n                ))}\n              </ul>\n            )}\n          </Card>\n        )}\n\n        {/* ── Formulieren ── */}\n        <Card>\n          <WidgetKop titel=\"Formulieren\" tab=\"forms\" tabLabel=\"Formulieren\" />\n          {formulieren === null ? (\n            <p className=\"text-sm text-slate-500\">Laden…</p>\n          ) : formulieren.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">Nog geen formulieren.</p>\n          ) : (\n            <ul className=\"grid gap-1\">\n              {formulieren.map((f) => (\n                <li key={f.id}>\n                  <button\n                    type=\"button\"\n                    onClick={() => gaNaar(\"forms\")}\n                    className=\"flex w-full items-center justify-between gap-2 rounded-lg px-2 py-1.5 text-left text-sm hover:bg-slate-100\"\n                  >\n                    <span className=\"truncate text-slate-800\" title={f.name}>{f.name}</span>\n                    <span className=\"shrink-0 text-xs text-slate-500\">\n                      {f.aantal} {f.aantal === 1 ? \"inzending\" : \"inzendingen\"}\n                      {f.laatste ? ` · laatste ${fmtDatum(f.laatste)}` : \"\"}\n                    </span>\n                  </button>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n\n        {/* ── Snelkoppelingen ── */}\n        <Card>\n          <div className=\"mb-3 flex items-center justify-between gap-2\">\n            <h2 className=\"text-sm font-semibold text-slate-800\">Snelkoppelingen</h2>\n            {magInstellen && linksBewerken === null && (\n              <Button variant=\"secondary\" size=\"sm\" onClick={() => setLinksBewerken(links.length ? [...links] : [{ label: \"\", href: \"\" }])}>\n                Instellen\n              </Button>\n            )}\n          </div>\n          {linksBewerken ? (\n            <div className=\"grid gap-2\">\n              <div className=\"grid grid-cols-[1fr_1.4fr_auto] gap-2 text-xs font-medium text-slate-500\">\n                <span>Naam</span>\n                <span>Adres</span>\n                <span aria-hidden=\"true\" />\n              </div>\n              {linksBewerken.map((l, i) => (\n                <div key={i} className=\"grid grid-cols-[1fr_1.4fr_auto] gap-2\">\n                  <Input value={l.label} placeholder=\"bv. Webwinkel\" aria-label=\"Naam van de snelkoppeling\"\n                    onChange={(e) => setLinksBewerken(linksBewerken.map((x, j) => (j === i ? { ...x, label: e.target.value } : x)))} />\n                  <Input value={l.href} placeholder=\"/webwinkel of https://…\" aria-label=\"Adres van de snelkoppeling\"\n                    onChange={(e) => setLinksBewerken(linksBewerken.map((x, j) => (j === i ? { ...x, href: e.target.value } : x)))} />\n                  <Button variant=\"ghost\" size=\"sm\" aria-label=\"Verwijderen\"\n                    onClick={() => setLinksBewerken(linksBewerken.filter((_, j) => j !== i))}>✕</Button>\n                </div>\n              ))}\n              <div className=\"flex items-center justify-between gap-2\">\n                <Button variant=\"secondary\" size=\"sm\" disabled={linksBewerken.length >= 12}\n                  onClick={() => setLinksBewerken([...linksBewerken, { label: \"\", href: \"\" }])}>\n                  + Snelkoppeling\n                </Button>\n                <div className=\"flex gap-2\">\n                  <Button variant=\"secondary\" size=\"sm\" onClick={() => setLinksBewerken(null)}>Annuleren</Button>\n                  <Button size=\"sm\" disabled={linksOpslaan} onClick={() => void slaLinksOp()}>\n                    {linksOpslaan ? \"Bezig…\" : \"Opslaan\"}\n                  </Button>\n                </div>\n              </div>\n            </div>\n          ) : links.length === 0 ? (\n            <p className=\"text-sm text-slate-500\">\n              {magInstellen\n                ? \"Nog geen snelkoppelingen. Zet hier de plekken waar je vaak moet zijn — je webwinkel, een pagina, een extern systeem.\"\n                : \"Nog geen snelkoppelingen ingesteld.\"}\n            </p>\n          ) : (\n            <ul className=\"flex flex-wrap gap-2\">\n              {links.map((l, i) => (\n                <li key={i}>\n                  <a\n                    href={l.href}\n                    target={/^https?:\\/\\//i.test(l.href) ? \"_blank\" : undefined}\n                    rel=\"noreferrer\"\n                    className=\"inline-flex items-center gap-1.5 rounded-lg border border-slate-200 px-3 py-1.5 text-sm text-slate-700 hover:bg-slate-100\"\n                  >\n                    {l.label} <span aria-hidden=\"true\" className=\"text-slate-400\">↗</span>\n                  </a>\n                </li>\n              ))}\n            </ul>\n          )}\n        </Card>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/pages/PagesPanel.js

@@ -20,6 +20,7 @@ const FUNCTIONELE_TYPES = /* @__PURE__ */ new Set([
   "orderStatus"
 ]);
 function isFunctioneel(p) {
+  if (p.path === "/") return false;
   return (p.blocks ?? []).some((b) => FUNCTIONELE_TYPES.has(String(b._type)));
 }
 function PaginaKnop({ p, selected, onClick }) {
@@ -81,11 +82,11 @@ function PagesPanel({ siteId }) {
           ] }) })
         ] })
       ] }),
-      /* @__PURE__ */ jsx("ul", { className: "grid gap-1", children: gewoon.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PaginaKnop, { p, selected: p.id === selected, onClick: () => setSelected(p.id) }) }, p.id)) }),
+      /* @__PURE__ */ jsx("ul", { className: "grid gap-1", children: gewoon.map((p) => /* @__PURE__ */ jsx("li", { className: "min-w-0", children: /* @__PURE__ */ jsx(PaginaKnop, { p, selected: p.id === selected, onClick: () => setSelected(p.id) }) }, p.id)) }),
       functioneel.length > 0 && /* @__PURE__ */ jsxs("div", { className: "mt-4 border-t border-slate-200 pt-3", children: [
         /* @__PURE__ */ jsx("p", { className: "mb-1 px-3 text-xs font-medium tracking-wide text-slate-500 uppercase", children: "Winkel & functioneel" }),
         /* @__PURE__ */ jsx("p", { className: "mb-2 px-3 text-xs text-slate-400", children: "Deze pagina's zijn het omhulsel van een functie. Producten en bestellingen beheer je onder Webwinkel; hier pas je alleen de tekst eromheen aan." }),
-        /* @__PURE__ */ jsx("ul", { className: "grid gap-1", children: functioneel.map((p) => /* @__PURE__ */ jsx("li", { children: /* @__PURE__ */ jsx(PaginaKnop, { p, selected: p.id === selected, onClick: () => setSelected(p.id) }) }, p.id)) })
+        /* @__PURE__ */ jsx("ul", { className: "grid gap-1", children: functioneel.map((p) => /* @__PURE__ */ jsx("li", { className: "min-w-0", children: /* @__PURE__ */ jsx(PaginaKnop, { p, selected: p.id === selected, onClick: () => setSelected(p.id) }) }, p.id)) })
       ] })
     ] }),
     /* @__PURE__ */ jsx("div", { children: current ? /* @__PURE__ */ jsxs(Fragment, { children: [

package/dist/admin/pages/PagesPanel.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/pages/PagesPanel.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { Button, Card, Field, Input, Badge } from \"../ui/primitives\";\nimport { Dialog, DialogTrigger, DialogContent, DialogClose } from \"../ui/dialog\";\nimport { useToast } from \"../ui/toast\";\nimport { useConfirm } from \"../ui/ConfirmDialog\";\nimport { subscribePages, createPage, deletePage, type DraftPage } from \"../lib/pagesClient\";\nimport { PageEditor } from \"./PageEditor\";\n\nfunction slugify(s: string): string {\n  return s\n    .toLowerCase()\n    .normalize(\"NFD\")\n    .replace(/[̀-ͯ]/g, \"\")\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/(^-|-$)/g, \"\");\n}\n\n/**\n * Bloktypes die een pagina FUNCTIONEEL maken (7.16): een afrekenpagina is \"een pagina met een\n * checkout-blok\", en die hoort in de lijst niet tussen \"Over ons\" te staan — de inhoud (producten,\n * bestellingen) beheer je onder Webwinkel, hier staat alleen het omhulsel. Er is bewust géén\n * pagina-type-veld in het schema (dat zou een tweede waarheid zijn naast de blokken zelf); we lezen\n * het af aan wat er op de pagina staat.\n */\nconst FUNCTIONELE_TYPES = new Set([\n  \"shopCategories\",\n  \"productGrid\",\n  \"productDetail\",\n  \"cart\",\n  \"checkout\",\n  \"donation\",\n  \"orderStatus\",\n]);\nfunction isFunctioneel(p: DraftPage): boolean {\n  return (p.blocks ?? []).some((b) => FUNCTIONELE_TYPES.has(String((b as { _type?: unknown })._type)));\n}\n\n/**\n * Eén rij in de paginalijst. Titel + pad onder elkaar: de kolom is 260px en een SEO-titel als\n * \"Christelijk Kraamcadeau — christelijke geschenken en kraamcadeaus\" is dan onleesbaar afgekapt\n * zónder dat je kunt zien wélke pagina het is. Het pad is kort, uniek en herkenbaar (\"/\", \"/over-\n * ons\") — precies het houvast dat de afgekapte titel mist. `title` levert de volle titel bij hover.\n */\nfunction PaginaKnop({ p, selected, onClick }: { p: DraftPage; selected: boolean; onClick: () => void }) {\n  return (\n    <button\n      onClick={onClick}\n      title={`${p.title} — ${p.path}`}\n      className={`flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2 text-left text-sm ${\n        selected ? \"bg-brand-50 text-brand-700\" : \"hover:bg-slate-100\"\n      }`}\n    >\n      <span className=\"min-w-0\">\n        <span className=\"block truncate\">{p.title}</span>\n        <span className={`block truncate text-xs ${selected ? \"text-brand-700/70\" : \"text-slate-400\"}`}>{p.path}</span>\n      </span>\n      {p.published ? <Badge tone=\"green\">live</Badge> : <Badge tone=\"amber\">concept</Badge>}\n    </button>\n  );\n}\n\nexport function PagesPanel({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [pages, setPages] = useState<DraftPage[]>([]);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [newTitle, setNewTitle] = useState(\"\");\n\n  useEffect(() => subscribePages(siteId, setPages), [siteId]);\n\n  const gewoon = pages.filter((p) => !isFunctioneel(p));\n  const functioneel = pages.filter(isFunctioneel);\n  useEffect(() => {\n    // Standaard de eerste GEWONE pagina: /beheer → Pagina's gaat over teksten, niet over de winkel.\n    if (!selected && pages.length) setSelected((gewoon[0] ?? pages[0]).id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pages, selected]);\n\n  const current = pages.find((p) => p.id === selected) ?? null;\n\n  async function create() {\n    const title = newTitle.trim();\n    if (!title) return;\n    const slug = slugify(title) || \"pagina\";\n    const path = slug === \"home\" ? \"/\" : `/${slug}`;\n    try {\n      const id = await createPage(siteId, { title, slug, path });\n      setNewTitle(\"\");\n      setSelected(id);\n      toast({ title: \"Pagina aangemaakt\", description: path });\n    } catch (e) {\n      // De dialoog sluit sowieso (DialogClose) — zonder deze toast dacht de klant dat de pagina\n      // bestond terwijl de write (rules/offline) faalde.\n      toast({ title: \"Pagina aanmaken mislukt\", description: (e as Error).message, tone: \"error\" });\n    }\n  }\n\n  return (\n    <div className=\"grid gap-4 md:grid-cols-[260px_1fr]\">\n      <Card className=\"h-fit\">\n        <div className=\"mb-3 flex items-center justify-between gap-2\">\n          <span className=\"text-xs font-medium tracking-wide text-slate-500 uppercase\">Overzicht</span>\n          <Dialog>\n            <DialogTrigger asChild>\n              <Button size=\"sm\">+ Nieuw</Button>\n            </DialogTrigger>\n            <DialogContent title=\"Nieuwe pagina\">\n              <div className=\"grid gap-3\">\n                <Field label=\"Titel\">\n                  <Input value={newTitle} onChange={(e) => setNewTitle(e.target.value)} placeholder=\"bv. Over ons\" />\n                </Field>\n                <div className=\"flex justify-end gap-2\">\n                  <DialogClose asChild>\n                    <Button variant=\"secondary\">Annuleren</Button>\n                  </DialogClose>\n                  <DialogClose asChild>\n                    <Button onClick={create}>Aanmaken</Button>\n                  </DialogClose>\n                </div>\n              </div>\n            </DialogContent>\n          </Dialog>\n        </div>\n        <ul className=\"grid gap-1\">\n          {gewoon.map((p) => (\n            <li key={p.id}>\n              <PaginaKnop p={p} selected={p.id === selected} onClick={() => setSelected(p.id)} />\n            </li>\n          ))}\n          {/* Geen lege-lijst-tekst hier: de lege staat rechts zegt hetzelfde én noemt de volgende\n              stap. Twee keer \"Nog geen pagina's\" naast elkaar leest als een fout. */}\n        </ul>\n        {functioneel.length > 0 && (\n          <div className=\"mt-4 border-t border-slate-200 pt-3\">\n            <p className=\"mb-1 px-3 text-xs font-medium tracking-wide text-slate-500 uppercase\">Winkel &amp; functioneel</p>\n            <p className=\"mb-2 px-3 text-xs text-slate-400\">\n              Deze pagina&apos;s zijn het omhulsel van een functie. Producten en bestellingen beheer je\n              onder Webwinkel; hier pas je alleen de tekst eromheen aan.\n            </p>\n            <ul className=\"grid gap-1\">\n              {functioneel.map((p) => (\n                <li key={p.id}>\n                  <PaginaKnop p={p} selected={p.id === selected} onClick={() => setSelected(p.id)} />\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </Card>\n\n      <div>\n        {current ? (\n          <>\n            <PageEditor siteId={siteId} page={current} allPages={pages} />\n            {/* Verwijderen staat ONDER de editor en draagt geen rode vlakknop meer. Het was het\n                opvallendste element op het scherm — helderrood, bovenaan, bóven \"Publiceren\" —\n                waarmee de onomkeerbare actie meer aandacht kreeg dan de actie waarvoor je komt.\n                Een tekstknop in de foutkleur is duidelijk genoeg; de bevestiging vangt de rest. */}\n            <div className=\"mt-4 flex justify-end border-t border-slate-200 pt-4\">\n              <button\n                type=\"button\"\n                className=\"rounded px-2 py-1 text-sm text-red-600 hover:underline focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:outline-none\"\n                onClick={async () => {\n                  const ok = await confirm({\n                    title: `Pagina \"${current.title}\" verwijderen?`,\n                    description:\n                      \"De pagina en de bijbehorende werkversie worden verwijderd. Dit kan niet ongedaan worden gemaakt. \" +\n                      \"Van de live site verdwijnt hij zodra die opnieuw is gebouwd — meestal binnen enkele minuten.\",\n                    confirmLabel: \"Verwijderen\",\n                    tone: \"danger\",\n                  });\n                  if (!ok) return;\n                  await deletePage(siteId, current.id);\n                  setSelected(null);\n                  // Eerlijk over de vertraging: de pagina is wég uit het beheer, maar de live site\n                  // laat hem pas los na een rebuild. Beloven dat hij \"verdwenen\" is terwijl de URL\n                  // nog werkt, kost meer vertrouwen dan het kost om het te zeggen.\n                  toast({\n                    title: \"Pagina verwijderd\",\n                    description: \"De live site laat de pagina los zodra hij opnieuw is gebouwd (meestal enkele minuten).\",\n                  });\n                }}\n              >\n                Pagina verwijderen\n              </button>\n            </div>\n          </>\n        ) : (\n          <Card className=\"grid place-items-center py-16 text-center\">\n            <div className=\"max-w-sm\">\n              {/* Een lege lijst is een uitnodiging, geen mededeling: zeg wat de volgende stap is. */}\n              <p className=\"text-sm font-medium text-slate-700\">\n                {pages.length === 0 ? \"Nog geen pagina's\" : \"Geen pagina geselecteerd\"}\n              </p>\n              <p className=\"mt-1 text-sm text-slate-500\">\n                {pages.length === 0\n                  ? \"Maak je eerste pagina met + Nieuw. Wat je maakt blijft een concept tot je publiceert.\"\n                  : \"Kies links een pagina om de tekst en secties aan te passen.\"}\n              </p>\n            </div>\n          </Card>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/admin/pages/PagesPanel.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { Button, Card, Field, Input, Badge } from \"../ui/primitives\";\nimport { Dialog, DialogTrigger, DialogContent, DialogClose } from \"../ui/dialog\";\nimport { useToast } from \"../ui/toast\";\nimport { useConfirm } from \"../ui/ConfirmDialog\";\nimport { subscribePages, createPage, deletePage, type DraftPage } from \"../lib/pagesClient\";\nimport { PageEditor } from \"./PageEditor\";\n\nfunction slugify(s: string): string {\n  return s\n    .toLowerCase()\n    .normalize(\"NFD\")\n    .replace(/[̀-ͯ]/g, \"\")\n    .replace(/[^a-z0-9]+/g, \"-\")\n    .replace(/(^-|-$)/g, \"\");\n}\n\n/**\n * Bloktypes die een pagina FUNCTIONEEL maken (7.16): een afrekenpagina is \"een pagina met een\n * checkout-blok\", en die hoort in de lijst niet tussen \"Over ons\" te staan — de inhoud (producten,\n * bestellingen) beheer je onder Webwinkel, hier staat alleen het omhulsel. Er is bewust géén\n * pagina-type-veld in het schema (dat zou een tweede waarheid zijn naast de blokken zelf); we lezen\n * het af aan wat er op de pagina staat.\n */\nconst FUNCTIONELE_TYPES = new Set([\n  \"shopCategories\",\n  \"productGrid\",\n  \"productDetail\",\n  \"cart\",\n  \"checkout\",\n  \"donation\",\n  \"orderStatus\",\n]);\nfunction isFunctioneel(p: DraftPage): boolean {\n  // De homepage hoort ALTIJD bij de gewone pagina's: op een winkel-site staat er vaak een\n  // productGrid op de home, maar de home is nooit alleen \"het omhulsel van een functie\" —\n  // het is de voordeur van de site, en die moet bovenaan staan waar de klant hem zoekt.\n  if (p.path === \"/\") return false;\n  return (p.blocks ?? []).some((b) => FUNCTIONELE_TYPES.has(String((b as { _type?: unknown })._type)));\n}\n\n/**\n * Eén rij in de paginalijst. Titel + pad onder elkaar: de kolom is 260px en een SEO-titel als\n * \"Christelijk Kraamcadeau — christelijke geschenken en kraamcadeaus\" is dan onleesbaar afgekapt\n * zónder dat je kunt zien wélke pagina het is. Het pad is kort, uniek en herkenbaar (\"/\", \"/over-\n * ons\") — precies het houvast dat de afgekapte titel mist. `title` levert de volle titel bij hover.\n */\nfunction PaginaKnop({ p, selected, onClick }: { p: DraftPage; selected: boolean; onClick: () => void }) {\n  return (\n    <button\n      onClick={onClick}\n      title={`${p.title} — ${p.path}`}\n      className={`flex w-full items-center justify-between gap-2 rounded-lg px-3 py-2 text-left text-sm ${\n        selected ? \"bg-brand-50 text-brand-700\" : \"hover:bg-slate-100\"\n      }`}\n    >\n      <span className=\"min-w-0\">\n        <span className=\"block truncate\">{p.title}</span>\n        <span className={`block truncate text-xs ${selected ? \"text-brand-700/70\" : \"text-slate-400\"}`}>{p.path}</span>\n      </span>\n      {p.published ? <Badge tone=\"green\">live</Badge> : <Badge tone=\"amber\">concept</Badge>}\n    </button>\n  );\n}\n\nexport function PagesPanel({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [pages, setPages] = useState<DraftPage[]>([]);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [newTitle, setNewTitle] = useState(\"\");\n\n  useEffect(() => subscribePages(siteId, setPages), [siteId]);\n\n  const gewoon = pages.filter((p) => !isFunctioneel(p));\n  const functioneel = pages.filter(isFunctioneel);\n  useEffect(() => {\n    // Standaard de eerste GEWONE pagina: /beheer → Pagina's gaat over teksten, niet over de winkel.\n    if (!selected && pages.length) setSelected((gewoon[0] ?? pages[0]).id);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [pages, selected]);\n\n  const current = pages.find((p) => p.id === selected) ?? null;\n\n  async function create() {\n    const title = newTitle.trim();\n    if (!title) return;\n    const slug = slugify(title) || \"pagina\";\n    const path = slug === \"home\" ? \"/\" : `/${slug}`;\n    try {\n      const id = await createPage(siteId, { title, slug, path });\n      setNewTitle(\"\");\n      setSelected(id);\n      toast({ title: \"Pagina aangemaakt\", description: path });\n    } catch (e) {\n      // De dialoog sluit sowieso (DialogClose) — zonder deze toast dacht de klant dat de pagina\n      // bestond terwijl de write (rules/offline) faalde.\n      toast({ title: \"Pagina aanmaken mislukt\", description: (e as Error).message, tone: \"error\" });\n    }\n  }\n\n  return (\n    <div className=\"grid gap-4 md:grid-cols-[260px_1fr]\">\n      <Card className=\"h-fit\">\n        <div className=\"mb-3 flex items-center justify-between gap-2\">\n          <span className=\"text-xs font-medium tracking-wide text-slate-500 uppercase\">Overzicht</span>\n          <Dialog>\n            <DialogTrigger asChild>\n              <Button size=\"sm\">+ Nieuw</Button>\n            </DialogTrigger>\n            <DialogContent title=\"Nieuwe pagina\">\n              <div className=\"grid gap-3\">\n                <Field label=\"Titel\">\n                  <Input value={newTitle} onChange={(e) => setNewTitle(e.target.value)} placeholder=\"bv. Over ons\" />\n                </Field>\n                <div className=\"flex justify-end gap-2\">\n                  <DialogClose asChild>\n                    <Button variant=\"secondary\">Annuleren</Button>\n                  </DialogClose>\n                  <DialogClose asChild>\n                    <Button onClick={create}>Aanmaken</Button>\n                  </DialogClose>\n                </div>\n              </div>\n            </DialogContent>\n          </Dialog>\n        </div>\n        <ul className=\"grid gap-1\">\n          {gewoon.map((p) => (\n            <li key={p.id} className=\"min-w-0\">\n              <PaginaKnop p={p} selected={p.id === selected} onClick={() => setSelected(p.id)} />\n            </li>\n          ))}\n          {/* Geen lege-lijst-tekst hier: de lege staat rechts zegt hetzelfde én noemt de volgende\n              stap. Twee keer \"Nog geen pagina's\" naast elkaar leest als een fout. */}\n        </ul>\n        {functioneel.length > 0 && (\n          <div className=\"mt-4 border-t border-slate-200 pt-3\">\n            <p className=\"mb-1 px-3 text-xs font-medium tracking-wide text-slate-500 uppercase\">Winkel &amp; functioneel</p>\n            <p className=\"mb-2 px-3 text-xs text-slate-400\">\n              Deze pagina&apos;s zijn het omhulsel van een functie. Producten en bestellingen beheer je\n              onder Webwinkel; hier pas je alleen de tekst eromheen aan.\n            </p>\n            <ul className=\"grid gap-1\">\n              {functioneel.map((p) => (\n                <li key={p.id} className=\"min-w-0\">\n                  <PaginaKnop p={p} selected={p.id === selected} onClick={() => setSelected(p.id)} />\n                </li>\n              ))}\n            </ul>\n          </div>\n        )}\n      </Card>\n\n      <div>\n        {current ? (\n          <>\n            <PageEditor siteId={siteId} page={current} allPages={pages} />\n            {/* Verwijderen staat ONDER de editor en draagt geen rode vlakknop meer. Het was het\n                opvallendste element op het scherm — helderrood, bovenaan, bóven \"Publiceren\" —\n                waarmee de onomkeerbare actie meer aandacht kreeg dan de actie waarvoor je komt.\n                Een tekstknop in de foutkleur is duidelijk genoeg; de bevestiging vangt de rest. */}\n            <div className=\"mt-4 flex justify-end border-t border-slate-200 pt-4\">\n              <button\n                type=\"button\"\n                className=\"rounded px-2 py-1 text-sm text-red-600 hover:underline focus-visible:ring-2 focus-visible:ring-brand-500 focus-visible:outline-none\"\n                onClick={async () => {\n                  const ok = await confirm({\n                    title: `Pagina \"${current.title}\" verwijderen?`,\n                    description:\n                      \"De pagina en de bijbehorende werkversie worden verwijderd. Dit kan niet ongedaan worden gemaakt. \" +\n                      \"Van de live site verdwijnt hij zodra die opnieuw is gebouwd — meestal binnen enkele minuten.\",\n                    confirmLabel: \"Verwijderen\",\n                    tone: \"danger\",\n                  });\n                  if (!ok) return;\n                  await deletePage(siteId, current.id);\n                  setSelected(null);\n                  // Eerlijk over de vertraging: de pagina is wég uit het beheer, maar de live site\n                  // laat hem pas los na een rebuild. Beloven dat hij \"verdwenen\" is terwijl de URL\n                  // nog werkt, kost meer vertrouwen dan het kost om het te zeggen.\n                  toast({\n                    title: \"Pagina verwijderd\",\n                    description: \"De live site laat de pagina los zodra hij opnieuw is gebouwd (meestal enkele minuten).\",\n                  });\n                }}\n              >\n                Pagina verwijderen\n              </button>\n            </div>\n          </>\n        ) : (\n          <Card className=\"grid place-items-center py-16 text-center\">\n            <div className=\"max-w-sm\">\n              {/* Een lege lijst is een uitnodiging, geen mededeling: zeg wat de volgende stap is. */}\n              <p className=\"text-sm font-medium text-slate-700\">\n                {pages.length === 0 ? \"Nog geen pagina's\" : \"Geen pagina geselecteerd\"}\n              </p>\n              <p className=\"mt-1 text-sm text-slate-500\">\n                {pages.length === 0\n                  ? \"Maak je eerste pagina met + Nieuw. Wat je maakt blijft een concept tot je publiceert.\"\n                  : \"Kies links een pagina om de tekst en secties aan te passen.\"}\n              </p>\n            </div>\n          </Card>\n        )}\n      </div>\n    </div>\n  );\n}\n"],"mappings":";AA0DM,SAoGI,UAnGF,KADF;AAxDN,SAAS,WAAW,gBAAgB;AACpC,SAAS,QAAQ,MAAM,OAAO,OAAO,aAAa;AAClD,SAAS,QAAQ,eAAe,eAAe,mBAAmB;AAClE,SAAS,gBAAgB;AACzB,SAAS,kBAAkB;AAC3B,SAAS,gBAAgB,YAAY,kBAAkC;AACvE,SAAS,kBAAkB;AAE3B,SAAS,QAAQ,GAAmB;AAClC,SAAO,EACJ,YAAY,EACZ,UAAU,KAAK,EACf,QAAQ,UAAU,EAAE,EACpB,QAAQ,eAAe,GAAG,EAC1B,QAAQ,YAAY,EAAE;AAC3B;AASA,MAAM,oBAAoB,oBAAI,IAAI;AAAA,EAChC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,CAAC;AACD,SAAS,cAAc,GAAuB;AAI5C,MAAI,EAAE,SAAS,IAAK,QAAO;AAC3B,UAAQ,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,MAAM,kBAAkB,IAAI,OAAQ,EAA0B,KAAK,CAAC,CAAC;AACrG;AAQA,SAAS,WAAW,EAAE,GAAG,UAAU,QAAQ,GAA6D;AACtG,SACE;AAAA,IAAC;AAAA;AAAA,MACC;AAAA,MACA,OAAO,GAAG,EAAE,KAAK,WAAM,EAAE,IAAI;AAAA,MAC7B,WAAW,yFACT,WAAW,+BAA+B,oBAC5C;AAAA,MAEA;AAAA,6BAAC,UAAK,WAAU,WACd;AAAA,8BAAC,UAAK,WAAU,kBAAkB,YAAE,OAAM;AAAA,UAC1C,oBAAC,UAAK,WAAW,0BAA0B,WAAW,sBAAsB,gBAAgB,IAAK,YAAE,MAAK;AAAA,WAC1G;AAAA,QACC,EAAE,YAAY,oBAAC,SAAM,MAAK,SAAQ,kBAAI,IAAW,oBAAC,SAAM,MAAK,SAAQ,qBAAO;AAAA;AAAA;AAAA,EAC/E;AAEJ;AAEO,SAAS,WAAW,EAAE,OAAO,GAAuB;AACzD,QAAM,EAAE,MAAM,IAAI,SAAS;AAC3B,QAAM,UAAU,WAAW;AAC3B,QAAM,CAAC,OAAO,QAAQ,IAAI,SAAsB,CAAC,CAAC;AAClD,QAAM,CAAC,UAAU,WAAW,IAAI,SAAwB,IAAI;AAC5D,QAAM,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE;AAE3C,YAAU,MAAM,eAAe,QAAQ,QAAQ,GAAG,CAAC,MAAM,CAAC;AAE1D,QAAM,SAAS,MAAM,OAAO,CAAC,MAAM,CAAC,cAAc,CAAC,CAAC;AACpD,QAAM,cAAc,MAAM,OAAO,aAAa;AAC9C,YAAU,MAAM;AAEd,QAAI,CAAC,YAAY,MAAM,OAAQ,cAAa,OAAO,CAAC,KAAK,MAAM,CAAC,GAAG,EAAE;AAAA,EAEvE,GAAG,CAAC,OAAO,QAAQ,CAAC;AAEpB,QAAM,UAAU,MAAM,KAAK,CAAC,MAAM,EAAE,OAAO,QAAQ,KAAK;AAExD,iBAAe,SAAS;AACtB,UAAM,QAAQ,SAAS,KAAK;AAC5B,QAAI,CAAC,MAAO;AACZ,UAAM,OAAO,QAAQ,KAAK,KAAK;AAC/B,UAAM,OAAO,SAAS,SAAS,MAAM,IAAI,IAAI;AAC7C,QAAI;AACF,YAAM,KAAK,MAAM,WAAW,QAAQ,EAAE,OAAO,MAAM,KAAK,CAAC;AACzD,kBAAY,EAAE;AACd,kBAAY,EAAE;AACd,YAAM,EAAE,OAAO,qBAAqB,aAAa,KAAK,CAAC;AAAA,IACzD,SAAS,GAAG;AAGV,YAAM,EAAE,OAAO,2BAA2B,aAAc,EAAY,SAAS,MAAM,QAAQ,CAAC;AAAA,IAC9F;AAAA,EACF;AAEA,SACE,qBAAC,SAAI,WAAU,uCACb;AAAA,yBAAC,QAAK,WAAU,SACd;AAAA,2BAAC,SAAI,WAAU,gDACb;AAAA,4BAAC,UAAK,WAAU,8DAA6D,uBAAS;AAAA,QACtF,qBAAC,UACC;AAAA,8BAAC,iBAAc,SAAO,MACpB,8BAAC,UAAO,MAAK,MAAK,qBAAO,GAC3B;AAAA,UACA,oBAAC,iBAAc,OAAM,iBACnB,+BAAC,SAAI,WAAU,cACb;AAAA,gCAAC,SAAM,OAAM,SACX,8BAAC,SAAM,OAAO,UAAU,UAAU,CAAC,MAAM,YAAY,EAAE,OAAO,KAAK,GAAG,aAAY,gBAAe,GACnG;AAAA,YACA,qBAAC,SAAI,WAAU,0BACb;AAAA,kCAAC,eAAY,SAAO,MAClB,8BAAC,UAAO,SAAQ,aAAY,uBAAS,GACvC;AAAA,cACA,oBAAC,eAAY,SAAO,MAClB,8BAAC,UAAO,SAAS,QAAQ,sBAAQ,GACnC;AAAA,eACF;AAAA,aACF,GACF;AAAA,WACF;AAAA,SACF;AAAA,MACA,oBAAC,QAAG,WAAU,cACX,iBAAO,IAAI,CAAC,MACX,oBAAC,QAAc,WAAU,WACvB,8BAAC,cAAW,GAAM,UAAU,EAAE,OAAO,UAAU,SAAS,MAAM,YAAY,EAAE,EAAE,GAAG,KAD1E,EAAE,EAEX,CACD,GAGH;AAAA,MACC,YAAY,SAAS,KACpB,qBAAC,SAAI,WAAU,uCACb;AAAA,4BAAC,OAAE,WAAU,wEAAuE,kCAAwB;AAAA,QAC5G,oBAAC,OAAE,WAAU,oCAAmC,6JAGhD;AAAA,QACA,oBAAC,QAAG,WAAU,cACX,sBAAY,IAAI,CAAC,MAChB,oBAAC,QAAc,WAAU,WACvB,8BAAC,cAAW,GAAM,UAAU,EAAE,OAAO,UAAU,SAAS,MAAM,YAAY,EAAE,EAAE,GAAG,KAD1E,EAAE,EAEX,CACD,GACH;AAAA,SACF;AAAA,OAEJ;AAAA,IAEA,oBAAC,SACE,oBACC,iCACE;AAAA,0BAAC,cAAW,QAAgB,MAAM,SAAS,UAAU,OAAO;AAAA,MAK5D,oBAAC,SAAI,WAAU,wDACb;AAAA,QAAC;AAAA;AAAA,UACC,MAAK;AAAA,UACL,WAAU;AAAA,UACV,SAAS,YAAY;AACnB,kBAAM,KAAK,MAAM,QAAQ;AAAA,cACvB,OAAO,WAAW,QAAQ,KAAK;AAAA,cAC/B,aACE;AAAA,cAEF,cAAc;AAAA,cACd,MAAM;AAAA,YACR,CAAC;AACD,gBAAI,CAAC,GAAI;AACT,kBAAM,WAAW,QAAQ,QAAQ,EAAE;AACnC,wBAAY,IAAI;AAIhB,kBAAM;AAAA,cACJ,OAAO;AAAA,cACP,aAAa;AAAA,YACf,CAAC;AAAA,UACH;AAAA,UACD;AAAA;AAAA,MAED,GACF;AAAA,OACF,IAEA,oBAAC,QAAK,WAAU,6CACd,+BAAC,SAAI,WAAU,YAEb;AAAA,0BAAC,OAAE,WAAU,sCACV,gBAAM,WAAW,IAAI,sBAAsB,4BAC9C;AAAA,MACA,oBAAC,OAAE,WAAU,+BACV,gBAAM,WAAW,IACd,0FACA,+DACN;AAAA,OACF,GACF,GAEJ;AAAA,KACF;AAEJ;","names":[]}

package/dist/admin/shop/ProductsTab.js

@@ -62,8 +62,12 @@ function ProductsTab({ siteId }) {
       order: products.length,
       featured: false
     };
-    const id = await saveProductDoc(siteId, void 0, nieuw);
-    setSelected(id);
+    try {
+      const id = await saveProductDoc(siteId, void 0, nieuw);
+      setSelected(id);
+    } catch (e) {
+      toast({ title: "Product aanmaken mislukt", description: e instanceof Error ? e.message : void 0, tone: "error" });
+    }
   }
   const filtered = useMemo(() => {
     const needle = q.trim().toLowerCase();

package/dist/admin/shop/ProductsTab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/shop/ProductsTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useState } from \"react\";\nimport { collection, doc, onSnapshot } from \"firebase/firestore\";\nimport { removeProduct, saveProductDoc } from \"./productClient\";\nimport { getDb } from \"../../firebase/client\";\nimport {\n  ProductSchema,\n  formatCents,\n  type PersonalizationField,\n  type Product,\n  type ProductOption,\n  type ProductVariant,\n  type ShopCategory,\n} from \"../../schema/shop\";\nimport { Badge, Button, Card, Field, Input, Textarea } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { Switch } from \"../ui/switch\";\nimport { useToast } from \"../ui/toast\";\nimport { useConfirm, type ConfirmOptions } from \"../ui/ConfirmDialog\";\nimport { MediaPickerButton } from \"../media/MediaPicker\";\nimport { slugify } from \"../lib/slugify\";\nimport { allVariantKeys, centsToEuroInput, eurosToCents } from \"./lib\";\n\ntype StoredProduct = Product & { id: string };\ntype StoredCategory = ShopCategory & { id: string };\n\nconst STATUS_OPTIONS = [\n  { value: \"draft\", label: \"Concept\" },\n  { value: \"active\", label: \"Actief\" },\n  { value: \"archived\", label: \"Gearchiveerd\" },\n];\n\nexport function ProductsTab({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [products, setProducts] = useState<StoredProduct[]>([]);\n  const [cats, setCats] = useState<StoredCategory[]>([]);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [q, setQ] = useState(\"\");\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) return;\n    const un1 = onSnapshot(collection(db, \"sites\", siteId, \"products\"), (snap) =>\n      setProducts(\n        snap.docs\n          .map((d) => ({ id: d.id, ...(d.data() as Product) }))\n          .sort((a, b) => (a.order ?? 0) - (b.order ?? 0) || a.name.localeCompare(b.name, \"nl\")),\n      ),\n    );\n    const un2 = onSnapshot(collection(db, \"sites\", siteId, \"shopCategories\"), (snap) =>\n      setCats(snap.docs.map((d) => ({ id: d.id, ...(d.data() as ShopCategory) }))),\n    );\n    return () => {\n      un1();\n      un2();\n    };\n  }, [siteId]);\n\n  async function createProduct() {\n    // Ook aanmaken loopt via de callable: een vers product is een draft (onzichtbaar voor de\n    // cache), maar zo staat élke productmutatie in de audit-log en is er één pad i.p.v. twee.\n    const nieuw = {\n      name: \"Nieuw product\",\n      slug: `product-${products.length + 1}`,\n      description: \"\",\n      categoryIds: [],\n      images: [],\n      priceCents: 0,\n      vatRate: 21,\n      options: [],\n      variants: [],\n      trackStock: false,\n      status: \"draft\",\n      order: products.length,\n      featured: false,\n    } satisfies Product;\n    const id = await saveProductDoc(siteId, undefined, nieuw);\n    setSelected(id);\n  }\n\n  const filtered = useMemo(() => {\n    const needle = q.trim().toLowerCase();\n    if (!needle) return products;\n    return products.filter((p) => p.name.toLowerCase().includes(needle) || p.slug.includes(needle));\n  }, [products, q]);\n\n  const current = products.find((p) => p.id === selected) ?? null;\n\n  return (\n    <div className=\"grid gap-4 md:grid-cols-[300px_1fr]\">\n      <Card className=\"h-fit\">\n        <div className=\"mb-3 flex items-center justify-between\">\n          <h3 className=\"text-sm font-semibold\">Producten</h3>\n          <Button size=\"sm\" onClick={createProduct}>+ Nieuw</Button>\n        </div>\n        <Input placeholder=\"Zoeken…\" value={q} onChange={(e) => setQ(e.target.value)} className=\"mb-2\" />\n        <ul className=\"grid max-h-[60vh] gap-1 overflow-y-auto\">\n          {filtered.map((p) => (\n            <li key={p.id}>\n              <button\n                onClick={() => setSelected(p.id)}\n                className={`flex w-full items-center gap-2 rounded-lg px-3 py-2 text-left text-sm ${\n                  p.id === selected ? \"bg-brand-50 text-brand-700\" : \"hover:bg-slate-100\"\n                }`}\n              >\n                {p.images?.[0] && <img src={p.images[0]} alt=\"\" className=\"h-8 w-8 rounded object-cover\" />}\n                <span className=\"min-w-0 flex-1 truncate\">{p.name}</span>\n                <Badge tone={p.status === \"active\" ? \"green\" : p.status === \"draft\" ? \"amber\" : \"slate\"}>\n                  {STATUS_OPTIONS.find((s) => s.value === p.status)?.label ?? p.status}\n                </Badge>\n              </button>\n            </li>\n          ))}\n          {filtered.length === 0 && <li className=\"px-3 py-2 text-sm text-slate-500\">Geen producten.</li>}\n        </ul>\n      </Card>\n      {current ? (\n        <ProductForm\n          key={current.id}\n          siteId={siteId}\n          product={current}\n          categories={cats}\n          onDeleted={() => setSelected(null)}\n          onToast={toast}\n          confirm={confirm}\n        />\n      ) : (\n        <Card>\n          <p className=\"text-sm text-slate-500\">Selecteer of maak een product.</p>\n        </Card>\n      )}\n    </div>\n  );\n}\n\n/**\n * Het volledige productformulier. Sinds 7.8 ook buiten dit tabblad in gebruik: het tandwiel bij een\n * product op de pagina opent hetzelfde formulier in een zijpaneel. Bewust hergebruik en geen tweede,\n * uitgeklede versie — twee formulieren voor één product lopen gegarandeerd uit elkaar, en dan hangt\n * het van je route af welke velden je kunt bereiken.\n */\nexport function ProductForm({\n  siteId,\n  product,\n  categories,\n  onDeleted,\n  onToast,\n  confirm,\n}: {\n  siteId: string;\n  product: StoredProduct;\n  categories: StoredCategory[];\n  onDeleted: () => void;\n  onToast: (t: { title: string; description?: string; tone?: \"default\" | \"success\" | \"error\" }) => void;\n  confirm: (opts: ConfirmOptions) => Promise<boolean>;\n}) {\n  const [def, setDef] = useState<Product>(product);\n  const [priceInput, setPriceInput] = useState(centsToEuroInput(product.priceCents));\n  const [compareInput, setCompareInput] = useState(centsToEuroInput(product.compareAtCents));\n\n  const variantKeys = useMemo(() => allVariantKeys(def.options ?? []), [def.options]);\n\n  function setOption(i: number, patch: Partial<ProductOption>) {\n    setDef((p) => {\n      const options = [...(p.options ?? [])];\n      options[i] = { ...options[i], ...patch };\n      return { ...p, options };\n    });\n  }\n\n  function variantFor(key: string): ProductVariant | undefined {\n    return (def.variants ?? []).find((v) => v.key === key);\n  }\n\n  function patchVariant(key: string, patch: Partial<ProductVariant>) {\n    setDef((p) => {\n      const variants = [...(p.variants ?? [])];\n      const idx = variants.findIndex((v) => v.key === key);\n      if (idx >= 0) variants[idx] = { ...variants[idx], ...patch };\n      else variants.push({ key, active: true, ...patch });\n      return { ...p, variants };\n    });\n  }\n\n  async function save() {\n    const db = getDb();\n    if (!db) return;\n    // Alleen varianten bewaren die iets toevoegen (afwijkende prijs/voorraad/sku of inactief),\n    // en geen wees-varianten van verwijderde optiewaarden.\n    const validKeys = new Set(variantKeys);\n    const cleanVariants = (def.variants ?? []).filter(\n      (v) =>\n        validKeys.has(v.key) &&\n        (v.priceCents !== undefined || v.stock !== undefined || v.sku !== undefined || v.active === false),\n    );\n    // Onvolledige personalisatie-regels (zonder label) niet opslaan.\n    const cleanPersonalization = (def.personalization ?? []).filter((f) => f.label.trim().length > 0);\n    const parsed = ProductSchema.safeParse({\n      ...def,\n      variants: cleanVariants,\n      personalization: cleanPersonalization.length > 0 ? cleanPersonalization : undefined,\n    });\n    if (!parsed.success) {\n      onToast({ title: \"Ongeldig product\", description: parsed.error.issues[0]?.message, tone: \"error\" });\n      return;\n    }\n    // Via de callable (7.9): de server valideert, auditeert en — belangrijker — pingt de\n    // products-cachetag, zodat de wijziging ook op de LIVE shoppagina's staat en niet alleen in\n    // Firestore. Zie productClient.ts, ook voor de terugval op een oudere backend.\n    await saveProductDoc(siteId, product.id, parsed.data);\n    onToast({ title: \"Product opgeslagen\", tone: \"success\" });\n  }\n\n  async function remove() {\n    const ok = await confirm({\n      title: `\"${product.name}\" verwijderen?`,\n      description: \"Bestaande bestellingen behouden hun eigen kopie van naam en prijs.\",\n      tone: \"danger\",\n    });\n    if (!ok) return;\n    await removeProduct(siteId, product.id);\n    onDeleted();\n  }\n\n  return (\n    <Card>\n      <div className=\"grid gap-4\">\n        <div className=\"grid gap-4 md:grid-cols-2\">\n          <Field label=\"Naam\">\n            <Input\n              value={def.name}\n              onChange={(e) => setDef((p) => ({ ...p, name: e.target.value, slug: slugify(e.target.value) || p.slug }))}\n            />\n          </Field>\n          <Field label=\"Slug\" hint=\"Product-URL: /product?p=<slug>\">\n            <Input value={def.slug} onChange={(e) => setDef((p) => ({ ...p, slug: slugify(e.target.value) }))} />\n          </Field>\n        </div>\n\n        <div className=\"grid gap-4 md:grid-cols-3\">\n          <Field label=\"Prijs (€, incl. btw)\">\n            <Input\n              value={priceInput}\n              onChange={(e) => {\n                setPriceInput(e.target.value);\n                const c = eurosToCents(e.target.value);\n                if (c !== null) setDef((p) => ({ ...p, priceCents: c }));\n              }}\n            />\n          </Field>\n          <Field label=\"Van-prijs (€, optioneel)\" hint=\"Doorgestreept naast de prijs\">\n            <Input\n              value={compareInput}\n              onChange={(e) => {\n                setCompareInput(e.target.value);\n                const c = eurosToCents(e.target.value);\n                setDef((p) => ({ ...p, compareAtCents: c ?? undefined }));\n              }}\n            />\n          </Field>\n          <Field label=\"Btw-tarief\">\n            <Select\n              value={String(def.vatRate ?? 21)}\n              onValueChange={(v) => setDef((p) => ({ ...p, vatRate: Number(v) as 21 | 9 | 0 }))}\n              options={[\n                { value: \"21\", label: \"21%\" },\n                { value: \"9\", label: \"9%\" },\n                { value: \"0\", label: \"0%\" },\n              ]}\n            />\n          </Field>\n        </div>\n\n        <Field label=\"Omschrijving\">\n          <Textarea rows={4} value={def.description ?? \"\"} onChange={(e) => setDef((p) => ({ ...p, description: e.target.value }))} />\n        </Field>\n\n        <Field label=\"Afbeeldingen\" hint=\"Eerste afbeelding is het hoofdbeeld\">\n          <div className=\"flex flex-wrap items-center gap-3\">\n            {(def.images ?? []).map((url, i) => (\n              <div key={url + i} className=\"relative\">\n                <img src={url} alt=\"\" className=\"h-16 w-16 rounded-lg object-cover\" />\n                <button\n                  type=\"button\"\n                  aria-label=\"Verwijder afbeelding\"\n                  className=\"absolute -right-2 -top-2 grid h-5 w-5 place-items-center rounded-full bg-slate-700 text-xs text-white\"\n                  onClick={() => setDef((p) => ({ ...p, images: (p.images ?? []).filter((_, j) => j !== i) }))}\n                >\n                  ✕\n                </button>\n              </div>\n            ))}\n            <MediaPickerButton\n              siteId={siteId}\n              label=\"+ Afbeelding\"\n              onSelect={(m) => setDef((p) => ({ ...p, images: [...(p.images ?? []), m.url] }))}\n            />\n          </div>\n        </Field>\n\n        <Field label=\"Categorieën\">\n          <div className=\"flex flex-wrap gap-2\">\n            {categories.map((c) => {\n              const on = (def.categoryIds ?? []).includes(c.id);\n              return (\n                <button\n                  key={c.id}\n                  type=\"button\"\n                  onClick={() =>\n                    setDef((p) => ({\n                      ...p,\n                      categoryIds: on ? (p.categoryIds ?? []).filter((x) => x !== c.id) : [...(p.categoryIds ?? []), c.id],\n                    }))\n                  }\n                  className={`rounded-full border px-3 py-1 text-sm ${\n                    on ? \"border-brand-500 bg-brand-50 text-brand-700\" : \"border-slate-200 hover:bg-slate-50\"\n                  }`}\n                >\n                  {on ? \"✓ \" : \"\"}\n                  {c.name}\n                </button>\n              );\n            })}\n            {categories.length === 0 && <span className=\"text-sm text-slate-500\">Maak eerst een categorie aan.</span>}\n          </div>\n        </Field>\n\n        {/* Opties & varianten */}\n        <Field\n          label=\"Opties (bv. Maat, Kleur)\"\n          hint=\"Max. 3. Waarden gescheiden door komma's. Combinaties kun je hieronder per stuk aanpassen.\"\n        >\n          <div className=\"grid gap-2\">\n            {(def.options ?? []).map((opt, i) => (\n              <div key={i} className=\"grid gap-2 rounded-lg border border-slate-100 p-2\">\n                <div className=\"flex items-center gap-2\">\n                  <Input\n                    className=\"w-36\"\n                    placeholder=\"Naam (bv. Maat)\"\n                    value={opt.name}\n                    onChange={(e) => setOption(i, { name: e.target.value })}\n                  />\n                  <Input\n                    placeholder=\"Waarden, bv: 56, 62, 68, 74\"\n                    value={opt.values.join(\", \")}\n                    onChange={(e) =>\n                      setOption(i, { values: e.target.value.split(\",\").map((s) => s.trim()).filter(Boolean) })\n                    }\n                  />\n                  <Button\n                    size=\"sm\"\n                    variant=\"ghost\"\n                    onClick={() => setDef((p) => ({ ...p, options: (p.options ?? []).filter((_, j) => j !== i) }))}\n                  >\n                    ✕\n                  </Button>\n                </div>\n                {/* Afbeelding per waarde (5.6) — vooral voor de kleur-as: de detailpagina\n                    wisselt het hoofdbeeld mee met de gekozen kleur. */}\n                {/^kleur|^colou?r/i.test(opt.name) && opt.values.length > 0 && (\n                  <div className=\"flex flex-wrap items-center gap-2\">\n                    {opt.values.map((value) => {\n                      const url = opt.images?.[value];\n                      return (\n                        <span key={value} className=\"flex items-center gap-1 rounded-full border border-slate-200 px-2 py-1 text-xs\">\n                          {url && <img src={url} alt=\"\" className=\"h-6 w-6 rounded object-cover\" />}\n                          {value}\n                          <MediaPickerButton\n                            siteId={siteId}\n                            label={url ? \"↻\" : \"+ foto\"}\n                            onSelect={(m) =>\n                              setOption(i, { images: { ...(opt.images ?? {}), [value]: m.url } })\n                            }\n                          />\n                          {url && (\n                            <button\n                              type=\"button\"\n                              aria-label={`Verwijder foto van ${value}`}\n                              className=\"text-slate-400 hover:text-slate-700\"\n                              onClick={() => {\n                                const images = { ...(opt.images ?? {}) };\n                                delete images[value];\n                                setOption(i, { images });\n                              }}\n                            >\n                              ✕\n                            </button>\n                          )}\n                        </span>\n                      );\n                    })}\n                  </div>\n                )}\n              </div>\n            ))}\n            {(def.options ?? []).length < 3 && (\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                className=\"w-fit\"\n                onClick={() => setDef((p) => ({ ...p, options: [...(p.options ?? []), { name: \"\", values: [] }] }))}\n              >\n                + Optie\n              </Button>\n            )}\n          </div>\n        </Field>\n\n        {variantKeys.length > 0 && variantKeys.length <= 60 && (\n          <Field label=\"Varianten\" hint=\"Leeg = standaardprijs / onbeperkte voorraad\">\n            <div className=\"overflow-x-auto\">\n              <table className=\"w-full text-sm\">\n                <thead>\n                  <tr className=\"text-left text-xs text-slate-500\">\n                    <th className=\"py-1 pr-2\">Combinatie</th>\n                    <th className=\"py-1 pr-2\">Prijs (€)</th>\n                    {def.trackStock && <th className=\"py-1 pr-2\">Voorraad</th>}\n                    <th className=\"py-1 pr-2\">Leverbaar</th>\n                  </tr>\n                </thead>\n                <tbody>\n                  {variantKeys.map((key) => {\n                    const v = variantFor(key);\n                    return (\n                      <tr key={key} className=\"border-t border-slate-100\">\n                        <td className=\"py-1 pr-2\">{key.split(\"|\").join(\" · \")}</td>\n                        <td className=\"py-1 pr-2\">\n                          {/* Native uncontrolled inputs: geen cursor-gedoe bij \"13,\" tijdens typen. */}\n                          <input\n                            className=\"w-24 rounded-lg border border-slate-200 px-2 py-1\"\n                            placeholder={centsToEuroInput(def.priceCents)}\n                            defaultValue={centsToEuroInput(v?.priceCents)}\n                            onChange={(e) => {\n                              const c = eurosToCents(e.target.value);\n                              patchVariant(key, { priceCents: c ?? undefined });\n                            }}\n                          />\n                        </td>\n                        {def.trackStock && (\n                          <td className=\"py-1 pr-2\">\n                            <input\n                              className=\"w-20 rounded-lg border border-slate-200 px-2 py-1\"\n                              type=\"number\"\n                              min={0}\n                              placeholder=\"∞\"\n                              defaultValue={v?.stock ?? \"\"}\n                              onChange={(e) => {\n                                const n = e.target.value === \"\" ? undefined : Math.max(0, Number(e.target.value) || 0);\n                                patchVariant(key, { stock: n });\n                              }}\n                            />\n                          </td>\n                        )}\n                        <td className=\"py-1 pr-2\">\n                          <Switch checked={v?.active !== false} onCheckedChange={(on) => patchVariant(key, { active: on })} />\n                        </td>\n                      </tr>\n                    );\n                  })}\n                </tbody>\n              </table>\n            </div>\n          </Field>\n        )}\n        {variantKeys.length > 60 && (\n          <p className=\"text-sm text-amber-600\">\n            {variantKeys.length} combinaties — te veel om per stuk te tonen. Beperk het aantal optie-waarden.\n          </p>\n        )}\n\n        {/* Personalisatie (5.6): eigen naam/logo van de klant, met optionele meerprijs. */}\n        <Field\n          label=\"Personalisatie (eigen tekst of afbeelding)\"\n          hint=\"Max. 3 velden. De klant vult dit in op de productpagina; de meerprijs telt automatisch mee.\"\n        >\n          <div className=\"grid gap-2\">\n            {(def.personalization ?? []).map((f, i) => {\n              const setPers = (patch: Partial<PersonalizationField>) =>\n                setDef((p) => {\n                  const personalization = [...(p.personalization ?? [])];\n                  personalization[i] = { ...personalization[i], ...patch };\n                  return { ...p, personalization };\n                });\n              return (\n                <div key={i} className=\"grid gap-2 rounded-lg border border-slate-100 p-2 md:grid-cols-[1fr_130px_90px_110px_auto]\">\n                  <Input\n                    placeholder='Label (bv. \"Naam van het kindje\")'\n                    value={f.label}\n                    onChange={(e) =>\n                      setPers({\n                        label: e.target.value,\n                        key: f.key || e.target.value.toLowerCase().replace(/[^a-z0-9]+/g, \"_\").replace(/^_+|_+$/g, \"\").slice(0, 40) || `veld${i + 1}`,\n                      })\n                    }\n                  />\n                  <Select\n                    value={f.type}\n                    onValueChange={(v) => setPers({ type: v as \"text\" | \"image\" })}\n                    options={[\n                      { value: \"text\", label: \"Tekst\" },\n                      { value: \"image\", label: \"Afbeelding\" },\n                    ]}\n                  />\n                  {f.type === \"text\" ? (\n                    <Input\n                      type=\"number\"\n                      title=\"Max. tekens\"\n                      min={1}\n                      max={200}\n                      value={f.maxLength ?? 40}\n                      onChange={(e) => setPers({ maxLength: Math.max(1, Math.min(200, Number(e.target.value) || 40)) })}\n                    />\n                  ) : (\n                    <span className=\"self-center text-xs text-slate-400\">jpg/png/webp</span>\n                  )}\n                  <input\n                    className=\"rounded-lg border border-slate-200 px-2 py-1\"\n                    placeholder=\"Meerprijs €\"\n                    defaultValue={f.priceCents ? centsToEuroInput(f.priceCents) : \"\"}\n                    onChange={(e) => setPers({ priceCents: eurosToCents(e.target.value) ?? 0 })}\n                  />\n                  <div className=\"flex items-center gap-2\">\n                    <Switch checked={f.required === true} onCheckedChange={(v) => setPers({ required: v })} label=\"Verplicht\" />\n                    <Button\n                      size=\"sm\"\n                      variant=\"ghost\"\n                      onClick={() => setDef((p) => ({ ...p, personalization: (p.personalization ?? []).filter((_, j) => j !== i) }))}\n                    >\n                      ✕\n                    </Button>\n                  </div>\n                </div>\n              );\n            })}\n            {(def.personalization ?? []).length < 3 && (\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                className=\"w-fit\"\n                onClick={() =>\n                  setDef((p) => ({\n                    ...p,\n                    personalization: [\n                      ...(p.personalization ?? []),\n                      { key: `veld${(p.personalization ?? []).length + 1}`, label: \"\", type: \"text\", required: false, maxLength: 40, priceCents: 0 },\n                    ],\n                  }))\n                }\n              >\n                + Personalisatie-veld\n              </Button>\n            )}\n          </div>\n        </Field>\n\n        <div className=\"flex flex-wrap items-center gap-6\">\n          <Field label=\"Status\">\n            <Select\n              value={def.status ?? \"draft\"}\n              onValueChange={(v) => setDef((p) => ({ ...p, status: v as Product[\"status\"] }))}\n              options={STATUS_OPTIONS}\n            />\n          </Field>\n          <Field label=\"Volgorde\">\n            <Input\n              type=\"number\"\n              className=\"w-24\"\n              value={def.order ?? 0}\n              onChange={(e) => setDef((p) => ({ ...p, order: Math.max(0, Number(e.target.value) || 0) }))}\n            />\n          </Field>\n          <Switch checked={def.featured === true} onCheckedChange={(v) => setDef((p) => ({ ...p, featured: v }))} label=\"Uitgelicht\" />\n          <Switch checked={def.trackStock === true} onCheckedChange={(v) => setDef((p) => ({ ...p, trackStock: v }))} label=\"Voorraad bijhouden\" />\n          {def.trackStock && (def.options ?? []).length === 0 && (\n            <Field label=\"Voorraad\">\n              <Input\n                type=\"number\"\n                className=\"w-24\"\n                placeholder=\"∞\"\n                value={def.stock ?? \"\"}\n                onChange={(e) =>\n                  setDef((p) => ({ ...p, stock: e.target.value === \"\" ? undefined : Math.max(0, Number(e.target.value) || 0) }))\n                }\n              />\n            </Field>\n          )}\n        </div>\n\n        <div className=\"flex items-center justify-between border-t border-slate-100 pt-4\">\n          <div className=\"flex items-center gap-3\">\n            <Button onClick={save}>Opslaan</Button>\n            <span className=\"text-sm text-slate-500\">{formatCents(def.priceCents)}</span>\n          </div>\n          <Button variant=\"danger\" onClick={remove}>Verwijderen</Button>\n        </div>\n      </div>\n    </Card>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/admin/shop/ProductsTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useMemo, useState } from \"react\";\nimport { collection, doc, onSnapshot } from \"firebase/firestore\";\nimport { removeProduct, saveProductDoc } from \"./productClient\";\nimport { getDb } from \"../../firebase/client\";\nimport {\n  ProductSchema,\n  formatCents,\n  type PersonalizationField,\n  type Product,\n  type ProductOption,\n  type ProductVariant,\n  type ShopCategory,\n} from \"../../schema/shop\";\nimport { Badge, Button, Card, Field, Input, Textarea } from \"../ui/primitives\";\nimport { Select } from \"../ui/select\";\nimport { Switch } from \"../ui/switch\";\nimport { useToast } from \"../ui/toast\";\nimport { useConfirm, type ConfirmOptions } from \"../ui/ConfirmDialog\";\nimport { MediaPickerButton } from \"../media/MediaPicker\";\nimport { slugify } from \"../lib/slugify\";\nimport { allVariantKeys, centsToEuroInput, eurosToCents } from \"./lib\";\n\ntype StoredProduct = Product & { id: string };\ntype StoredCategory = ShopCategory & { id: string };\n\nconst STATUS_OPTIONS = [\n  { value: \"draft\", label: \"Concept\" },\n  { value: \"active\", label: \"Actief\" },\n  { value: \"archived\", label: \"Gearchiveerd\" },\n];\n\nexport function ProductsTab({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const confirm = useConfirm();\n  const [products, setProducts] = useState<StoredProduct[]>([]);\n  const [cats, setCats] = useState<StoredCategory[]>([]);\n  const [selected, setSelected] = useState<string | null>(null);\n  const [q, setQ] = useState(\"\");\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) return;\n    const un1 = onSnapshot(collection(db, \"sites\", siteId, \"products\"), (snap) =>\n      setProducts(\n        snap.docs\n          .map((d) => ({ id: d.id, ...(d.data() as Product) }))\n          .sort((a, b) => (a.order ?? 0) - (b.order ?? 0) || a.name.localeCompare(b.name, \"nl\")),\n      ),\n    );\n    const un2 = onSnapshot(collection(db, \"sites\", siteId, \"shopCategories\"), (snap) =>\n      setCats(snap.docs.map((d) => ({ id: d.id, ...(d.data() as ShopCategory) }))),\n    );\n    return () => {\n      un1();\n      un2();\n    };\n  }, [siteId]);\n\n  async function createProduct() {\n    // Ook aanmaken loopt via de callable: een vers product is een draft (onzichtbaar voor de\n    // cache), maar zo staat élke productmutatie in de audit-log en is er één pad i.p.v. twee.\n    const nieuw = {\n      name: \"Nieuw product\",\n      slug: `product-${products.length + 1}`,\n      description: \"\",\n      categoryIds: [],\n      images: [],\n      priceCents: 0,\n      vatRate: 21,\n      options: [],\n      variants: [],\n      trackStock: false,\n      status: \"draft\",\n      order: products.length,\n      featured: false,\n    } satisfies Product;\n    try {\n      const id = await saveProductDoc(siteId, undefined, nieuw);\n      setSelected(id);\n    } catch (e) {\n      // Zichtbaar falen: dit gooide een tijdlang stil (unhandled) terwijl de knop gewoon niets\n      // leek te doen — precies de melding \"bij aanmaken product krijg ik iets met permissions\".\n      toast({ title: \"Product aanmaken mislukt\", description: e instanceof Error ? e.message : undefined, tone: \"error\" });\n    }\n  }\n\n  const filtered = useMemo(() => {\n    const needle = q.trim().toLowerCase();\n    if (!needle) return products;\n    return products.filter((p) => p.name.toLowerCase().includes(needle) || p.slug.includes(needle));\n  }, [products, q]);\n\n  const current = products.find((p) => p.id === selected) ?? null;\n\n  return (\n    <div className=\"grid gap-4 md:grid-cols-[300px_1fr]\">\n      <Card className=\"h-fit\">\n        <div className=\"mb-3 flex items-center justify-between\">\n          <h3 className=\"text-sm font-semibold\">Producten</h3>\n          <Button size=\"sm\" onClick={createProduct}>+ Nieuw</Button>\n        </div>\n        <Input placeholder=\"Zoeken…\" value={q} onChange={(e) => setQ(e.target.value)} className=\"mb-2\" />\n        <ul className=\"grid max-h-[60vh] gap-1 overflow-y-auto\">\n          {filtered.map((p) => (\n            <li key={p.id}>\n              <button\n                onClick={() => setSelected(p.id)}\n                className={`flex w-full items-center gap-2 rounded-lg px-3 py-2 text-left text-sm ${\n                  p.id === selected ? \"bg-brand-50 text-brand-700\" : \"hover:bg-slate-100\"\n                }`}\n              >\n                {p.images?.[0] && <img src={p.images[0]} alt=\"\" className=\"h-8 w-8 rounded object-cover\" />}\n                <span className=\"min-w-0 flex-1 truncate\">{p.name}</span>\n                <Badge tone={p.status === \"active\" ? \"green\" : p.status === \"draft\" ? \"amber\" : \"slate\"}>\n                  {STATUS_OPTIONS.find((s) => s.value === p.status)?.label ?? p.status}\n                </Badge>\n              </button>\n            </li>\n          ))}\n          {filtered.length === 0 && <li className=\"px-3 py-2 text-sm text-slate-500\">Geen producten.</li>}\n        </ul>\n      </Card>\n      {current ? (\n        <ProductForm\n          key={current.id}\n          siteId={siteId}\n          product={current}\n          categories={cats}\n          onDeleted={() => setSelected(null)}\n          onToast={toast}\n          confirm={confirm}\n        />\n      ) : (\n        <Card>\n          <p className=\"text-sm text-slate-500\">Selecteer of maak een product.</p>\n        </Card>\n      )}\n    </div>\n  );\n}\n\n/**\n * Het volledige productformulier. Sinds 7.8 ook buiten dit tabblad in gebruik: het tandwiel bij een\n * product op de pagina opent hetzelfde formulier in een zijpaneel. Bewust hergebruik en geen tweede,\n * uitgeklede versie — twee formulieren voor één product lopen gegarandeerd uit elkaar, en dan hangt\n * het van je route af welke velden je kunt bereiken.\n */\nexport function ProductForm({\n  siteId,\n  product,\n  categories,\n  onDeleted,\n  onToast,\n  confirm,\n}: {\n  siteId: string;\n  product: StoredProduct;\n  categories: StoredCategory[];\n  onDeleted: () => void;\n  onToast: (t: { title: string; description?: string; tone?: \"default\" | \"success\" | \"error\" }) => void;\n  confirm: (opts: ConfirmOptions) => Promise<boolean>;\n}) {\n  const [def, setDef] = useState<Product>(product);\n  const [priceInput, setPriceInput] = useState(centsToEuroInput(product.priceCents));\n  const [compareInput, setCompareInput] = useState(centsToEuroInput(product.compareAtCents));\n\n  const variantKeys = useMemo(() => allVariantKeys(def.options ?? []), [def.options]);\n\n  function setOption(i: number, patch: Partial<ProductOption>) {\n    setDef((p) => {\n      const options = [...(p.options ?? [])];\n      options[i] = { ...options[i], ...patch };\n      return { ...p, options };\n    });\n  }\n\n  function variantFor(key: string): ProductVariant | undefined {\n    return (def.variants ?? []).find((v) => v.key === key);\n  }\n\n  function patchVariant(key: string, patch: Partial<ProductVariant>) {\n    setDef((p) => {\n      const variants = [...(p.variants ?? [])];\n      const idx = variants.findIndex((v) => v.key === key);\n      if (idx >= 0) variants[idx] = { ...variants[idx], ...patch };\n      else variants.push({ key, active: true, ...patch });\n      return { ...p, variants };\n    });\n  }\n\n  async function save() {\n    const db = getDb();\n    if (!db) return;\n    // Alleen varianten bewaren die iets toevoegen (afwijkende prijs/voorraad/sku of inactief),\n    // en geen wees-varianten van verwijderde optiewaarden.\n    const validKeys = new Set(variantKeys);\n    const cleanVariants = (def.variants ?? []).filter(\n      (v) =>\n        validKeys.has(v.key) &&\n        (v.priceCents !== undefined || v.stock !== undefined || v.sku !== undefined || v.active === false),\n    );\n    // Onvolledige personalisatie-regels (zonder label) niet opslaan.\n    const cleanPersonalization = (def.personalization ?? []).filter((f) => f.label.trim().length > 0);\n    const parsed = ProductSchema.safeParse({\n      ...def,\n      variants: cleanVariants,\n      personalization: cleanPersonalization.length > 0 ? cleanPersonalization : undefined,\n    });\n    if (!parsed.success) {\n      onToast({ title: \"Ongeldig product\", description: parsed.error.issues[0]?.message, tone: \"error\" });\n      return;\n    }\n    // Via de callable (7.9): de server valideert, auditeert en — belangrijker — pingt de\n    // products-cachetag, zodat de wijziging ook op de LIVE shoppagina's staat en niet alleen in\n    // Firestore. Zie productClient.ts, ook voor de terugval op een oudere backend.\n    await saveProductDoc(siteId, product.id, parsed.data);\n    onToast({ title: \"Product opgeslagen\", tone: \"success\" });\n  }\n\n  async function remove() {\n    const ok = await confirm({\n      title: `\"${product.name}\" verwijderen?`,\n      description: \"Bestaande bestellingen behouden hun eigen kopie van naam en prijs.\",\n      tone: \"danger\",\n    });\n    if (!ok) return;\n    await removeProduct(siteId, product.id);\n    onDeleted();\n  }\n\n  return (\n    <Card>\n      <div className=\"grid gap-4\">\n        <div className=\"grid gap-4 md:grid-cols-2\">\n          <Field label=\"Naam\">\n            <Input\n              value={def.name}\n              onChange={(e) => setDef((p) => ({ ...p, name: e.target.value, slug: slugify(e.target.value) || p.slug }))}\n            />\n          </Field>\n          <Field label=\"Slug\" hint=\"Product-URL: /product?p=<slug>\">\n            <Input value={def.slug} onChange={(e) => setDef((p) => ({ ...p, slug: slugify(e.target.value) }))} />\n          </Field>\n        </div>\n\n        <div className=\"grid gap-4 md:grid-cols-3\">\n          <Field label=\"Prijs (€, incl. btw)\">\n            <Input\n              value={priceInput}\n              onChange={(e) => {\n                setPriceInput(e.target.value);\n                const c = eurosToCents(e.target.value);\n                if (c !== null) setDef((p) => ({ ...p, priceCents: c }));\n              }}\n            />\n          </Field>\n          <Field label=\"Van-prijs (€, optioneel)\" hint=\"Doorgestreept naast de prijs\">\n            <Input\n              value={compareInput}\n              onChange={(e) => {\n                setCompareInput(e.target.value);\n                const c = eurosToCents(e.target.value);\n                setDef((p) => ({ ...p, compareAtCents: c ?? undefined }));\n              }}\n            />\n          </Field>\n          <Field label=\"Btw-tarief\">\n            <Select\n              value={String(def.vatRate ?? 21)}\n              onValueChange={(v) => setDef((p) => ({ ...p, vatRate: Number(v) as 21 | 9 | 0 }))}\n              options={[\n                { value: \"21\", label: \"21%\" },\n                { value: \"9\", label: \"9%\" },\n                { value: \"0\", label: \"0%\" },\n              ]}\n            />\n          </Field>\n        </div>\n\n        <Field label=\"Omschrijving\">\n          <Textarea rows={4} value={def.description ?? \"\"} onChange={(e) => setDef((p) => ({ ...p, description: e.target.value }))} />\n        </Field>\n\n        <Field label=\"Afbeeldingen\" hint=\"Eerste afbeelding is het hoofdbeeld\">\n          <div className=\"flex flex-wrap items-center gap-3\">\n            {(def.images ?? []).map((url, i) => (\n              <div key={url + i} className=\"relative\">\n                <img src={url} alt=\"\" className=\"h-16 w-16 rounded-lg object-cover\" />\n                <button\n                  type=\"button\"\n                  aria-label=\"Verwijder afbeelding\"\n                  className=\"absolute -right-2 -top-2 grid h-5 w-5 place-items-center rounded-full bg-slate-700 text-xs text-white\"\n                  onClick={() => setDef((p) => ({ ...p, images: (p.images ?? []).filter((_, j) => j !== i) }))}\n                >\n                  ✕\n                </button>\n              </div>\n            ))}\n            <MediaPickerButton\n              siteId={siteId}\n              label=\"+ Afbeelding\"\n              onSelect={(m) => setDef((p) => ({ ...p, images: [...(p.images ?? []), m.url] }))}\n            />\n          </div>\n        </Field>\n\n        <Field label=\"Categorieën\">\n          <div className=\"flex flex-wrap gap-2\">\n            {categories.map((c) => {\n              const on = (def.categoryIds ?? []).includes(c.id);\n              return (\n                <button\n                  key={c.id}\n                  type=\"button\"\n                  onClick={() =>\n                    setDef((p) => ({\n                      ...p,\n                      categoryIds: on ? (p.categoryIds ?? []).filter((x) => x !== c.id) : [...(p.categoryIds ?? []), c.id],\n                    }))\n                  }\n                  className={`rounded-full border px-3 py-1 text-sm ${\n                    on ? \"border-brand-500 bg-brand-50 text-brand-700\" : \"border-slate-200 hover:bg-slate-50\"\n                  }`}\n                >\n                  {on ? \"✓ \" : \"\"}\n                  {c.name}\n                </button>\n              );\n            })}\n            {categories.length === 0 && <span className=\"text-sm text-slate-500\">Maak eerst een categorie aan.</span>}\n          </div>\n        </Field>\n\n        {/* Opties & varianten */}\n        <Field\n          label=\"Opties (bv. Maat, Kleur)\"\n          hint=\"Max. 3. Waarden gescheiden door komma's. Combinaties kun je hieronder per stuk aanpassen.\"\n        >\n          <div className=\"grid gap-2\">\n            {(def.options ?? []).map((opt, i) => (\n              <div key={i} className=\"grid gap-2 rounded-lg border border-slate-100 p-2\">\n                <div className=\"flex items-center gap-2\">\n                  <Input\n                    className=\"w-36\"\n                    placeholder=\"Naam (bv. Maat)\"\n                    value={opt.name}\n                    onChange={(e) => setOption(i, { name: e.target.value })}\n                  />\n                  <Input\n                    placeholder=\"Waarden, bv: 56, 62, 68, 74\"\n                    value={opt.values.join(\", \")}\n                    onChange={(e) =>\n                      setOption(i, { values: e.target.value.split(\",\").map((s) => s.trim()).filter(Boolean) })\n                    }\n                  />\n                  <Button\n                    size=\"sm\"\n                    variant=\"ghost\"\n                    onClick={() => setDef((p) => ({ ...p, options: (p.options ?? []).filter((_, j) => j !== i) }))}\n                  >\n                    ✕\n                  </Button>\n                </div>\n                {/* Afbeelding per waarde (5.6) — vooral voor de kleur-as: de detailpagina\n                    wisselt het hoofdbeeld mee met de gekozen kleur. */}\n                {/^kleur|^colou?r/i.test(opt.name) && opt.values.length > 0 && (\n                  <div className=\"flex flex-wrap items-center gap-2\">\n                    {opt.values.map((value) => {\n                      const url = opt.images?.[value];\n                      return (\n                        <span key={value} className=\"flex items-center gap-1 rounded-full border border-slate-200 px-2 py-1 text-xs\">\n                          {url && <img src={url} alt=\"\" className=\"h-6 w-6 rounded object-cover\" />}\n                          {value}\n                          <MediaPickerButton\n                            siteId={siteId}\n                            label={url ? \"↻\" : \"+ foto\"}\n                            onSelect={(m) =>\n                              setOption(i, { images: { ...(opt.images ?? {}), [value]: m.url } })\n                            }\n                          />\n                          {url && (\n                            <button\n                              type=\"button\"\n                              aria-label={`Verwijder foto van ${value}`}\n                              className=\"text-slate-400 hover:text-slate-700\"\n                              onClick={() => {\n                                const images = { ...(opt.images ?? {}) };\n                                delete images[value];\n                                setOption(i, { images });\n                              }}\n                            >\n                              ✕\n                            </button>\n                          )}\n                        </span>\n                      );\n                    })}\n                  </div>\n                )}\n              </div>\n            ))}\n            {(def.options ?? []).length < 3 && (\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                className=\"w-fit\"\n                onClick={() => setDef((p) => ({ ...p, options: [...(p.options ?? []), { name: \"\", values: [] }] }))}\n              >\n                + Optie\n              </Button>\n            )}\n          </div>\n        </Field>\n\n        {variantKeys.length > 0 && variantKeys.length <= 60 && (\n          <Field label=\"Varianten\" hint=\"Leeg = standaardprijs / onbeperkte voorraad\">\n            <div className=\"overflow-x-auto\">\n              <table className=\"w-full text-sm\">\n                <thead>\n                  <tr className=\"text-left text-xs text-slate-500\">\n                    <th className=\"py-1 pr-2\">Combinatie</th>\n                    <th className=\"py-1 pr-2\">Prijs (€)</th>\n                    {def.trackStock && <th className=\"py-1 pr-2\">Voorraad</th>}\n                    <th className=\"py-1 pr-2\">Leverbaar</th>\n                  </tr>\n                </thead>\n                <tbody>\n                  {variantKeys.map((key) => {\n                    const v = variantFor(key);\n                    return (\n                      <tr key={key} className=\"border-t border-slate-100\">\n                        <td className=\"py-1 pr-2\">{key.split(\"|\").join(\" · \")}</td>\n                        <td className=\"py-1 pr-2\">\n                          {/* Native uncontrolled inputs: geen cursor-gedoe bij \"13,\" tijdens typen. */}\n                          <input\n                            className=\"w-24 rounded-lg border border-slate-200 px-2 py-1\"\n                            placeholder={centsToEuroInput(def.priceCents)}\n                            defaultValue={centsToEuroInput(v?.priceCents)}\n                            onChange={(e) => {\n                              const c = eurosToCents(e.target.value);\n                              patchVariant(key, { priceCents: c ?? undefined });\n                            }}\n                          />\n                        </td>\n                        {def.trackStock && (\n                          <td className=\"py-1 pr-2\">\n                            <input\n                              className=\"w-20 rounded-lg border border-slate-200 px-2 py-1\"\n                              type=\"number\"\n                              min={0}\n                              placeholder=\"∞\"\n                              defaultValue={v?.stock ?? \"\"}\n                              onChange={(e) => {\n                                const n = e.target.value === \"\" ? undefined : Math.max(0, Number(e.target.value) || 0);\n                                patchVariant(key, { stock: n });\n                              }}\n                            />\n                          </td>\n                        )}\n                        <td className=\"py-1 pr-2\">\n                          <Switch checked={v?.active !== false} onCheckedChange={(on) => patchVariant(key, { active: on })} />\n                        </td>\n                      </tr>\n                    );\n                  })}\n                </tbody>\n              </table>\n            </div>\n          </Field>\n        )}\n        {variantKeys.length > 60 && (\n          <p className=\"text-sm text-amber-600\">\n            {variantKeys.length} combinaties — te veel om per stuk te tonen. Beperk het aantal optie-waarden.\n          </p>\n        )}\n\n        {/* Personalisatie (5.6): eigen naam/logo van de klant, met optionele meerprijs. */}\n        <Field\n          label=\"Personalisatie (eigen tekst of afbeelding)\"\n          hint=\"Max. 3 velden. De klant vult dit in op de productpagina; de meerprijs telt automatisch mee.\"\n        >\n          <div className=\"grid gap-2\">\n            {(def.personalization ?? []).map((f, i) => {\n              const setPers = (patch: Partial<PersonalizationField>) =>\n                setDef((p) => {\n                  const personalization = [...(p.personalization ?? [])];\n                  personalization[i] = { ...personalization[i], ...patch };\n                  return { ...p, personalization };\n                });\n              return (\n                <div key={i} className=\"grid gap-2 rounded-lg border border-slate-100 p-2 md:grid-cols-[1fr_130px_90px_110px_auto]\">\n                  <Input\n                    placeholder='Label (bv. \"Naam van het kindje\")'\n                    value={f.label}\n                    onChange={(e) =>\n                      setPers({\n                        label: e.target.value,\n                        key: f.key || e.target.value.toLowerCase().replace(/[^a-z0-9]+/g, \"_\").replace(/^_+|_+$/g, \"\").slice(0, 40) || `veld${i + 1}`,\n                      })\n                    }\n                  />\n                  <Select\n                    value={f.type}\n                    onValueChange={(v) => setPers({ type: v as \"text\" | \"image\" })}\n                    options={[\n                      { value: \"text\", label: \"Tekst\" },\n                      { value: \"image\", label: \"Afbeelding\" },\n                    ]}\n                  />\n                  {f.type === \"text\" ? (\n                    <Input\n                      type=\"number\"\n                      title=\"Max. tekens\"\n                      min={1}\n                      max={200}\n                      value={f.maxLength ?? 40}\n                      onChange={(e) => setPers({ maxLength: Math.max(1, Math.min(200, Number(e.target.value) || 40)) })}\n                    />\n                  ) : (\n                    <span className=\"self-center text-xs text-slate-400\">jpg/png/webp</span>\n                  )}\n                  <input\n                    className=\"rounded-lg border border-slate-200 px-2 py-1\"\n                    placeholder=\"Meerprijs €\"\n                    defaultValue={f.priceCents ? centsToEuroInput(f.priceCents) : \"\"}\n                    onChange={(e) => setPers({ priceCents: eurosToCents(e.target.value) ?? 0 })}\n                  />\n                  <div className=\"flex items-center gap-2\">\n                    <Switch checked={f.required === true} onCheckedChange={(v) => setPers({ required: v })} label=\"Verplicht\" />\n                    <Button\n                      size=\"sm\"\n                      variant=\"ghost\"\n                      onClick={() => setDef((p) => ({ ...p, personalization: (p.personalization ?? []).filter((_, j) => j !== i) }))}\n                    >\n                      ✕\n                    </Button>\n                  </div>\n                </div>\n              );\n            })}\n            {(def.personalization ?? []).length < 3 && (\n              <Button\n                size=\"sm\"\n                variant=\"secondary\"\n                className=\"w-fit\"\n                onClick={() =>\n                  setDef((p) => ({\n                    ...p,\n                    personalization: [\n                      ...(p.personalization ?? []),\n                      { key: `veld${(p.personalization ?? []).length + 1}`, label: \"\", type: \"text\", required: false, maxLength: 40, priceCents: 0 },\n                    ],\n                  }))\n                }\n              >\n                + Personalisatie-veld\n              </Button>\n            )}\n          </div>\n        </Field>\n\n        <div className=\"flex flex-wrap items-center gap-6\">\n          <Field label=\"Status\">\n            <Select\n              value={def.status ?? \"draft\"}\n              onValueChange={(v) => setDef((p) => ({ ...p, status: v as Product[\"status\"] }))}\n              options={STATUS_OPTIONS}\n            />\n          </Field>\n          <Field label=\"Volgorde\">\n            <Input\n              type=\"number\"\n              className=\"w-24\"\n              value={def.order ?? 0}\n              onChange={(e) => setDef((p) => ({ ...p, order: Math.max(0, Number(e.target.value) || 0) }))}\n            />\n          </Field>\n          <Switch checked={def.featured === true} onCheckedChange={(v) => setDef((p) => ({ ...p, featured: v }))} label=\"Uitgelicht\" />\n          <Switch checked={def.trackStock === true} onCheckedChange={(v) => setDef((p) => ({ ...p, trackStock: v }))} label=\"Voorraad bijhouden\" />\n          {def.trackStock && (def.options ?? []).length === 0 && (\n            <Field label=\"Voorraad\">\n              <Input\n                type=\"number\"\n                className=\"w-24\"\n                placeholder=\"∞\"\n                value={def.stock ?? \"\"}\n                onChange={(e) =>\n                  setDef((p) => ({ ...p, stock: e.target.value === \"\" ? undefined : Math.max(0, Number(e.target.value) || 0) }))\n                }\n              />\n            </Field>\n          )}\n        </div>\n\n        <div className=\"flex items-center justify-between border-t border-slate-100 pt-4\">\n          <div className=\"flex items-center gap-3\">\n            <Button onClick={save}>Opslaan</Button>\n            <span className=\"text-sm text-slate-500\">{formatCents(def.priceCents)}</span>\n          </div>\n          <Button variant=\"danger\" onClick={remove}>Verwijderen</Button>\n        </div>\n      </div>\n    </Card>\n  );\n}\n"],"mappings":"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","names":[]}

package/dist/admin/shop/ShopSettingsTab.js

@@ -1,8 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
-import { doc, getDoc, setDoc } from "firebase/firestore";
-import { getDb } from "../../firebase/client.js";
+import { doc, getDoc } from "firebase/firestore";
+import { getDb, getFirebaseApp } from "../../firebase/client.js";
+import { callable } from "../../firebase/functionsClient.js";
 import { Button, Card, Field, Input } from "../ui/primitives.js";
 import { useToast } from "../ui/toast.js";
 import { centsToEuroInput, eurosToCents } from "./lib.js";
@@ -25,8 +26,8 @@ function ShopSettingsTab({ siteId }) {
     });
   }, [siteId]);
   async function save() {
-    const db = getDb();
-    if (!db || !cfg) return;
+    const app = getFirebaseApp();
+    if (!app || !cfg) return;
     setBusy(true);
     try {
       const next = {
@@ -34,11 +35,8 @@ function ShopSettingsTab({ siteId }) {
         shippingFlatCents: eurosToCents(shipInput) ?? 495,
         shippingFreeFromCents: freeInput.trim() === "" ? 0 : eurosToCents(freeInput) ?? 0
       };
-      await setDoc(
-        doc(db, "sites", siteId, "settings", "public"),
-        { modules: { shop: { config: next } } },
-        { merge: true }
-      );
+      const fn = callable(app, "saveSiteSettings");
+      await fn({ siteId, settings: { modules: { shop: { config: next } } } });
       setCfg(next);
       toast({ title: "Instellingen opgeslagen", tone: "success" });
     } catch (e) {

package/dist/admin/shop/ShopSettingsTab.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/admin/shop/ShopSettingsTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { doc, getDoc, setDoc } from \"firebase/firestore\";\nimport { getDb } from \"../../firebase/client\";\nimport { Button, Card, Field, Input } from \"../ui/primitives\";\nimport { useToast } from \"../ui/toast\";\nimport { centsToEuroInput, eurosToCents } from \"./lib\";\n\n/**\n * Winkel-instellingen — leest/schrijft DEZELFDE module-config als Instellingen → Modules\n * (settings/public.modules.shop.config; geen tweede bron van waarheid), maar met winkel-\n * presentatie: bedragen in euro's en uitleg per veld. Siteadmin-only (rules).\n */\ninterface ShopCfg {\n  shippingFlatCents?: number;\n  shippingFreeFromCents?: number;\n  orderPrefix?: string;\n  currency?: string;\n  businessName?: string;\n  businessAddress?: string;\n  businessZip?: string;\n  businessCity?: string;\n  businessKvk?: string;\n  businessBtw?: string;\n  [k: string]: unknown;\n}\n\nexport function ShopSettingsTab({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const [cfg, setCfg] = useState<ShopCfg | null>(null);\n  const [shipInput, setShipInput] = useState(\"\");\n  const [freeInput, setFreeInput] = useState(\"\");\n  const [busy, setBusy] = useState(false);\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) return;\n    void getDoc(doc(db, \"sites\", siteId, \"settings\", \"public\")).then((snap) => {\n      const modules = (snap.data()?.modules ?? {}) as Record<string, { config?: ShopCfg } | boolean>;\n      const entry = modules.shop;\n      const c = typeof entry === \"object\" && entry !== null ? (entry.config ?? {}) : {};\n      setCfg(c);\n      setShipInput(centsToEuroInput(c.shippingFlatCents ?? 495));\n      setFreeInput(c.shippingFreeFromCents ? centsToEuroInput(c.shippingFreeFromCents) : \"\");\n    });\n  }, [siteId]);\n\n  async function save() {\n    const db = getDb();\n    if (!db || !cfg) return;\n    setBusy(true);\n    try {\n      const next: ShopCfg = {\n        ...cfg,\n        shippingFlatCents: eurosToCents(shipInput) ?? 495,\n        shippingFreeFromCents: freeInput.trim() === \"\" ? 0 : (eurosToCents(freeInput) ?? 0),\n      };\n      // Merge-diep op precies dit pad; enabled-vlag blijft onaangeroerd.\n      await setDoc(\n        doc(db, \"sites\", siteId, \"settings\", \"public\"),\n        { modules: { shop: { config: next } } },\n        { merge: true },\n      );\n      setCfg(next);\n      toast({ title: \"Instellingen opgeslagen\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: e instanceof Error ? e.message : undefined, tone: \"error\" });\n    } finally {\n      setBusy(false);\n    }\n  }\n\n  if (!cfg) return <Card><p className=\"text-sm text-slate-500\">Laden…</p></Card>;\n\n  const set = (k: string, v: string) => setCfg((p) => ({ ...p, [k]: v }));\n\n  return (\n    <div className=\"grid gap-4 lg:grid-cols-2\">\n      <Card>\n        <h3 className=\"mb-3 text-sm font-semibold\">Verzending & bestellen</h3>\n        <div className=\"grid gap-4\">\n          <Field label=\"Verzendkosten (€)\" hint=\"Vast bedrag per bestelling binnen Nederland\">\n            <Input value={shipInput} onChange={(e) => setShipInput(e.target.value)} placeholder=\"4,95\" className=\"w-32\" />\n          </Field>\n          <Field label=\"Gratis verzending vanaf (€)\" hint=\"Leeg = nooit gratis\">\n            <Input value={freeInput} onChange={(e) => setFreeInput(e.target.value)} placeholder=\"50,00\" className=\"w-32\" />\n          </Field>\n          <Field label=\"Ordernummer-prefix\" hint=\"Bijv. CKC → CKC-2026-0001\">\n            <Input value={String(cfg.orderPrefix ?? \"ORDER\")} onChange={(e) => set(\"orderPrefix\", e.target.value.toUpperCase().slice(0, 12))} className=\"w-32\" />\n          </Field>\n        </div>\n      </Card>\n\n      <Card>\n        <h3 className=\"mb-1 text-sm font-semibold\">Bedrijfsgegevens (factuur)</h3>\n        <p className=\"mb-3 text-xs text-slate-500\">Deze gegevens komen op de factuur-PDF die klanten bij hun bestelling krijgen.</p>\n        <div className=\"grid gap-3\">\n          <Field label=\"Bedrijfsnaam\"><Input value={String(cfg.businessName ?? \"\")} onChange={(e) => set(\"businessName\", e.target.value)} /></Field>\n          <Field label=\"Adres\"><Input value={String(cfg.businessAddress ?? \"\")} onChange={(e) => set(\"businessAddress\", e.target.value)} /></Field>\n          <div className=\"grid grid-cols-[120px_1fr] gap-3\">\n            <Field label=\"Postcode\"><Input value={String(cfg.businessZip ?? \"\")} onChange={(e) => set(\"businessZip\", e.target.value)} /></Field>\n            <Field label=\"Plaats\"><Input value={String(cfg.businessCity ?? \"\")} onChange={(e) => set(\"businessCity\", e.target.value)} /></Field>\n          </div>\n          <div className=\"grid grid-cols-2 gap-3\">\n            <Field label=\"KVK-nummer\"><Input value={String(cfg.businessKvk ?? \"\")} onChange={(e) => set(\"businessKvk\", e.target.value)} /></Field>\n            <Field label=\"Btw-nummer\"><Input value={String(cfg.businessBtw ?? \"\")} onChange={(e) => set(\"businessBtw\", e.target.value)} /></Field>\n          </div>\n        </div>\n      </Card>\n\n      <div className=\"lg:col-span-2\">\n        <Button onClick={save} disabled={busy}>Opslaan</Button>\n        <p className=\"mt-2 text-xs text-slate-500\">\n          Paden en valuta van de winkel staan onder Instellingen → Modules → Webwinkel.\n        </p>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../src/admin/shop/ShopSettingsTab.tsx"],"sourcesContent":["\"use client\";\n\nimport { useEffect, useState } from \"react\";\nimport { doc, getDoc } from \"firebase/firestore\";\nimport { getDb, getFirebaseApp } from \"../../firebase/client\";\nimport { callable } from \"../../firebase/functionsClient\";\nimport { Button, Card, Field, Input } from \"../ui/primitives\";\nimport { useToast } from \"../ui/toast\";\nimport { centsToEuroInput, eurosToCents } from \"./lib\";\n\n/**\n * Winkel-instellingen — leest/schrijft DEZELFDE module-config als Instellingen → Modules\n * (settings/public.modules.shop.config; geen tweede bron van waarheid), maar met winkel-\n * presentatie: bedragen in euro's en uitleg per veld. Siteadmin-only (rules).\n */\ninterface ShopCfg {\n  shippingFlatCents?: number;\n  shippingFreeFromCents?: number;\n  orderPrefix?: string;\n  currency?: string;\n  businessName?: string;\n  businessAddress?: string;\n  businessZip?: string;\n  businessCity?: string;\n  businessKvk?: string;\n  businessBtw?: string;\n  [k: string]: unknown;\n}\n\nexport function ShopSettingsTab({ siteId }: { siteId: string }) {\n  const { toast } = useToast();\n  const [cfg, setCfg] = useState<ShopCfg | null>(null);\n  const [shipInput, setShipInput] = useState(\"\");\n  const [freeInput, setFreeInput] = useState(\"\");\n  const [busy, setBusy] = useState(false);\n\n  useEffect(() => {\n    const db = getDb();\n    if (!db) return;\n    void getDoc(doc(db, \"sites\", siteId, \"settings\", \"public\")).then((snap) => {\n      const modules = (snap.data()?.modules ?? {}) as Record<string, { config?: ShopCfg } | boolean>;\n      const entry = modules.shop;\n      const c = typeof entry === \"object\" && entry !== null ? (entry.config ?? {}) : {};\n      setCfg(c);\n      setShipInput(centsToEuroInput(c.shippingFlatCents ?? 495));\n      setFreeInput(c.shippingFreeFromCents ? centsToEuroInput(c.shippingFreeFromCents) : \"\");\n    });\n  }, [siteId]);\n\n  async function save() {\n    const app = getFirebaseApp();\n    if (!app || !cfg) return;\n    setBusy(true);\n    try {\n      const next: ShopCfg = {\n        ...cfg,\n        shippingFlatCents: eurosToCents(shipInput) ?? 495,\n        shippingFreeFromCents: freeInput.trim() === \"\" ? 0 : (eurosToCents(freeInput) ?? 0),\n      };\n      /**\n       * Via de saveSiteSettings-callable, NIET rechtstreeks naar Firestore. Deze tab deed nog een\n       * directe setDoc op settings/public, maar die deur zit sinds de settings-verstrakking in de\n       * rules voor iederéén dicht (ook superadmin) — de klant kreeg letterlijk \"Missing or\n       * insufficient permissions\" bij het opslaan van verzendkosten. De callable is bovendien de\n       * enige route die site/public consistent houdt én de cache-tag pusht, zodat de nieuwe\n       * verzendkosten binnen seconden op de live winkel staan i.p.v. na het ISR-vangnet.\n       * set+merge in de callable merged diep: de enabled-vlag en andere modules blijven staan.\n       */\n      const fn = callable(app, \"saveSiteSettings\");\n      await fn({ siteId, settings: { modules: { shop: { config: next } } } });\n      setCfg(next);\n      toast({ title: \"Instellingen opgeslagen\", tone: \"success\" });\n    } catch (e) {\n      toast({ title: \"Opslaan mislukt\", description: e instanceof Error ? e.message : undefined, tone: \"error\" });\n    } finally {\n      setBusy(false);\n    }\n  }\n\n  if (!cfg) return <Card><p className=\"text-sm text-slate-500\">Laden…</p></Card>;\n\n  const set = (k: string, v: string) => setCfg((p) => ({ ...p, [k]: v }));\n\n  return (\n    <div className=\"grid gap-4 lg:grid-cols-2\">\n      <Card>\n        <h3 className=\"mb-3 text-sm font-semibold\">Verzending & bestellen</h3>\n        <div className=\"grid gap-4\">\n          <Field label=\"Verzendkosten (€)\" hint=\"Vast bedrag per bestelling binnen Nederland\">\n            <Input value={shipInput} onChange={(e) => setShipInput(e.target.value)} placeholder=\"4,95\" className=\"w-32\" />\n          </Field>\n          <Field label=\"Gratis verzending vanaf (€)\" hint=\"Leeg = nooit gratis\">\n            <Input value={freeInput} onChange={(e) => setFreeInput(e.target.value)} placeholder=\"50,00\" className=\"w-32\" />\n          </Field>\n          <Field label=\"Ordernummer-prefix\" hint=\"Bijv. CKC → CKC-2026-0001\">\n            <Input value={String(cfg.orderPrefix ?? \"ORDER\")} onChange={(e) => set(\"orderPrefix\", e.target.value.toUpperCase().slice(0, 12))} className=\"w-32\" />\n          </Field>\n        </div>\n      </Card>\n\n      <Card>\n        <h3 className=\"mb-1 text-sm font-semibold\">Bedrijfsgegevens (factuur)</h3>\n        <p className=\"mb-3 text-xs text-slate-500\">Deze gegevens komen op de factuur-PDF die klanten bij hun bestelling krijgen.</p>\n        <div className=\"grid gap-3\">\n          <Field label=\"Bedrijfsnaam\"><Input value={String(cfg.businessName ?? \"\")} onChange={(e) => set(\"businessName\", e.target.value)} /></Field>\n          <Field label=\"Adres\"><Input value={String(cfg.businessAddress ?? \"\")} onChange={(e) => set(\"businessAddress\", e.target.value)} /></Field>\n          <div className=\"grid grid-cols-[120px_1fr] gap-3\">\n            <Field label=\"Postcode\"><Input value={String(cfg.businessZip ?? \"\")} onChange={(e) => set(\"businessZip\", e.target.value)} /></Field>\n            <Field label=\"Plaats\"><Input value={String(cfg.businessCity ?? \"\")} onChange={(e) => set(\"businessCity\", e.target.value)} /></Field>\n          </div>\n          <div className=\"grid grid-cols-2 gap-3\">\n            <Field label=\"KVK-nummer\"><Input value={String(cfg.businessKvk ?? \"\")} onChange={(e) => set(\"businessKvk\", e.target.value)} /></Field>\n            <Field label=\"Btw-nummer\"><Input value={String(cfg.businessBtw ?? \"\")} onChange={(e) => set(\"businessBtw\", e.target.value)} /></Field>\n          </div>\n        </div>\n      </Card>\n\n      <div className=\"lg:col-span-2\">\n        <Button onClick={save} disabled={busy}>Opslaan</Button>\n        <p className=\"mt-2 text-xs text-slate-500\">\n          Paden en valuta van de winkel staan onder Instellingen → Modules → Webwinkel.\n        </p>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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","names":[]}