@flowselections/pick-schermen-kwekers 1.0.10 → 1.0.12

package/dist-lib/hooks/usePickQueue.js

@@ -7,6 +7,7 @@ export const defaultFilters = {
     search: "",
     documentTypeId: null,
     urgentOnly: false,
+    onlyPending: false,
     page: 0,
     pageSize: 25,
     sortRules: [],
@@ -56,7 +57,7 @@ export function usePickQueue(args) {
             search: filters.search.trim() || undefined,
             documentTypeId: filters.documentTypeId,
             urgentOnly: filters.urgentOnly,
-            includeDone: true,
+            includeDone: !filters.onlyPending,
             pickDay,
             sortRules: filters.sortRules,
             page: filters.page,
@@ -68,27 +69,55 @@ export function usePickQueue(args) {
         enabled: enabled && !pickDayQuery.isLoading,
         queryFn: () => pickApi.dayCounts({ stationId, screenId, pickDay }),
     });
+    // Locks komen primair via realtime binnen; deze poll is alleen terugval.
     const locksQuery = useQuery({
         queryKey: ["pick", "locks", stationId ?? "-"],
         enabled,
         queryFn: () => pickApi.locks(stationId),
-        refetchInterval: 5000,
+        refetchInterval: 20000,
     });
-    const invalidate = useCallback(() => {
+    const invalidateNow = useCallback(() => {
         queryClient.invalidateQueries({ queryKey: ["pick", "queue"] });
         queryClient.invalidateQueries({ queryKey: ["pick", "locks"] });
         queryClient.invalidateQueries({ queryKey: ["pick", "dayCounts"] });
         queryClient.invalidateQueries({ queryKey: ["pick", "countryCounts"] });
         queryClient.invalidateQueries({ queryKey: ["pick", "dashboard"] });
     }, [queryClient]);
+    /**
+     * Realtime-meldingen komen bij een Engine-sync in tientallen tegelijk binnen.
+     * Samenvoegen tot één herlaadslag houdt het scherm rustig en snel.
+     */
+    const debounceTimer = useRef(null);
+    const invalidate = useCallback(() => {
+        if (debounceTimer.current)
+            clearTimeout(debounceTimer.current);
+        debounceTimer.current = setTimeout(() => {
+            debounceTimer.current = null;
+            invalidateNow();
+        }, 400);
+    }, [invalidateNow]);
+    useEffect(() => () => {
+        if (debounceTimer.current)
+            clearTimeout(debounceTimer.current);
+    }, []);
+    const [realtimeOk, setRealtimeOk] = useState(true);
     useEffect(() => {
         if (!enabled)
             return;
+        // Alleen meldingen van dit station: andere stations mogen dit scherm niet belasten.
+        const queueFilter = stationId
+            ? { event: "*", schema: "public", table: "pick_queue", filter: `station_id=eq.${stationId}` }
+            : { event: "*", schema: "public", table: "pick_queue" };
+        const lockFilter = stationId
+            ? { event: "*", schema: "public", table: "pick_queue_locks", filter: `station_id=eq.${stationId}` }
+            : { event: "*", schema: "public", table: "pick_queue_locks" };
         const channel = pickDb
             .channel(`pick-queue-${stationId ?? "all"}`)
-            .on("postgres_changes", { event: "*", schema: "public", table: "pick_queue" }, invalidate)
-            .on("postgres_changes", { event: "*", schema: "public", table: "pick_queue_locks" }, invalidate)
-            .subscribe();
+            .on("postgres_changes", queueFilter, invalidate)
+            .on("postgres_changes", lockFilter, invalidate)
+            .subscribe((status) => {
+            setRealtimeOk(status === "SUBSCRIBED");
+        });
         return () => {
             pickDb.removeChannel(channel);
         };
@@ -100,10 +129,12 @@ export function usePickQueue(args) {
         pickDay,
         pendingCount: countsQuery.data?.pending ?? 0,
         printedCount: countsQuery.data?.printed ?? 0,
+        urgentCount: countsQuery.data?.urgent ?? 0,
         loading: queueQuery.isLoading,
         error: queueQuery.error instanceof Error ? queueQuery.error.message : null,
         lockedIds,
-        refresh: invalidate,
+        realtimeOk,
+        refresh: invalidateNow,
     };
 }
 /** Houdt bij dat dit scherm online is en ruimt verlopen locks op. */

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

@@ -1 +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"}
+{"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;;EA2D/E"}

package/dist-lib/hooks/usePrintJob.js

@@ -21,26 +21,37 @@ export function usePrintJob() {
         if (!jobId)
             return;
         let stopped = false;
+        let timer = null;
+        const stopPolling = () => {
+            if (timer !== null) {
+                window.clearInterval(timer);
+                timer = null;
+            }
+        };
         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));
+                // Eindstatus bereikt: niet meer blijven pollen.
+                if (job && ["voltooid", "mislukt", "geannuleerd"].includes(job.status))
+                    stopPolling();
             }
             catch {
                 // status tijdelijk niet leesbaar; volgende poging volgt
             }
         };
         void read();
-        const timer = window.setInterval(read, 2000);
+        // Realtime is de bron; de poll is alleen terugval als er niets binnenkomt.
+        timer = window.setInterval(read, 10000);
         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);
+            stopPolling();
             pickDb.removeChannel(channel);
         };
     }, [jobId]);