@flowselections/floriday-voorraad 1.0.150 → 1.0.154

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

@@ -1,2 +1,43 @@
-export declare function StockIntegrityAlert(): import("react").JSX.Element | null;
+/**
+ * Rode melding wanneer in één transactie twee of meer artikelen van een
+ * positieve fysieke voorraad naar 0 zijn gegaan (bewaking in de database:
+ * `stock_integrity_alerts`). Blijft staan tot iemand op "Gezien" klikt.
+ */
+import { type ReactNode } from "react";
+type AlertItem = {
+    trade_item_key: string;
+    physical_before: number;
+    change_source: string | null;
+    product_id?: string | null;
+    article_code?: string | null;
+    name?: string | null;
+};
+type IntegrityAlert = {
+    id: string;
+    created_at: string;
+    item_count: number;
+    alert_kind?: string | null;
+    items: (AlertItem & {
+        qty?: number | null;
+        order_number?: string | null;
+    })[];
+};
+/** Open voorraadbewakingsmeldingen, met namen en "Gezien". */
+export declare function useStockIntegrityAlerts(): {
+    alerts: IntegrityAlert[];
+    names: Map<string, {
+        code: string | null;
+        name: string | null;
+    }>;
+    acknowledge: (id: string) => Promise<void>;
+};
+/**
+ * Meldingen als losse regels voor de NoticeBar: één regel per melding met
+ * "Details" (lijst in een venster, nooit in de melding zelf) en "Gezien".
+ */
+export declare function useStockIntegrityNotices(): {
+    items: ReactNode[];
+    dialog: ReactNode;
+};
+export {};
 //# sourceMappingURL=StockIntegrityAlert.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"StockIntegrityAlert.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockIntegrityAlert.tsx"],"names":[],"mappings":"AAqCA,wBAAgB,mBAAmB,uCAiIlC"}
+{"version":3,"file":"StockIntegrityAlert.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockIntegrityAlert.tsx"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAoC,KAAK,SAAS,EAAE,MAAM,OAAO,CAAC;AAKzE,KAAK,SAAS,GAAG;IACf,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,MAAM,CAAC;IACxB,aAAa,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC7B,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB,CAAC;AAmBF,KAAK,cAAc,GAAG;IACpB,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,KAAK,EAAE,CAAC,SAAS,GAAG;QAAE,GAAG,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;QAAC,YAAY,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE,CAAC,EAAE,CAAC;CAC9E,CAAC;AAEF,8DAA8D;AAC9D,wBAAgB,uBAAuB;;;cAEkB,MAAM,GAAG,IAAI;cAAQ,MAAM,GAAG,IAAI;;sBAsD1D,MAAM;EAiBtC;AAUD;;;GAGG;AACH,wBAAgB,wBAAwB,IAAI;IAAE,KAAK,EAAE,SAAS,EAAE,CAAC;IAAC,MAAM,EAAE,SAAS,CAAA;CAAE,CAyCpF"}

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

@@ -1,13 +1,19 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 /**
  * Rode melding wanneer in één transactie twee of meer artikelen van een
  * positieve fysieke voorraad naar 0 zijn gegaan (bewaking in de database:
  * `stock_integrity_alerts`). Blijft staan tot iemand op "Gezien" klikt.
  */
 import { useCallback, useEffect, useState } from "react";
-import { AlertOctagon } from "lucide-react";
+import { Dialog, DialogContent, DialogHeader, DialogTitle } from "@flowselections/core";
 import { toast } from "sonner";
 import { supabase } from "../../integrations/supabase/client.js";
+/** Bron van een voorraadwijziging in gewone woorden; onbekende codes niet tonen. */
+const BRON = {
+    MANUAL_STOCK: "handmatig aangepast", IMPORT: "import", ORDER: "order", CORRECTIE: "correctie",
+    FLORIDAY: "Floriday", PRODUCTION: "productie", unknown: "onbekend",
+};
+const bronTekst = (b) => (b ? (BRON[b] ? ` (${BRON[b]})` : "") : "");
 const keyToProductId = (k) => k.replace(/^product:/, "");
 function label(it, names) {
     const found = names.get(it.trade_item_key);
@@ -17,7 +23,8 @@ function label(it, names) {
         return [code, name].filter(Boolean).join(" – ");
     return "onbekend artikel";
 }
-export function StockIntegrityAlert() {
+/** Open voorraadbewakingsmeldingen, met namen en "Gezien". */
+export function useStockIntegrityAlerts() {
     const [alerts, setAlerts] = useState([]);
     const [names, setNames] = useState(new Map());
     const load = useCallback(async () => {
@@ -76,12 +83,36 @@ export function StockIntegrityAlert() {
         })
             .eq("id", id);
         if (error) {
-            toast.error(`Markeren als gezien mislukt: ${error.message}`);
+            console.warn(error);
+            toast.error("Markeren als gezien lukt niet. Probeer opnieuw.");
             return;
         }
         void load();
     };
-    if (alerts.length === 0)
-        return null;
-    return (_jsx("div", { className: "space-y-2", children: alerts.map((a) => (_jsxs("div", { className: "flex items-start gap-3 rounded-md border border-destructive/40 bg-destructive/10 p-3 text-sm text-destructive", children: [_jsx(AlertOctagon, { className: "mt-0.5 h-4 w-4 shrink-0" }), _jsx("div", { className: "flex-1 space-y-1", children: a.alert_kind === "FLORIDAY_NOT_UPDATED" ? (_jsxs(_Fragment, { children: [_jsxs("p", { className: "font-medium", children: ["Verkoop niet in Floriday verwerkt \u2013 pas de Floriday-voorraad aan (", new Date(a.created_at).toLocaleString("nl-NL"), ")."] }), _jsx("p", { className: "text-xs text-foreground/80", children: "Floriday leidt deze artikelen. Deze verkoop kwam niet via Floriday, dus Floriday weet er niets van." }), _jsx("ul", { className: "text-xs text-foreground/80", children: (Array.isArray(a.items) ? a.items : []).slice(0, 10).map((it, i) => (_jsxs("li", { children: [label(it, names), ": ", it.qty ?? "?", " stuks", it.order_number ? ` (order ${it.order_number})` : ""] }, `${it.trade_item_key}-${i}`))) })] })) : (_jsxs(_Fragment, { children: [_jsxs("p", { className: "font-medium", children: [a.item_count, " artikelen gingen tegelijk naar voorraad 0 (", new Date(a.created_at).toLocaleString("nl-NL"), "). Controleer of dit klopt."] }), _jsx("ul", { className: "text-xs text-foreground/80", children: (Array.isArray(a.items) ? a.items : []).slice(0, 10).map((it, i) => (_jsxs("li", { children: [label(it, names), ": was ", it.physical_before, it.change_source ? ` (bron ${it.change_source})` : " (bron onbekend)"] }, `${it.trade_item_key}-${i}`))) })] })) }), _jsx("button", { type: "button", className: "rounded-md border border-destructive/40 bg-background px-3 py-1 text-xs font-medium text-foreground hover:bg-muted", onClick: () => void acknowledge(a.id), children: "Gezien" })] }, a.id))) }));
+    return { alerts, names, acknowledge };
+}
+const tijd = (iso) => new Date(iso).toLocaleString("nl-NL", { weekday: "short", day: "numeric", month: "short", hour: "2-digit", minute: "2-digit" }).replace(/\./g, "");
+function samenvatting(a) {
+    return a.alert_kind === "FLORIDAY_NOT_UPDATED"
+        ? `Verkoop niet in Floriday verwerkt (${tijd(a.created_at)}): pas de Floriday-voorraad aan`
+        : `${a.item_count} artikelen gingen tegelijk naar 0 (${tijd(a.created_at)}): controleer of dit klopt`;
+}
+/**
+ * Meldingen als losse regels voor de NoticeBar: één regel per melding met
+ * "Details" (lijst in een venster, nooit in de melding zelf) en "Gezien".
+ */
+export function useStockIntegrityNotices() {
+    const { alerts, names, acknowledge } = useStockIntegrityAlerts();
+    const [open, setOpen] = useState(null);
+    const items = alerts.map((a) => (_jsxs("span", { className: "inline-flex min-w-0 max-w-full items-center gap-2", children: [_jsx("span", { className: "truncate", children: samenvatting(a) }), _jsx("span", { role: "button", tabIndex: 0, className: "shrink-0 font-medium underline underline-offset-2", onClick: (e) => { e.stopPropagation(); setOpen(a); }, onKeyDown: (e) => { if (e.key === "Enter") {
+                    e.stopPropagation();
+                    setOpen(a);
+                } }, children: "Details" }), _jsx("span", { role: "button", tabIndex: 0, className: "shrink-0 font-medium underline underline-offset-2", onClick: (e) => { e.stopPropagation(); void acknowledge(a.id); }, onKeyDown: (e) => { if (e.key === "Enter") {
+                    e.stopPropagation();
+                    void acknowledge(a.id);
+                } }, children: "Gezien" })] }, a.id)));
+    const dialog = (_jsx(Dialog, { open: !!open, onOpenChange: (o) => !o && setOpen(null), children: _jsxs(DialogContent, { className: "max-w-lg", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Voorraadmelding" }) }), open && (_jsxs("div", { className: "space-y-3 text-sm", children: [_jsxs("p", { children: [samenvatting(open), "."] }), open.alert_kind === "FLORIDAY_NOT_UPDATED" && (_jsx("p", { className: "text-muted-foreground", children: "Floriday leidt deze artikelen. Deze verkoop kwam niet via Floriday, dus Floriday weet er niets van." })), _jsx("ul", { className: "max-h-80 divide-y divide-border overflow-auto rounded-lg border border-border", children: (Array.isArray(open.items) ? open.items : []).map((it, i) => (_jsxs("li", { className: "flex justify-between gap-3 px-3 py-2", children: [_jsx("span", { className: "min-w-0 truncate", children: label(it, names) }), _jsx("span", { className: "shrink-0 tabular-nums text-muted-foreground", children: open.alert_kind === "FLORIDAY_NOT_UPDATED"
+                                            ? `${it.qty ?? "?"} stuks${it.order_number ? ` · order ${it.order_number}` : ""}`
+                                            : `was ${it.physical_before} stuks${bronTekst(it.change_source)}` })] }, `${it.trade_item_key}-${i}`))) }), _jsx("div", { className: "flex justify-end", children: _jsx("button", { type: "button", className: "h-8 rounded-md border border-border bg-card px-3 text-sm font-medium hover:bg-muted", onClick: () => { void acknowledge(open.id); setOpen(null); }, children: "Gezien" }) })] }))] }) }));
+    return { items, dialog };
 }

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

@@ -1 +1 @@
-{"version":3,"file":"StockMutationHistoryCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockMutationHistoryCard.tsx"],"names":[],"mappings":"AAYA,UAAU,KAAK;IACb,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,wFAAwF;IACxF,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB;AAiDD,wBAAgB,wBAAwB,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,KAAK,+BAgPpF"}
+{"version":3,"file":"StockMutationHistoryCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/StockMutationHistoryCard.tsx"],"names":[],"mappings":"AAcA,UAAU,KAAK;IACb,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC1B,wFAAwF;IACxF,QAAQ,CAAC,EAAE,MAAM,EAAE,CAAC;CACrB;AAiBD,wBAAgB,wBAAwB,CAAC,EAAE,YAAY,EAAE,SAAS,EAAE,QAAQ,EAAE,EAAE,KAAK,+BA2MpF"}

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

@@ -6,42 +6,12 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { useEffect, useState } from "react";
 import { dbFoutTekst } from "../../lib/db-error-message.js";
-import { Card, CardContent, Badge, Button } from "@flowselections/core";
+import { Card, CardContent, Button } from "@flowselections/core";
+import { mutatieSoort, redenTekst } from "../../lib/labels.js";
+import { datum, getal } from "../../lib/notatie.js";
+import { HoverTip } from "../fs-ui/HoverTip.js";
 import { ChevronDown, ChevronUp, Loader2, History } from "lucide-react";
 import { supabase } from "../../integrations/supabase/client.js";
-import { CollapsibleText } from "./CollapsibleText.js";
-const TYPE_LABEL = {
-    consumption: { label: "Afboeking (verkoop)", tone: "bg-rose-100 text-rose-800 border-rose-200" },
-    consumption_blocked: { label: "Afboeking geblokkeerd", tone: "bg-amber-100 text-amber-800 border-amber-200" },
-    consumption_skipped: { label: "Afboeking overgeslagen", tone: "bg-amber-100 text-amber-800 border-amber-200" },
-    reservation: { label: "Reservering", tone: "bg-blue-100 text-blue-800 border-blue-200" },
-    reservation_release: { label: "Reservering vrijgegeven", tone: "bg-blue-100 text-blue-800 border-blue-200" },
-    reservation_skipped: { label: "Reservering overgeslagen", tone: "bg-amber-100 text-amber-800 border-amber-200" },
-    manual_writeoff: { label: "Afgeboekt (met reden)", tone: "bg-rose-100 text-rose-800 border-rose-200" },
-    manual_correction: { label: "Handmatige correctie", tone: "bg-slate-100 text-slate-700 border-slate-200" },
-    order_sync: { label: "Verwerking verkooporders", tone: "bg-indigo-100 text-indigo-800 border-indigo-200" },
-    import: { label: "Import", tone: "bg-slate-100 text-slate-700 border-slate-200" },
-    production: { label: "Productie", tone: "bg-emerald-100 text-emerald-800 border-emerald-200" },
-    stock_update: { label: "Voorraad bijgewerkt", tone: "bg-slate-100 text-slate-700 border-slate-200" },
-    new_article: { label: "Nieuw artikel", tone: "bg-emerald-100 text-emerald-800 border-emerald-200" },
-};
-function formatMoment(v) {
-    try {
-        const d = new Date(v);
-        if (Number.isNaN(d.getTime()))
-            return v;
-        return d.toLocaleString("nl-NL", {
-            day: "2-digit",
-            month: "short",
-            year: "numeric",
-            hour: "2-digit",
-            minute: "2-digit",
-        });
-    }
-    catch {
-        return v;
-    }
-}
 export function StockMutationHistoryCard({ tradeItemKey, productId, sleutels }) {
     const [rows, setRows] = useState(null);
     const [error, setError] = useState(null);
@@ -142,17 +112,11 @@ export function StockMutationHistoryCard({ tradeItemKey, productId, sleutels })
             supabase.removeChannel(channel);
         };
     }, [tradeItemKey, productId, sleutels?.join("|")]); // eslint-disable-line react-hooks/exhaustive-deps
-    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(History, { className: "h-4 w-4" }) }), _jsx("span", { className: "font-medium", children: "Afboekgeschiedenis" }), _jsx("span", { className: "text-xs text-muted-foreground tabular-nums", children: rows ? `${rows.length} mutatie${rows.length === 1 ? "" : "s"}` : "" })] }), _jsxs(CardContent, { className: "pt-0", children: [error && (_jsx("div", { className: "text-sm text-destructive", children: 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" }), " Mutaties laden\u2026"] })), rows && rows.length === 0 && !error && (_jsx("div", { className: "text-sm text-muted-foreground", children: "Nog geen voorraadmutaties voor dit artikel." })), rows && rows.length > 0 && (_jsxs("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: "Wanneer" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Soort" }), _jsx("th", { className: "px-3 py-2 text-right", children: "Aantal" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Van \u2192 naar" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Order" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Door" }), _jsx("th", { className: "px-3 py-2 text-left", children: "Reden" })] }) }), _jsx("tbody", { children: (expanded ? rows : rows.slice(0, 5)).map((r) => {
-                                            const meta = TYPE_LABEL[r.mutation_type] ?? {
-                                                label: r.mutation_type || "Onbekend",
-                                                tone: "bg-slate-100 text-slate-700 border-slate-200",
-                                            };
-                                            const physChanged = r.physical_before !== null &&
-                                                r.physical_after !== null &&
-                                                r.physical_before !== r.physical_after;
-                                            const resChanged = r.reserved_before !== null &&
-                                                r.reserved_after !== null &&
-                                                r.reserved_before !== r.reserved_after;
-                                            return (_jsxs("tr", { className: "border-t align-top", children: [_jsx("td", { className: "whitespace-nowrap px-3 py-2", children: formatMoment(r.created_at) }), _jsx("td", { className: "px-3 py-2", children: _jsx(Badge, { variant: "outline", className: `border ${meta.tone}`, children: meta.label }) }), _jsxs("td", { className: `px-3 py-2 text-right tabular-nums font-medium ${r.qty_delta < 0 ? "text-rose-700" : r.qty_delta > 0 ? "text-emerald-700" : ""}`, children: [r.qty_delta > 0 ? "+" : "", r.qty_delta] }), _jsxs("td", { className: "whitespace-nowrap px-3 py-2 tabular-nums text-muted-foreground", children: [physChanged && (_jsxs("div", { children: ["Liggend ", r.physical_before, " \u2192 ", r.physical_after] })), resChanged && (_jsxs("div", { children: ["Gereserveerd ", r.reserved_before, " \u2192 ", r.reserved_after] })), !physChanged && !resChanged && _jsx("span", { children: "\u2014" })] }), _jsx("td", { className: "whitespace-nowrap px-3 py-2", children: r.order_id ? (_jsx("a", { href: `/floriday-verkoop/verkooporders/${r.order_id}`, className: "text-primary hover:underline", children: r.order_number ?? "Order" })) : (_jsx("span", { className: "text-muted-foreground", children: "\u2014" })) }), _jsx("td", { className: "whitespace-nowrap px-3 py-2 text-muted-foreground", children: r.created_by_name ?? "Systeem" }), _jsx("td", { className: "px-3 py-2 text-muted-foreground", children: _jsx(CollapsibleText, { text: r.reason }) })] }, r.id));
+    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(History, { className: "h-4 w-4" }) }), _jsx("span", { className: "font-medium", children: "Afboekgeschiedenis" }), _jsx("span", { className: "text-xs text-muted-foreground tabular-nums", children: rows ? `${rows.length} wijziging${rows.length === 1 ? "" : "en"}` : "" })] }), _jsxs(CardContent, { className: "pt-0", children: [error && (_jsx("div", { className: "text-sm text-destructive", children: 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" }), " Mutaties laden\u2026"] })), rows && rows.length === 0 && !error && (_jsx("div", { className: "text-sm text-muted-foreground", children: "Nog geen voorraadmutaties voor dit artikel." })), rows && rows.length > 0 && (_jsxs("div", { className: "overflow-x-auto rounded-md border border-border", children: [_jsxs("table", { className: "w-full min-w-[900px] table-fixed text-sm [&_thead_th]:h-10 [&_thead_th]:px-2 [&_thead_th]:text-left [&_thead_th]:align-middle [&_thead_th]:text-[11px] [&_thead_th]:font-semibold [&_thead_th]:uppercase [&_thead_th]:tracking-wide [&_thead_th]:text-muted-foreground", children: [_jsxs("colgroup", { children: [_jsx("col", { style: { width: "132px" } }), _jsx("col", { style: { width: "184px" } }), _jsx("col", { style: { width: "104px" } }), _jsx("col", { style: { width: "184px" } }), _jsx("col", { style: { width: "112px" } }), _jsx("col", { style: { width: "132px" } }), _jsx("col", {})] }), _jsx("thead", { children: _jsxs("tr", { className: "border-b border-border", children: [_jsx("th", { children: "Wanneer" }), _jsx("th", { children: "Soort" }), _jsx("th", { children: "Aantal" }), _jsx("th", { children: "Van \u2192 naar" }), _jsx("th", { children: "Order" }), _jsx("th", { children: "Door" }), _jsx("th", { children: "Reden" })] }) }), _jsx("tbody", { children: (expanded ? rows : rows.slice(0, 5)).map((r) => {
+                                            const physChanged = r.physical_before !== null && r.physical_after !== null && r.physical_before !== r.physical_after;
+                                            const resChanged = r.reserved_before !== null && r.reserved_after !== null && r.reserved_before !== r.reserved_after;
+                                            const reden = redenTekst(r.reason);
+                                            const cel = "truncate px-2 py-0 align-middle";
+                                            return (_jsxs("tr", { className: "h-[60px] border-b border-border last:border-0", children: [_jsx("td", { className: cel + " tabular-nums", children: datum(r.created_at, true) }), _jsx("td", { className: cel, children: mutatieSoort(r.mutation_type) }), _jsxs("td", { className: cel + " tabular-nums " + (r.qty_delta < 0 ? "text-destructive" : r.qty_delta > 0 ? "text-primary" : "text-muted-foreground"), children: [r.qty_delta > 0 ? "+" : "", getal(r.qty_delta), " ", _jsx("span", { className: "text-xs text-muted-foreground", children: "stuks" })] }), _jsxs("td", { className: cel + " tabular-nums", children: [physChanged && _jsxs("div", { className: "truncate", children: ["Liggend ", getal(r.physical_before), " \u2192 ", getal(r.physical_after)] }), resChanged && _jsxs("div", { className: "truncate " + (physChanged ? "text-xs text-muted-foreground" : ""), children: ["Gereserveerd ", getal(r.reserved_before), " \u2192 ", getal(r.reserved_after)] }), !physChanged && !resChanged && _jsx("span", { className: "text-muted-foreground", children: "\u2014" })] }), _jsx("td", { className: cel, children: r.order_id ? (_jsx("a", { href: `/floriday-verkoop/verkooporders/${r.order_id}`, className: "text-primary hover:underline", children: r.order_number ?? "Order" })) : _jsx("span", { className: "text-muted-foreground", children: "\u2014" }) }), _jsx("td", { className: cel + " text-muted-foreground", children: r.created_by_name ?? "Systeem" }), _jsx("td", { className: cel + " text-muted-foreground", children: reden ? _jsx(HoverTip, { label: reden, content: _jsx("div", { className: "max-w-xs text-xs", children: reden }), align: "start", className: "block max-w-full truncate text-left", children: _jsx("span", { className: "truncate", children: reden }) }) : "—" })] }, r.id));
                                         }) })] }), rows.length > 5 && (_jsx("div", { className: "flex justify-center border-t bg-muted/20 px-3 py-2", children: _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => setExpanded((current) => !current), className: "gap-1.5", children: expanded ? (_jsxs(_Fragment, { children: [_jsx(ChevronUp, { className: "h-4 w-4" }), " Inklappen"] })) : (_jsxs(_Fragment, { children: [_jsx(ChevronDown, { className: "h-4 w-4" }), " Meer tonen (", rows.length - 5, ")"] })) }) }))] }))] })] }));
 }

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

@@ -20,7 +20,7 @@ const UUID_RE = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/
 /** Een verwerker houdt een regel maximaal 5 minuten vast. */
 const LOCK_STALE_MS = 5 * 60000;
 const STATUS_LABEL = {
-    pending: "In wachtrij",
+    pending: "Wacht op versturen",
     processing: "Bezig",
     sent: "Verstuurd",
     completed: "Verstuurd",
@@ -74,7 +74,7 @@ function explainError(raw) {
         return { text: raw, action: "Vul een prijs in bij dit artikel en probeer opnieuw." };
     }
     if (m.includes("cache")) {
-        return { text: raw, action: "Synchroniseer de Floriday-artikelen en probeer opnieuw." };
+        return { text: raw, action: "Werk de Floriday-artikelen bij en probeer opnieuw." };
     }
     if (m.includes("429") || m.includes("rate limit") || m.includes("snelheidslimiet")) {
         return { text: "Floriday liet even geen nieuwe berichten toe.", action: "Dit gaat vanzelf; de volgende ronde pakt het op." };

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

@@ -2,7 +2,11 @@
  * Telmoment vastleggen: orders vóór de teldag en orders die vóór het telmoment vertrokken
  * zijn tellen niet mee; orders van de teldag die al weg zijn vink je aan.
  */
-export declare function TelmomentButton({ onSaved }: {
+export declare function TelmomentButton({ onSaved, open: openVan, onOpenChange, verbergKnop }: {
     onSaved?: () => void;
+    /** Optioneel van buitenaf openen (bijv. vanuit het menu "Meer"). */
+    open?: boolean;
+    onOpenChange?: (o: boolean) => void;
+    verbergKnop?: boolean;
 }): import("react").JSX.Element;
 //# sourceMappingURL=TelmomentButton.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"TelmomentButton.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/TelmomentButton.tsx"],"names":[],"mappings":"AA6BA;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,OAAO,EAAE,EAAE;IAAE,OAAO,CAAC,EAAE,MAAM,IAAI,CAAA;CAAE,+BAkGpE"}
+{"version":3,"file":"TelmomentButton.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/TelmomentButton.tsx"],"names":[],"mappings":"AA6BA;;;GAGG;AACH,wBAAgB,eAAe,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,YAAY,EAAE,WAAW,EAAE,EAAE;IACrF,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,oEAAoE;IACpE,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,YAAY,CAAC,EAAE,CAAC,CAAC,EAAE,OAAO,KAAK,IAAI,CAAC;IACpC,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,+BAyGA"}

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

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useState } from "react";
+import { useEffect, useState } from "react";
 import { ClipboardCheck } from "lucide-react";
 import { Button, Dialog, DialogContent, DialogHeader, DialogTitle, Input, toast, } from "@flowselections/core";
 import { supabase } from "../../integrations/supabase/client.js";
@@ -12,8 +12,10 @@ function lokaleInvoer(d) {
  * Telmoment vastleggen: orders vóór de teldag en orders die vóór het telmoment vertrokken
  * zijn tellen niet mee; orders van de teldag die al weg zijn vink je aan.
  */
-export function TelmomentButton({ onSaved }) {
-    const [open, setOpen] = useState(false);
+export function TelmomentButton({ onSaved, open: openVan, onOpenChange, verbergKnop }) {
+    const [openEigen, setOpenEigen] = useState(false);
+    const open = openVan ?? openEigen;
+    const setOpen = (o) => { setOpenEigen(o); onOpenChange?.(o); };
     const [moment, setMoment] = useState(() => lokaleInvoer(new Date()));
     const [regels, setRegels] = useState(null);
     const [alWeg, setAlWeg] = useState(new Set());
@@ -22,7 +24,8 @@ export function TelmomentButton({ onSaved }) {
         setRegels(null);
         const { data, error } = await supabase.rpc("voorraad_telmoment_lijst", { p_telmoment: new Date(m).toISOString(), p_keys: null });
         if (error) {
-            toast.error(error.message);
+            console.warn(error);
+            toast.error("De lijst kon niet geladen worden. Probeer opnieuw.");
             setRegels([]);
             return;
         }
@@ -42,14 +45,18 @@ export function TelmomentButton({ onSaved }) {
             onSaved?.();
         }
         catch (e) {
-            toast.error(e.message);
+            console.warn(e);
+            toast.error("Telmoment opslaan lukt niet. Probeer opnieuw.");
         }
         finally {
             setBusy(false);
         }
     };
+    // Van buitenaf geopend: lijst laden.
+    useEffect(() => { if (openVan)
+        void laden(); }, [openVan]); // eslint-disable-line react-hooks/exhaustive-deps
     const groepen = ["teldag_open", "vertrokken", "voor_teldag"];
-    return (_jsxs(_Fragment, { children: [_jsxs(Button, { variant: "outline", size: "sm", onClick: () => { setOpen(true); void laden(); }, children: [_jsx(ClipboardCheck, { className: "mr-2 h-4 w-4" }), "Telmoment"] }), _jsx(Dialog, { open: open, onOpenChange: setOpen, children: _jsxs(DialogContent, { className: "max-w-3xl", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Telmoment vastleggen" }) }), _jsxs("div", { className: "flex items-end gap-2", children: [_jsxs("label", { className: "text-xs text-muted-foreground space-y-1", children: [_jsx("span", { className: "block", children: "Moment van tellen" }), _jsx(Input, { type: "datetime-local", className: "h-9 w-56", value: moment, onChange: (e) => setMoment(e.target.value) })] }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => void laden(), children: "Ververs lijst" })] }), _jsxs("div", { className: "max-h-[50vh] overflow-y-auto space-y-4 text-sm", children: [regels === null && _jsx("p", { className: "text-muted-foreground", children: "Laden\u2026" }), regels !== null && regels.length === 0 && (_jsx("p", { className: "text-muted-foreground", children: "Geen openstaande orderregels tot en met de teldag." })), regels !== null && groepen.map((g) => {
+    return (_jsxs(_Fragment, { children: [!verbergKnop && (_jsxs(Button, { variant: "outline", size: "sm", onClick: () => { setOpen(true); void laden(); }, children: [_jsx(ClipboardCheck, { className: "mr-2 h-4 w-4" }), "Telmoment"] })), _jsx(Dialog, { open: open, onOpenChange: setOpen, children: _jsxs(DialogContent, { className: "max-w-3xl", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Telmoment vastleggen" }) }), _jsxs("div", { className: "flex items-end gap-2", children: [_jsxs("label", { className: "text-xs text-muted-foreground space-y-1", children: [_jsx("span", { className: "block", children: "Moment van tellen" }), _jsx(Input, { type: "datetime-local", className: "h-9 w-56", value: moment, onChange: (e) => setMoment(e.target.value) })] }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => void laden(), children: "Ververs lijst" })] }), _jsxs("div", { className: "max-h-[50vh] overflow-y-auto space-y-4 text-sm", children: [regels === null && _jsx("p", { className: "text-muted-foreground", children: "Laden\u2026" }), regels !== null && regels.length === 0 && (_jsx("p", { className: "text-muted-foreground", children: "Geen openstaande orderregels tot en met de teldag." })), regels !== null && groepen.map((g) => {
                                     const lijst = regels.filter((r) => r.categorie === g);
                                     if (lijst.length === 0)
                                         return null;

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

@@ -1 +1 @@
-{"version":3,"file":"ValidationOverviewTable.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ValidationOverviewTable.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAoB3D,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EACL,YAAY,EACZ,SAAS,GACV,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC,+BAwKA"}
+{"version":3,"file":"ValidationOverviewTable.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ValidationOverviewTable.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAC;AAkB3D,wBAAgB,uBAAuB,CAAC,EACtC,KAAK,EACL,YAAY,EACZ,SAAS,GACV,EAAE;IACD,KAAK,EAAE,SAAS,EAAE,CAAC;IACnB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,SAAS,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACvC,+BA6IA"}

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

@@ -1,11 +1,9 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { useNavigate } from "@tanstack/react-router";
-import { Badge, Button } from "@flowselections/core";
+import { Button } from "@flowselections/core";
 import { Link2, Loader2, Pencil, Send } from "lucide-react";
 import { conceptMetArtikel, validateDraftForPublish } from "../../lib/floriday-import-validator.js";
-import { updateDraftMeta } from "../../hooks/useLocalTradeItems.js";
-import { floriday } from "../../lib/floriday-client.js";
 import { relinkProducts } from "../../lib/floriday-relink.js";
 import { toast } from "@flowselections/core";
 /**
@@ -33,13 +31,14 @@ export function ValidationOverviewTable({ items, connectionId, onChanged, }) {
             else {
                 const total = (res.linked ?? 0) + (res.repaired ?? 0);
                 toast.success(total > 0
-                    ? `${total} product(en) opnieuw gekoppeld aan Floriday`
+                    ? `${total} artikel(en) opnieuw gekoppeld aan Floriday`
                     : "Geen extra koppelingen gevonden");
             }
             await onChanged();
         }
         catch (e) {
-            toast.error(e?.message ?? "Automatisch koppelen mislukt");
+            console.warn(e);
+            toast.error("Automatisch koppelen is niet gelukt. Probeer het later opnieuw.");
         }
         finally {
             setRelinking(false);
@@ -51,50 +50,22 @@ export function ValidationOverviewTable({ items, connectionId, onChanged, }) {
         }
         return "Nog geen overeenkomend Floriday-artikel gevonden (streepjescode, artikelcode of naam)";
     };
-    const publish = async (item) => {
-        const productId = item.productId ?? item.localId;
-        if (!productId || !connectionId)
-            return;
-        const payload = item.raw?.custom_fields?.floriday_payload ??
-            item.raw?.floriday_payload ??
-            item.raw?.data ??
-            {};
-        const v = validateDraftForPublish(conceptMetArtikel(payload, artikelVan(item)));
-        if (!v.ok) {
-            toast.error("Nog niet compleet: " + v.missing.join(", "));
-            return;
-        }
-        try {
-            const { buildAddTradeItemPayload } = await import("../../lib/floriday-payload.js");
-            const built = buildAddTradeItemPayload(conceptMetArtikel(payload, artikelVan(item)));
-            const res = await floriday.createTradeItem(connectionId, built);
-            await updateDraftMeta(productId, {
-                floridayLinkStatus: "published",
-                floridayId: res?.tradeItemId ?? null,
-                floridayLinkError: null,
-                lastFloridaySyncAt: new Date().toISOString(),
-            });
-            toast.success("Product staat nu actief op Floriday");
-            await onChanged();
-        }
-        catch (e) {
-            toast.error(e?.message ?? "Activeren op Floriday mislukt");
-            await onChanged();
-        }
-    };
     const relinkButton = (_jsxs(Button, { size: "sm", variant: "outline", onClick: runRelink, disabled: relinking, children: [relinking ? (_jsx(Loader2, { className: "h-3 w-3 mr-1 animate-spin" })) : (_jsx(Link2, { className: "h-3 w-3 mr-1" })), "Nu opnieuw koppelen"] }));
     if (rows.length === 0) {
-        return (_jsxs("div", { className: "p-8 text-center text-sm text-muted-foreground space-y-3", children: [_jsx("div", { children: "Alle producten staan actief op Floriday." }), _jsx("div", { className: "flex justify-center", children: relinkButton })] }));
+        return (_jsxs("div", { className: "p-8 text-center text-sm text-muted-foreground space-y-3", children: [_jsx("div", { children: "Alle artikelen staan op Floriday." }), _jsx("div", { className: "flex justify-center", children: relinkButton })] }));
     }
-    return (_jsxs("div", { className: "overflow-x-auto", children: [_jsxs("div", { className: "flex items-center justify-between gap-2 p-3 border-b", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Koppelen gebeurt automatisch zodra Floriday-artikelen binnenkomen en elk uur op de achtergrond." }), relinkButton] }), _jsxs("table", { className: "w-full text-sm", children: [_jsx("thead", { className: "bg-muted/50 text-left", children: _jsxs("tr", { children: [_jsx("th", { className: "p-3", children: "Artikelcode" }), _jsx("th", { className: "p-3", children: "Artikelnaam" }), _jsx("th", { className: "p-3", children: "Floriday-status" }), _jsx("th", { className: "p-3", children: "Reden" }), _jsx("th", { className: "p-3", children: "Ontbrekende Floriday-velden" }), _jsx("th", { className: "p-3 text-right", children: "Acties" })] }) }), _jsx("tbody", { children: rows.map((it) => {
+    return (_jsxs("div", { className: "overflow-x-auto", children: [_jsxs("div", { className: "flex items-center justify-between gap-2 border-b border-border p-3", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: "Koppelen gebeurt automatisch zodra Floriday-artikelen binnenkomen en elk uur op de achtergrond." }), relinkButton] }), _jsxs("table", { className: "w-full min-w-[900px] table-fixed text-sm [&_thead_th]:h-10 [&_thead_th]:px-2 [&_thead_th]:text-left [&_thead_th]:align-middle [&_thead_th]:text-[11px] [&_thead_th]:font-semibold [&_thead_th]:uppercase [&_thead_th]:tracking-wide [&_thead_th]:text-muted-foreground [&_tbody_td]:h-[60px] [&_tbody_td]:truncate [&_tbody_td]:px-2 [&_tbody_td]:py-0 [&_tbody_td]:align-middle", children: [_jsxs("colgroup", { children: [_jsx("col", { style: { width: "120px" } }), _jsx("col", { style: { width: "220px" } }), _jsx("col", { style: { width: "160px" } }), _jsx("col", {}), _jsx("col", { style: { width: "220px" } }), _jsx("col", { style: { width: "260px" } })] }), _jsx("thead", { children: _jsxs("tr", { className: "border-b border-border", children: [_jsx("th", { children: "Artikelnummer" }), _jsx("th", { children: "Artikel" }), _jsx("th", { children: "Floriday" }), _jsx("th", { children: "Reden" }), _jsx("th", { children: "Nog nodig" }), _jsx("th", { children: _jsx("span", { className: "sr-only", children: "Acties" }) })] }) }), _jsx("tbody", { children: rows.map((it) => {
                             const payload = it.raw?.custom_fields?.floriday_payload ??
                                 it.raw?.floriday_payload ??
                                 it.raw?.data ??
                                 {};
                             const v = validateDraftForPublish(conceptMetArtikel(payload, artikelVan(it)));
-                            return (_jsxs("tr", { className: "border-t align-top", children: [_jsx("td", { className: "p-3 font-mono text-xs", children: it.articleNumber || "—" }), _jsx("td", { className: "p-3", children: it.name }), _jsx("td", { className: "p-3", children: _jsx(Badge, { className: "bg-slate-500/15 text-slate-700 border-slate-500/30", children: "Niet actief op Floriday" }) }), _jsx("td", { className: "p-3 text-xs text-muted-foreground max-w-[260px]", children: reasonFor(it) }), _jsx("td", { className: "p-3", children: v.missing.length === 0 ? (_jsx("span", { className: "text-xs text-emerald-700", children: "Klaar om te activeren" })) : (_jsxs("span", { className: "text-xs text-muted-foreground", title: v.missing.join(", "), children: ["Nog nodig: ", v.missing.slice(0, 3).join(", ").toLowerCase(), v.missing.length > 3 ? ` en nog ${v.missing.length - 3} andere` : "", "."] })) }), _jsx("td", { className: "p-3", children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { size: "sm", variant: "outline", onClick: () => {
+                            return (_jsxs("tr", { className: "border-b border-border last:border-0 hover:bg-muted/40", children: [_jsx("td", { children: it.articleNumber || "—" }), _jsx("td", { children: it.name }), _jsx("td", { children: _jsx("span", { className: "text-muted-foreground", children: "Niet actief op Floriday" }) }), _jsx("td", { children: reasonFor(it) }), _jsx("td", { children: v.missing.length === 0 ? (_jsx("span", { className: "text-primary", children: "Klaar om te activeren" })) : (_jsxs("span", { className: "text-muted-foreground", title: v.missing.join(", "), children: [v.missing.slice(0, 2).join(", ").toLowerCase(), v.missing.length > 2 ? ` +${v.missing.length - 2}` : ""] })) }), _jsx("td", { children: _jsxs("div", { className: "flex justify-end gap-1", children: [_jsxs(Button, { size: "sm", variant: "outline", onClick: () => {
                                                         const target = it.productId ?? it.localId ?? it.id;
                                                         navigate({ to: "/voorraad/$id", params: { id: target } });
-                                                    }, children: [_jsx(Pencil, { className: "h-3 w-3 mr-1" }), "Bewerken"] }), _jsxs(Button, { size: "sm", onClick: () => publish(it), disabled: !v.ok, children: [_jsx(Send, { className: "h-3 w-3 mr-1" }), "Activeer op Floriday"] })] }) })] }, it.id));
+                                                    }, children: [_jsx(Pencil, { className: "mr-1 h-3.5 w-3.5" }), "Bewerken"] }), _jsxs(Button, { size: "sm", disabled: !v.ok, onClick: () => {
+                                                        const target = it.productId ?? it.localId ?? it.id;
+                                                        navigate({ to: "/voorraad/$id", params: { id: target }, state: { stuurOverzicht: true } });
+                                                    }, children: [_jsx(Send, { className: "mr-1 h-3.5 w-3.5" }), "Activeer op Floriday"] })] }) })] }, it.id));
                         }) })] })] }));
 }

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

@@ -1,2 +1,3 @@
+/** Floriday-controle: artikelen die nog niet op Floriday staan, per pagina van de server (geen limiet van 1000). */
 export declare function ValidationPage(): import("react").JSX.Element;
 //# sourceMappingURL=ValidationPage.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"ValidationPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ValidationPage.tsx"],"names":[],"mappings":"AAQA,wBAAgB,cAAc,gCAkC7B"}
+{"version":3,"file":"ValidationPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/ValidationPage.tsx"],"names":[],"mappings":"AAiBA,oHAAoH;AACpH,wBAAgB,cAAc,gCAuC7B"}

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

@@ -1,13 +1,41 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useCallback, useEffect, useState } from "react";
 import { Link } from "@tanstack/react-router";
-import { Card } from "@flowselections/core";
+import { Card, Skeleton } from "@flowselections/core";
 import { ArrowLeft } from "lucide-react";
 import { useFloridayConnection } from "../../hooks/useFloridayConnection.js";
-import { useVoorraadData } from "../../hooks/useVoorraadData.js";
+import { supabase } from "../../integrations/supabase/client.js";
+import { productToTradeItem } from "../../hooks/useLocalTradeItems.js";
+import { dbFoutTekst } from "../../lib/db-error-message.js";
 import { ValidationOverviewTable } from "./ValidationOverviewTable.js";
-import { KoppelingStatusPanel } from "./KoppelingStatusPanel.js";
+import { Pagination } from "../fs-ui/Pagination.js";
+import { NoticeBar } from "../fs-ui/NoticeBar.js";
+import { PageHeader } from "../fs-ui/PageHeader.js";
+import { UpdatedAt } from "../fs-ui/UpdatedAt.js";
+const GROOTTE = 50;
+/** Floriday-controle: artikelen die nog niet op Floriday staan, per pagina van de server (geen limiet van 1000). */
 export function ValidationPage() {
     const { activeId } = useFloridayConnection();
-    const { items, loading, reload } = useVoorraadData(activeId);
-    return (_jsxs("main", { className: "p-6 space-y-4", children: [_jsx("div", { className: "flex items-center gap-2", children: _jsxs(Link, { to: "/voorraad", className: "inline-flex items-center gap-1 text-sm text-muted-foreground hover:text-foreground", children: [_jsx(ArrowLeft, { className: "h-4 w-4" }), "Terug naar voorraad"] }) }), _jsxs("div", { children: [_jsx("h1", { className: "text-xl font-semibold", children: "Floriday-koppeling \u2014 validatie" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Alle artikelen die nog niet succesvol met Floriday gekoppeld zijn." })] }), _jsx(KoppelingStatusPanel, { connectionId: activeId, onChanged: reload }), _jsx(Card, { className: "overflow-hidden", children: loading ? (_jsx("div", { className: "p-6 text-sm text-muted-foreground", children: "Laden\u2026" })) : (_jsx(ValidationOverviewTable, { items: items, connectionId: activeId, onChanged: reload })) })] }));
+    const [pagina, setPagina] = useState(1);
+    const [items, setItems] = useState([]);
+    const [totaal, setTotaal] = useState(0);
+    const [loading, setLoading] = useState(true);
+    const [fout, setFout] = useState(null);
+    const [bijgewerkt, setBijgewerkt] = useState(null);
+    const reload = useCallback(async () => {
+        const { data, error } = await supabase.rpc("voorraad_validatie_pagina", { p_pagina: pagina, p_grootte: GROOTTE });
+        if (error) {
+            setFout(dbFoutTekst(error));
+            setLoading(false);
+            return;
+        }
+        const r = data;
+        setItems((r.rijen ?? []).map(productToTradeItem));
+        setTotaal(Number(r.totaal ?? 0));
+        setFout(null);
+        setLoading(false);
+        setBijgewerkt(new Date());
+    }, [pagina]);
+    useEffect(() => { void reload(); }, [reload]);
+    return (_jsxs("main", { className: "flex w-full min-w-0 flex-col gap-4 overflow-x-clip p-4 pb-[calc(7rem+env(safe-area-inset-bottom))] sm:p-6 sm:pb-24", children: [_jsx(PageHeader, { crumb: _jsxs(Link, { to: "/voorraad", className: "inline-flex items-center gap-1 hover:text-foreground", children: [_jsx(ArrowLeft, { className: "h-4 w-4" }), " Voorraad"] }), title: "Voorraadcontrole", updated: _jsx(UpdatedAt, { at: bijgewerkt, info: "Artikelen die nog niet op Floriday staan. Koppelen gebeurt automatisch zodra Floriday-artikelen binnenkomen." }) }), _jsx(NoticeBar, { items: fout ? [fout] : [] }), _jsx(Card, { className: "overflow-hidden rounded-xl shadow-sm", children: loading ? (_jsx("div", { className: "space-y-2 p-4", "aria-busy": "true", children: Array.from({ length: 8 }).map((_, i) => _jsx(Skeleton, { className: "h-10 w-full rounded-lg" }, i)) })) : (_jsx(ValidationOverviewTable, { items: items, connectionId: activeId, onChanged: reload })) }), _jsx(Pagination, { page: pagina, pageSize: GROOTTE, totalCount: totaal, onPage: setPagina })] }));
 }

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

@@ -1,3 +1,6 @@
-/** Inklapbaar blok "Beheer": alleen zichtbaar voor beheerders, alleen informatie plus één knop. */
+/**
+ * "Voorraad — Controle Floriday-artikelen": alleen voor admin en superadmin
+ * (`voorraad_is_beheerder` in de database). Inklapbaar; ververst na de knop en zolang een controle loopt.
+ */
 export declare function VoorraadBeheerCard(): import("react").JSX.Element | null;
 //# sourceMappingURL=VoorraadBeheerCard.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"VoorraadBeheerCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/VoorraadBeheerCard.tsx"],"names":[],"mappings":"AAuBA,mGAAmG;AACnG,wBAAgB,kBAAkB,uCAwDjC"}
+{"version":3,"file":"VoorraadBeheerCard.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/VoorraadBeheerCard.tsx"],"names":[],"mappings":"AA8BA;;;GAGG;AACH,wBAAgB,kBAAkB,uCAoFjC"}

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

@@ -1,28 +1,48 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from "react";
-import { Button, Card, CardContent, CardHeader, CardTitle, toast } from "@flowselections/core";
+import { lazy, Suspense, useCallback, useEffect, useState } from "react";
+import { Button, Card, Skeleton, toast } from "@flowselections/core";
+import { ChevronDown, RefreshCw } from "lucide-react";
 import { supabase } from "../../integrations/supabase/client.js";
 import { dbFoutTekst } from "../../lib/db-error-message.js";
 import { toonVersieBeheer } from "../../lib/floriday-versie-ronde.js";
 import { floridayVersiesControleren } from "../../lib/floriday-versie-ronde.functions.js";
+import { useFloridayConnection } from "../../hooks/useFloridayConnection.js";
+// Zware beheeronderdelen laden pas als je het blok openklapt.
+const KoppelingStatusPanel = lazy(() => import("./KoppelingStatusPanel.js").then((m) => ({ default: m.KoppelingStatusPanel })));
+const StockPushMonitor = lazy(() => import("./StockPushMonitor.js").then((m) => ({ default: m.StockPushMonitor })));
+const FloridayTakeoverPanel = lazy(() => import("./FloridayTakeoverPanel.js").then((m) => ({ default: m.FloridayTakeoverPanel })));
 const STATUS_TEKST = {
     geslaagd: "geslaagd",
     onvolledig: "nog niet compleet (wordt automatisch opnieuw geprobeerd)",
     mislukt: "mislukt (wordt automatisch opnieuw geprobeerd)",
 };
-/** Inklapbaar blok "Beheer": alleen zichtbaar voor beheerders, alleen informatie plus één knop. */
+/**
+ * "Voorraad — Controle Floriday-artikelen": alleen voor admin en superadmin
+ * (`voorraad_is_beheerder` in de database). Inklapbaar; ververst na de knop en zolang een controle loopt.
+ */
 export function VoorraadBeheerCard() {
     const [status, setStatus] = useState(null);
     const [bezig, setBezig] = useState(false);
+    const [open, setOpen] = useState(false);
+    const [versie, setVersie] = useState(0);
+    const conn = useFloridayConnection();
     const laad = useCallback(async () => {
         const { data, error } = await supabase.rpc("voorraad_floriday_versieronde_status");
         if (error) {
+            console.warn("Beheerstatus voorraad niet geladen", error);
             setStatus(null);
             return;
         }
         setStatus(data);
     }, []);
     useEffect(() => { void laad(); }, [laad]);
+    // Stil verversen zolang een controle loopt.
+    useEffect(() => {
+        if (!status?.bezig)
+            return;
+        const t = setInterval(() => void laad(), 5000);
+        return () => clearInterval(t);
+    }, [status?.bezig, laad]);
     if (!toonVersieBeheer(status) || !status?.heeft_koppeling)
         return null;
     const start = async () => {
@@ -30,15 +50,16 @@ export function VoorraadBeheerCard() {
         try {
             await floridayVersiesControleren();
             toast.success("Controle gestart. Dit loopt op de achtergrond.");
-            await laad();
         }
         catch (e) {
             toast.error(dbFoutTekst(e));
         }
         finally {
             setBezig(false);
+            setVersie((v) => v + 1);
+            await laad();
         }
     };
     const l = status.laatste;
-    return (_jsx(Card, { children: _jsxs("details", { children: [_jsx("summary", { className: "cursor-pointer list-none", children: _jsx(CardHeader, { children: _jsx(CardTitle, { children: "Beheer" }) }) }), _jsxs(CardContent, { className: "space-y-2 text-sm", children: [_jsx("p", { className: "font-medium", children: "Controle van Floriday-artikelen" }), _jsx("p", { className: "text-muted-foreground", children: "Loopt vanzelf elke nacht. Oude versies van Floriday-artikelen worden geen zichtbaar artikel." }), _jsxs("p", { children: ["Laatste controle:", " ", l ? `${new Date(l.uitgevoerd_at).toLocaleString("nl-NL")} — ${STATUS_TEKST[l.status] ?? l.status}` : "nog niet uitgevoerd", status.bezig && " · nu bezig"] }), l?.melding && l.status !== "geslaagd" && _jsx("p", { className: "text-muted-foreground", children: l.melding }), _jsxs("p", { children: ["Vervangen in Floriday: ", status.vervangen ?? 0, " \u00B7 Vervallen: ", status.vervallen ?? 0, " \u00B7 Apart gezet (geen antwoord van Floriday): ", status.onbekend ?? 0] }), _jsx(Button, { size: "sm", variant: "outline", onClick: () => void start(), disabled: bezig || status.bezig, children: bezig ? "Bezig…" : "Nu opnieuw controleren" })] })] }) }));
+    return (_jsxs(Card, { className: "overflow-hidden rounded-xl shadow-sm", children: [_jsxs("button", { type: "button", onClick: () => setOpen((o) => !o), "aria-expanded": open, className: "flex w-full items-center justify-between gap-3 px-5 py-4 text-left focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: [_jsxs("div", { children: [_jsx("div", { className: "text-base font-semibold", children: "Voorraad \u2014 Controle Floriday-artikelen" }), _jsxs("div", { className: "text-xs text-muted-foreground", children: ["Alleen voor beheerders \u00B7 Laatste controle ", l ? new Date(l.uitgevoerd_at).toLocaleString("nl-NL") : "nog niet uitgevoerd"] })] }), _jsx(ChevronDown, { className: "h-4 w-4 shrink-0 transition-transform motion-reduce:transition-none " + (open ? "rotate-180" : ""), "aria-hidden": true })] }), open && (_jsxs("div", { className: "space-y-4 border-t border-border px-5 py-4 text-sm", children: [_jsxs("section", { className: "space-y-2", children: [_jsx("p", { className: "text-muted-foreground", children: "Loopt vanzelf elke nacht. Oude versies van Floriday-artikelen worden geen zichtbaar artikel." }), _jsxs("p", { children: ["Laatste controle:", " ", l ? `${new Date(l.uitgevoerd_at).toLocaleString("nl-NL")} — ${STATUS_TEKST[l.status] ?? "onbekend"}` : "nog niet uitgevoerd", status.bezig && " · nu bezig"] }), l?.melding && l.status !== "geslaagd" && _jsx("p", { className: "text-muted-foreground", children: l.melding }), _jsxs("p", { className: "tabular-nums", children: ["Vervangen in Floriday: ", status.vervangen ?? 0, " \u00B7 Vervallen: ", status.vervallen ?? 0, " \u00B7 Apart gezet (geen antwoord van Floriday): ", status.onbekend ?? 0] }), _jsxs(Button, { size: "sm", variant: "outline", className: "h-8", onClick: () => void start(), disabled: bezig || status.bezig, children: [_jsx(RefreshCw, { className: "mr-2 h-4 w-4 " + (bezig || status.bezig ? "animate-spin motion-reduce:animate-none" : "") }), bezig ? "Bezig…" : "Nu opnieuw controleren"] })] }), _jsx(Suspense, { fallback: _jsx(Skeleton, { className: "h-32 w-full rounded-xl" }), children: _jsxs("div", { className: "space-y-4", children: [_jsx(KoppelingStatusPanel, { connectionId: conn.activeId ?? null, onChanged: () => void laad() }), _jsx(StockPushMonitor, { connectionId: conn.activeId ?? null }), _jsx(FloridayTakeoverPanel, { connectionId: conn.activeId ?? null })] }, versie) })] }))] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"VoorraadPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/VoorraadPage.tsx"],"names":[],"mappings":"AAwCA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AA2CnD,wBAAgB,YAAY,gCA6M3B"}
+{"version":3,"file":"VoorraadPage.d.ts","sourceRoot":"","sources":["../../../src/components/voorraad/VoorraadPage.tsx"],"names":[],"mappings":"AA2EA,OAAO,EAAE,UAAU,EAAE,MAAM,uBAAuB,CAAC;AAsDnD,wBAAgB,YAAY,gCA0M3B"}