@flowselections/mailbox-orders 1.0.3 → 1.0.4

package/dist-lib/components/MailboxProposalsPage.js

@@ -1,12 +1,14 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { useMemo, useState } from "react";
-import { useQuery, useQueryClient } from "@tanstack/react-query";
+import { useEffect, useMemo, useRef, useState } from "react";
+import { useQuery, useQueryClient, useMutation } from "@tanstack/react-query";
 import { useServerFn } from "@tanstack/react-start";
 import { Button, Badge, Card, CardContent, CardHeader, CardTitle, Input, Label, Textarea, Switch, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, Dialog, DialogContent, DialogHeader, DialogTitle, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, toast, } from "@flowselections/core";
-import { Check, X, Trash2, Plus, AlertTriangle } from "lucide-react";
-import { listProposals, approveProposal, rejectProposal, listCustomersForPicker, listProductsForPicker, } from "../lib/mailbox.functions";
+import { Check, X, Trash2, Plus, AlertTriangle, RefreshCw } from "lucide-react";
+import { listProposals, approveProposal, rejectProposal, listCustomersForPicker, listProductsForPicker, listDeliveryLocationsForCustomer, listPickupLocations, listCarriersForPicker, getOrderPickDays, getActiveOrdersMailbox, ingestEmailEvent, backfillRecentEvents, } from "../lib/mailbox.functions";
 import { listTemplateFields, listPlantTypesForPicker, listSuppliersForPicker, } from "../lib/mailbox-template.functions";
 import { SearchableSelect } from "./SearchableSelect";
+import { CartAssignmentWizard } from "./CartAssignmentWizard";
+import { supabase } from "../integrations/supabase/client";
 export function MailboxProposalsPage() {
     const qc = useQueryClient();
     const fetchList = useServerFn(listProposals);
@@ -17,29 +19,121 @@ export function MailboxProposalsPage() {
     const fetchProducts = useServerFn(listProductsForPicker);
     const fetchPlantTypes = useServerFn(listPlantTypesForPicker);
     const fetchSuppliers = useServerFn(listSuppliersForPicker);
-    const [status, setStatus] = useState("pending");
+    const fetchCarriers = useServerFn(listCarriersForPicker);
+    const fetchPickupLocations = useServerFn(listPickupLocations);
+    const fetchActive = useServerFn(getActiveOrdersMailbox);
+    const fetchIngest = useServerFn(ingestEmailEvent);
+    const fetchBackfill = useServerFn(backfillRecentEvents);
+    // Server fns met requireSupabaseAuth gooien een raw Response bij een stale
+    // bearer-token. Die bubbelt op als "[object Response]" en blankt het scherm.
+    // Vang elke fout en geef een lege fallback terug — UI blijft bruikbaar.
+    const safe = async (fn) => {
+        try {
+            return await fn();
+        }
+        catch {
+            return { items: [] };
+        }
+    };
+    // Bestelvoorstellen toont uitsluitend nieuwe, nog niet gecontroleerde
+    // bestellingen ("Te controleren"). Goedgekeurd/afgewezen verschijnt in
+    // de module Verwerkt.
     const { data, isLoading } = useQuery({
-        queryKey: ["mailbox-proposals", status],
-        queryFn: () => fetchList({ data: { status } }),
+        queryKey: ["mailbox-proposals", "pending"],
+        queryFn: () => safe(() => fetchList({ data: { status: "pending" } })),
     });
     const { data: templateData } = useQuery({
         queryKey: ["mailbox-template-fields"],
-        queryFn: () => fetchTemplate(),
+        queryFn: () => safe(() => fetchTemplate()),
     });
-    const { data: customersData } = useQuery({ queryKey: ["mailbox-customers"], queryFn: () => fetchCustomers() });
-    const { data: productsData } = useQuery({ queryKey: ["mailbox-products"], queryFn: () => fetchProducts() });
-    const { data: plantData } = useQuery({ queryKey: ["mailbox-plant-types"], queryFn: () => fetchPlantTypes() });
-    const { data: supplierData } = useQuery({ queryKey: ["mailbox-suppliers"], queryFn: () => fetchSuppliers() });
+    const { data: customersData } = useQuery({ queryKey: ["mailbox-customers"], queryFn: () => safe(() => fetchCustomers()) });
+    const { data: productsData } = useQuery({ queryKey: ["mailbox-products"], queryFn: () => safe(() => fetchProducts()) });
+    const { data: plantData } = useQuery({ queryKey: ["mailbox-plant-types"], queryFn: () => safe(() => fetchPlantTypes()) });
+    const { data: supplierData } = useQuery({ queryKey: ["mailbox-suppliers"], queryFn: () => safe(() => fetchSuppliers()) });
+    const { data: carriersData } = useQuery({ queryKey: ["mailbox-carriers"], queryFn: () => safe(() => fetchCarriers()) });
+    const { data: pickupLocData } = useQuery({ queryKey: ["mailbox-pickup-locations"], queryFn: () => safe(() => fetchPickupLocations()) });
+    // Realtime ingestie + backfill — voorheen in de Inbox-pagina.
+    const { data: activeMailbox } = useQuery({
+        queryKey: ["mailbox-active-account"],
+        queryFn: () => fetchActive(),
+        refetchInterval: 60000,
+        retry: 1,
+    });
+    const activeMailboxId = activeMailbox?.connected ? activeMailbox.id : null;
+    const backfillMut = useMutation({
+        mutationFn: async () => {
+            try {
+                return await fetchBackfill();
+            }
+            catch {
+                return { ok: false, inserted: 0 };
+            }
+        },
+        onSuccess: (res) => {
+            if (res?.ok && (res.inserted ?? 0) > 0) {
+                qc.invalidateQueries({ queryKey: ["mailbox-proposals"] });
+            }
+        },
+    });
+    const handleManualSync = () => {
+        const p = backfillMut.mutateAsync();
+        toast.promise(p, {
+            loading: "Mailbox synchroniseren...",
+            success: (res) => res?.ok
+                ? (res.inserted ?? 0) > 0
+                    ? `${res.inserted} nieuwe bestelling(en) opgehaald`
+                    : "Geen nieuwe bestellingen"
+                : `Sync mislukt: ${res?.error ?? "onbekende fout"}`,
+            error: "Sync mislukt",
+        });
+    };
+    useEffect(() => {
+        if (!activeMailboxId)
+            return;
+        const channel = supabase
+            .channel(`email_auth_events:${activeMailboxId}`)
+            .on("postgres_changes", {
+            event: "INSERT", schema: "public", table: "email_auth_events",
+            filter: `connection_id=eq.${activeMailboxId}`,
+        }, async (payload) => {
+            const evId = payload?.new?.id;
+            if (!evId)
+                return;
+            try {
+                const res = await fetchIngest({ data: { eventId: evId } });
+                if (res?.ok && (res.inserted ?? 0) > 0) {
+                    toast.success("Nieuwe bestelling ontvangen");
+                    qc.invalidateQueries({ queryKey: ["mailbox-proposals"] });
+                }
+            }
+            catch { /* backfill vangt op */ }
+        })
+            .subscribe();
+        return () => { void supabase.removeChannel(channel); };
+    }, [activeMailboxId, fetchIngest, qc]);
+    const didInitialBackfill = useRef(false);
+    useEffect(() => {
+        if (!activeMailboxId || didInitialBackfill.current)
+            return;
+        didInitialBackfill.current = true;
+        backfillMut.mutate();
+        const t = setInterval(() => backfillMut.mutate(), 300000);
+        return () => clearInterval(t);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [activeMailboxId]);
     const items = Array.isArray(data?.items) ? data.items : [];
     const template = Array.isArray(templateData?.items) ? templateData.items : [];
     const customers = Array.isArray(customersData?.items) ? customersData.items : [];
     const products = Array.isArray(productsData?.items) ? productsData.items : [];
     const plantTypes = Array.isArray(plantData?.items) ? plantData.items : [];
     const suppliers = Array.isArray(supplierData?.items) ? supplierData.items : [];
+    const carriers = Array.isArray(carriersData?.items) ? carriersData.items : [];
+    const pickupLocations = Array.isArray(pickupLocData?.items) ? pickupLocData.items : [];
     const [activeId, setActiveId] = useState(null);
+    const [cartOrderId, setCartOrderId] = useState(null);
     const active = items.find((p) => p.id === activeId) ?? null;
-    const statusLabel = (s) => s === "approved" ? "Goedgekeurd" : s === "rejected" ? "Afgewezen" : "Nieuw";
-    const statusVariant = (s) => s === "approved" ? "default" : s === "rejected" ? "destructive" : "secondary";
+    const statusLabel = (_s) => "Te controleren";
+    const statusVariant = (_s) => "secondary";
     const customerNameFor = (p) => {
         const fvs = Array.isArray(p.mailbox_proposal_field_values) ? p.mailbox_proposal_field_values : [];
         const fv = fvs.find((v) => v.field_key === "customer");
@@ -52,18 +146,20 @@ export function MailboxProposalsPage() {
         return p.mailbox_messages?.from_name || p.mailbox_messages?.from_email || "Onbekend";
     };
     const orderNumberFor = (p) => `MB-${String(p.id).slice(0, 8).toUpperCase()}`;
-    return (_jsxs("div", { className: "p-6 space-y-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Voorstellen" }), _jsxs(Select, { value: status, onValueChange: (v) => setStatus(v), children: [_jsx(SelectTrigger, { className: "w-48", children: _jsx(SelectValue, {}) }), _jsxs(SelectContent, { children: [_jsx(SelectItem, { value: "pending", children: "Nieuw / In behandeling" }), _jsx(SelectItem, { value: "approved", children: "Goedgekeurd" }), _jsx(SelectItem, { value: "rejected", children: "Afgekeurd" })] })] })] }), isLoading ? (_jsx("div", { className: "text-muted-foreground", children: "Laden..." })) : items.length === 0 ? (_jsx("p", { className: "text-muted-foreground", children: "Geen voorstellen in deze categorie." })) : (_jsx(Card, { children: _jsx(CardContent, { className: "p-0", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Ordernummer" }), _jsx(TableHead, { children: "Klantnaam" }), _jsx(TableHead, { children: "Orderdatum" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "text-right", children: "Orderwaarde" })] }) }), _jsx(TableBody, { children: items.map((p) => {
+    return (_jsxs("div", { className: "p-6 space-y-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Bestelvoorstellen" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "Nieuw binnengekomen bestellingen die nog handmatig gecontroleerd moeten worden." })] }), _jsxs(Button, { onClick: handleManualSync, disabled: backfillMut.isPending, variant: "outline", children: [_jsx(RefreshCw, { className: `h-4 w-4 mr-2 ${backfillMut.isPending ? "animate-spin" : ""}` }), "Sync nu"] })] }), isLoading ? (_jsx("div", { className: "text-muted-foreground", children: "Laden..." })) : items.length === 0 ? (_jsx("p", { className: "text-muted-foreground", children: "Geen bestellingen te controleren." })) : (_jsx(Card, { children: _jsx(CardContent, { className: "p-0", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Ordernummer" }), _jsx(TableHead, { children: "Klantnaam" }), _jsx(TableHead, { children: "Orderdatum" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "text-right", children: "Orderwaarde" })] }) }), _jsx(TableBody, { children: items.map((p) => {
                                     const fvs = Array.isArray(p.mailbox_proposal_field_values) ? p.mailbox_proposal_field_values : [];
                                     const needsReview = fvs.some((v) => v.needs_review);
                                     const date = p.mailbox_messages?.received_at ?? p.created_at;
                                     return (_jsxs(TableRow, { className: "cursor-pointer hover:bg-muted/50", onClick: () => setActiveId(p.id), children: [_jsx(TableCell, { className: "font-mono text-xs", children: orderNumberFor(p) }), _jsx(TableCell, { className: "font-medium", children: customerNameFor(p) }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: date ? new Date(date).toLocaleDateString("nl-NL") : "-" }), _jsx(TableCell, { children: _jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Badge, { variant: statusVariant(p.status), children: statusLabel(p.status) }), needsReview && (_jsxs(Badge, { variant: "outline", className: "text-xs border-yellow-500 text-yellow-700", children: [_jsx(AlertTriangle, { className: "h-3 w-3 mr-1" }), "Controleren"] }))] }) }), _jsx(TableCell, { className: "text-right text-sm text-muted-foreground", children: "\u2014" })] }, p.id));
                                 }) })] }) }) })), _jsx(Dialog, { open: !!active, onOpenChange: (o) => { if (!o)
-                    setActiveId(null); }, children: _jsx(DialogContent, { className: "max-w-[95vw] w-[95vw] h-[92vh] max-h-[92vh] overflow-y-auto p-6", children: active && (_jsxs(_Fragment, { children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { children: [orderNumberFor(active), " \u00B7 ", customerNameFor(active)] }) }), _jsx(ProposalEditor, { proposal: active, template: template, customers: customers, products: products, plantTypes: plantTypes, suppliers: suppliers, onApprove: async (payload) => {
+                    setActiveId(null); }, children: _jsx(DialogContent, { className: "max-w-[95vw] w-[95vw] h-[92vh] max-h-[92vh] overflow-y-auto p-6", children: active && (_jsxs(_Fragment, { children: [_jsx(DialogHeader, { children: _jsxs(DialogTitle, { children: [orderNumberFor(active), " \u00B7 ", customerNameFor(active)] }) }), _jsx(ProposalEditor, { proposal: active, template: template, customers: customers, products: products, plantTypes: plantTypes, suppliers: suppliers, carriers: carriers, pickupLocations: pickupLocations, onApprove: async (payload) => {
                                     try {
-                                        await fetchApprove({ data: payload });
+                                        const res = await fetchApprove({ data: payload });
                                         toast.success("Bestelling aangemaakt");
                                         qc.invalidateQueries({ queryKey: ["mailbox-proposals"] });
                                         setActiveId(null);
+                                        if (res?.orderId)
+                                            setCartOrderId(res.orderId);
                                     }
                                     catch (e) {
                                         toast.error(e?.message ?? "Goedkeuren mislukt");
@@ -78,9 +174,12 @@ export function MailboxProposalsPage() {
                                     catch (e) {
                                         toast.error(e?.message ?? "Afwijzen mislukt");
                                     }
-                                } }, active.id)] })) }) })] }));
+                                } }, active.id)] })) }) }), _jsx(CartAssignmentWizard, { orderId: cartOrderId, open: !!cartOrderId, onClose: () => setCartOrderId(null) })] }));
 }
-function ProposalEditor({ proposal, template, customers, products, plantTypes, suppliers, onApprove, onReject, }) {
+function ReadOnlyField({ label, value }) {
+    return (_jsxs("div", { className: "space-y-0.5", children: [_jsx("div", { className: "text-[11px] uppercase tracking-wide text-muted-foreground", children: label }), _jsx("div", { className: "text-sm", children: value && String(value).trim() !== "" ? value : _jsx("span", { className: "text-muted-foreground", children: "\u2014" }) })] }));
+}
+function ProposalEditor({ proposal, template, customers, products, plantTypes, suppliers, carriers, pickupLocations, onApprove, onReject, }) {
     const msg = proposal.mailbox_messages ?? {};
     const fieldValues = Array.isArray(proposal.mailbox_proposal_field_values)
         ? proposal.mailbox_proposal_field_values : [];
@@ -96,6 +195,10 @@ function ProposalEditor({ proposal, template, customers, products, plantTypes, s
         visibleFields.forEach((f) => {
             init[f.key] = fvMap[f.key]?.value ?? f.default_value ?? null;
         });
+        // Vul de auto-herkende klant in als er nog geen waarde uit het template komt
+        if (!init["customer"] && proposal.matched_customer_id) {
+            init["customer"] = proposal.matched_customer_id;
+        }
         return init;
     });
     const initialLines = Array.isArray(proposal.mailbox_proposal_lines)
@@ -114,12 +217,99 @@ function ProposalEditor({ proposal, template, customers, products, plantTypes, s
     const deliveryVal = values["delivery_date"];
     const notesVal = values["notes"];
     const setVal = (key, v) => setValues((prev) => ({ ...prev, [key]: v }));
+    const fetchDeliveryLocations = useServerFn(listDeliveryLocationsForCustomer);
+    const { data: deliveryLocData } = useQuery({
+        queryKey: ["mailbox-delivery-locations", customerVal],
+        enabled: !!customerVal,
+        queryFn: async () => {
+            try {
+                return await fetchDeliveryLocations({ data: { customerId: customerVal } });
+            }
+            catch {
+                return { items: [] };
+            }
+        },
+    });
+    const deliveryLocations = Array.isArray(deliveryLocData?.items) ? deliveryLocData.items : [];
+    const deliveryLocationVal = values["delivery_location"];
+    const carrierVal = values["carrier"];
+    const selectedLocation = deliveryLocations.find((l) => l.id === deliveryLocationVal) ?? null;
+    // Reset delivery_location wanneer klant wijzigt en huidige waarde niet meer past
+    if (deliveryLocationVal && deliveryLocations.length > 0 &&
+        !deliveryLocations.some((l) => l.id === deliveryLocationVal)) {
+        // schedule reset via microtask om setState-in-render te vermijden
+        queueMicrotask(() => setVal("delivery_location", null));
+    }
+    // Auto-vul vervoerder zodra een nieuwe locatie wordt gekozen (één keer per wissel).
+    const lastLocRef = useRef(deliveryLocationVal);
+    useEffect(() => {
+        if (deliveryLocationVal !== lastLocRef.current) {
+            lastLocRef.current = deliveryLocationVal;
+            const loc = deliveryLocations.find((l) => l.id === deliveryLocationVal);
+            if (loc?.carrier_id)
+                setVal("carrier", loc.carrier_id);
+            else if (deliveryLocationVal === null)
+                setVal("carrier", null);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [deliveryLocationVal, deliveryLocations.length]);
+    // ─── Eerst mogelijke leverdatum ────────────────────────────────────────────
+    const fetchPickDays = useServerFn(getOrderPickDays);
+    const { data: pickDaysData } = useQuery({
+        queryKey: ["mailbox-order-pick-days"],
+        queryFn: async () => {
+            try {
+                return await fetchPickDays();
+            }
+            catch {
+                return { pickDays: 0 };
+            }
+        },
+    });
+    const pickDays = Math.max(0, Number(pickDaysData?.pickDays ?? 0));
+    const selectedCarrier = carriers.find((c) => c.id === carrierVal) ?? null;
+    const carrierDeliveryDays = Math.max(0, Number(selectedCarrier?.delivery_days ?? 0));
+    const pickupLocationVal = values["pickup_location"];
+    const canPickDate = !!customerVal && !!deliveryLocationVal && !!pickupLocationVal && !!carrierVal;
+    const fmtISO = (d) => `${d.getFullYear()}-${String(d.getMonth() + 1).padStart(2, "0")}-${String(d.getDate()).padStart(2, "0")}`;
+    const earliestDate = useMemo(() => {
+        const base = new Date();
+        base.setHours(0, 0, 0, 0);
+        base.setDate(base.getDate() + pickDays + carrierDeliveryDays);
+        return base;
+    }, [pickDays, carrierDeliveryDays]);
+    const earliestISO = fmtISO(earliestDate);
+    const earliestLabel = earliestDate.toLocaleDateString("nl-NL", {
+        day: "numeric", month: "long", year: "numeric",
+    });
+    // Synchroniseer delivery_date wanneer de eerst mogelijke datum verandert.
+    useEffect(() => {
+        if (!canPickDate)
+            return;
+        if (!deliveryVal || deliveryVal < earliestISO) {
+            setVal("delivery_date", earliestISO);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [canPickDate, earliestISO]);
     const handleApprove = () => {
         const missing = template.filter((f) => f.required && (values[f.key] === null || values[f.key] === undefined || values[f.key] === ""));
         if (missing.length > 0) {
             toast.error(`Verplichte velden ontbreken: ${missing.map((m) => m.label).join(", ")}`);
             return;
         }
+        if (!deliveryLocationVal) {
+            toast.error("Selecteer een afleverlocatie.");
+            return;
+        }
+        if (!pickupLocationVal) {
+            toast.error("Selecteer een afhaallocatie (eigen locatie / tuin).");
+            return;
+        }
+        const validLines = lines.filter((l) => l.product_id && (l.quantity ?? 0) > 0);
+        if (validLines.length === 0) {
+            toast.error("Voeg minimaal één product toe aan de bestelling.");
+            return;
+        }
         const cust = customers.find((c) => c.id === customerVal);
         onApprove({
             proposalId: proposal.id,
@@ -127,11 +317,57 @@ function ProposalEditor({ proposal, template, customers, products, plantTypes, s
             customerName: cust?.company_name ?? msg.from_name ?? msg.from_email ?? "Onbekend",
             deliveryDate: deliveryVal || new Date(Date.now() + 86400000).toISOString().slice(0, 10),
             notes: notesVal || null,
-            lines: lines.filter((l) => l.raw_product_text.trim() !== ""),
+            lines: validLines,
             fieldValues: Object.entries(values).map(([field_key, value]) => ({ field_key, value })),
         });
     };
-    return (_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "text-base", children: msg.subject || "(geen onderwerp)" }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [msg.from_name, " <", msg.from_email, "> \u00B7", " ", msg.received_at ? new Date(msg.received_at).toLocaleString("nl-NL") : ""] })] }), _jsx(CardContent, { children: _jsx("pre", { className: "text-sm whitespace-pre-wrap font-sans max-h-[60vh] overflow-y-auto", children: msg.body_text || "(geen tekst)" }) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Bestelvoorstel" }) }), _jsxs(CardContent, { className: "space-y-4", children: [visibleFields.map((field) => (_jsx(DynamicField, { field: field, value: values[field.key], meta: fvMap[field.key], onChange: (v) => setVal(field.key, v), customers: customers, products: products, plantTypes: plantTypes, suppliers: suppliers }, field.key))), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Bestelregels" }), lines.map((line, idx) => (_jsxs("div", { className: "grid grid-cols-12 gap-2 items-start", children: [_jsxs("div", { className: "col-span-6", children: [_jsx(SearchableSelect, { value: line.product_id, placeholder: "Kies product...", clearLabel: "\u2014 Handmatig \u2014", options: products.map((p) => ({ value: p.id, label: p.product, hint: p.unit })), onChange: (v) => {
+    return (_jsxs("div", { className: "grid grid-cols-2 gap-4", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { className: "text-base", children: msg.subject || "(geen onderwerp)" }), _jsxs("div", { className: "text-xs text-muted-foreground", children: [msg.from_name, " <", msg.from_email, "> \u00B7", " ", msg.received_at ? new Date(msg.received_at).toLocaleString("nl-NL") : ""] })] }), _jsx(CardContent, { children: _jsx("pre", { className: "text-sm whitespace-pre-wrap font-sans max-h-[60vh] overflow-y-auto", children: msg.body_text || "(geen tekst)" }) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Bestelvoorstel" }) }), _jsxs(CardContent, { className: "space-y-4", children: [(() => {
+                                const customerField = visibleFields.find((f) => f.key === "customer");
+                                const deliveryDateField = visibleFields.find((f) => f.key === "delivery_date");
+                                const otherFields = visibleFields.filter((f) => f.key !== "customer" && f.key !== "delivery_date");
+                                const renderField = (field) => (_jsx(DynamicField, { field: field, value: values[field.key], meta: fvMap[field.key], onChange: (v) => setVal(field.key, v), customers: customers, products: products, plantTypes: plantTypes, suppliers: suppliers }, field.key));
+                                const payload = (proposal.parsed_payload ?? {});
+                                const autoMatched = payload.auto_matched_customer === true;
+                                const matchWarning = typeof payload.auto_match_warning === "string" ? payload.auto_match_warning : null;
+                                return (_jsxs(_Fragment, { children: [autoMatched && (_jsxs("div", { className: "rounded-md border border-emerald-200 bg-emerald-50 px-3 py-2 text-xs text-emerald-800", children: ["Klant automatisch herkend op basis van het e-mailadres van de afzender", payload.auto_match_email ? ` (${payload.auto_match_email})` : "", "."] })), matchWarning && (_jsx("div", { className: "rounded-md border border-amber-200 bg-amber-50 px-3 py-2 text-xs text-amber-800", children: matchWarning })), customerField && renderField(customerField), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: "Locatie" }), _jsx(SearchableSelect, { value: deliveryLocationVal, placeholder: !customerVal
+                                                        ? "Selecteer eerst een klant"
+                                                        : deliveryLocations.length
+                                                            ? "Kies locatie..."
+                                                            : "Geen locaties bekend voor deze klant", clearLabel: "\u2014 Geen \u2014", disabled: !customerVal || deliveryLocations.length === 0, options: deliveryLocations.map((l) => {
+                                                        const addr = [
+                                                            l.address_line || [l.street, l.house_number].filter(Boolean).join(" "),
+                                                            l.postal_code,
+                                                            l.city,
+                                                        ].filter(Boolean).join(", ");
+                                                        return {
+                                                            value: l.id,
+                                                            label: (l.name || addr || "Locatie") + (l.is_primary ? " ★" : ""),
+                                                            hint: l.name && addr ? addr : undefined,
+                                                        };
+                                                    }), onChange: (v) => setVal("delivery_location", v) })] }), selectedLocation && (_jsxs("div", { className: "rounded-md border bg-muted/30 p-3 space-y-2", children: [_jsx("div", { className: "text-xs font-medium text-muted-foreground", children: "Adresgegevens" }), _jsxs("div", { className: "grid grid-cols-2 gap-2", children: [_jsx(ReadOnlyField, { label: "Straat", value: selectedLocation.street }), _jsx(ReadOnlyField, { label: "Huisnummer", value: selectedLocation.house_number }), _jsx(ReadOnlyField, { label: "Postcode", value: selectedLocation.postal_code }), _jsx(ReadOnlyField, { label: "Plaats", value: selectedLocation.city }), _jsx(ReadOnlyField, { label: "Provincie", value: selectedLocation.province }), _jsx(ReadOnlyField, { label: "Land", value: selectedLocation.country })] })] })), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: ["Afhaallocatie / Tuin ", _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(SearchableSelect, { value: pickupLocationVal, placeholder: pickupLocations.length ? "Kies eigen locatie..." : "Geen eigen locaties bekend", clearLabel: "\u2014 Geen \u2014", allowClear: false, disabled: pickupLocations.length === 0, options: pickupLocations.map((l) => ({ value: l.id, label: l.name })), onChange: (v) => setVal("pickup_location", v) }), _jsx("div", { className: "text-xs text-muted-foreground", children: "Locatie van waaruit de bestelling wordt geleverd of opgehaald." })] }), _jsxs("div", { className: "space-y-1", children: [_jsx(Label, { children: "Vervoerder" }), _jsx(SearchableSelect, { value: carrierVal, placeholder: !customerVal
+                                                        ? "Selecteer eerst een klant"
+                                                        : !deliveryLocationVal
+                                                            ? "Selecteer eerst een locatie"
+                                                            : "Kies vervoerder...", clearLabel: "\u2014 Geen \u2014", disabled: !deliveryLocationVal, options: carriers.map((c) => ({
+                                                        value: c.id,
+                                                        label: c.name + (c.is_default ? " (standaard)" : ""),
+                                                    })), onChange: (v) => setVal("carrier", v) }), selectedLocation?.carrier_id && carrierVal !== selectedLocation.carrier_id && (_jsx("div", { className: "text-xs text-muted-foreground", children: "Wijkt af van standaard vervoerder van deze locatie \u2014 geldt alleen voor deze bestelling." }))] }), _jsxs("div", { className: "space-y-1", children: [_jsxs(Label, { className: "flex items-center gap-2", children: [deliveryDateField?.label ?? "Verzenddatum", deliveryDateField?.required && _jsx("span", { className: "text-destructive", children: "*" })] }), _jsx(Input, { type: "date", value: canPickDate ? (deliveryVal ?? "") : "", min: canPickDate ? earliestISO : undefined, disabled: !canPickDate, onChange: (e) => {
+                                                        const v = e.target.value || null;
+                                                        if (v && v < earliestISO) {
+                                                            toast.error(`Eerst mogelijke leverdatum is ${earliestLabel}.`);
+                                                            setVal("delivery_date", earliestISO);
+                                                            return;
+                                                        }
+                                                        setVal("delivery_date", v);
+                                                    } }), !canPickDate ? (_jsx("div", { className: "text-xs text-muted-foreground", children: "Selecteer eerst klant, afleverlocatie, afhaallocatie en vervoerder." })) : (_jsxs("div", { className: "text-xs text-muted-foreground", children: ["Eerst beschikbare leverdatum is ", earliestLabel, ", op basis van orderpicktijd (", pickDays, "d) en levertijd vervoerder (", carrierDeliveryDays, "d)."] }))] }), otherFields.map(renderField)] }));
+                            })(), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: "Bestelregels" }), _jsxs("div", { className: "grid grid-cols-12 gap-2 text-xs text-muted-foreground px-1", children: [_jsx("div", { className: "col-span-5", children: "Product" }), _jsx("div", { className: "col-span-2", children: "Planten" }), _jsx("div", { className: "col-span-2", children: "Fusten" }), _jsx("div", { className: "col-span-2", children: "Eenheid" }), _jsx("div", { className: "col-span-1" })] }), lines.map((line, idx) => {
+                                        const product = line.product_id ? products.find((p) => p.id === line.product_id) : null;
+                                        const ppc = Math.max(1, Number(product?.plants_per_crate ?? 1));
+                                        const plants = line.quantity ?? null;
+                                        const cratesExact = plants !== null ? plants / ppc : null;
+                                        const cratesDisplay = cratesExact === null ? "" :
+                                            Number.isInteger(cratesExact) ? String(cratesExact) : cratesExact.toFixed(2);
+                                        return (_jsxs("div", { className: "grid grid-cols-12 gap-2 items-start", children: [_jsx("div", { className: "col-span-5", children: _jsx(SearchableSelect, { value: line.product_id, placeholder: "Kies product...", clearLabel: "\u2014 Handmatig \u2014", options: products.map((p) => ({ value: p.id, label: p.product, hint: p.unit })), onChange: (v) => {
                                                             const next = [...lines];
                                                             if (v === null)
                                                                 next[idx] = { ...next[idx], product_id: null };
@@ -144,19 +380,21 @@ function ProposalEditor({ proposal, template, customers, products, plantTypes, s
                                                                 };
                                                             }
                                                             setLines(next);
-                                                        } }), _jsx(Input, { className: "mt-1", value: line.raw_product_text, onChange: (e) => {
-                                                            const next = [...lines];
-                                                            next[idx] = { ...next[idx], raw_product_text: e.target.value };
-                                                            setLines(next);
-                                                        }, placeholder: "Productomschrijving" })] }), _jsx(Input, { className: "col-span-2", type: "number", value: line.quantity ?? "", onChange: (e) => {
-                                                    const next = [...lines];
-                                                    next[idx] = { ...next[idx], quantity: e.target.value ? Number(e.target.value) : null };
-                                                    setLines(next);
-                                                }, placeholder: "Aantal" }), _jsx(Input, { className: "col-span-3", value: line.unit ?? "", onChange: (e) => {
-                                                    const next = [...lines];
-                                                    next[idx] = { ...next[idx], unit: e.target.value };
-                                                    setLines(next);
-                                                }, placeholder: "Eenheid" }), _jsx(Button, { variant: "ghost", size: "icon", className: "col-span-1", onClick: () => setLines(lines.filter((_, i) => i !== idx)), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, idx))), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => setLines([...lines, { product_id: null, raw_product_text: "", quantity: 1, unit: "stuks" }]), children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Regel toevoegen"] })] }), _jsxs("div", { className: "flex gap-2 pt-2", children: [_jsxs(Button, { className: "flex-1", onClick: handleApprove, children: [_jsx(Check, { className: "h-4 w-4 mr-1" }), " Goedkeuren"] }), _jsxs(Button, { variant: "destructive", onClick: () => onReject(notesVal || ""), children: [_jsx(X, { className: "h-4 w-4 mr-1" }), " Afwijzen"] })] })] })] })] }));
+                                                        } }) }), _jsx(Input, { className: "col-span-2", type: "number", min: 0, value: plants ?? "", onChange: (e) => {
+                                                        const next = [...lines];
+                                                        next[idx] = { ...next[idx], quantity: e.target.value ? Number(e.target.value) : null };
+                                                        setLines(next);
+                                                    }, placeholder: "Planten" }), _jsx(Input, { className: "col-span-2", type: "number", min: 0, step: "0.01", value: cratesDisplay, onChange: (e) => {
+                                                        const next = [...lines];
+                                                        const cr = e.target.value ? Number(e.target.value) : null;
+                                                        next[idx] = { ...next[idx], quantity: cr === null ? null : Math.round(cr * ppc) };
+                                                        setLines(next);
+                                                    }, placeholder: "Fusten", title: `${ppc} planten per fust` }), _jsx(Input, { className: "col-span-2", value: line.unit ?? "", onChange: (e) => {
+                                                        const next = [...lines];
+                                                        next[idx] = { ...next[idx], unit: e.target.value };
+                                                        setLines(next);
+                                                    }, placeholder: "Eenheid" }), _jsx(Button, { variant: "ghost", size: "icon", className: "col-span-1", onClick: () => setLines(lines.filter((_, i) => i !== idx)), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }, idx));
+                                    }), _jsxs(Button, { variant: "outline", size: "sm", onClick: () => setLines([...lines, { product_id: null, raw_product_text: "", quantity: 1, unit: "stuks" }]), children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Regel toevoegen"] })] }), _jsxs("div", { className: "flex gap-2 pt-2", children: [_jsxs(Button, { className: "flex-1", onClick: handleApprove, children: [_jsx(Check, { className: "h-4 w-4 mr-1" }), " Goedkeuren"] }), _jsxs(Button, { variant: "destructive", onClick: () => onReject(notesVal || ""), children: [_jsx(X, { className: "h-4 w-4 mr-1" }), " Afwijzen"] })] })] })] })] }));
 }
 function DynamicField({ field, value, meta, onChange, customers, products, plantTypes, suppliers, }) {
     const reviewClass = meta?.needs_review ? "border-yellow-500 ring-1 ring-yellow-500/40 rounded-md p-2" : "";

package/dist-lib/components/SearchableSelect.d.ts

@@ -12,7 +12,8 @@ interface SearchableSelectProps {
     clearLabel?: string;
     onChange: (value: string | null) => void;
     className?: string;
+    disabled?: boolean;
 }
-export declare function SearchableSelect({ value, options, placeholder, emptyLabel, allowClear, clearLabel, onChange, className, }: SearchableSelectProps): import("react").JSX.Element;
+export declare function SearchableSelect({ value, options, placeholder, emptyLabel, allowClear, clearLabel, onChange, className, disabled, }: SearchableSelectProps): import("react").JSX.Element;
 export {};
 //# sourceMappingURL=SearchableSelect.d.ts.map

package/dist-lib/components/SearchableSelect.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SearchableSelect.d.ts","sourceRoot":"","sources":["../../src/components/SearchableSelect.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,UAAU,qBAAqB;IAC7B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EAAE,OAAO,EAAE,WAAuB,EAAE,UAA6B,EACtE,UAAiB,EAAE,UAAiC,EACpD,QAAQ,EAAE,SAAS,GACpB,EAAE,qBAAqB,+BAsFvB"}
+{"version":3,"file":"SearchableSelect.d.ts","sourceRoot":"","sources":["../../src/components/SearchableSelect.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,gBAAgB;IAC/B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CACtB;AAED,UAAU,qBAAqB;IAC7B,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IACrB,OAAO,EAAE,gBAAgB,EAAE,CAAC;IAC5B,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,wBAAgB,gBAAgB,CAAC,EAC/B,KAAK,EAAE,OAAO,EAAE,WAAuB,EAAE,UAA6B,EACtE,UAAiB,EAAE,UAAiC,EACpD,QAAQ,EAAE,SAAS,EAAE,QAAgB,GACtC,EAAE,qBAAqB,+BAuFvB"}

package/dist-lib/components/SearchableSelect.js

@@ -2,7 +2,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useMemo, useState } from "react";
 import { Button, Input, Popover, PopoverContent, PopoverTrigger, } from "@flowselections/core";
 import { Check, ChevronsUpDown, Search } from "lucide-react";
-export function SearchableSelect({ value, options, placeholder = "Kies...", emptyLabel = "Geen resultaat", allowClear = true, clearLabel = "— Geen koppeling —", onChange, className, }) {
+export function SearchableSelect({ value, options, placeholder = "Kies...", emptyLabel = "Geen resultaat", allowClear = true, clearLabel = "— Geen koppeling —", onChange, className, disabled = false, }) {
     const [open, setOpen] = useState(false);
     const [q, setQ] = useState("");
     const selected = useMemo(() => options.find((o) => o.value === value) ?? null, [options, value]);
@@ -15,6 +15,7 @@ export function SearchableSelect({ value, options, placeholder = "Kies...", empt
             (o.hint ?? "").toLowerCase().includes(needle))
             .slice(0, 200);
     }, [options, q]);
-    return (_jsxs(Popover, { open: open, onOpenChange: (o) => { setOpen(o); if (!o)
-            setQ(""); }, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", role: "combobox", "aria-expanded": open, className: `w-full justify-between font-normal ${className ?? ""}`, children: [_jsx("span", { className: `truncate ${selected ? "" : "text-muted-foreground"}`, children: selected?.label ?? placeholder }), _jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })] }) }), _jsxs(PopoverContent, { className: "w-[--radix-popover-trigger-width] p-0", align: "start", children: [_jsx("div", { className: "p-2 border-b", children: _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }), _jsx(Input, { autoFocus: true, value: q, onChange: (e) => setQ(e.target.value), placeholder: `Zoek in ${options.length} items...`, className: "pl-8 h-9" })] }) }), _jsxs("div", { className: "max-h-64 overflow-y-auto py-1", children: [allowClear && (_jsxs("button", { type: "button", className: "w-full text-left text-sm px-3 py-2 hover:bg-accent flex items-center gap-2", onClick: () => { onChange(null); setOpen(false); }, children: [value === null && _jsx(Check, { className: "h-3 w-3" }), _jsx("span", { className: "text-muted-foreground italic", children: clearLabel })] })), filtered.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-sm text-muted-foreground text-center", children: emptyLabel })) : (filtered.map((o) => (_jsxs("button", { type: "button", className: "w-full text-left text-sm px-3 py-2 hover:bg-accent flex items-start gap-2", onClick: () => { onChange(o.value); setOpen(false); }, children: [_jsx(Check, { className: `h-3 w-3 mt-1 shrink-0 ${value === o.value ? "" : "invisible"}` }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("div", { className: "truncate", children: o.label }), o.hint && _jsx("div", { className: "text-xs text-muted-foreground truncate", children: o.hint })] })] }, o.value)))), filtered.length === 200 && (_jsx("div", { className: "px-3 py-2 text-xs text-muted-foreground text-center border-t", children: "Toon eerste 200 resultaten \u2014 verfijn je zoekopdracht" }))] })] })] }));
+    return (_jsxs(Popover, { open: open, onOpenChange: (o) => { if (disabled)
+            return; setOpen(o); if (!o)
+            setQ(""); }, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { type: "button", variant: "outline", role: "combobox", "aria-expanded": open, disabled: disabled, className: `w-full justify-between font-normal ${className ?? ""}`, children: [_jsx("span", { className: `truncate ${selected ? "" : "text-muted-foreground"}`, children: selected?.label ?? placeholder }), _jsx(ChevronsUpDown, { className: "ml-2 h-4 w-4 shrink-0 opacity-50" })] }) }), _jsxs(PopoverContent, { className: "w-[--radix-popover-trigger-width] p-0", align: "start", children: [_jsx("div", { className: "p-2 border-b", children: _jsxs("div", { className: "relative", children: [_jsx(Search, { className: "absolute left-2 top-1/2 -translate-y-1/2 h-4 w-4 text-muted-foreground" }), _jsx(Input, { autoFocus: true, value: q, onChange: (e) => setQ(e.target.value), placeholder: `Zoek in ${options.length} items...`, className: "pl-8 h-9" })] }) }), _jsxs("div", { className: "max-h-64 overflow-y-auto py-1", children: [allowClear && (_jsxs("button", { type: "button", className: "w-full text-left text-sm px-3 py-2 hover:bg-accent flex items-center gap-2", onClick: () => { onChange(null); setOpen(false); }, children: [value === null && _jsx(Check, { className: "h-3 w-3" }), _jsx("span", { className: "text-muted-foreground italic", children: clearLabel })] })), filtered.length === 0 ? (_jsx("div", { className: "px-3 py-6 text-sm text-muted-foreground text-center", children: emptyLabel })) : (filtered.map((o) => (_jsxs("button", { type: "button", className: "w-full text-left text-sm px-3 py-2 hover:bg-accent flex items-start gap-2", onClick: () => { onChange(o.value); setOpen(false); }, children: [_jsx(Check, { className: `h-3 w-3 mt-1 shrink-0 ${value === o.value ? "" : "invisible"}` }), _jsxs("div", { className: "flex-1 min-w-0", children: [_jsx("div", { className: "truncate", children: o.label }), o.hint && _jsx("div", { className: "text-xs text-muted-foreground truncate", children: o.hint })] })] }, o.value)))), filtered.length === 200 && (_jsx("div", { className: "px-3 py-2 text-xs text-muted-foreground text-center border-t", children: "Toon eerste 200 resultaten \u2014 verfijn je zoekopdracht" }))] })] })] }));
 }

package/dist-lib/index.d.ts

@@ -1,6 +1,5 @@
 import type { FlowModule } from "@flowselections/core";
 export * from "./_core-safelist";
-export { MailboxInboxPage } from "./components/MailboxInboxPage";
 export { MailboxProposalsPage } from "./components/MailboxProposalsPage";
 export { SearchableSelect } from "./components/SearchableSelect";
 export { MailboxProcessedPage } from "./components/MailboxProcessedPage";

package/dist-lib/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAGvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AAEzE,eAAO,MAAM,mBAAmB,EAAE,UAmBjC,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAGvD,cAAc,kBAAkB,CAAC;AACjC,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AACzE,OAAO,EAAE,gBAAgB,EAAE,MAAM,+BAA+B,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,mCAAmC,CAAC;AAEzE,eAAO,MAAM,mBAAmB,EAAE,UAkBjC,CAAC"}

package/dist-lib/index.js

@@ -1,10 +1,9 @@
 // ============================================================================
 // src/index.ts — MODULE CONTRACT (Mailbox bestellingen)
 // ============================================================================
-import { Mail, Inbox, ClipboardCheck, CheckCircle2 } from "lucide-react";
+import { Mail, ClipboardCheck, CheckCircle2 } from "lucide-react";
 import { MailboxOrderTemplateCard } from "./components/settings/MailboxOrderTemplateCard";
 export * from "./_core-safelist";
-export { MailboxInboxPage } from "./components/MailboxInboxPage";
 export { MailboxProposalsPage } from "./components/MailboxProposalsPage";
 export { SearchableSelect } from "./components/SearchableSelect";
 export { MailboxProcessedPage } from "./components/MailboxProcessedPage";
@@ -14,10 +13,9 @@ export const mailboxOrdersModule = {
     version: "1.2.0",
     nav: {
         label: "Mailbox",
-        href: "/mailbox-orders",
+        href: "/mailbox-orders/voorstellen",
         icon: Mail,
         children: [
-            { label: "Inbox", href: "/mailbox-orders", icon: Inbox },
             { label: "Voorstellen", href: "/mailbox-orders/voorstellen", icon: ClipboardCheck },
             { label: "Verwerkt", href: "/mailbox-orders/verwerkt", icon: CheckCircle2 },
         ],

package/dist-lib/integrations/supabase/auth-attacher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"auth-attacher.d.ts","sourceRoot":"","sources":["../../../src/integrations/supabase/auth-attacher.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,mHAa9B,CAAA"}
+{"version":3,"file":"auth-attacher.d.ts","sourceRoot":"","sources":["../../../src/integrations/supabase/auth-attacher.ts"],"names":[],"mappings":"AAKA,eAAO,MAAM,kBAAkB,mHAyC9B,CAAA"}

package/dist-lib/integrations/supabase/auth-attacher.js

@@ -9,7 +9,41 @@ export const attachSupabaseAuth = createMiddleware({ type: 'function' }).client(
     const { supabase } = await import('./client');
     const { data } = await supabase.auth.getSession();
     const token = data.session?.access_token;
-    return next({
-        headers: token ? { Authorization: `Bearer ${token}` } : {},
-    });
+    const redirectToLogin = async () => {
+        try {
+            await supabase.auth.signOut();
+        }
+        catch { /* noop */ }
+        try {
+            window.localStorage.clear();
+        }
+        catch { /* noop */ }
+        if (!window.location.pathname.startsWith('/login')) {
+            window.location.replace('/login');
+        }
+    };
+    try {
+        return await next({
+            headers: token ? { Authorization: `Bearer ${token}` } : {},
+        });
+    }
+    catch (err) {
+        // TanStack geeft door auth-middleware gegooide Response-objecten soms als
+        // raw Response terug aan de browser. Als we die opnieuw gooien, toont de
+        // runtime overlay alleen `[object Response]`. Zet ze daarom om naar óf een
+        // stille login-redirect (401) óf een normale Error met leesbare tekst.
+        if (err instanceof Response) {
+            if (err.status === 401) {
+                await redirectToLogin();
+                throw new Error('Sessie verlopen — log opnieuw in.');
+            }
+            let message = '';
+            try {
+                message = await err.clone().text();
+            }
+            catch { /* noop */ }
+            throw new Error(message || `Serverfout (${err.status})`);
+        }
+        throw err;
+    }
 });