fix: useCallback to define retryCsrfRequest to avoid infinite loop (#…

…2259)
regen-network · Jan 11, 2024 · 8e84d3e · 8e84d3e
1 parent d9879cf
commit 8e84d3e
Showing 1 changed file with 10 additions and 6 deletions.
diff --git a/web-marketplace/src/lib/errors/hooks/useRetryCsrfRequest.tsx b/web-marketplace/src/lib/errors/hooks/useRetryCsrfRequest.tsx
@@ -1,3 +1,4 @@
+import { useCallback } from 'react';
 import { useQueryClient } from '@tanstack/react-query';
 import { useSetAtom } from 'jotai';
 
@@ -8,12 +9,15 @@ export const useRetryCsrfRequest = () => {
   const reactQueryClient = useQueryClient();
   const addFailedFunction = useSetAtom(failedFunctionsWriteAtom);
 
-  const retryCsrfRequest = async (failedFunction: FailedFnType) => {
-    await reactQueryClient.invalidateQueries({
-      queryKey: [GET_CSRF_QUERY_KEY],
-    });
-    addFailedFunction(failedFunction);
-  };
+  const retryCsrfRequest = useCallback(
+    async (failedFunction: FailedFnType) => {
+      await reactQueryClient.invalidateQueries({
+        queryKey: [GET_CSRF_QUERY_KEY],
+      });
+      addFailedFunction(failedFunction);
+    },
+    [addFailedFunction, reactQueryClient],
+  );
 
   return retryCsrfRequest;
 };