@payloadcms/ui 3.32.0-canary.2 → 3.32.0-internal.9f46ea6

package/dist/hooks/useQueues.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useQueues.d.ts","sourceRoot":"","sources":["../../src/hooks/useQueues.ts"],"names":[],"mappings":"AAEA,wBAAgB,SAAS,IAAI;IAC3B,SAAS,EAAE,CAAC,EAAE,EAAE,CAAC,MAAM,EAAE,WAAW,KAAK,OAAO,CAAC,IAAI,CAAC,KAAK,IAAI,CAAA;CAChE,CA2CA"}
+{"version":3,"file":"useQueues.d.ts","sourceRoot":"","sources":["../../src/hooks/useQueues.ts"],"names":[],"mappings":"AAEA,KAAK,UAAU,GAAG;IAChB,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAChC,EAAE,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAA;IAC9B,QAAQ,CAAC,EAAE,WAAW,CAAC,UAAU,CAAC,CAAA;CACnC,CAAA;AAED,KAAK,WAAW,GAAG;IACjB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,IAAI,CAAA;IACzB;;;;OAIG;IACH,aAAa,CAAC,EAAE,MAAM,OAAO,CAAA;IAC7B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAA;IACjB;;;;OAIG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAA;CACnB,CAAA;AAED,KAAK,SAAS,GAAG,CAAC,EAAE,EAAE,UAAU,CAAC,IAAI,CAAC,EAAE,OAAO,CAAC,EAAE,WAAW,KAAK,IAAI,CAAA;AAEtE;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,SAAS,IAAI;IAC3B,SAAS,EAAE,SAAS,CAAA;CACrB,CA0DA"}

package/dist/hooks/useQueues.js

@@ -1,40 +1,64 @@
 import { useCallback, useRef } from 'react';
+/**
+ * A React hook that allows you to queue up functions to be executed in order.
+ * This is useful when you need to ensure long running networks requests are processed sequentially.
+ * Builds up a "queue" of functions to be executed in order, only ever processing the last function in the queue.
+ * This ensures that a long queue of tasks doesn't cause a backlog of tasks to be processed.
+ * E.g. if you queue a task and it begins running, then you queue 9 more tasks:
+ *   1. The currently task will finish
+ *   2. The next task in the queue will run
+ *   3. All remaining tasks will be discarded
+ * @returns {queueTask} A function used to queue a function.
+ * @example
+ * const { queueTask } = useQueues()
+ * queueTask(async () => {
+ *   await fetch('https://api.example.com')
+ * })
+ */
 export function useQueues() {
-  const runningTaskRef = useRef(null);
-  const queuedTask = useRef(null);
-  const abortControllerRef = useRef(null);
-  const queueTask = useCallback(fn => {
-    // Overwrite the queued task every time a new one arrives
-    queuedTask.current = fn;
-    // If a task is already running, abort it and return
-    if (runningTaskRef.current !== null) {
-      if (abortControllerRef.current) {
-        abortControllerRef.current.abort();
+  const queue = useRef([]);
+  const isProcessing = useRef(false);
+  const queueTask = useCallback((fn, options) => {
+    queue.current.push({
+      discard: options?.discard,
+      fn,
+      priority: options?.priority
+    });
+    async function processQueue() {
+      if (isProcessing.current) {
+        return;
       }
-      return;
-    }
-    const executeTask = async () => {
-      while (queuedTask.current) {
-        const taskToRun = queuedTask.current;
-        queuedTask.current = null // Reset latest task before running
-        ;
-        const controller = new AbortController();
-        abortControllerRef.current = controller;
+      // Allow the consumer to prevent the queue from processing under certain conditions
+      if (typeof options?.beforeProcess === 'function') {
+        const shouldContinue = options.beforeProcess();
+        if (shouldContinue === false) {
+          return;
+        }
+      }
+      while (queue.current.length > 0) {
+        // Only process the latest, prioritized task in the queue
+        const latestTask = queue.current.find(task => task.priority) || queue.current.pop();
+        // This task is about to run, so remove the discard option if it exists
+        if ('discard' in latestTask) {
+          latestTask.discard = undefined;
+        }
+        // Discard all other tasks that are not explicitly set to not be discarded
+        queue.current = queue.current.filter(task => task.discard === false);
+        isProcessing.current = true;
         try {
-          runningTaskRef.current = taskToRun(controller.signal);
-          await runningTaskRef.current // Wait for the task to complete
-          ;
+          await latestTask.fn();
         } catch (err) {
-          if (err.name !== 'AbortError') {
-            console.error('Error in queued function:', err) // eslint-disable-line no-console
-            ;
-          }
+          console.error('Error in queued function:', err) // eslint-disable-line no-console
+          ;
         } finally {
-          runningTaskRef.current = null;
+          isProcessing.current = false;
+          if (typeof options?.afterProcess === 'function') {
+            options.afterProcess();
+          }
         }
       }
-    };
-    void executeTask();
+    }
+    void processQueue();
   }, []);
   return {
     queueTask

package/dist/hooks/useQueues.js.map

@@ -1 +1 @@
-{"version":3,"file":"useQueues.js","names":["useCallback","useRef","useQueues","runningTaskRef","queuedTask","abortControllerRef","queueTask","fn","current","abort","executeTask","taskToRun","controller","AbortController","signal","err","name","console","error"],"sources":["../../src/hooks/useQueues.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\n\nexport function useQueues(): {\n  queueTask: (fn: (signal: AbortSignal) => Promise<void>) => void\n} {\n  const runningTaskRef = useRef<null | Promise<void>>(null)\n  const queuedTask = useRef<((signal: AbortSignal) => Promise<void>) | null>(null)\n  const abortControllerRef = useRef<AbortController | null>(null)\n\n  const queueTask = useCallback((fn: (signal: AbortSignal) => Promise<void>) => {\n    // Overwrite the queued task every time a new one arrives\n    queuedTask.current = fn\n\n    // If a task is already running, abort it and return\n    if (runningTaskRef.current !== null) {\n      if (abortControllerRef.current) {\n        abortControllerRef.current.abort()\n      }\n\n      return\n    }\n\n    const executeTask = async () => {\n      while (queuedTask.current) {\n        const taskToRun = queuedTask.current\n        queuedTask.current = null // Reset latest task before running\n\n        const controller = new AbortController()\n        abortControllerRef.current = controller\n\n        try {\n          runningTaskRef.current = taskToRun(controller.signal)\n          await runningTaskRef.current // Wait for the task to complete\n        } catch (err) {\n          if (err.name !== 'AbortError') {\n            console.error('Error in queued function:', err) // eslint-disable-line no-console\n          }\n        } finally {\n          runningTaskRef.current = null\n        }\n      }\n    }\n\n    void executeTask()\n  }, [])\n\n  return { queueTask }\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,MAAM,QAAQ;AAEpC,OAAO,SAASC,UAAA;EAGd,MAAMC,cAAA,GAAiBF,MAAA,CAA6B;EACpD,MAAMG,UAAA,GAAaH,MAAA,CAAwD;EAC3E,MAAMI,kBAAA,GAAqBJ,MAAA,CAA+B;EAE1D,MAAMK,SAAA,GAAYN,WAAA,CAAaO,EAAA;IAC7B;IACAH,UAAA,CAAWI,OAAO,GAAGD,EAAA;IAErB;IACA,IAAIJ,cAAA,CAAeK,OAAO,KAAK,MAAM;MACnC,IAAIH,kBAAA,CAAmBG,OAAO,EAAE;QAC9BH,kBAAA,CAAmBG,OAAO,CAACC,KAAK;MAClC;MAEA;IACF;IAEA,MAAMC,WAAA,GAAc,MAAAA,CAAA;MAClB,OAAON,UAAA,CAAWI,OAAO,EAAE;QACzB,MAAMG,SAAA,GAAYP,UAAA,CAAWI,OAAO;QACpCJ,UAAA,CAAWI,OAAO,GAAG,KAAK;QAAA;QAE1B,MAAMI,UAAA,GAAa,IAAIC,eAAA;QACvBR,kBAAA,CAAmBG,OAAO,GAAGI,UAAA;QAE7B,IAAI;UACFT,cAAA,CAAeK,OAAO,GAAGG,SAAA,CAAUC,UAAA,CAAWE,MAAM;UACpD,MAAMX,cAAA,CAAeK,OAAO,CAAC;UAAA;QAC/B,EAAE,OAAOO,GAAA,EAAK;UACZ,IAAIA,GAAA,CAAIC,IAAI,KAAK,cAAc;YAC7BC,OAAA,CAAQC,KAAK,CAAC,6BAA6BH,GAAA,EAAK;YAAA;UAClD;QACF,UAAU;UACRZ,cAAA,CAAeK,OAAO,GAAG;QAC3B;MACF;IACF;IAEA,KAAKE,WAAA;EACP,GAAG,EAAE;EAEL,OAAO;IAAEJ;EAAU;AACrB","ignoreList":[]}
+{"version":3,"file":"useQueues.js","names":["useCallback","useRef","useQueues","queue","isProcessing","queueTask","fn","options","current","push","discard","priority","processQueue","beforeProcess","shouldContinue","length","latestTask","find","task","pop","undefined","filter","err","console","error","afterProcess"],"sources":["../../src/hooks/useQueues.ts"],"sourcesContent":["import { useCallback, useRef } from 'react'\n\ntype QueuedTask = {\n  discard?: TaskOptions['discard']\n  fn: () => Promise<void> | void\n  priority?: TaskOptions['priority']\n}\n\ntype TaskOptions = {\n  /**\n   * A function that is called after the queue has processed a function\n   * Used to perform side effects after processing the queue\n   * @returns {void}\n   */\n  afterProcess?: () => void\n  /**\n   * A function that can be used to prevent the queue from processing under certain conditions\n   * Can also be used to perform side effects before processing the queue\n   * @returns {boolean} If `false`, the queue will not process\n   */\n  beforeProcess?: () => boolean\n  /**\n   * All tasks that except the last task in the queue will be discarded to prevent a backlog.\n   * To ensure a task is not discarded, set the `discard` option to `false`\n   * @default undefined\n   */\n  discard?: boolean\n  /**\n   * Priority tasks will be processed before non-priority tasks\n   * This is helpful to ensure a task added later in the queue is processed first\n   * @default false\n   */\n  priority?: boolean\n}\n\ntype QueueTask = (fn: QueuedTask['fn'], options?: TaskOptions) => void\n\n/**\n * A React hook that allows you to queue up functions to be executed in order.\n * This is useful when you need to ensure long running networks requests are processed sequentially.\n * Builds up a \"queue\" of functions to be executed in order, only ever processing the last function in the queue.\n * This ensures that a long queue of tasks doesn't cause a backlog of tasks to be processed.\n * E.g. if you queue a task and it begins running, then you queue 9 more tasks:\n *   1. The currently task will finish\n *   2. The next task in the queue will run\n *   3. All remaining tasks will be discarded\n * @returns {queueTask} A function used to queue a function.\n * @example\n * const { queueTask } = useQueues()\n * queueTask(async () => {\n *   await fetch('https://api.example.com')\n * })\n */\nexport function useQueues(): {\n  queueTask: QueueTask\n} {\n  const queue = useRef<QueuedTask[]>([])\n\n  const isProcessing = useRef(false)\n\n  const queueTask = useCallback<QueueTask>((fn, options) => {\n    queue.current.push({\n      discard: options?.discard,\n      fn,\n      priority: options?.priority,\n    })\n\n    async function processQueue() {\n      if (isProcessing.current) {\n        return\n      }\n\n      // Allow the consumer to prevent the queue from processing under certain conditions\n      if (typeof options?.beforeProcess === 'function') {\n        const shouldContinue = options.beforeProcess()\n\n        if (shouldContinue === false) {\n          return\n        }\n      }\n\n      while (queue.current.length > 0) {\n        // Only process the latest, prioritized task in the queue\n        const latestTask = queue.current.find((task) => task.priority) || queue.current.pop()\n\n        // This task is about to run, so remove the discard option if it exists\n        if ('discard' in latestTask) {\n          latestTask.discard = undefined\n        }\n\n        // Discard all other tasks that are not explicitly set to not be discarded\n        queue.current = queue.current.filter((task) => task.discard === false)\n\n        isProcessing.current = true\n\n        try {\n          await latestTask.fn()\n        } catch (err) {\n          console.error('Error in queued function:', err) // eslint-disable-line no-console\n        } finally {\n          isProcessing.current = false\n\n          if (typeof options?.afterProcess === 'function') {\n            options.afterProcess()\n          }\n        }\n      }\n    }\n\n    void processQueue()\n  }, [])\n\n  return { queueTask }\n}\n"],"mappings":"AAAA,SAASA,WAAW,EAAEC,MAAM,QAAQ;AAqCpC;;;;;;;;;;;;;;;;AAgBA,OAAO,SAASC,UAAA;EAGd,MAAMC,KAAA,GAAQF,MAAA,CAAqB,EAAE;EAErC,MAAMG,YAAA,GAAeH,MAAA,CAAO;EAE5B,MAAMI,SAAA,GAAYL,WAAA,CAAuB,CAACM,EAAA,EAAIC,OAAA;IAC5CJ,KAAA,CAAMK,OAAO,CAACC,IAAI,CAAC;MACjBC,OAAA,EAASH,OAAA,EAASG,OAAA;MAClBJ,EAAA;MACAK,QAAA,EAAUJ,OAAA,EAASI;IACrB;IAEA,eAAeC,aAAA;MACb,IAAIR,YAAA,CAAaI,OAAO,EAAE;QACxB;MACF;MAEA;MACA,IAAI,OAAOD,OAAA,EAASM,aAAA,KAAkB,YAAY;QAChD,MAAMC,cAAA,GAAiBP,OAAA,CAAQM,aAAa;QAE5C,IAAIC,cAAA,KAAmB,OAAO;UAC5B;QACF;MACF;MAEA,OAAOX,KAAA,CAAMK,OAAO,CAACO,MAAM,GAAG,GAAG;QAC/B;QACA,MAAMC,UAAA,GAAab,KAAA,CAAMK,OAAO,CAACS,IAAI,CAAEC,IAAA,IAASA,IAAA,CAAKP,QAAQ,KAAKR,KAAA,CAAMK,OAAO,CAACW,GAAG;QAEnF;QACA,IAAI,aAAaH,UAAA,EAAY;UAC3BA,UAAA,CAAWN,OAAO,GAAGU,SAAA;QACvB;QAEA;QACAjB,KAAA,CAAMK,OAAO,GAAGL,KAAA,CAAMK,OAAO,CAACa,MAAM,CAAEH,IAAA,IAASA,IAAA,CAAKR,OAAO,KAAK;QAEhEN,YAAA,CAAaI,OAAO,GAAG;QAEvB,IAAI;UACF,MAAMQ,UAAA,CAAWV,EAAE;QACrB,EAAE,OAAOgB,GAAA,EAAK;UACZC,OAAA,CAAQC,KAAK,CAAC,6BAA6BF,GAAA,EAAK;UAAA;QAClD,UAAU;UACRlB,YAAA,CAAaI,OAAO,GAAG;UAEvB,IAAI,OAAOD,OAAA,EAASkB,YAAA,KAAiB,YAAY;YAC/ClB,OAAA,CAAQkB,YAAY;UACtB;QACF;MACF;IACF;IAEA,KAAKb,YAAA;EACP,GAAG,EAAE;EAEL,OAAO;IAAEP;EAAU;AACrB","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@payloadcms/ui",
-  "version": "3.32.0-canary.2",
+  "version": "3.32.0-internal.9f46ea6",
   "homepage": "https://payloadcms.com",
   "repository": {
     "type": "git",
@@ -132,7 +132,7 @@
     "ts-essentials": "10.0.3",
     "use-context-selector": "2.0.0",
     "uuid": "10.0.0",
-    "@payloadcms/translations": "3.32.0-canary.2"
+    "@payloadcms/translations": "3.32.0-internal.9f46ea6"
   },
   "devDependencies": {
     "@babel/cli": "7.26.4",
@@ -149,13 +149,13 @@
     "esbuild-sass-plugin": "3.3.1",
     "eslint-plugin-react-compiler": "19.0.0-beta-714736e-20250131",
     "@payloadcms/eslint-config": "3.28.0",
-    "payload": "3.32.0-canary.2"
+    "payload": "3.32.0-internal.9f46ea6"
   },
   "peerDependencies": {
     "next": "^15.2.3",
     "react": "^19.0.0 || ^19.0.0-rc-65a56d0e-20241020",
     "react-dom": "^19.0.0 || ^19.0.0-rc-65a56d0e-20241020",
-    "payload": "3.32.0-canary.2"
+    "payload": "3.32.0-internal.9f46ea6"
   },
   "engines": {
     "node": "^18.20.2 || >=20.9.0"