@flowselections/dashboard-planner-installatie-techniek 1.0.38 → 1.0.40

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@flowselections/dashboard-planner-installatie-techniek",
-  "version": "1.0.38",
+  "version": "1.0.40",
   "flowselections": {
     "moduleId": "dashboard-planner-installatie-techniek",
     "pages": [
@@ -118,7 +118,7 @@
   "devDependencies": {
     "@cloudflare/vite-plugin": "^1.25.5",
     "@eslint/js": "^9.32.0",
-    "@flowselections/core": "1.0.29",
+    "@flowselections/core": "1.0.30",
     "@lovable.dev/vite-tanstack-config": "2.26.5",
     "@rsbuild/core": "^1.0.0",
     "@tailwindcss/vite": "^4.2.1",

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

@@ -1,2 +0,0 @@
-export declare function DashboardInstallatieTechniekPage(): import("react").JSX.Element;
-//# sourceMappingURL=DashboardInstallatieTechniekPage.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"DashboardInstallatieTechniekPage.d.ts","sourceRoot":"","sources":["../../src/components/DashboardInstallatieTechniekPage.tsx"],"names":[],"mappings":"AAwHA,wBAAgB,gCAAgC,gCAmQ/C"}

package/dist-lib/components/DashboardInstallatieTechniekPage.js

@@ -1,129 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-// ============================================================================
-// src/components/DashboardInstallatieTechniekPage.tsx
-// ============================================================================
-// Dashboard voor de installatietechniek — alle cijfers komen uit de database
-// via de getDashboardData server-function. Blokken zonder bruikbare bron
-// blijven bewust leeg met een duidelijke melding.
-//
-// GEEN <Header /> hier — de shell levert de Header via staticData.title.
-// ============================================================================
-import { useQuery, useQueryClient } from "@tanstack/react-query";
-import { useServerFn } from "@tanstack/react-start";
-import { AlertTriangle, CalendarCheck, CheckCircle2, ClipboardList, Eye, LayoutGrid, Package, RefreshCw, Truck, Wrench, } from "lucide-react";
-import { useState } from "react";
-import { Badge, Button, Card, CardContent, CardHeader, CardTitle, Skeleton, Table, TableBody, TableCell, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, toast, useAuth, } from "@flowselections/core";
-import { getDashboardData } from "../lib/dashboard-installatietechniek.functions";
-// ── KPI-tegels (volgorde = referentie) ────────────────────────────────────────
-const KPI_TILES = [
-    { key: "totaleVoorraad", label: "Totale Voorraad", Icon: Package, kleur: "text-blue-600 bg-blue-500/10" },
-    { key: "openBestellingen", label: "Open Bestellingen", Icon: ClipboardList, kleur: "text-blue-600 bg-blue-500/10" },
-    { key: "verzendingenVandaag", label: "Verzendingen Vandaag", Icon: Truck, kleur: "text-green-600 bg-green-500/10" },
-    { key: "voorraadAlerts", label: "Voorraad Alerts", Icon: AlertTriangle, kleur: "text-blue-600 bg-blue-500/10" },
-    { key: "openWerkbonnen", label: "Open Werkbonnen", Icon: Wrench, kleur: "text-blue-600 bg-blue-500/10" },
-    { key: "werkbonnenVandaag", label: "Werkbonnen Vandaag", Icon: CalendarCheck, kleur: "text-green-600 bg-green-500/10" },
-    { key: "teControleren", label: "Te Controleren", Icon: Eye, kleur: "text-orange-600 bg-orange-500/10" },
-];
-const EMPTY = {
-    kpis: {
-        totaleVoorraad: 0,
-        openBestellingen: 0,
-        verzendingenVandaag: 0,
-        voorraadAlerts: 0,
-        openWerkbonnen: 0,
-        werkbonnenVandaag: 0,
-        teControleren: 0,
-    },
-    recenteBestellingen: [],
-    voorraadWaarschuwingenMagazijn: [],
-    voorraadWaarschuwingenBus: [],
-    verzendingenVandaag: [],
-    garanties: [],
-};
-const STATUS_LABEL = {
-    open: "Open",
-    in_progress: "In uitvoering",
-    invoicing: "Te factureren",
-    planned_hidden: "Gepland",
-    planned_visible: "Gepland",
-    unassigned: "Niet toegewezen",
-    completed: "Afgerond",
-    geannuleerd: "Geannuleerd",
-    concept: "Concept",
-    verzonden: "Verzonden",
-    afgerond: "Afgerond",
-    goedgekeurd: "Goedgekeurd",
-};
-function statusLabel(status) {
-    return STATUS_LABEL[status] ?? status ?? "—";
-}
-/**
- * Server-function data is nooit blind te vertrouwen: bij een auth-fout of een
- * onverwachte respons kan `data` een object zijn dat géén DashboardData is.
- * Deze helper normaliseert altijd naar een volledig geldig DashboardData-object.
- */
-function normaliseerDashboard(data) {
-    const d = (data ?? {});
-    const kpis = (d.kpis && typeof d.kpis === "object" ? d.kpis : {});
-    return {
-        kpis: { ...EMPTY.kpis, ...kpis },
-        recenteBestellingen: Array.isArray(d.recenteBestellingen) ? d.recenteBestellingen : [],
-        voorraadWaarschuwingenMagazijn: Array.isArray(d.voorraadWaarschuwingenMagazijn)
-            ? d.voorraadWaarschuwingenMagazijn
-            : [],
-        voorraadWaarschuwingenBus: Array.isArray(d.voorraadWaarschuwingenBus)
-            ? d.voorraadWaarschuwingenBus
-            : [],
-        verzendingenVandaag: Array.isArray(d.verzendingenVandaag) ? d.verzendingenVandaag : [],
-        garanties: Array.isArray(d.garanties) ? d.garanties : [],
-    };
-}
-export function DashboardInstallatieTechniekPage() {
-    const { user } = useAuth();
-    const queryClient = useQueryClient();
-    const fetchDashboard = useServerFn(getDashboardData);
-    const { data, isLoading, isFetching, isError, refetch } = useQuery({
-        queryKey: ["dashboard-installatietechniek"],
-        queryFn: async () => {
-            try {
-                return await fetchDashboard();
-            }
-            catch (err) {
-                // Een 401/500 komt terug als een ruwe Response; die mag nooit als
-                // "Error: [object Response]" naar de router-errorboundary lekken.
-                if (err instanceof Response) {
-                    const tekst = await err.text().catch(() => "");
-                    throw new Error(`Dashboard laden mislukt (${err.status}) ${tekst}`.trim());
-                }
-                throw err instanceof Error ? err : new Error(String(err));
-            }
-        },
-        staleTime: 30000,
-        retry: false,
-    });
-    const dashboard = normaliseerDashboard(data);
-    const [voorraadTab, setVoorraadTab] = useState("magazijn");
-    const handleVernieuwen = () => {
-        queryClient.invalidateQueries({ queryKey: ["dashboard-installatietechniek"] });
-        refetch();
-        toast.success("Dashboard ververst");
-    };
-    const handleWidgetsBeheren = () => {
-        toast.info("Widgets beheren — binnenkort beschikbaar");
-    };
-    return (_jsxs("main", { className: "p-6 space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: "Installatietechniek" }), _jsxs("p", { className: "text-sm text-muted-foreground", children: ["Welkom terug", user?.email ? `, ${user.email}` : "", " \u2014 hier is het actuele overzicht."] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [_jsxs(Button, { onClick: handleWidgetsBeheren, variant: "outline", className: "gap-2", children: [_jsx(LayoutGrid, { className: "w-4 h-4" }), "Widgets beheren"] }), _jsxs(Button, { onClick: handleVernieuwen, variant: "outline", className: "gap-2", disabled: isFetching, children: [_jsx(RefreshCw, { className: `w-4 h-4 ${isFetching ? "animate-spin" : ""}` }), "Vernieuwen"] })] })] }), isError && (_jsxs("div", { className: "flex items-center gap-3 rounded-md border border-destructive/30 bg-destructive/5 p-4 text-sm", children: [_jsx(AlertTriangle, { className: "h-4 w-4 text-destructive" }), _jsx("span", { className: "text-muted-foreground", children: "Kon dashboardgegevens niet laden \u2014 probeer het opnieuw met Vernieuwen." })] })), _jsx("div", { className: "grid gap-4 sm:grid-cols-2 lg:grid-cols-4", children: KPI_TILES.map((tile) => {
-                    const { Icon } = tile;
-                    const waarde = dashboard.kpis[tile.key];
-                    return (_jsx(Card, { children: _jsx(CardContent, { className: "p-5", children: _jsxs("div", { className: "flex items-start justify-between", children: [_jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: tile.label }), isLoading ? (_jsx(Skeleton, { className: "mt-2 h-9 w-16" })) : (_jsx("p", { className: "mt-2 text-3xl font-semibold tracking-tight", children: waarde }))] }), _jsx("div", { className: `flex items-center justify-center w-10 h-10 rounded-full ${tile.kleur}`, children: _jsx(Icon, { className: "w-5 h-5" }) })] }) }) }, tile.key));
-                }) }), _jsxs("div", { className: "grid gap-4 lg:grid-cols-2", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { children: "Recente Bestellingen" }), _jsx(Badge, { variant: "secondary", children: dashboard.recenteBestellingen.length })] }), _jsx(CardContent, { children: isLoading ? (_jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-8 w-full" }), _jsx(Skeleton, { className: "h-8 w-full" }), _jsx(Skeleton, { className: "h-8 w-full" })] })) : dashboard.recenteBestellingen.length === 0 ? (_jsx(EmptyState, { tekst: "Geen recente bestellingen" })) : (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Klant" }), _jsx(TableHead, { children: "Status" }), _jsx(TableHead, { className: "text-right", children: "Bedrag" })] }) }), _jsx(TableBody, { children: dashboard.recenteBestellingen.map((b) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: b.orderNumber || "—" }), _jsx(TableCell, { className: "text-muted-foreground", children: b.customerName || "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: "outline", children: statusLabel(b.status) }) }), _jsx(TableCell, { className: "text-right text-muted-foreground", children: b.total || "—" })] }, b.orderNumber || b.orderDate))) })] }) })) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { className: "flex flex-row items-center justify-between", children: _jsx(CardTitle, { children: "Voorraadwaarschuwingen" }) }), _jsx(CardContent, { children: _jsxs(Tabs, { value: voorraadTab, onValueChange: (v) => setVoorraadTab(v), children: [_jsxs(TabsList, { children: [_jsx(TabsTrigger, { value: "magazijn", children: "Magazijn" }), _jsx(TabsTrigger, { value: "bus", children: "Bus-voorraad" })] }), _jsx(TabsContent, { value: "magazijn", className: "mt-4", children: isLoading ? (_jsx(Skeleton, { className: "h-8 w-full" })) : dashboard.voorraadWaarschuwingenMagazijn.length === 0 ? (_jsx(EmptyState, { tekst: "Geen voorraadwaarschuwingen" })) : (_jsx(VoorraadListMagazijn, { items: dashboard.voorraadWaarschuwingenMagazijn })) }), _jsx(TabsContent, { value: "bus", className: "mt-4", children: isLoading ? (_jsx(Skeleton, { className: "h-8 w-full" })) : dashboard.voorraadWaarschuwingenBus.length === 0 ? (_jsx(EmptyState, { tekst: "Geen voorraadwaarschuwingen" })) : (_jsx(VoorraadListBus, { items: dashboard.voorraadWaarschuwingenBus })) })] }) })] })] }), _jsxs("div", { className: "grid gap-4 lg:grid-cols-2", children: [_jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex flex-row items-center justify-between", children: [_jsx(CardTitle, { children: "Verzendingen Vandaag" }), _jsx(Badge, { variant: "secondary", children: dashboard.verzendingenVandaag.length })] }), _jsx(CardContent, { children: isLoading ? (_jsxs("div", { className: "space-y-2", children: [_jsx(Skeleton, { className: "h-8 w-full" }), _jsx(Skeleton, { className: "h-8 w-full" })] })) : dashboard.verzendingenVandaag.length === 0 ? (_jsx(EmptyState, { tekst: "Geen verzendingen vandaag" })) : (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Verzending" }), _jsx(TableHead, { children: "Order" }), _jsx(TableHead, { children: "Klant" }), _jsx(TableHead, { children: "Status" })] }) }), _jsx(TableBody, { children: dashboard.verzendingenVandaag.map((v) => (_jsxs(TableRow, { children: [_jsxs(TableCell, { className: "font-medium", children: ["#", v.shipmentNumber] }), _jsx(TableCell, { children: v.orderNumber || "—" }), _jsx(TableCell, { className: "text-muted-foreground", children: v.customerName || "—" }), _jsx(TableCell, { children: _jsx(Badge, { variant: "outline", children: statusLabel(v.status) }) })] }, `${v.orderNumber}-${v.shipmentNumber}`))) })] }) })) })] }), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsxs(CardTitle, { className: "flex items-center gap-2", children: [_jsx(CheckCircle2, { className: "w-5 h-5 text-green-600" }), "Garanties"] }) }), _jsx(CardContent, { children: _jsx(EmptyState, { tekst: "Geen garanties die binnenkort verlopen" }) })] })] })] }));
-}
-// ── Subcomponenten ───────────────────────────────────────────────────────────
-function EmptyState({ tekst }) {
-    return (_jsx("div", { className: "flex min-h-[6rem] items-center justify-center py-8 text-center text-sm text-muted-foreground", children: tekst }));
-}
-function VoorraadListMagazijn({ items, }) {
-    return (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Artikel" }), _jsx(TableHead, { children: "Artikelnr." }), _jsx(TableHead, { className: "text-right", children: "Voorraad" })] }) }), _jsx(TableBody, { children: items.map((m) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: m.description || "—" }), _jsx(TableCell, { className: "text-muted-foreground", children: m.articleNumber || "—" }), _jsxs(TableCell, { className: "text-right text-muted-foreground", children: [m.quantity, " ", m.unit] })] }, m.articleNumber || m.description))) })] }) }));
-}
-function VoorraadListBus({ items, }) {
-    return (_jsx("div", { className: "rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsxs(TableRow, { children: [_jsx(TableHead, { children: "Product" }), _jsx(TableHead, { className: "text-right", children: "Huidig" }), _jsx(TableHead, { className: "text-right", children: "Minimum" })] }) }), _jsx(TableBody, { children: items.map((m) => (_jsxs(TableRow, { children: [_jsx(TableCell, { className: "font-medium", children: m.productName || "—" }), _jsxs(TableCell, { className: "text-right text-red-600", children: [m.quantityCurrent, " ", m.unit] }), _jsxs(TableCell, { className: "text-right text-muted-foreground", children: [m.quantityMin, " ", m.unit] })] }, m.barcode || m.productName))) })] }) }));
-}

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

@@ -1,6 +0,0 @@
-interface InstallatieTechniekLogoProps {
-    className?: string;
-}
-export declare function InstallatieTechniekLogo({ className }: InstallatieTechniekLogoProps): import("react").JSX.Element;
-export {};
-//# sourceMappingURL=InstallatieTechniekLogo.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"InstallatieTechniekLogo.d.ts","sourceRoot":"","sources":["../../src/components/InstallatieTechniekLogo.tsx"],"names":[],"mappings":"AAKA,UAAU,4BAA4B;IACpC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,wBAAgB,uBAAuB,CAAC,EAAE,SAAS,EAAE,EAAE,4BAA4B,+BAsBlF"}

package/dist-lib/components/InstallatieTechniekLogo.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-export function InstallatieTechniekLogo({ className }) {
-    return (_jsxs("svg", { viewBox: "0 0 40 40", fill: "none", xmlns: "http://www.w3.org/2000/svg", className: className, "aria-hidden": "true", children: [_jsx("rect", { width: "40", height: "40", rx: "8", fill: "currentColor", opacity: "0.1" }), _jsx("path", { d: "M12 28 L20 20 M24 16 a4 4 0 1 0 -2.8 -1.2 L19 17 a1.4 1.4 0 0 0 0 2 L22 22 a1.4 1.4 0 0 0 2 0 l2.2 -2.2 A4 4 0 0 0 24 16 Z", stroke: "currentColor", strokeWidth: "1.8", strokeLinecap: "round", strokeLinejoin: "round", fill: "currentColor", fillOpacity: "0.15" })] }));
-}