Enforce react-hooks/exhaustive-deps lint rule

.changeset/unlucky-horses-sort.md

@@ -0,0 +1,6 @@
+---
+"eslint-config-thirdweb": patch
+"@thirdweb-dev/react": patch
+---
+
+Enforce react-hooks/exhaustive-deps lint rule

packages/eslint-config-thirdweb/index.js

@@ -50,5 +50,8 @@ module.exports = {
         ],
       },
     ],
+
+    // react
+    "react-hooks/exhaustive-deps": "error",
   },
 };

packages/react/src/payments/components/CheckoutWithCard.tsx

@@ -97,7 +97,20 @@ export const CheckoutWithCard = ({
       options,
       configs,
     });
-  }, [CheckoutWithCardIframeContainerRef.current]);
+  }, [
+    appNameToUse,
+    clientId,
+    configs,
+    locale,
+    onBeforeModalOpen,
+    onCardDetailLoad,
+    onError,
+    onPaymentSuccess,
+    onPriceUpdate,
+    onReview,
+    options,
+    sdkClientSecret,
+  ]);
 
   return (
     <>

packages/react/src/payments/components/PaperCheckout.tsx

@@ -141,7 +141,7 @@ export const PaperCheckout = <T extends ContractType>({
     return () => {
       window.removeEventListener("message", handleMessage);
     };
-  }, []);
+  }, [onCloseCheckout, onPaymentSuccess, onTransferSuccess]);
 
   // Build iframe URL with query params.
   const checkoutUrl = new URL(`/checkout/${checkoutId}`, PAPER_APP_URL);

packages/react/src/payments/components/VerifyOwnershipWithPaper.tsx

@@ -84,7 +84,7 @@ export const VerifyOwnershipWithPaper: React.FC<
     return () => {
       window.removeEventListener("message", handleMessage);
     };
-  }, []);
+  }, [onError, onSuccess, onWindowClose]);
 
   const url = new URL("/sdk/v1/login-with-paper", PAPER_APP_URL);
   url.searchParams.append("chainName", chainNameToUse);

packages/react/src/payments/components/common/Modal.tsx

@@ -36,7 +36,7 @@ export const Modal: React.FC<{
     return () => {
       document.removeEventListener("keydown", keyDownHandler);
     };
-  }, []);
+  }, [escapeToClose, onClose]);
 
   const additionalDialogClasses = isFullScreen ? "" : dialogContainedClasses;
   const dialogPanelBg = isFullScreen ? "transparent" : bgColor;