@trackunit/react-graphql-hooks 1.3.164 → 1.3.165

package/index.cjs.js

@@ -136,7 +136,8 @@ const unionEdgesByNodeKey = (key, previousEdges, newEdges) => {
 const usePaginationQuery = (document, { ...props }) => {
     const [lastFetchedData, setLastFetchedData] = react.useState();
     const [resetTrigger, setResetTrigger] = react.useState(0);
-    const [abortController] = react.useState(new AbortController());
+    const [abortController, setAbortController] = react.useState(new AbortController());
+    const [lastAbortController, setLastAbortController] = react.useState(undefined);
     // Makes **sure** query variables are stable.
     // Before, it required variables to always be memorized in the parent which was easy to forget and confusing.
     // Maybe better solution exists but this is the best I could come up with without changing to much.
@@ -149,7 +150,16 @@ const usePaginationQuery = (document, { ...props }) => {
         if (!isEqual(props.variables, variablesRef.current)) {
             variablesRef.current = props.variables;
             setStableVariables(props.variables);
+            if (!props.skip) {
+                if (lastAbortController) {
+                    lastAbortController.abort();
+                }
+                const newAbortController = new AbortController();
+                setLastAbortController(newAbortController);
+                setAbortController(newAbortController);
+            }
         }
+        // eslint-disable-next-line
     }, [props.variables]);
     const internalProps = react.useMemo(() => {
         return {

package/index.esm.js

@@ -115,7 +115,8 @@ const unionEdgesByNodeKey = (key, previousEdges, newEdges) => {
 const usePaginationQuery = (document, { ...props }) => {
     const [lastFetchedData, setLastFetchedData] = useState();
     const [resetTrigger, setResetTrigger] = useState(0);
-    const [abortController] = useState(new AbortController());
+    const [abortController, setAbortController] = useState(new AbortController());
+    const [lastAbortController, setLastAbortController] = useState(undefined);
     // Makes **sure** query variables are stable.
     // Before, it required variables to always be memorized in the parent which was easy to forget and confusing.
     // Maybe better solution exists but this is the best I could come up with without changing to much.
@@ -128,7 +129,16 @@ const usePaginationQuery = (document, { ...props }) => {
         if (!isEqual(props.variables, variablesRef.current)) {
             variablesRef.current = props.variables;
             setStableVariables(props.variables);
+            if (!props.skip) {
+                if (lastAbortController) {
+                    lastAbortController.abort();
+                }
+                const newAbortController = new AbortController();
+                setLastAbortController(newAbortController);
+                setAbortController(newAbortController);
+            }
         }
+        // eslint-disable-next-line
     }, [props.variables]);
     const internalProps = useMemo(() => {
         return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-graphql-hooks",
-  "version": "1.3.164",
+  "version": "1.3.165",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -10,7 +10,7 @@
     "@apollo/client": "3.13.8",
     "react": "19.0.0",
     "lodash": "4.17.21",
-    "@trackunit/i18n-library-translation": "1.3.160",
+    "@trackunit/i18n-library-translation": "1.3.161",
     "@trackunit/shared-utils": "1.5.141",
     "@trackunit/react-table-pagination": "1.3.141",
     "@trackunit/react-test-setup": "1.0.31"