@flowselections/mailbox-orders 1.0.3 → 1.0.5

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

@@ -0,0 +1,6 @@
+export declare function CartAssignmentWizard({ orderId, open, onClose, }: {
+    orderId: string | null;
+    open: boolean;
+    onClose: () => void;
+}): import("react").JSX.Element;
+//# sourceMappingURL=CartAssignmentWizard.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"CartAssignmentWizard.d.ts","sourceRoot":"","sources":["../../src/components/CartAssignmentWizard.tsx"],"names":[],"mappings":"AA2CA,wBAAgB,oBAAoB,CAAC,EACnC,OAAO,EAAE,IAAI,EAAE,OAAO,GACvB,EAAE;IAAE,OAAO,EAAE,MAAM,GAAG,IAAI,CAAC;IAAC,IAAI,EAAE,OAAO,CAAC;IAAC,OAAO,EAAE,MAAM,IAAI,CAAA;CAAE,+BAsUhE"}

package/dist-lib/components/CartAssignmentWizard.js

@@ -0,0 +1,199 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useMemo, useState } from "react";
+import { useQuery } from "@tanstack/react-query";
+import { useServerFn } from "@tanstack/react-start";
+import { Button, Badge, Card, CardContent, CardHeader, CardTitle, Input, Label, Dialog, DialogContent, DialogHeader, DialogTitle, DialogFooter, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
+import { Plus, Trash2, AlertTriangle, CheckCircle2 } from "lucide-react";
+import { planAndSaveAutoCarts, saveManualCarts } from "../lib/mailbox.functions";
+export function CartAssignmentWizard({ orderId, open, onClose, }) {
+    const fetchPlan = useServerFn(planAndSaveAutoCarts);
+    const fetchSave = useServerFn(saveManualCarts);
+    const { data, isLoading, refetch } = useQuery({
+        queryKey: ["cart-plan", orderId],
+        enabled: !!orderId && open,
+        queryFn: async () => {
+            try {
+                return await fetchPlan({ data: { orderId: orderId } });
+            }
+            catch (e) {
+                toast.error(e?.message ?? "Indelen mislukt");
+                return { autoCarts: [], remainders: [], existingManualCarts: [], nextCartNumber: 1 };
+            }
+        },
+    });
+    const autoCarts = Array.isArray(data?.autoCarts) ? data.autoCarts : [];
+    const remainders = Array.isArray(data?.remainders) ? data.remainders : [];
+    const existingManualCarts = Array.isArray(data?.existingManualCarts) ? data.existingManualCarts : [];
+    // Pool met nog in te delen fusten per orderregel
+    const [pool, setPool] = useState({});
+    const [manual, setManual] = useState([]);
+    useEffect(() => {
+        const p = {};
+        remainders.forEach((r) => { p[r.order_item_id] = r.crates_remaining; });
+        setPool(p);
+        // Bestaande handmatige karren herstellen — capaciteitsmeta uit remainders aanvullen.
+        const remMeta = {};
+        remainders.forEach((r) => { remMeta[r.order_item_id] = r; });
+        setManual(existingManualCarts.map((c) => ({
+            id: crypto.randomUUID(),
+            items: c.items.map((i) => {
+                const meta = i.order_item_id ? remMeta[i.order_item_id] : null;
+                return {
+                    ...i,
+                    crates_per_layer: meta?.crates_per_layer ?? i.crates_per_layer ?? 1,
+                    layers_per_cart: meta?.layers_per_cart ?? i.layers_per_cart ?? 1,
+                };
+            }),
+        })));
+    }, [data]);
+    const remByItem = useMemo(() => {
+        const m = {};
+        remainders.forEach((r) => { m[r.order_item_id] = r; });
+        return m;
+    }, [remainders]);
+    const addCart = () => setManual((m) => [...m, { id: crypto.randomUUID(), items: [] }]);
+    const addItemToCart = (cartId, orderItemId, crates) => {
+        const rem = remByItem[orderItemId];
+        if (!rem)
+            return;
+        const available = pool[orderItemId] ?? 0;
+        const take = Math.max(0, Math.min(crates, available));
+        if (take === 0)
+            return;
+        setPool((p) => ({ ...p, [orderItemId]: available - take }));
+        setManual((carts) => carts.map((c) => {
+            if (c.id !== cartId)
+                return c;
+            // merge in plaats van duplicate regel
+            const existingIdx = c.items.findIndex((i) => i.order_item_id === orderItemId);
+            if (existingIdx >= 0) {
+                const next = [...c.items];
+                next[existingIdx] = { ...next[existingIdx], crates: next[existingIdx].crates + take };
+                return { ...c, items: next };
+            }
+            return {
+                ...c,
+                items: [...c.items, {
+                        order_item_id: orderItemId,
+                        product_id: rem.product_id,
+                        product_name: rem.product_name,
+                        crates: take,
+                        plants_per_crate: rem.plants_per_crate,
+                        crates_per_layer: rem.crates_per_layer,
+                        layers_per_cart: rem.layers_per_cart,
+                    }],
+            };
+        }));
+    };
+    const removeItem = (cartId, orderItemId) => {
+        setManual((carts) => carts.map((c) => {
+            if (c.id !== cartId)
+                return c;
+            const item = c.items.find((i) => i.order_item_id === orderItemId);
+            if (!item)
+                return c;
+            setPool((p) => ({ ...p, [orderItemId]: (p[orderItemId] ?? 0) + item.crates }));
+            return { ...c, items: c.items.filter((i) => i.order_item_id !== orderItemId) };
+        }));
+    };
+    const removeCart = (cartId) => {
+        setManual((carts) => {
+            const c = carts.find((x) => x.id === cartId);
+            if (c) {
+                setPool((p) => {
+                    const np = { ...p };
+                    c.items.forEach((i) => {
+                        if (!i.order_item_id)
+                            return;
+                        np[i.order_item_id] = (np[i.order_item_id] ?? 0) + i.crates;
+                    });
+                    return np;
+                });
+            }
+            return carts.filter((x) => x.id !== cartId);
+        });
+    };
+    // Capaciteit per kar = max van betrokken artikelen (gemengde karren toegestaan,
+    // pakken we de hoogste cratesPerCart als bovengrens; waarschuwing toont per item).
+    const cartCapacity = (cart) => cart.items.length === 0
+        ? 0
+        : Math.max(...cart.items.map((i) => i.crates_per_layer * i.layers_per_cart));
+    const cartUsed = (cart) => cart.items.reduce((s, i) => s + i.crates, 0);
+    const totalRemainingInPool = Object.values(pool).reduce((s, n) => s + n, 0);
+    const handleSave = async () => {
+        if (totalRemainingInPool > 0) {
+            toast.error(`Nog ${totalRemainingInPool} fust niet ingedeeld — verdeel alles over een kar voordat je opslaat`);
+            return;
+        }
+        if (manual.some((c) => c.items.length === 0)) {
+            toast.error("Lege karren niet toegestaan");
+            return;
+        }
+        const overfull = manual.find((c) => cartUsed(c) > cartCapacity(c));
+        if (overfull) {
+            toast.error("Een kar overschrijdt de capaciteit");
+            return;
+        }
+        try {
+            await fetchSave({
+                data: {
+                    orderId: orderId,
+                    carts: manual.map((c) => ({
+                        is_complete: cartUsed(c) >= cartCapacity(c),
+                        items: c.items.map((i) => ({
+                            order_item_id: i.order_item_id,
+                            product_id: i.product_id,
+                            product_name: i.product_name,
+                            crates: Math.max(1, Math.trunc(i.crates)),
+                            plants_per_crate: Math.max(1, Math.trunc(i.plants_per_crate || 1)),
+                            crates_per_layer: Math.max(1, Math.trunc(i.crates_per_layer || 1)),
+                        })),
+                    })),
+                },
+            });
+            toast.success("Karindeling opgeslagen");
+            onClose();
+        }
+        catch (e) {
+            // requireSupabaseAuth en input-validatie gooien een Response; toString
+            // daarvan is "[object Response]" — zet om in leesbare melding zodat
+            // de React error-overlay niet wordt getriggerd.
+            let msg = "Opslaan mislukt";
+            if (e instanceof Response) {
+                try {
+                    msg = (await e.text()) || `HTTP ${e.status}`;
+                }
+                catch {
+                    msg = `HTTP ${e.status}`;
+                }
+                if (e.status === 401)
+                    msg = "Sessie verlopen — log opnieuw in";
+            }
+            else if (e?.message) {
+                msg = e.message;
+            }
+            toast.error(msg);
+            console.error("saveManualCarts failed:", e);
+        }
+    };
+    return (_jsx(Dialog, { open: open, onOpenChange: (o) => { if (!o)
+            onClose(); }, children: _jsxs(DialogContent, { className: "max-w-[95vw] w-[95vw] h-[92vh] max-h-[92vh] overflow-y-auto p-6", children: [_jsx(DialogHeader, { children: _jsx(DialogTitle, { children: "Karindeling" }) }), isLoading ? (_jsx("div", { className: "text-muted-foreground", children: "Karren worden berekend..." })) : (_jsxs("div", { className: "space-y-6", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Automatisch ingedeelde karren" }), _jsxs(Badge, { variant: "secondary", children: [autoCarts.length, " kar(ren)"] })] }), _jsx(CardContent, { children: autoCarts.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen volledige karren mogelijk." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Kar #" }), _jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { className: "text-right", children: "Fusten" }), _jsx(TableHead, { className: "text-right", children: "Planten" }), _jsx(TableHead, { className: "text-right", children: "Bezetting" }), _jsx(TableHead, { children: "Status" })] }) }), _jsx(TableBody, { children: autoCarts.map((c) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-mono", children: c.cart_number }), _jsx(TableCell, { children: c.product_name }), _jsx(TableCell, { className: "text-right", children: c.crates }), _jsx(TableCell, { className: "text-right", children: c.plants }), _jsx(TableCell, { className: "text-right", children: "100%" }), _jsx(TableCell, { children: _jsxs(Badge, { className: "gap-1", children: [_jsx(CheckCircle2, { className: "h-3 w-3" }), " Volledig"] }) })] }, c.cart_number))) })] })) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { className: "text-base", children: "Handmatig in te delen fusten" }) }), _jsx(CardContent, { className: "space-y-3", children: remainders.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen restant \u2014 alles past volledig op karren." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { className: "text-right", children: "Beschikbaar (fusten)" }), _jsx(TableHead, { className: "text-right", children: "Planten/fust" }), _jsx(TableHead, { className: "text-right", children: "Capaciteit/kar" })] }) }), _jsx(TableBody, { children: remainders.map((r) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: r.product_name }), _jsxs(TableCell, { className: "text-right font-mono", children: [pool[r.order_item_id] ?? 0, " / ", r.crates_remaining] }), _jsx(TableCell, { className: "text-right", children: r.plants_per_crate }), _jsx(TableCell, { className: "text-right", children: r.crates_per_layer * r.layers_per_cart })] }, r.order_item_id))) })] })) })] }), remainders.length > 0 && (_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { className: "text-base", children: "Restant-karren samenstellen" }), _jsxs(Button, { size: "sm", onClick: addCart, children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Kar toevoegen"] })] }), _jsxs(CardContent, { className: "space-y-3", children: [manual.length === 0 && (_jsx("p", { className: "text-sm text-muted-foreground", children: "Voeg een kar toe om restant-fusten in te delen." })), manual.map((cart, idx) => {
+                                            const used = cartUsed(cart);
+                                            const cap = cartCapacity(cart);
+                                            const pct = cap > 0 ? Math.round((used / cap) * 100) : 0;
+                                            const over = cap > 0 && used > cap;
+                                            return (_jsxs(Card, { className: over ? "border-destructive" : "", children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between py-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs("span", { className: "font-medium", children: ["Restant-kar ", idx + 1] }), _jsxs(Badge, { variant: over ? "destructive" : "secondary", children: [used, " / ", cap || "?", " fusten (", pct, "%)"] }), over && (_jsxs("span", { className: "text-xs text-destructive flex items-center gap-1", children: [_jsx(AlertTriangle, { className: "h-3 w-3" }), " Capaciteit overschreden"] }))] }), _jsx(Button, { variant: "ghost", size: "icon", onClick: () => removeCart(cart.id), children: _jsx(Trash2, { className: "h-4 w-4" }) })] }), _jsxs(CardContent, { className: "space-y-2", children: [cart.items.map((i) => (_jsxs("div", { className: "flex items-center justify-between text-sm", children: [_jsxs("div", { children: [_jsx("span", { className: "font-medium", children: i.product_name }), _jsxs("span", { className: "text-muted-foreground", children: [" \u00B7 ", i.crates, " fust (", i.crates * i.plants_per_crate, " planten)"] })] }), _jsx(Button, { variant: "ghost", size: "sm", onClick: () => removeItem(cart.id, i.order_item_id), children: _jsx(Trash2, { className: "h-3 w-3" }) })] }, i.order_item_id))), _jsx(AddItemRow, { remainders: remainders, pool: pool, onAdd: (itemId, crates) => addItemToCart(cart.id, itemId, crates) })] })] }, cart.id));
+                                        })] })] }))] })), _jsxs(DialogFooter, { className: "gap-2", children: [_jsx(Button, { variant: "outline", onClick: onClose, children: "Annuleren" }), _jsxs(Button, { onClick: handleSave, disabled: isLoading || totalRemainingInPool > 0, children: ["Karindeling opslaan", totalRemainingInPool > 0 && (_jsxs(Badge, { variant: "destructive", className: "ml-2", children: ["Nog ", totalRemainingInPool, " fust in te delen"] }))] })] })] }) }));
+}
+function AddItemRow({ remainders, pool, onAdd, }) {
+    const available = remainders.filter((r) => (pool[r.order_item_id] ?? 0) > 0);
+    const [sel, setSel] = useState("");
+    const [qty, setQty] = useState(1);
+    if (available.length === 0)
+        return null;
+    return (_jsxs("div", { className: "flex items-end gap-2 pt-2 border-t", children: [_jsxs("div", { className: "flex-1", children: [_jsx(Label, { className: "text-xs", children: "Artikel" }), _jsxs(Select, { value: sel, onValueChange: setSel, children: [_jsx(SelectTrigger, { children: _jsx(SelectValue, { placeholder: "Kies restant-artikel..." }) }), _jsx(SelectContent, { children: available.map((r) => (_jsxs(SelectItem, { value: r.order_item_id, children: [r.product_name, " (", pool[r.order_item_id], " fust beschikbaar)"] }, r.order_item_id))) })] })] }), _jsxs("div", { className: "w-24", children: [_jsx(Label, { className: "text-xs", children: "Fusten" }), _jsx(Input, { type: "number", min: 1, value: qty, onChange: (e) => setQty(Math.max(1, Number(e.target.value) || 1)) })] }), _jsxs(Button, { size: "sm", disabled: !sel, onClick: () => { if (sel) {
+                    onAdd(sel, qty);
+                    setSel("");
+                    setQty(1);
+                } }, children: [_jsx(Plus, { className: "h-3 w-3 mr-1" }), " Toevoegen"] })] }));
+}

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

@@ -1 +1 @@
-{"version":3,"file":"MailboxProcessedPage.d.ts","sourceRoot":"","sources":["../../src/components/MailboxProcessedPage.tsx"],"names":[],"mappings":"AAQA,wBAAgB,oBAAoB,gCAuDnC"}
+{"version":3,"file":"MailboxProcessedPage.d.ts","sourceRoot":"","sources":["../../src/components/MailboxProcessedPage.tsx"],"names":[],"mappings":"AAWA,wBAAgB,oBAAoB,gCAiGnC"}

package/dist-lib/components/MailboxProcessedPage.js

@@ -1,10 +1,15 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useQuery } from "@tanstack/react-query";
+import { useState } from "react";
+import { useQuery, useQueryClient } from "@tanstack/react-query";
 import { useServerFn } from "@tanstack/react-start";
-import { Badge, Card, CardContent, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@flowselections/core";
-import { listProposals } from "../lib/mailbox.functions";
+import { toast } from "sonner";
+import { Badge, Button, Card, CardContent, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, } from "@flowselections/core";
+import { listProposals, reopenProposal } from "../lib/mailbox.functions";
+import { CartAssignmentWizard } from "./CartAssignmentWizard";
 export function MailboxProcessedPage() {
     const fetchList = useServerFn(listProposals);
+    const reopen = useServerFn(reopenProposal);
+    const qc = useQueryClient();
     const approved = useQuery({
         queryKey: ["mailbox-proposals", "approved"],
         queryFn: () => fetchList({ data: { status: "approved" } }),
@@ -17,5 +22,21 @@ export function MailboxProcessedPage() {
         ...(Array.isArray(approved.data?.items) ? approved.data.items : []),
         ...(Array.isArray(rejected.data?.items) ? rejected.data.items : []),
     ].sort((a, b) => (b.reviewed_at ?? "").localeCompare(a.reviewed_at ?? ""));
-    return (_jsxs("div", { className: "p-6 space-y-4", children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Verwerkt" }), _jsx(Card, { children: _jsx(CardContent, { className: "p-0", children: items.length === 0 ? (_jsx("div", { className: "p-8 text-center text-muted-foreground", children: "Nog geen verwerkte voorstellen." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Afzender" }), _jsx(TableHead, { children: "Onderwerp" }), _jsx(TableHead, { children: "Verwerkt op" })] }) }), _jsx(TableBody, { children: items.map((p) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Badge, { variant: p.status === "approved" ? "default" : "destructive", children: p.status === "approved" ? "Goedgekeurd" : "Afgewezen" }) }), _jsx(TableCell, { children: p.mailbox_messages?.from_email ?? "-" }), _jsx(TableCell, { className: "max-w-md truncate", children: p.mailbox_messages?.subject ?? "-" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: p.reviewed_at ? new Date(p.reviewed_at).toLocaleString("nl-NL") : "-" })] }, p.id))) })] })) }) })] }));
+    const [cartOrderId, setCartOrderId] = useState(null);
+    const [busyId, setBusyId] = useState(null);
+    const handleReopen = async (proposalId) => {
+        setBusyId(proposalId);
+        try {
+            await reopen({ data: { proposalId } });
+            toast.success("Voorstel teruggezet naar 'Te controleren'.");
+            await qc.invalidateQueries({ queryKey: ["mailbox-proposals"] });
+        }
+        catch (e) {
+            toast.error(e?.message ?? "Terugzetten mislukt.");
+        }
+        finally {
+            setBusyId(null);
+        }
+    };
+    return (_jsxs("div", { className: "p-6 space-y-4", children: [_jsx("h1", { className: "text-2xl font-semibold", children: "Verwerkt" }), _jsx(Card, { children: _jsx(CardContent, { className: "p-0", children: items.length === 0 ? (_jsx("div", { className: "p-8 text-center text-muted-foreground", children: "Nog geen verwerkte voorstellen." })) : (_jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Status" }), _jsx(TableHead, { children: "Afzender" }), _jsx(TableHead, { children: "Onderwerp" }), _jsx(TableHead, { children: "Verwerkt op" }), _jsx(TableHead, { className: "text-right", children: "Acties" })] }) }), _jsx(TableBody, { children: items.map((p) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: _jsx(Badge, { variant: p.status === "approved" ? "default" : "destructive", children: p.status === "approved" ? "Goedgekeurd" : "Afgewezen" }) }), _jsx(TableCell, { children: p.mailbox_messages?.from_email ?? "-" }), _jsx(TableCell, { className: "max-w-md truncate", children: p.mailbox_messages?.subject ?? "-" }), _jsx(TableCell, { className: "text-sm text-muted-foreground", children: p.reviewed_at ? new Date(p.reviewed_at).toLocaleString("nl-NL") : "-" }), _jsxs(TableCell, { className: "text-right space-x-2", children: [p.status === "approved" && p.created_order_id && (_jsx(Button, { size: "sm", variant: "outline", onClick: () => setCartOrderId(p.created_order_id), children: "Karindeling aanpassen" })), p.status === "rejected" && (_jsx(Button, { size: "sm", variant: "outline", disabled: busyId === p.id, onClick: () => handleReopen(p.id), children: busyId === p.id ? "Bezig..." : "Terugzetten" }))] })] }, p.id))) })] })) }) }), _jsx(CartAssignmentWizard, { orderId: cartOrderId, open: !!cartOrderId, onClose: () => setCartOrderId(null) })] }));
 }

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

@@ -1 +1 @@
-{"version":3,"file":"MailboxProposalsPage.d.ts","sourceRoot":"","sources":["../../src/components/MailboxProposalsPage.tsx"],"names":[],"mappings":"AA+BA,wBAAgB,oBAAoB,gCAqKnC"}
+{"version":3,"file":"MailboxProposalsPage.d.ts","sourceRoot":"","sources":["../../src/components/MailboxProposalsPage.tsx"],"names":[],"mappings":"AAmCA,wBAAgB,oBAAoB,gCAiQnC"}