@flowselections/floriday-verkoop-module 1.0.38 → 1.0.40

package/dist-lib/components/verkoop/VerkoopOrdersPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"VerkoopOrdersPage.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/VerkoopOrdersPage.tsx"],"names":[],"mappings":"AAkFA,wBAAgB,iBAAiB,gCA2ahC"}
+{"version":3,"file":"VerkoopOrdersPage.d.ts","sourceRoot":"","sources":["../../../src/components/verkoop/VerkoopOrdersPage.tsx"],"names":[],"mappings":"AA8DA,wBAAgB,iBAAiB,gCA+YhC"}

package/dist-lib/components/verkoop/VerkoopOrdersPage.js

@@ -1,5 +1,5 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { useEffect, useMemo, useState } from "react";
+import { useEffect, useState } from "react";
 import { Button, Select, SelectContent, SelectItem, SelectTrigger, SelectValue, toast, } from "@flowselections/core";
 import { Download, Plus, AlertTriangle, RefreshCw, ChevronLeft, ChevronRight, Filter, } from "lucide-react";
 import { useServerFn } from "@tanstack/react-start";
@@ -9,8 +9,9 @@ import { supabase } from "../../integrations/supabase/client";
 import { runSalesOrdersSync } from "../../lib/salesorders.functions";
 import { deleteLocalOrder } from "../../lib/create-order.functions";
 import { runTradeItemsSync } from "../../lib/tradeitems.functions";
-import { applyFilters, computeTotals, ordersToCsv, } from "../../lib/salesorders-mapping";
-import { useSalesOrdersQuery } from "../../lib/useSalesOrdersQuery";
+import { ordersToCsv, } from "../../lib/salesorders-mapping";
+import { listSalesOrders } from "../../lib/salesorders-list.functions";
+import { derivePeriodWindow, useSalesOrdersQuery } from "../../lib/useSalesOrdersQuery";
 import { AnalyticsCards } from "./AnalyticsCards";
 import { SalesOrdersFilters } from "./SalesOrdersFilters";
 import { SalesOrdersFilterPanel, countActiveFilters, } from "./SalesOrdersFilterPanel";
@@ -23,35 +24,8 @@ const STATUS_TABS = [
     { id: "invoiced", label: "Gefactureerd" },
     { id: "cancelled", label: "Geannuleerd" },
 ];
-function matchesStatus(o, tab) {
-    if (tab === "all")
-        return true;
-    if (tab === "cancelled")
-        return o.status.isCancelled;
-    if (tab === "shipped")
-        return o.status.isShipped;
-    if (tab === "invoiced")
-        return o.status.isInvoiced;
-    if (tab === "open")
-        return !o.status.isCancelled && !o.status.isShipped;
-    return true;
-}
-/**
- * Groepeer orders die tot dezelfde buffer horen tot één "logische" order.
- * Wordt gebruikt voor tellingen en totalen zodat een buffer als 1 order geldt.
- */
-function collapseBuffers(orders) {
-    const seen = new Set();
-    const out = [];
-    for (const o of orders) {
-        const key = o.bufferId && (o.bufferSize ?? 1) > 1 ? `buf:${o.bufferId}` : `one:${o.id}`;
-        if (seen.has(key))
-            continue;
-        seen.add(key);
-        out.push(o);
-    }
-    return out;
-}
+// Statusfiltering, buffer-groepering en totalen gebeuren serverside
+// (zie src/lib/salesorders-list.server.ts).
 export function VerkoopOrdersPage() {
     const [tab, setTab] = useState("all");
     const [filterPanelOpen, setFilterPanelOpen] = useState(false);
@@ -101,81 +75,70 @@ export function VerkoopOrdersPage() {
             setDeleting(false);
         }
     };
-    const { data, isLoading, error, refetch, isFetching } = useSalesOrdersQuery(filters);
-    const orders = data?.orders ?? [];
+    // Serverside gefilterd, gesorteerd en gepagineerd: de browser krijgt alleen
+    // de zichtbare pagina plus totalen/tellingen.
+    const { data, isLoading, error, refetch, isFetching } = useSalesOrdersQuery(filters, {
+        tab,
+        page,
+        pageSize,
+    });
+    const paged = data?.orders ?? [];
     const activeEnvironment = data?.environment ?? "staging";
-    // Automatisch omschakelen wanneer de Authenticatie-module de omgeving wijzigt.
+    const totals = data?.totals ?? {
+        revenue: 0,
+        avgPrice: 0,
+        fustCount: 0,
+        karCount: 0,
+        orderCount: 0,
+    };
+    const statusCounts = data?.statusCounts ?? {
+        all: 0,
+        open: 0,
+        shipped: 0,
+        invoiced: 0,
+        cancelled: 0,
+    };
+    const totalCount = data?.totalCount ?? 0;
+    const fetchListForExport = useServerFn(listSalesOrders);
+    // Automatisch verversen wanneer de Authenticatie-module de omgeving wijzigt.
     useEffect(() => {
         const channel = supabase
             .channel("floriday-settings-env")
             .on("postgres_changes", { event: "*", schema: "public", table: "floriday_settings" }, () => {
-            queryClient.invalidateQueries({ queryKey: ["floriday", "salesorders-cache"] });
+            queryClient.invalidateQueries({ queryKey: ["floriday", "salesorders-list"] });
         })
             .subscribe();
         return () => {
             supabase.removeChannel(channel);
         };
     }, [queryClient]);
-    // Realtime — lijst live bijwerken zodra cache-regels binnenkomen/wijzigen.
-    useEffect(() => {
-        let timer = null;
-        const invalidate = () => {
-            if (timer)
-                clearTimeout(timer);
-            timer = setTimeout(() => {
-                queryClient.invalidateQueries({ queryKey: ["floriday", "salesorders-cache"] });
-            }, 500);
-        };
-        const channel = supabase
-            .channel("floriday-salesorders-cache")
-            .on("postgres_changes", { event: "*", schema: "public", table: "floriday_salesorders_cache" }, invalidate)
-            .on("postgres_changes", { event: "*", schema: "public", table: "floriday_fulfillment_orders_cache" }, invalidate)
-            .subscribe();
-        return () => {
-            if (timer)
-                clearTimeout(timer);
-            supabase.removeChannel(channel);
-        };
-    }, [queryClient]);
-    const statusFiltered = useMemo(() => orders.filter((o) => matchesStatus(o, tab)), [orders, tab]);
-    const filtered = useMemo(() => applyFilters(statusFiltered, filters), [statusFiltered, filters]);
-    const totals = useMemo(() => computeTotals(collapseBuffers(filtered)), [filtered]);
-    const statusCounts = useMemo(() => {
-        const base = collapseBuffers(applyFilters(orders, filters));
-        const counts = {
-            all: base.length,
-            open: 0,
-            shipped: 0,
-            invoiced: 0,
-            cancelled: 0,
-        };
-        for (const o of base) {
-            if (o.status.isCancelled)
-                counts.cancelled++;
-            else if (o.status.isShipped)
-                counts.shipped++;
-            else
-                counts.open++;
-            if (o.status.isInvoiced)
-                counts.invoiced++;
-        }
-        return counts;
-    }, [orders, filters]);
     const activeFilterCount = countActiveFilters(filters);
-    const totalCount = filtered.length;
     const totalPages = Math.max(1, Math.ceil(totalCount / pageSize));
     useEffect(() => {
         if (page > totalPages)
             setPage(totalPages);
     }, [page, totalPages]);
-    // Reset naar pagina 1 als filters wijzigen
+    // Reset naar pagina 1 als filters, tab of paginagrootte wijzigen
     useEffect(() => {
         setPage(1);
-    }, [filters, pageSize]);
-    const paged = useMemo(() => filtered.slice((page - 1) * pageSize, page * pageSize), [filtered, page, pageSize]);
-    const handleExport = () => {
+    }, [filters, pageSize, tab]);
+    const handleExport = async () => {
         try {
-            const { csv, filename } = ordersToCsv(filtered);
+            const win = derivePeriodWindow(filters);
+            const res = await fetchListForExport({
+                data: {
+                    since: win.since,
+                    until: win.until,
+                    dateField: win.dateField,
+                    search: filters.search,
+                    status: filters.status,
+                    tab,
+                    page: 1,
+                    pageSize: 200,
+                    all: true,
+                },
+            });
+            const { csv, filename } = ordersToCsv(res.rows);
             const blob = new Blob(["\ufeff" + csv], { type: "text/csv;charset=utf-8" });
             const url = URL.createObjectURL(blob);
             const a = document.createElement("a");