@flowselections/floriday-voorraad 1.0.15 → 1.0.17

package/dist-lib/components/voorraad/EditArtikelPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EditArtikelPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/EditArtikelPage.tsx"],"names":[],"mappings":"AAWA,wBAAgB,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,2CA0DrD"}
+{"version":3,"file":"EditArtikelPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/EditArtikelPage.tsx"],"names":[],"mappings":"AAeA,wBAAgB,eAAe,CAAC,EAAE,EAAE,EAAE,EAAE;IAAE,EAAE,EAAE,MAAM,CAAA;CAAE,2CAyHrD"}

package/dist-lib/components/voorraad/EditArtikelPage.js

@@ -1,11 +1,18 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useState } from "react";
+import { useNavigate } from "@tanstack/react-router";
 import { Card } from "@flowselections/core";
 import { Loader2 } from "lucide-react";
 import { ArtikelWizard } from "./ArtikelWizard";
 import { supabase } from "../../integrations/supabase/client";
+import { useFloridayConnection } from "../../hooks/useFloridayConnection";
+import { upsertLocalTradeItem } from "../../hooks/useLocalTradeItems";
+import { emptyWizardData, isValidGtin13 } from "../../lib/floriday-payload";
 export function EditArtikelPage({ id }) {
     const [resolved, setResolved] = useState(null);
+    const [promoting, setPromoting] = useState(false);
+    const { activeId } = useFloridayConnection();
+    const navigate = useNavigate();
     useEffect(() => {
         let cancelled = false;
         setResolved(null);
@@ -32,14 +39,81 @@ export function EditArtikelPage({ id }) {
                 setResolved({ kind: "published", id });
                 return;
             }
-            setResolved({ kind: "notfound" });
+            // Fallback: ERP-only product → promote to editable draft transparently.
+            const prodRes = await supabase
+                .from("products")
+                .select("id,product,barcode,quantity,sale_price")
+                .eq("id", id)
+                .maybeSingle();
+            if (cancelled)
+                return;
+            if (!prodRes.data) {
+                setResolved({ kind: "notfound" });
+                return;
+            }
+            if (!activeId) {
+                // No Floriday connection yet — cannot create a draft (connection_id required).
+                setResolved({ kind: "notfound" });
+                return;
+            }
+            setPromoting(true);
+            try {
+                // Look for an existing draft already linked to this product.
+                const existing = await supabase
+                    .from("trade_item_drafts")
+                    .select("id,data")
+                    .eq("connection_id", activeId)
+                    .contains("data", { linkedProductId: id })
+                    .maybeSingle();
+                if (cancelled)
+                    return;
+                if (existing.data) {
+                    navigate({
+                        to: "/voorraad/$id",
+                        params: { id: existing.data.id },
+                        replace: true,
+                    });
+                    return;
+                }
+                const prod = prodRes.data;
+                const barcode = String(prod.barcode ?? "").trim();
+                const validGtin = isValidGtin13(barcode);
+                const seed = {
+                    ...emptyWizardData,
+                    name: prod.product ?? "",
+                    articleCode: validGtin ? "" : barcode,
+                    gtin: validGtin ? barcode : "",
+                    salePricePerPiece: Number(prod.sale_price) || 0,
+                    saleStockPieces: Number(prod.quantity) || 0,
+                    linkedProductId: id,
+                };
+                const newId = await upsertLocalTradeItem({
+                    connectionId: activeId,
+                    data: seed,
+                });
+                if (cancelled)
+                    return;
+                navigate({
+                    to: "/voorraad/$id",
+                    params: { id: newId },
+                    replace: true,
+                });
+            }
+            catch {
+                if (!cancelled)
+                    setResolved({ kind: "notfound" });
+            }
+            finally {
+                if (!cancelled)
+                    setPromoting(false);
+            }
         })();
         return () => {
             cancelled = true;
         };
-    }, [id]);
-    if (!resolved) {
-        return (_jsx("main", { className: "p-6", children: _jsxs(Card, { className: "p-6 flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Artikel zoeken..."] }) }));
+    }, [id, activeId, navigate]);
+    if (!resolved || promoting) {
+        return (_jsx("main", { className: "p-6", children: _jsxs(Card, { className: "p-6 flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), promoting ? "Artikel voorbereiden voor bewerken..." : "Artikel zoeken..."] }) }));
     }
     if (resolved.kind === "notfound") {
         return (_jsx("main", { className: "p-6", children: _jsx(Card, { className: "p-6 text-sm", children: "Artikel niet gevonden. Het is mogelijk verwijderd of nog niet gesynchroniseerd vanuit Floriday." }) }));

package/dist-lib/components/voorraad/ExcelExportButton.d.ts

@@ -1,6 +1,7 @@
 import type { TradeItem } from "../../lib/floriday-client";
-export declare function ExcelExportButton({ items, filename, }: {
+export declare function ExcelExportButton({ items, filename, onExported, }: {
     items: TradeItem[];
     filename?: string;
+    onExported?: () => void | Promise<void>;
 }): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=ExcelExportButton.d.ts.map

package/dist-lib/components/voorraad/ExcelExportButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ExcelExportButton.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ExcelExportButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAE3D,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAqB,GACtB,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,2CAyBA"}
+{"version":3,"file":"ExcelExportButton.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ExcelExportButton.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAG3D,wBAAgB,iBAAiB,CAAC,EAChC,KAAK,EACL,QAAqB,EACrB,UAAU,GACX,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACzC,2CAgDA"}

package/dist-lib/components/voorraad/ExcelExportButton.js

@@ -1,11 +1,26 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import * as XLSX from "xlsx";
-import { Button } from "@flowselections/core";
+import { Button, toast } from "@flowselections/core";
 import { Download } from "lucide-react";
-export function ExcelExportButton({ items, filename = "voorraad", }) {
-    const handle = () => {
-        const rows = items.map((i) => ({
-            Artikelnummer: i.articleNumber,
+import { ensureArticleCodes } from "../../lib/ensure-article-codes";
+export function ExcelExportButton({ items, filename = "voorraad", onExported, }) {
+    const handle = async () => {
+        let exportItems;
+        try {
+            exportItems = await ensureArticleCodes(items);
+        }
+        catch (e) {
+            toast.error(`Artikelcodes genereren mislukt: ${e.message}`);
+            return;
+        }
+        const missing = exportItems.filter((i) => !(i.articleNumber ?? "").trim());
+        if (missing.length > 0) {
+            toast.error(`${missing.length} artikel(en) missen nog een artikelcode; export afgebroken.`);
+            return;
+        }
+        const generatedCount = exportItems.filter((i, idx) => i.articleNumber !== items[idx].articleNumber).length;
+        const rows = exportItems.map((i) => ({
+            Artikelcode: i.articleNumber,
             Productnaam: i.name,
             "Liggende voorraad": i.quantity,
             Minimum: i.minQuantity,
@@ -19,6 +34,10 @@ export function ExcelExportButton({ items, filename = "voorraad", }) {
         XLSX.utils.book_append_sheet(wb, ws, "Voorraad");
         const stamp = new Date().toISOString().slice(0, 10);
         XLSX.writeFile(wb, `${filename}-${stamp}.xlsx`);
+        if (generatedCount > 0) {
+            toast.success(`${generatedCount} artikel(en) kregen automatisch een nieuwe artikelcode.`);
+            await onExported?.();
+        }
     };
     return (_jsxs(Button, { variant: "outline", onClick: handle, disabled: items.length === 0, children: [_jsx(Download, { className: "mr-2 h-4 w-4" }), "Excel export"] }));
 }

package/dist-lib/components/voorraad/OrderHistoryCard.d.ts

@@ -0,0 +1,8 @@
+interface Props {
+    tradeItemKey: string | null;
+    productName: string | null;
+    productId?: string | null;
+}
+export declare function OrderHistoryCard({ tradeItemKey, productName, productId }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=OrderHistoryCard.d.ts.map

package/dist-lib/components/voorraad/OrderHistoryCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrderHistoryCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/OrderHistoryCard.tsx"],"names":[],"mappings":"AAKA,UAAU,KAAK;IACb,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,WAAW,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC3B;AAgDD,wBAAgB,gBAAgB,CAAC,EAAE,YAAY,EAAE,WAAW,EAAE,SAAS,EAAE,EAAE,KAAK,2CAoK/E"}

package/dist-lib/components/voorraad/OrderHistoryCard.js

@@ -0,0 +1,133 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from "react";
+import { Card, CardContent, Badge } from "@flowselections/core";
+import { Loader2, ClipboardList, ExternalLink } from "lucide-react";
+import { supabase } from "../../integrations/supabase/client";
+const STATUS_TONE = {
+    "nog te picken": "bg-amber-100 text-amber-800 border-amber-200",
+    "klaar voor verzending": "bg-blue-100 text-blue-800 border-blue-200",
+    verzonden: "bg-emerald-100 text-emerald-800 border-emerald-200",
+    geannuleerd: "bg-rose-100 text-rose-800 border-rose-200",
+    concept: "bg-slate-100 text-slate-700 border-slate-200",
+};
+// Legacy waarden mappen naar de nieuwe fases zolang de backfill/trigger
+// nog niet elke rij heeft omgezet.
+function normalizeStatus(raw) {
+    const s = (raw ?? "").trim().toLowerCase();
+    if (!s)
+        return "Nog te picken";
+    if (["verzonden", "geleverd", "shipped", "delivered"].includes(s))
+        return "Verzonden";
+    if (["nieuw", "open", "new", "pending"].includes(s))
+        return "Nog te picken";
+    if (["ready", "klaar", "klaar voor verzending"].includes(s))
+        return "Klaar voor verzending";
+    if (["geannuleerd", "cancelled", "canceled"].includes(s))
+        return "geannuleerd";
+    if (s === "concept")
+        return "concept";
+    if (s === "nog te picken")
+        return "Nog te picken";
+    return raw ?? "Nog te picken";
+}
+function formatDate(v) {
+    if (!v)
+        return "—";
+    try {
+        const d = new Date(v);
+        if (Number.isNaN(d.getTime()))
+            return v;
+        return d.toLocaleDateString("nl-NL", { day: "2-digit", month: "short", year: "numeric" });
+    }
+    catch {
+        return v;
+    }
+}
+export function OrderHistoryCard({ tradeItemKey, productName, productId }) {
+    const [rows, setRows] = useState(null);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        let cancelled = false;
+        const load = async () => {
+            setError(null);
+            try {
+                // Resolve all local product ids that map to this trade item key.
+                const productIds = new Set();
+                if (productId)
+                    productIds.add(productId);
+                if (tradeItemKey) {
+                    const { data: prods } = await supabase
+                        .from("products")
+                        .select("id")
+                        .eq("trade_item_key", tradeItemKey)
+                        .limit(50);
+                    for (const p of (prods ?? []))
+                        productIds.add(p.id);
+                }
+                // Build the OR filter: match on product_id OR on product_name for
+                // legacy rows that weren't linked to a product yet.
+                const orFilters = [];
+                if (productIds.size > 0) {
+                    orFilters.push(`product_id.in.(${[...productIds].join(",")})`);
+                }
+                if (productName) {
+                    const safe = productName.replace(/[\\%,()]/g, " ").trim();
+                    if (safe)
+                        orFilters.push(`product_name.eq.${safe}`);
+                }
+                if (orFilters.length === 0) {
+                    if (!cancelled)
+                        setRows([]);
+                    return;
+                }
+                const { data, error } = await supabase
+                    .from("order_items")
+                    .select("order_id,quantity,unit,orders!inner(id,order_number,customer_name,order_date,created_at,status,order_source,deleted_at)")
+                    .or(orFilters.join(","))
+                    .is("orders.deleted_at", null)
+                    .order("created_at", { ascending: false, foreignTable: "orders" })
+                    .limit(100);
+                if (error)
+                    throw error;
+                if (cancelled)
+                    return;
+                const mapped = (data ?? [])
+                    .map((r) => ({
+                    order_id: r.order_id,
+                    order_number: r.orders?.order_number ?? "—",
+                    customer_name: r.orders?.customer_name ?? null,
+                    quantity: r.quantity ?? 0,
+                    unit: r.unit ?? null,
+                    order_date: r.orders?.order_date ?? null,
+                    created_at: r.orders?.created_at ?? "",
+                    status: r.orders?.status ?? null,
+                    order_source: r.orders?.order_source ?? null,
+                }))
+                    .sort((a, b) => (a.created_at < b.created_at ? 1 : -1));
+                setRows(mapped);
+            }
+            catch (e) {
+                if (!cancelled)
+                    setError(e.message);
+            }
+        };
+        load();
+        // Realtime: refresh when any order or order_item mutates.
+        const channel = supabase
+            .channel(`order-history-${tradeItemKey ?? "none"}`)
+            .on("postgres_changes", { event: "*", schema: "public", table: "order_items" }, load)
+            .on("postgres_changes", { event: "*", schema: "public", table: "orders" }, load)
+            .subscribe();
+        return () => {
+            cancelled = true;
+            supabase.removeChannel(channel);
+        };
+    }, [tradeItemKey, productName, productId]);
+    return (_jsxs(Card, { children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-3 px-6 py-4", children: [_jsx("span", { className: "flex h-7 w-7 items-center justify-center rounded-full border border-primary/40 bg-primary/10 text-primary", children: _jsx(ClipboardList, { className: "h-4 w-4" }) }), _jsx("span", { className: "font-medium", children: "Bestelgeschiedenis" }), _jsx("span", { className: "text-xs text-muted-foreground tabular-nums", children: rows ? `${rows.length} bestelling${rows.length === 1 ? "" : "en"}` : "" })] }), _jsxs(CardContent, { className: "pt-0", children: [error && (_jsxs("div", { className: "text-sm text-destructive", children: ["Kon bestelgeschiedenis niet laden: ", error] })), !rows && !error && (_jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), " Bestellingen laden\u2026"] })), rows && rows.length === 0 && !error && (_jsx("div", { className: "text-sm text-muted-foreground", children: "Nog geen bestellingen voor dit artikel." })), rows && rows.length > 0 && (_jsx("div", { className: "overflow-x-auto rounded-md border", children: _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted/50 text-xs uppercase text-muted-foreground", children: _jsxs("tr", { children: [_jsx("th", { className: "px-3 py-2 text-left", children: "Ordernummer" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Klant" }), _jsx("th", { className: "px-3 py-2 text-right", children: "Fusten" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Besteldatum" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Status" }), _jsx("th", { className: "px-3 py-2" })] }) }), _jsx("tbody", { children: rows.map((r) => {
+                                        const label = normalizeStatus(r.status);
+                                        const tone = STATUS_TONE[label.toLowerCase()] ??
+                                            "bg-slate-100 text-slate-700 border-slate-200";
+                                        const href = `/floriday-verkoop/verkooporders/${r.order_id}`;
+                                        return (_jsxs("tr", { className: "border-t hover:bg-muted/40 cursor-pointer", onClick: () => { window.location.href = href; }, children: [_jsx("td", { className: "px-3 py-2 font-medium", children: _jsx("a", { href: href, className: "text-primary hover:underline", onClick: (e) => e.stopPropagation(), children: r.order_number }) }), _jsx("td", { className: "px-3 py-2", children: r.customer_name ?? "—" }), _jsxs("td", { className: "px-3 py-2 text-right tabular-nums", children: [r.quantity, r.unit ? _jsx("span", { className: "ml-1 text-xs text-muted-foreground", children: r.unit }) : null] }), _jsx("td", { className: "px-3 py-2", children: formatDate(r.order_date ?? r.created_at) }), _jsx("td", { className: "px-3 py-2", children: _jsx(Badge, { variant: "outline", className: `border ${tone}`, children: label }) }), _jsx("td", { className: "px-3 py-2 text-right text-muted-foreground", children: _jsx(ExternalLink, { className: "h-3.5 w-3.5 inline" }) })] }, r.order_id));
+                                    }) })] }) }))] })] }));
+}

package/dist-lib/components/voorraad/PriceStatusBadge.d.ts

@@ -0,0 +1,7 @@
+type Props = {
+    tradeItemId: string | null | undefined;
+    offerForSale: boolean;
+};
+export declare function PriceStatusBadge({ tradeItemId, offerForSale }: Props): import("react/jsx-runtime").JSX.Element | null;
+export {};
+//# sourceMappingURL=PriceStatusBadge.d.ts.map

package/dist-lib/components/voorraad/PriceStatusBadge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"PriceStatusBadge.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/PriceStatusBadge.tsx"],"names":[],"mappings":"AAGA,KAAK,KAAK,GAAG;IACX,WAAW,EAAE,MAAM,GAAG,IAAI,GAAG,SAAS,CAAC;IACvC,YAAY,EAAE,OAAO,CAAC;CACvB,CAAC;AAeF,wBAAgB,gBAAgB,CAAC,EAAE,WAAW,EAAE,YAAY,EAAE,EAAE,KAAK,kDAkEpE"}

package/dist-lib/components/voorraad/PriceStatusBadge.js

@@ -0,0 +1,67 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { CircleDollarSign, Clock, MinusCircle, Loader2 } from "lucide-react";
+import { useTradeItemSupplyLine } from "../../hooks/useTradeItemSupplyLine";
+function formatDate(iso) {
+    if (!iso)
+        return "—";
+    try {
+        return new Date(iso).toLocaleDateString("nl-NL", {
+            day: "2-digit",
+            month: "short",
+            year: "numeric",
+        });
+    }
+    catch {
+        return iso;
+    }
+}
+export function PriceStatusBadge({ tradeItemId, offerForSale }) {
+    const { data: supplyLine, isLoading } = useTradeItemSupplyLine(tradeItemId);
+    if (!tradeItemId)
+        return null;
+    if (isLoading) {
+        return (_jsxs("span", { className: "inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full bg-muted text-muted-foreground", children: [_jsx(Loader2, { className: "h-3 w-3 animate-spin" }), " Prijsstatus laden\u2026"] }));
+    }
+    const now = Date.now();
+    const endMs = supplyLine?.period_end ? new Date(supplyLine.period_end).getTime() : null;
+    const qty = supplyLine?.available_quantity ?? 0;
+    const isExpired = endMs !== null && endMs < now;
+    const isDrained = supplyLine !== null && qty <= 0;
+    let label;
+    let Icon = CircleDollarSign;
+    let cls = "";
+    let variant;
+    if (!supplyLine || !offerForSale) {
+        variant = "none";
+        label = "Geen prijs actief";
+        Icon = MinusCircle;
+        cls = "bg-muted text-muted-foreground";
+    }
+    else if (isExpired || isDrained) {
+        variant = "expired";
+        label = isExpired ? "Prijs verlopen" : "Voorraad op";
+        Icon = Clock;
+        cls = "bg-amber-100 text-amber-800";
+    }
+    else {
+        variant = "live";
+        label = "Prijs live in catalogus";
+        Icon = CircleDollarSign;
+        cls = "bg-emerald-100 text-emerald-700";
+    }
+    const title = supplyLine
+        ? [
+            `Prijs: ${supplyLine.price_per_piece != null
+                ? `${supplyLine.currency ?? "EUR"} ${supplyLine.price_per_piece.toFixed(2)} / stuk`
+                : "—"}`,
+            `Beschikbaar: ${qty}`,
+            `Periode: ${formatDate(supplyLine.period_start)} → ${formatDate(supplyLine.period_end)}`,
+            variant === "none" && !offerForSale
+                ? '"Te koop aanbieden" staat uit.'
+                : null,
+        ]
+            .filter(Boolean)
+            .join("\n")
+        : "Nog geen prijs naar Floriday-catalogus gepusht.";
+    return (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs px-2 py-0.5 rounded-full cursor-help ${cls}`, title: title, children: [_jsx(Icon, { className: "h-3 w-3" }), " ", label] }));
+}

package/dist-lib/components/voorraad/ProductLinkCard.d.ts

@@ -0,0 +1,13 @@
+interface Props {
+    /** trade_item_key for this stock row (usually the Floriday id or `draft:<uuid>`). */
+    tradeItemKey: string | null;
+    /** Optional product name to power auto-linking suggestions. */
+    productName?: string | null;
+}
+/**
+ * Koppelt ERP-`products` rijen aan één Floriday-voorraadrij (`trade_item_key`).
+ * Zonder koppeling doen bestel-triggers niets voor mailbox/manual-orders.
+ */
+export declare function ProductLinkCard({ tradeItemKey, productName }: Props): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=ProductLinkCard.d.ts.map

package/dist-lib/components/voorraad/ProductLinkCard.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProductLinkCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ProductLinkCard.tsx"],"names":[],"mappings":"AAWA,UAAU,KAAK;IACb,qFAAqF;IACrF,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,+DAA+D;IAC/D,WAAW,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AASD;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE,KAAK,2CA4OnE"}

package/dist-lib/components/voorraad/ProductLinkCard.js

@@ -0,0 +1,159 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useCallback, useEffect, useMemo, useState } from "react";
+import { Button, Card, CardContent, Input, toast, } from "@flowselections/core";
+import { Link2, Loader2, RefreshCw, Trash2, Wand2 } from "lucide-react";
+import { supabase } from "../../integrations/supabase/client";
+/**
+ * Koppelt ERP-`products` rijen aan één Floriday-voorraadrij (`trade_item_key`).
+ * Zonder koppeling doen bestel-triggers niets voor mailbox/manual-orders.
+ */
+export function ProductLinkCard({ tradeItemKey, productName }) {
+    const [linked, setLinked] = useState([]);
+    const [candidates, setCandidates] = useState([]);
+    const [query, setQuery] = useState("");
+    const [loading, setLoading] = useState(false);
+    const [busy, setBusy] = useState(false);
+    const reload = useCallback(async () => {
+        if (!tradeItemKey)
+            return;
+        setLoading(true);
+        try {
+            const { data: linkedRows } = await supabase
+                .from("products")
+                .select("id, product, barcode, trade_item_key")
+                .eq("trade_item_key", tradeItemKey)
+                .order("product");
+            setLinked(linkedRows ?? []);
+        }
+        finally {
+            setLoading(false);
+        }
+    }, [tradeItemKey]);
+    useEffect(() => {
+        void reload();
+    }, [reload]);
+    useEffect(() => {
+        let cancelled = false;
+        const q = query.trim();
+        if (q.length < 2) {
+            setCandidates([]);
+            return;
+        }
+        (async () => {
+            const { data } = await supabase
+                .from("products")
+                .select("id, product, barcode, trade_item_key")
+                .or(`product.ilike.%${q}%,barcode.ilike.%${q}%`)
+                .is("trade_item_key", null)
+                .limit(20);
+            if (!cancelled)
+                setCandidates(data ?? []);
+        })();
+        return () => {
+            cancelled = true;
+        };
+    }, [query]);
+    const linkProduct = async (id) => {
+        if (!tradeItemKey)
+            return;
+        setBusy(true);
+        try {
+            const { error } = await supabase
+                .from("products")
+                .update({ trade_item_key: tradeItemKey })
+                .eq("id", id);
+            if (error)
+                throw error;
+            toast.success("Product gekoppeld");
+            setQuery("");
+            setCandidates([]);
+            await reload();
+        }
+        catch (e) {
+            toast.error(`Koppelen mislukt: ${e.message}`);
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const unlinkProduct = async (id) => {
+        setBusy(true);
+        try {
+            const { error } = await supabase
+                .from("products")
+                .update({ trade_item_key: null })
+                .eq("id", id);
+            if (error)
+                throw error;
+            toast.success("Koppeling verwijderd");
+            await reload();
+        }
+        catch (e) {
+            toast.error(`Ontkoppelen mislukt: ${e.message}`);
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const autoLinkByName = async () => {
+        if (!tradeItemKey || !productName)
+            return;
+        setBusy(true);
+        try {
+            const { data, error } = await supabase
+                .from("products")
+                .select("id, product")
+                .ilike("product", productName)
+                .is("trade_item_key", null);
+            if (error)
+                throw error;
+            const matches = data ?? [];
+            if (matches.length === 0) {
+                toast.info(`Geen niet-gekoppelde producten met naam "${productName}" gevonden.`);
+                return;
+            }
+            const ids = matches.map((m) => m.id);
+            const { error: updErr } = await supabase
+                .from("products")
+                .update({ trade_item_key: tradeItemKey })
+                .in("id", ids);
+            if (updErr)
+                throw updErr;
+            toast.success(`${ids.length} product(en) gekoppeld op naam`);
+            await reload();
+        }
+        catch (e) {
+            toast.error(`Auto-koppelen mislukt: ${e.message}`);
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const backfillReservations = async () => {
+        setBusy(true);
+        try {
+            const { data, error } = await supabase.rpc("backfill_open_order_reservations");
+            if (error)
+                throw error;
+            const rows = data ?? [];
+            const n = rows[0]?.processed_items ?? 0;
+            toast.success(`Backfill klaar: ${n} orderregel(s) verwerkt`);
+        }
+        catch (e) {
+            toast.error(`Backfill mislukt: ${e.message}`);
+        }
+        finally {
+            setBusy(false);
+        }
+    };
+    const helpText = useMemo(() => {
+        if (!tradeItemKey) {
+            return "Sla het artikel eerst op om producten te kunnen koppelen.";
+        }
+        if (linked.length === 0) {
+            return "Nog geen ERP-product gekoppeld. Zonder koppeling worden mailbox-orders niet automatisch van de voorraad afgeschreven.";
+        }
+        return "Bestellingen op deze ERP-producten reserveren automatisch op deze voorraadrij.";
+    }, [tradeItemKey, linked.length]);
+    return (_jsxs(Card, { children: [_jsxs("div", { className: "grid grid-cols-[auto_minmax(0,1fr)_auto] items-center gap-3 px-6 py-4", children: [_jsx("span", { className: "flex h-7 w-7 items-center justify-center rounded-full border border-primary/40 bg-primary/10 text-primary", children: _jsx(Link2, { className: "h-4 w-4" }) }), _jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "font-medium", children: "Gekoppelde ERP-producten" }), _jsx("div", { className: "text-xs text-muted-foreground", children: helpText })] }), _jsxs("div", { className: "flex gap-2", children: [productName && (_jsxs(Button, { variant: "outline", size: "sm", onClick: autoLinkByName, disabled: !tradeItemKey || busy, title: "Zoek ERP-producten met exact deze naam en koppel ze", children: [_jsx(Wand2, { className: "h-4 w-4 mr-1" }), "Auto op naam"] })), _jsxs(Button, { variant: "outline", size: "sm", onClick: backfillReservations, disabled: busy, title: "Reserveer openstaande orders retroactief", children: [_jsx(RefreshCw, { className: "h-4 w-4 mr-1" }), "Backfill"] })] })] }), _jsx(CardContent, { className: "pt-0 space-y-3", children: loading ? (_jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(Loader2, { className: "h-4 w-4 animate-spin" }), " Laden\u2026"] })) : (_jsxs(_Fragment, { children: [linked.length > 0 && (_jsx("ul", { className: "divide-y rounded-md border", children: linked.map((p) => (_jsxs("li", { className: "flex items-center justify-between gap-2 px-3 py-2 text-sm", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "truncate font-medium", children: p.product ?? "(zonder naam)" }), p.barcode && (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["Barcode: ", p.barcode] }))] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => unlinkProduct(p.id), disabled: busy, children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, p.id))) })), _jsxs("div", { className: "space-y-2", children: [_jsx(Input, { placeholder: "Zoek ERP-product op naam of SKU\u2026", value: query, onChange: (e) => setQuery(e.target.value), disabled: !tradeItemKey || busy }), candidates.length > 0 && (_jsx("ul", { className: "divide-y rounded-md border max-h-56 overflow-auto", children: candidates.map((p) => (_jsxs("li", { className: "flex items-center justify-between gap-2 px-3 py-2 text-sm", children: [_jsxs("div", { className: "min-w-0", children: [_jsx("div", { className: "truncate", children: p.product ?? "(zonder naam)" }), p.barcode && (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["Barcode: ", p.barcode] }))] }), _jsx(Button, { size: "sm", onClick: () => linkProduct(p.id), disabled: busy, children: "Koppel" })] }, p.id))) }))] })] })) })] }));
+}

package/dist-lib/components/voorraad/StockBulkButtons.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"StockBulkButtons.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockBulkButtons.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAsD3D,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,kBAAkB,EAClB,UAAU,GACX,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,kBAAkB,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,UAAU,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,2CA8dA"}
+{"version":3,"file":"StockBulkButtons.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockBulkButtons.tsx"],"names":[],"mappings":"AAgBA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAoF3D,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EACL,kBAAkB,EAClB,UAAU,GACX,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,kBAAkB,EAAE,MAAM,GAAG,IAAI,CAAC;IAClC,UAAU,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxC,2CAikBA"}