@flowselections/pick-schermen-kwekers 1.0.6 → 1.0.8

package/README.md

@@ -1,24 +1,24 @@
-# pick schermen kwekers
-
-blank project start
-
-This project was built with [Lovable](https://lovable.dev).
-
-## Build with Lovable
-
-Continue developing this project in the [Lovable editor](https://lovable.dev/projects/f7462658-1d60-42f1-8e22-dbefe36f44ef).
-
-- **Ship faster**: describe what you want to build and Lovable handles the code.
-- **Stay in sync**: every change made in Lovable is committed straight to this repository.
-- **Full ownership**: this code is yours. Push to `main` on GitHub and your changes sync back into Lovable, ready for your next prompt.
-
-## Development
-
-Prefer working locally? You need Node.js and npm — [install with nvm](https://github.com/nvm-sh/nvm#installing-and-updating).
-
-```sh
-git clone <this-repository-url>
-cd <repository-name>
-npm i
-npm run dev
-```
+# pick schermen kwekers
+
+blank project start
+
+This project was built with [Lovable](https://lovable.dev).
+
+## Build with Lovable
+
+Continue developing this project in the [Lovable editor](https://lovable.dev/projects/f7462658-1d60-42f1-8e22-dbefe36f44ef).
+
+- **Ship faster**: describe what you want to build and Lovable handles the code.
+- **Stay in sync**: every change made in Lovable is committed straight to this repository.
+- **Full ownership**: this code is yours. Push to `main` on GitHub and your changes sync back into Lovable, ready for your next prompt.
+
+## Development
+
+Prefer working locally? You need Node.js and npm — [install with nvm](https://github.com/nvm-sh/nvm#installing-and-updating).
+
+```sh
+git clone <this-repository-url>
+cd <repository-name>
+npm i
+npm run dev
+```

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

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

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

@@ -0,0 +1 @@
+{"version":3,"file":"TemplateModulePage.d.ts","sourceRoot":"","sources":["../../src/components/TemplateModulePage.tsx"],"names":[],"mappings":"AAsBA,wBAAgB,kBAAkB,gCAmFjC"}

package/dist-lib/components/TemplateModulePage.js

@@ -0,0 +1,44 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
+// ============================================================================
+// src/components/TemplateModulePage.tsx — EXAMPLE PAGE COMPONENT
+// ============================================================================
+// Pagina-componenten horen in src/components/, NIET alleen in src/routes/.
+// src/routes/ wordt NIET naar npm gepubliceerd (zie tsconfig.build.json exclude).
+//
+// GEEN <Header /> hier — die zit in _authenticated.tsx via staticData.title
+// ============================================================================
+import { useState, useEffect } from "react";
+import { useAuth, supabase, Button, Card, CardContent, CardHeader, CardTitle, toast, } from "@flowselections/core";
+import { TemplateModuleLogo } from './TemplateModuleLogo';
+export function TemplateModulePage() {
+    // Auth is guaranteed — this user is already logged in
+    const { user, isAdmin } = useAuth();
+    // Example state — replace with your own
+    const [items, setItems] = useState([]);
+    const [loading, setLoading] = useState(true);
+    useEffect(() => {
+        loadData();
+    }, []);
+    const loadData = async () => {
+        setLoading(true);
+        try {
+            // Example query — replace "products" with your table
+            const { data, error } = await supabase
+                .from("products")
+                .select("*")
+                .limit(10);
+            if (error)
+                throw error;
+            // ✅ Altijd Array.isArray bewaken op server-function data
+            // const safeItems = Array.isArray(data?.items) ? data.items : [];
+            setItems(Array.isArray(data) ? data : []);
+        }
+        catch {
+            toast.error("Fout bij het laden van gegevens");
+        }
+        finally {
+            setLoading(false);
+        }
+    };
+    return (_jsxs("main", { className: "p-6 space-y-6", children: [isAdmin && (_jsxs("div", { className: "text-sm text-muted-foreground", children: ["Ingelogd als admin: ", user?.email] })), _jsxs(Card, { children: [_jsx(CardHeader, { children: _jsx(CardTitle, { children: "Overzicht" }) }), _jsxs(CardContent, { children: [loading ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Laden..." })) : items.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: "Geen gegevens gevonden." })) : (_jsxs("p", { className: "text-sm", children: [items.length, " items geladen."] })), _jsx(Button, { onClick: loadData, className: "mt-4", disabled: loading, children: "Vernieuwen" })] })] }), _jsxs("div", { className: "flex items-center gap-2 text-sm text-muted-foreground", children: [_jsx(TemplateModuleLogo, { className: "w-6 h-6 text-primary" }), _jsx("span", { children: "SVG-component (voorkeur voor vector-logo's)" })] })] }));
+}

package/dist-lib/components/pick/PickScherm.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"PickScherm.d.ts","sourceRoot":"","sources":["../../../src/components/pick/PickScherm.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAiB,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAUtE,UAAU,KAAK;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAID;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,+BAmVpD"}
+{"version":3,"file":"PickScherm.d.ts","sourceRoot":"","sources":["../../../src/components/pick/PickScherm.tsx"],"names":[],"mappings":"AAwBA,OAAO,KAAK,EAAiB,WAAW,EAAE,MAAM,qBAAqB,CAAC;AAYtE,UAAU,KAAK;IACb,OAAO,EAAE,WAAW,CAAC;IACrB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;CACrB;AAID;;;GAGG;AACH,wBAAgB,UAAU,CAAC,EAAE,OAAO,EAAE,MAAM,EAAE,EAAE,KAAK,+BAgapD"}

package/dist-lib/components/pick/PickScherm.js

@@ -1,14 +1,16 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { Badge, Button, Card, CardContent, Input, toast } from "@flowselections/core";
-import { ArrowLeft, Globe, Loader2, Printer, RefreshCw, Search, WifiOff } from "lucide-react";
+import { Badge, Button, Card, CardContent, Input, toast, } from "@flowselections/core";
+import { AlertTriangle, ArrowLeft, CheckCircle2, Globe, Loader2, Printer, RefreshCw, Search, WifiOff, } from "lucide-react";
 import { LanguageTiles } from "./LanguageTiles";
 import { QueueTable } from "./QueueTable";
 import { getSessionId, pickApi } from "../../lib/pickApi";
-import { completeLogisticsTaskForItem, documentTypeOf, EmptyLayoutError, MissingLayoutError, printQueueItem, } from "../../lib/pickPrint";
+import { completeLogisticsTaskForItem } from "../../lib/pickPrint";
 import { getPickTranslator } from "../../lib/pickI18n";
+import { getPrintJobTexts, printJobStatusLabel } from "../../lib/pickPrintJobText";
 import { defaultFilters, usePickHeartbeat, usePickQueue, } from "../../hooks/usePickQueue";
 import { usePickDocumentTypes, usePickStatuses } from "../../hooks/usePickConfig";
+import { usePrintJob } from "../../hooks/usePrintJob";
 const LANG_STORAGE_KEY = "pick.language";
 /**
  * Pickscherm. De Logistiek Engine bepaalt welke documenten zichtbaar zijn en
@@ -20,14 +22,15 @@ export function PickScherm({ station, onBack }) {
     const [filters, setFilters] = useState(defaultFilters);
     const [busyId, setBusyId] = useState(null);
     const [pending, setPending] = useState(null);
+    const [lastPrinted, setLastPrinted] = useState(null);
+    const resetDone = useRef(null);
     const autoFetched = useRef(false);
     const { data: statuses } = usePickStatuses();
     const { data: documentTypes } = usePickDocumentTypes();
     const { online } = usePickHeartbeat(station.id, null, sessionId);
+    const { tracked, track, clear: clearJob } = usePrintJob();
     const t = useMemo(() => getPickTranslator(lang ?? "nl"), [lang]);
-    const layoutMissingMessage = useCallback((documentType) => t.lang === "nl"
-        ? `Geen layout ingesteld voor ${documentType}. Stel deze in in de Layout maker (pakbonnen, verzendbrieven, extra).`
-        : `No layout configured for ${documentType}. Set it up in the Layout maker.`, [t]);
+    const jobTexts = useMemo(() => getPrintJobTexts(t.lang), [t]);
     useEffect(() => {
         if (typeof window === "undefined")
             return;
@@ -47,26 +50,48 @@ export function PickScherm({ station, onBack }) {
         enabled: lang !== null,
     });
     const runPrint = useCallback(async (item) => {
-        const printed = await printQueueItem(item, t.locale);
-        await pickApi.completePrint(item.id, null, sessionId);
-        await completeLogisticsTaskForItem(item, printed);
+        const updated = await pickApi.completePrint(item.id, sessionId);
+        const jobId = updated?.print_job_id ?? null;
+        await completeLogisticsTaskForItem(item, jobId);
+        setLastPrinted(updated ?? item);
+        if (jobId) {
+            resetDone.current = null;
+            track({
+                jobId,
+                queueItemId: item.id,
+                documentNumber: (updated ?? item).document_number ?? null,
+            });
+        }
         toast.success(`${item.document_number ?? t("document")} ${t("sentToPrinter")}`);
         refresh();
-    }, [sessionId, refresh, t]);
-    /** Zet een printfout om in een begrijpelijke melding, zonder ooit zelf op te maken. */
-    const showPrintError = useCallback((e, item) => {
-        if (e instanceof EmptyLayoutError) {
-            toast.error(t.lang === "nl"
-                ? `Layout heeft nog geen inhoud (${e.layoutName}).`
-                : `Layout has no content yet (${e.layoutName}).`);
+    }, [sessionId, refresh, t, track]);
+    /** Mislukte printopdracht: document terugzetten zodat het weer in de wachtrij komt. */
+    useEffect(() => {
+        const job = tracked?.job;
+        if (!tracked || !job)
             return;
-        }
-        if (e instanceof MissingLayoutError) {
-            toast.error(layoutMissingMessage(e.documentType || documentTypeOf(item)));
+        if (job.status !== "mislukt" && job.status !== "geannuleerd")
             return;
-        }
+        if (resetDone.current === tracked.jobId)
+            return;
+        resetDone.current = tracked.jobId;
+        void (async () => {
+            try {
+                await pickApi.resetPrint(tracked.queueItemId, sessionId);
+                toast.error(`${jobTexts.failed}: ${job.foutmelding ?? jobTexts.unknown}`);
+            }
+            catch (e) {
+                toast.error(e instanceof Error ? e.message : jobTexts.failed);
+            }
+            finally {
+                refresh();
+            }
+        })();
+    }, [tracked, sessionId, refresh, jobTexts]);
+    /** Zet een printfout om in een begrijpelijke melding. */
+    const showPrintError = useCallback((e) => {
         toast.error(e instanceof Error ? e.message : t("notAvailable"));
-    }, [layoutMissingMessage, t]);
+    }, [t]);
     const handlePick = useCallback(async (item) => {
         setBusyId(item.id);
         try {
@@ -80,7 +105,7 @@ export function PickScherm({ station, onBack }) {
             await runPrint(claimed ?? item);
         }
         catch (e) {
-            showPrintError(e, item);
+            showPrintError(e);
             try {
                 await pickApi.releaseLock(item.id);
             }
@@ -93,21 +118,32 @@ export function PickScherm({ station, onBack }) {
             setBusyId(null);
         }
     }, [station.id, station.lock_timeout_seconds, sessionId, runPrint, refresh, showPrintError]);
-    /** Vraagt de Logistiek Engine om de volgende opdracht en laat deze ter bevestiging zien. */
-    /** Print een al geprint document opnieuw, zonder de wachtrijstatus te wijzigen. */
+    /**
+     * Zet een nieuwe printopdracht in de wachtrij voor een al geprint document,
+     * zonder de wachtrijstatus te wijzigen.
+     */
     const handleReprint = useCallback(async (item) => {
         setBusyId(item.id);
         try {
-            await printQueueItem(item, t.locale);
+            const jobId = await pickApi.reprint(item.id, sessionId);
+            setLastPrinted(item);
+            if (jobId) {
+                resetDone.current = jobId;
+                track({
+                    jobId,
+                    queueItemId: item.id,
+                    documentNumber: item.document_number ?? null,
+                });
+            }
             toast.success(`${item.document_number ?? t("document")} ${t("sentToPrinter")}`);
         }
         catch (e) {
-            showPrintError(e, item);
+            showPrintError(e);
         }
         finally {
             setBusyId(null);
         }
-    }, [t, showPrintError]);
+    }, [t, sessionId, track, showPrintError]);
     const fetchNext = useCallback(async () => {
         setBusyId("next");
         try {
@@ -147,7 +183,7 @@ export function PickScherm({ station, onBack }) {
             await fetchNext();
         }
         catch (e) {
-            showPrintError(e, item);
+            showPrintError(e);
             try {
                 await pickApi.releaseLock(item.id);
             }
@@ -194,5 +230,10 @@ export function PickScherm({ station, onBack }) {
         return (_jsxs("div", { className: "space-y-6", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsxs("div", { children: [_jsx("h2", { className: "text-2xl font-bold text-foreground", children: station.name }), _jsx("p", { className: "text-sm text-muted-foreground", children: t("chooseLanguageHint") })] }), onBack && (_jsxs(Button, { variant: "outline", onClick: onBack, children: [_jsx(ArrowLeft, { className: "mr-2 h-4 w-4" }), " ", t("back")] }))] }), _jsx(LanguageTiles, { onSelect: chooseLang })] }));
     }
     const totalPages = Math.max(1, Math.ceil(total / filters.pageSize));
-    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs(Button, { variant: "outline", size: "lg", onClick: () => setLang(null), children: [_jsx(Globe, { className: "mr-2 h-5 w-5" }), " ", t("changeLanguage")] }), _jsxs("div", { children: [_jsx("h2", { className: "text-xl font-bold text-foreground", children: station.name }), _jsxs("p", { className: "text-sm text-muted-foreground", children: [pendingCount, " ", t("statusToPrint"), " \u00B7 ", printedCount, " ", t("statusPrinted")] })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [!online && (_jsxs(Badge, { className: "bg-destructive text-destructive-foreground", children: [_jsx(WifiOff, { className: "mr-1 h-3.5 w-3.5" }), " ", t("offline")] })), _jsx(Button, { variant: "outline", size: "icon", onClick: refresh, "aria-label": t("refresh"), children: _jsx(RefreshCw, { className: "h-4 w-4" }) }), _jsxs(Button, { size: "lg", className: "h-14 px-8 text-lg", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null, children: [busyId !== null ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] })] }), pending && (_jsx(Card, { className: "border-2 border-primary", children: _jsxs(CardContent, { className: "flex flex-wrap items-center justify-between gap-4 p-5", children: [_jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: t("confirmPrintTitle") }), _jsx("p", { className: "text-2xl font-bold text-foreground", children: pending.document_number ?? t("document") }), _jsx("p", { className: "text-sm text-muted-foreground", children: [pending.order_number, pending.customer_name].filter(Boolean).join(" · ") })] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", size: "lg", onClick: cancelPending, disabled: busyId !== null, children: t("cancel") }), _jsxs(Button, { size: "lg", className: "h-14 px-8 text-lg", onClick: confirmPending, disabled: busyId !== null, children: [busyId === "confirm" ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("print")] })] })] }) })), _jsx(Card, { children: _jsx(CardContent, { className: "flex flex-wrap items-center gap-3 p-4", children: _jsxs("div", { className: "relative min-w-64 flex-1", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: t("search"), value: filters.search, onChange: (e) => setFilters((f) => ({ ...f, search: e.target.value, page: 0 })) })] }) }) }), loading ? (_jsxs("div", { className: "flex items-center justify-center py-16 text-muted-foreground", children: [_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" }), " ", t("loadingQueue")] })) : (_jsx(QueueTable, { items: items, lockedIds: lockedIds, statuses: Array.isArray(statuses) ? statuses : [], documentTypes: Array.isArray(documentTypes) ? documentTypes : [], busyId: busyId, onPick: handlePick, onReprint: handleReprint, t: t })), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("span", { className: "text-sm text-muted-foreground", children: [t("page"), " ", filters.page + 1, " ", t("of"), " ", totalPages] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", disabled: filters.page === 0, onClick: () => setFilters((f) => ({ ...f, page: Math.max(0, f.page - 1) })), children: t("previous") }), _jsx(Button, { variant: "outline", disabled: filters.page + 1 >= totalPages, onClick: () => setFilters((f) => ({ ...f, page: f.page + 1 })), children: t("next") })] })] })] }));
+    const jobStatus = tracked?.job?.status ?? null;
+    const jobFailed = jobStatus === "mislukt" || jobStatus === "geannuleerd";
+    return (_jsxs("div", { className: "space-y-4", children: [_jsxs("div", { className: "flex flex-wrap items-center justify-between gap-3", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsxs(Button, { variant: "outline", size: "lg", onClick: () => setLang(null), children: [_jsx(Globe, { className: "mr-2 h-5 w-5" }), " ", t("changeLanguage")] }), _jsxs("div", { children: [_jsx("h2", { className: "text-xl font-bold text-foreground", children: station.name }), _jsxs("p", { className: "text-sm text-muted-foreground", children: [pendingCount, " ", t("statusToPrint"), " \u00B7 ", printedCount, " ", t("statusPrinted")] })] })] }), _jsxs("div", { className: "flex items-center gap-2", children: [!online && (_jsxs(Badge, { className: "bg-destructive text-destructive-foreground", children: [_jsx(WifiOff, { className: "mr-1 h-3.5 w-3.5" }), " ", t("offline")] })), _jsx(Button, { variant: "outline", size: "icon", onClick: refresh, "aria-label": t("refresh"), children: _jsx(RefreshCw, { className: "h-4 w-4" }) }), _jsxs(Button, { size: "lg", className: "h-14 px-8 text-lg", onClick: () => (pending ? confirmPending() : fetchNext()), disabled: busyId !== null, children: [busyId !== null ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("printNext"), pending?.document_number ? ` · ${pending.document_number}` : ""] })] })] }), pending && (_jsx(Card, { className: "border-2 border-primary", children: _jsxs(CardContent, { className: "flex flex-wrap items-center justify-between gap-4 p-5", children: [_jsxs("div", { children: [_jsx("p", { className: "text-sm font-medium text-muted-foreground", children: t("confirmPrintTitle") }), _jsx("p", { className: "text-2xl font-bold text-foreground", children: pending.document_number ?? t("document") }), _jsx("p", { className: "text-sm text-muted-foreground", children: [pending.order_number, pending.customer_name].filter(Boolean).join(" · ") })] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", size: "lg", onClick: cancelPending, disabled: busyId !== null, children: t("cancel") }), _jsxs(Button, { size: "lg", className: "h-14 px-8 text-lg", onClick: confirmPending, disabled: busyId !== null, children: [busyId === "confirm" ? (_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" })) : (_jsx(Printer, { className: "mr-2 h-5 w-5" })), t("print")] })] })] }) })), tracked && (_jsx(Card, { className: jobFailed ? "border-2 border-destructive" : "border-2 border-primary/40", children: _jsxs(CardContent, { className: "flex flex-wrap items-center justify-between gap-4 p-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [jobFailed ? (_jsx(AlertTriangle, { className: "h-6 w-6 text-destructive" })) : jobStatus === "voltooid" ? (_jsx(CheckCircle2, { className: "h-6 w-6 text-primary" })) : (_jsx(Loader2, { className: "h-6 w-6 animate-spin text-muted-foreground" })), _jsxs("div", { children: [_jsxs("p", { className: "text-sm font-medium text-muted-foreground", children: [jobTexts.jobTitle, " ", tracked.documentNumber ? `· ${tracked.documentNumber}` : ""] }), _jsx("p", { className: "text-lg font-semibold text-foreground", children: printJobStatusLabel(jobStatus, t.lang) }), tracked.job?.printer_naam && (_jsxs("p", { className: "text-sm text-muted-foreground", children: [jobTexts.printerLabel, ": ", tracked.job.printer_naam] })), jobFailed && (_jsxs("p", { className: "text-sm text-destructive", children: [tracked.job?.foutmelding ?? jobTexts.unknown, " \u00B7 ", jobTexts.requeued] }))] })] }), _jsxs("div", { className: "flex gap-2", children: [jobFailed && lastPrinted && (_jsxs(Button, { size: "lg", onClick: () => {
+                                        clearJob();
+                                        void handlePick(lastPrinted);
+                                    }, disabled: busyId !== null, children: [_jsx(Printer, { className: "mr-2 h-5 w-5" }), " ", jobTexts.retry] })), _jsx(Button, { variant: "outline", size: "lg", onClick: clearJob, children: jobTexts.close })] })] }) })), _jsx(Card, { children: _jsx(CardContent, { className: "flex flex-wrap items-center gap-3 p-4", children: _jsxs("div", { className: "relative min-w-64 flex-1", children: [_jsx(Search, { className: "absolute left-3 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { className: "pl-9", placeholder: t("search"), value: filters.search, onChange: (e) => setFilters((f) => ({ ...f, search: e.target.value, page: 0 })) })] }) }) }), loading ? (_jsxs("div", { className: "flex items-center justify-center py-16 text-muted-foreground", children: [_jsx(Loader2, { className: "mr-2 h-5 w-5 animate-spin" }), " ", t("loadingQueue")] })) : (_jsx(QueueTable, { items: items, lockedIds: lockedIds, statuses: Array.isArray(statuses) ? statuses : [], documentTypes: Array.isArray(documentTypes) ? documentTypes : [], busyId: busyId, onPick: handlePick, onReprint: handleReprint, t: t })), _jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("span", { className: "text-sm text-muted-foreground", children: [t("page"), " ", filters.page + 1, " ", t("of"), " ", totalPages] }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Button, { variant: "outline", disabled: filters.page === 0, onClick: () => setFilters((f) => ({ ...f, page: Math.max(0, f.page - 1) })), children: t("previous") }), _jsx(Button, { variant: "outline", disabled: filters.page + 1 >= totalPages, onClick: () => setFilters((f) => ({ ...f, page: f.page + 1 })), children: t("next") })] })] })] }));
 }

package/dist-lib/hooks/usePrintJob.d.ts

@@ -0,0 +1,22 @@
+import type { PickPrintJob } from "../lib/pickTypes";
+export interface TrackedPrintJob {
+    jobId: string;
+    queueItemId: string;
+    documentNumber: string | null;
+    job: PickPrintJob | null;
+}
+/**
+ * Volgt de printopdracht die pick_complete_print heeft weggeschreven. De module
+ * print zelf niets: de Layout maker werkt print_jobs bij, hier wordt alleen de
+ * status gelezen (realtime + korte poll als terugval).
+ */
+export declare function usePrintJob(): {
+    tracked: TrackedPrintJob | null;
+    track: (args: {
+        jobId: string;
+        queueItemId: string;
+        documentNumber: string | null;
+    }) => void;
+    clear: () => void;
+};
+//# sourceMappingURL=usePrintJob.d.ts.map

package/dist-lib/hooks/usePrintJob.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePrintJob.d.ts","sourceRoot":"","sources":["../../src/hooks/usePrintJob.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,kBAAkB,CAAC;AAErD,MAAM,WAAW,eAAe;IAC9B,KAAK,EAAE,MAAM,CAAC;IACd,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,GAAG,EAAE,YAAY,GAAG,IAAI,CAAC;CAC1B;AAED;;;;GAIG;AACH,wBAAgB,WAAW;;kBAKhB;QAAE,KAAK,EAAE,MAAM,CAAC;QAAC,WAAW,EAAE,MAAM,CAAC;QAAC,cAAc,EAAE,MAAM,GAAG,IAAI,CAAA;KAAE;;EAgD/E"}

package/dist-lib/hooks/usePrintJob.js

@@ -0,0 +1,48 @@
+import { useCallback, useEffect, useRef, useState } from "react";
+import { pickApi, pickDb } from "../lib/pickApi";
+/**
+ * Volgt de printopdracht die pick_complete_print heeft weggeschreven. De module
+ * print zelf niets: de Layout maker werkt print_jobs bij, hier wordt alleen de
+ * status gelezen (realtime + korte poll als terugval).
+ */
+export function usePrintJob() {
+    const [tracked, setTracked] = useState(null);
+    const jobIdRef = useRef(null);
+    const track = useCallback((args) => {
+        jobIdRef.current = args.jobId;
+        setTracked({ ...args, job: null });
+    }, []);
+    const clear = useCallback(() => {
+        jobIdRef.current = null;
+        setTracked(null);
+    }, []);
+    const jobId = tracked?.jobId ?? null;
+    useEffect(() => {
+        if (!jobId)
+            return;
+        let stopped = false;
+        const read = async () => {
+            try {
+                const job = await pickApi.printJobStatus(jobId);
+                if (stopped || jobIdRef.current !== jobId)
+                    return;
+                setTracked((prev) => (prev && prev.jobId === jobId ? { ...prev, job } : prev));
+            }
+            catch {
+                // status tijdelijk niet leesbaar; volgende poging volgt
+            }
+        };
+        void read();
+        const timer = window.setInterval(read, 2000);
+        const channel = pickDb
+            .channel(`print_job_${jobId}`)
+            .on("postgres_changes", { event: "*", schema: "public", table: "print_jobs", filter: `id=eq.${jobId}` }, () => void read())
+            .subscribe();
+        return () => {
+            stopped = true;
+            window.clearInterval(timer);
+            pickDb.removeChannel(channel);
+        };
+    }, [jobId]);
+    return { tracked, track, clear };
+}