[NO CHANGELOG] [Add Funds Widget] Add funds wallet wallet connection …

…error handling (#2335)
immutable · Oct 22, 2024 · 7a8eea0 · 7a8eea0
1 parent adf97ff
commit 7a8eea0
Show file tree

Hide file tree

Showing 7 changed files with 46 additions and 12 deletions.
diff --git a/packages/checkout/widgets-lib/src/components/WalletDrawer/ConnectWalletDrawer.tsx b/packages/checkout/widgets-lib/src/components/WalletDrawer/ConnectWalletDrawer.tsx
@@ -188,19 +188,17 @@ export function ConnectWalletDrawer({
 
   const retrySelectedWallet = () => {
     if (prevWalletChangeEvent.current) {
-      handleOnWalletChangeEvent(prevWalletChangeEvent.current);
+      handleWalletConnection(prevWalletChangeEvent.current);
     }
   };
 
   const handleCloseChangedMindDrawer = () => {
-    setShowChangedMindDrawer(false);
     retrySelectedWallet();
+    setShowChangedMindDrawer(false);
   };
 
   const handleProceedEOA = () => {
-    if (prevWalletChangeEvent.current) {
-      handleWalletConnection(prevWalletChangeEvent.current);
-    }
+    retrySelectedWallet();
     setShowEOAWarningDrawer(false);
   };
 

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/AddFundsWidget.tsx b/packages/checkout/widgets-lib/src/widgets/add-funds/AddFundsWidget.tsx
@@ -96,9 +96,7 @@ export default function AddFundsWidget({
 
   const squidSdk = useSquid(checkout);
   const tokensResponse = useTokens(checkout);
-  const { showErrorHandover } = useError(
-    checkout.config.environment ?? Environment.SANDBOX,
-  );
+  const { showErrorHandover } = useError(checkout.config.environment);
 
   useEffect(() => {
     if (config.environment !== Environment.PRODUCTION) {

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/hooks/useError.tsx b/packages/checkout/widgets-lib/src/widgets/add-funds/hooks/useError.tsx
@@ -84,6 +84,23 @@ export const useError = (environment: Environment) => {
       secondaryButtonText: 'Close',
       onSecondaryButtonClick: closeWidget,
     },
+    [AddFundsErrorTypes.UNRECOGNISED_CHAIN]: {
+      headingText: 'Unrecognised chain',
+      subHeadingText: 'Please add the chain to your account and try again.',
+      primaryButtonText: 'Retry',
+      onPrimaryButtonClick: goBackToAddFundsView,
+      secondaryButtonText: 'Close',
+      onSecondaryButtonClick: closeWidget,
+    },
+    [AddFundsErrorTypes.PROVIDER_ERROR]: {
+      headingText: 'Wallet cannot be found',
+      subHeadingText:
+        'Please try to connect your wallet and try again.',
+      primaryButtonText: 'Retry',
+      onPrimaryButtonClick: goBackToAddFundsView,
+      secondaryButtonText: 'Close',
+      onSecondaryButtonClick: closeWidget,
+    },
     [AddFundsErrorTypes.WALLET_FAILED]: {
       headingText: 'Transaction failed',
       subHeadingText: 'The transaction failed. Please try again.',

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/hooks/useExecute.ts b/packages/checkout/widgets-lib/src/widgets/add-funds/hooks/useExecute.ts
@@ -39,6 +39,13 @@ export const useExecute = (environment: Environment) => {
       errorType = AddFundsErrorTypes.TRANSACTION_FAILED;
     }
 
+    if (
+      reason.includes('unrecognized chain')
+      || reason.includes('unrecognized chain')
+    ) {
+      errorType = AddFundsErrorTypes.UNRECOGNISED_CHAIN;
+    }
+
     const error: AddFundsError = {
       type: errorType,
       data: { error: err },

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/types.ts b/packages/checkout/widgets-lib/src/widgets/add-funds/types.ts
@@ -68,6 +68,8 @@ export enum AddFundsErrorTypes {
   INVALID_PARAMETERS = 'INVALID_PARAMETERS',
   SERVICE_BREAKDOWN = 'SERVICE_BREAKDOWN',
   TRANSACTION_FAILED = 'TRANSACTION_FAILED',
+  UNRECOGNISED_CHAIN = 'UNRECOGNISED_CHAIN',
+  PROVIDER_ERROR = 'PROVIDER_ERROR',
   WALLET_FAILED = 'WALLET_FAILED',
   WALLET_REJECTED = 'WALLET_REJECTED',
   WALLET_REJECTED_NO_FUNDS = 'WALLET_REJECTED_NO_FUNDS',

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/views/AddFunds.tsx b/packages/checkout/widgets-lib/src/widgets/add-funds/views/AddFunds.tsx
@@ -339,7 +339,7 @@ export function AddFunds({
           });
         }
       } catch (error) {
-        showErrorHandover(AddFundsErrorTypes.SERVICE_BREAKDOWN);
+        showErrorHandover(AddFundsErrorTypes.SERVICE_BREAKDOWN, { error });
       }
     };
 
@@ -360,7 +360,7 @@ export function AddFunds({
           setOnRampAllowedTokens(tokenResponse.tokens);
         }
       } catch (error) {
-        showErrorHandover(AddFundsErrorTypes.SERVICE_BREAKDOWN);
+        showErrorHandover(AddFundsErrorTypes.SERVICE_BREAKDOWN, { error });
       }
     };
     fetchOnRampTokens();

diff --git a/packages/checkout/widgets-lib/src/widgets/add-funds/views/Review.tsx b/packages/checkout/widgets-lib/src/widgets/add-funds/views/Review.tsx
@@ -32,7 +32,7 @@ import {
   AddFundsReviewData,
   AddFundsWidgetViews,
 } from '../../../context/view-context/AddFundsViewContextTypes';
-import { RiveStateMachineInput } from '../types';
+import { AddFundsErrorTypes, RiveStateMachineInput } from '../types';
 import { useExecute } from '../hooks/useExecute';
 import {
   ViewActions,
@@ -67,6 +67,7 @@ import {
 } from '../functions/getFormattedNumber';
 import { convertToNetworkChangeableProvider } from '../functions/convertToNetworkChangeableProvider';
 import { SquidFooter } from '../components/SquidFooter';
+import { useError } from '../hooks/useError';
 
 interface ReviewProps {
   data: AddFundsReviewData;
@@ -90,7 +91,9 @@ export function Review({
   onCloseButtonClick,
 }: ReviewProps) {
   const { viewDispatch } = useContext(ViewContext);
+
   const { track, page } = useAnalytics();
+
   const {
     addFundsState: { squid, chains, tokens },
   } = useContext(AddFundsContext);
@@ -110,6 +113,8 @@ export function Review({
     id: HandoverTarget.GLOBAL,
   });
 
+  const { showErrorHandover } = useError(checkout.config.environment);
+
   const {
     checkProviderChain,
     getAllowance,
@@ -242,7 +247,14 @@ export function Review({
       return;
     }
 
-    const currentFromAddress = await fromProvider.getSigner().getAddress();
+    let currentFromAddress = '';
+
+    try {
+      currentFromAddress = await fromProvider.getSigner().getAddress();
+    } catch (error) {
+      showErrorHandover(AddFundsErrorTypes.PROVIDER_ERROR, { error });
+      return;
+    }
 
     if (currentFromAddress !== fromAddress) {
       setShowAddressMissmatchDrawer(true);