fix: wrap-set-stake-refetch-in-retriable-function

Author: Harman-singh-waraich

web/package.json

@@ -118,6 +118,6 @@
     "react-use": "^17.5.1",
     "styled-components": "^5.3.3",
     "viem": "^2.21.54",
-    "wagmi": "^2.13.4"
+    "wagmi": "^2.13.5"
   }
 }

web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawButton.tsx

@@ -104,8 +104,7 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, ac
     error: allowanceError,
   } = useSimulatePnkIncreaseAllowance({
     query: {
-      enabled:
-        isAllowance && !isUndefined(targetStake) && !isUndefined(allowance) && !isUndefined(balance) && !isPopupOpen,
+      enabled: isAllowance && !isUndefined(targetStake) && !isUndefined(allowance) && !isUndefined(balance),
     },
     args: [klerosCoreAddress[DEFAULT_CHAIN], BigInt(targetStake ?? 0) - BigInt(allowance ?? 0)],
   });
@@ -214,10 +213,10 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, ac
               const status = res.status === "success";
               if (status) {
                 await refetchAllowance();
-                const refetchData = await refetchSetStake();
+                const refetchData = await refetchWithRetry(refetchSetStake);
                 // check for a relatively new error with react/tanstack-query:
                 // https://github.com/TanStack/query/issues/8209
-                if (!refetchData.data)
+                if (!refetchData?.data)
                   setPopupStepsState(
                     getStakeSteps(
                       StakeSteps.ApproveFailed,
@@ -228,8 +227,9 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, ac
                       new Error("Something went wrong. Please restart the process.")
                     )
                   );
-
-                handleStake(refetchData.data, hash);
+                else {
+                  handleStake(refetchData.data, hash);
+                }
               } else setPopupStepsState(getStakeSteps(StakeSteps.ApproveFailed, amount, theme, hash));
             });
         })
@@ -308,4 +308,29 @@ const StakeWithdrawButton: React.FC<IActionButton> = ({ amount, parsedAmount, ac
   );
 };
 
+async function refetchWithRetry<T>(fn: () => Promise<T>, retryCount = 5, retryDelay = 2000) {
+  let attempts = 0;
+
+  while (attempts < retryCount) {
+    try {
+      const returnData = await fn();
+
+      //@ts-expect-error data does exist
+      if (returnData && returnData?.data !== undefined) {
+        return returnData;
+      }
+    } catch (error) {
+      console.error(`Attempt ${attempts + 1} failed with error:`, error);
+    }
+
+    attempts++;
+
+    if (attempts >= retryCount) {
+      return;
+    }
+
+    await new Promise((resolve) => setTimeout(resolve, retryDelay));
+  }
+  return;
+}
 export default StakeWithdrawButton;

web/src/pages/Courts/CourtDetails/StakePanel/StakeWithdrawPopup/index.tsx

@@ -73,7 +73,7 @@ const InnerContainer = styled.div`
   flex-direction: column;
   align-self: center;
   gap: 24px;
-  padding: 24px;
+  padding: 0 24px 24px;
 `;
 
 const StyledButton = styled(LightButton)`

yarn.lock

@@ -5259,7 +5259,7 @@ __metadata:
     vite-plugin-node-polyfills: "npm:^0.21.0"
     vite-plugin-svgr: "npm:^4.3.0"
     vite-tsconfig-paths: "npm:^4.3.2"
-    wagmi: "npm:^2.13.4"
+    wagmi: "npm:^2.13.5"
   languageName: unknown
   linkType: soft
 
@@ -35085,9 +35085,9 @@ __metadata:
   languageName: node
   linkType: hard
 
-"wagmi@npm:^2.13.4":
-  version: 2.13.4
-  resolution: "wagmi@npm:2.13.4"
+"wagmi@npm:^2.13.5":
+  version: 2.13.5
+  resolution: "wagmi@npm:2.13.5"
   dependencies:
     "@wagmi/connectors": "npm:5.5.3"
     "@wagmi/core": "npm:2.15.2"
@@ -35100,7 +35100,7 @@ __metadata:
   peerDependenciesMeta:
     typescript:
       optional: true
-  checksum: 10/e2ef7d7c822d65ea8a851dc8d22a2f707c98df5d63bb401d7e018d03eab008cc9e2c2bf13e04e383abe2822097430cd20cb08be2d7394989def4ec408eda3c6c
+  checksum: 10/e37a79d8413abbebc10935956a8ec6696f02894501b235ec580e8855735fe04fd392ada964616aff0bbbc30190d5cb1f5319a70b99000f6061a05a78f458edbb
   languageName: node
   linkType: hard