Merge pull request #1489 from gabrielbazan7/ref/fee-msg

[REF] improve not enough funds/fee err msg
bitpay · Dec 6, 2024 · f3cd49b · f3cd49b
2 parents 19bb86e + 5617855
commit f3cd49b
Show file tree

Hide file tree

Showing 15 changed files with 286 additions and 154 deletions.
diff --git a/locales/en/translation.json b/locales/en/translation.json
@@ -1598,6 +1598,7 @@
   "Insufficient confirmed funds": "Insufficient confirmed funds",
   "You do not have enough confirmed funds to make this payment. Wait for your pending transactions to confirm or enable \"Use unconfirmed funds\" in Advanced Settings.": "You do not have enough confirmed funds to make this payment. Wait for your pending transactions to confirm or enable \"Use unconfirmed funds\" in Advanced Settings.",
   "Insufficient funds": "Insufficient funds",
+  "Insufficient funds in your linked wallet to cover the transaction fee.": "Insufficient funds in your linked {{linkedWalletAbbreviation}} wallet to cover the transaction fee.",
   "No compatible wallets": "No compatible wallets",
   "You currently don't have any wallets capable of sending this payment. Would you like to import one?": "You currently don't have any wallets capable of sending this payment. Would you like to import one?",
   "Maybe Later": "Maybe Later",

diff --git a/src/navigation/wallet/components/ErrorMessages.tsx b/src/navigation/wallet/components/ErrorMessages.tsx
@@ -4,6 +4,7 @@ import styled from 'styled-components/native';
 import {BaseText} from '../../../components/styled/Text';
 import {FlatList} from 'react-native';
 import {t} from 'i18next';
+import {RootStacks, navigationRef} from '../../../Root';
 
 interface BottomNotificationListType {
   key: number;
@@ -116,25 +117,31 @@ export const WrongPasswordError = (): BottomNotificationConfig => {
 export const CustomErrorMessage = ({
   errMsg,
   action = () => null,
+  cta,
   title,
 }: {
   errMsg: string;
   title?: string;
   action?: () => void;
+  cta?: [{text: string; action: () => void; primary: boolean}];
 }): BottomNotificationConfig => {
+  if (!cta) {
+    // set CTA with action if default
+    cta = [
+      {
+        text: t('OK'),
+        action,
+        primary: true,
+      },
+    ];
+  }
   return {
     type: 'error',
     title: title || t('Something went wrong'),
     message: errMsg,
     enableBackdropDismiss: true,
     onBackdropDismiss: action,
-    actions: [
-      {
-        text: t('OK'),
-        action,
-        primary: true,
-      },
-    ],
+    actions: cta,
   };
 };
 

diff --git a/src/navigation/wallet/screens/AccountDetails.tsx b/src/navigation/wallet/screens/AccountDetails.tsx
@@ -895,12 +895,6 @@ const AccountDetails: React.FC<AccountDetailsScreenProps> = ({route}) => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/GlobalSelect.tsx b/src/navigation/wallet/screens/GlobalSelect.tsx
@@ -983,6 +983,7 @@ const GlobalSelect: React.FC<GlobalSelectScreenProps | GlobalSelectProps> = ({
         dispatch(LogActions.error('[GlobalSelect] ' + errStr));
         if (setButtonState) {
           setButtonState('failed');
+          sleep(1000).then(() => setButtonState?.(null));
         } else {
           dispatch(dismissOnGoingProcessModal());
         }
@@ -994,16 +995,6 @@ const GlobalSelect: React.FC<GlobalSelectScreenProps | GlobalSelectProps> = ({
           showBottomNotificationModal({
             ...errorMessageConfig,
             enableBackdropDismiss: false,
-            actions: [
-              {
-                text: t('OK'),
-                action: () => {
-                  if (setButtonState) {
-                    setButtonState(undefined);
-                  }
-                },
-              },
-            ],
           }),
         );
       }

diff --git a/src/navigation/wallet/screens/SelectInputs.tsx b/src/navigation/wallet/screens/SelectInputs.tsx
@@ -362,12 +362,6 @@ const SelectInputs = () => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/SendToOptions.tsx b/src/navigation/wallet/screens/SendToOptions.tsx
@@ -250,12 +250,6 @@ const SendToOptions = () => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/TransactionDetails.tsx b/src/navigation/wallet/screens/TransactionDetails.tsx
@@ -412,12 +412,6 @@ const TransactionDetails = () => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/WalletDetails.tsx b/src/navigation/wallet/screens/WalletDetails.tsx
@@ -791,12 +791,6 @@ const WalletDetails: React.FC<WalletDetailsScreenProps> = ({route}) => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/send/confirm/BillConfirm.tsx b/src/navigation/wallet/screens/send/confirm/BillConfirm.tsx
@@ -276,15 +276,18 @@ const BillConfirm: React.VFC<
   const handleBillPayInvoiceOrTxpError = async (err: any) => {
     await sleep(400);
     dispatch(dismissOnGoingProcessModal());
+    const onDismiss = () => openWalletSelector(400);
     const [errorConfig] = await Promise.all([
-      dispatch(handleCreateTxProposalError(err)),
+      dispatch(handleCreateTxProposalError(err, onDismiss)),
       sleep(500),
     ]);
-    showError({
-      defaultErrorMessage:
-        err.response?.data?.message || err.message || errorConfig.message,
-      onDismiss: () => openWalletSelector(400),
-    });
+    dispatch(
+      AppActions.showBottomNotificationModal({
+        ...errorConfig,
+        errMsg:
+          err.response?.data?.message || err.message || errorConfig.message,
+      }),
+    );
   };
 
   const onCoinbaseAccountSelect = async (walletRowProps: WalletRowProps) => {

diff --git a/src/navigation/wallet/screens/send/confirm/Confirm.tsx b/src/navigation/wallet/screens/send/confirm/Confirm.tsx
@@ -384,12 +384,6 @@ const Confirm = () => {
         showBottomNotificationModal({
           ...errorMessageConfig,
           enableBackdropDismiss: false,
-          actions: [
-            {
-              text: t('OK'),
-              action: () => {},
-            },
-          ],
         }),
       );
     }

diff --git a/src/navigation/wallet/screens/send/confirm/GiftCardConfirm.tsx b/src/navigation/wallet/screens/send/confirm/GiftCardConfirm.tsx
@@ -1,7 +1,11 @@
 import Transport from '@ledgerhq/hw-transport';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {View} from 'react-native';
-import {useNavigation, useRoute} from '@react-navigation/native';
+import {
+  useNavigation,
+  useRoute,
+  useFocusEffect,
+} from '@react-navigation/native';
 import styled from 'styled-components/native';
 import {Hr} from '../../../../../components/styled/Containers';
 import {RouteProp, StackActions} from '@react-navigation/core';
@@ -323,20 +327,23 @@ const Confirm = () => {
   const handleCreateGiftCardInvoiceOrTxpError = async (err: any) => {
     await sleep(400);
     dispatch(dismissOnGoingProcessModal());
+    const onDismiss = () => {
+      if (err.message === GiftCardInvoiceCreationErrors.couponExpired) {
+        return popToShopHome();
+      }
+      return openWalletSelector(400);
+    };
     const [errorConfig] = await Promise.all([
-      dispatch(handleCreateTxProposalError(err)),
+      dispatch(handleCreateTxProposalError(err, onDismiss)),
       sleep(500),
     ]);
-    showError({
-      defaultErrorMessage:
-        err.response?.data?.message || err.message || errorConfig.message,
-      onDismiss: () => {
-        if (err.message === GiftCardInvoiceCreationErrors.couponExpired) {
-          return popToShopHome();
-        }
-        return openWalletSelector(400);
-      },
-    });
+    dispatch(
+      AppActions.showBottomNotificationModal({
+        ...errorConfig,
+        errMsg:
+          err.response?.data?.message || err.message || errorConfig.message,
+      }),
+    );
   };
 
   const onCoinbaseAccountSelect = async (walletRowProps: WalletRowProps) => {
@@ -626,9 +633,11 @@ const Confirm = () => {
     return () => clearTimeout(timer);
   }, [resetSwipeButton]);
 
-  useEffect(() => {
-    openWalletSelector(100);
-  }, []);
+  useFocusEffect(
+    useCallback(() => {
+      openWalletSelector(100);
+    }, []),
+  );
 
   return (
     <ConfirmContainer>

diff --git a/src/navigation/wallet/screens/send/confirm/PayProConfirm.tsx b/src/navigation/wallet/screens/send/confirm/PayProConfirm.tsx
@@ -1,6 +1,10 @@
 import Transport from '@ledgerhq/hw-transport';
 import {RouteProp, StackActions} from '@react-navigation/core';
-import {useNavigation, useRoute} from '@react-navigation/native';
+import {
+  useNavigation,
+  useRoute,
+  useFocusEffect,
+} from '@react-navigation/native';
 import React, {useCallback, useEffect, useMemo, useRef, useState} from 'react';
 import {useTranslation} from 'react-i18next';
 import {WalletScreens, WalletGroupParamList} from '../../../WalletGroup';
@@ -244,28 +248,29 @@ const PayProConfirm = () => {
     } catch (err: any) {
       await sleep(400);
       dispatch(dismissOnGoingProcessModal());
+      const onDismiss = () =>
+        wallet ? navigation.goBack() : reshowWalletSelector();
       const [errorConfig] = await Promise.all([
-        dispatch(handleCreateTxProposalError(err)),
+        dispatch(handleCreateTxProposalError(err, onDismiss)),
         sleep(500),
       ]);
       dispatch(
-        AppActions.showBottomNotificationModal(
-          CustomErrorMessage({
-            title: t('Error'),
-            errMsg:
-              err.response?.data?.message || err.message || errorConfig.message,
-            action: () =>
-              wallet ? navigation.goBack() : reshowWalletSelector(),
-          }),
-        ),
+        AppActions.showBottomNotificationModal({
+          ...errorConfig,
+          errMsg:
+            err.response?.data?.message || err.message || errorConfig.message,
+        }),
       );
     }
   };
 
-  useEffect(() => {
-    wallet ? createTxp(wallet) : setTimeout(() => openKeyWalletSelector(), 500);
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, []);
+  useFocusEffect(
+    useCallback(() => {
+      wallet
+        ? createTxp(wallet)
+        : setTimeout(() => openKeyWalletSelector(), 500);
+    }, []),
+  );
 
   const openKeyWalletSelector = () => {
     setWalletSelectorVisible(true);
@@ -274,19 +279,17 @@ const PayProConfirm = () => {
   const handleTxpError = async (err: any) => {
     await sleep(400);
     dispatch(dismissOnGoingProcessModal());
+    const onDismiss = () => reshowWalletSelector();
     const [errorConfig] = await Promise.all([
-      dispatch(handleCreateTxProposalError(err)),
+      dispatch(handleCreateTxProposalError(err, onDismiss)),
       sleep(500),
     ]);
     dispatch(
-      AppActions.showBottomNotificationModal(
-        CustomErrorMessage({
-          title: t('Error'),
-          errMsg:
-            err.response?.data?.message || err.message || errorConfig.message,
-          action: () => reshowWalletSelector(),
-        }),
-      ),
+      AppActions.showBottomNotificationModal({
+        ...errorConfig,
+        errMsg:
+          err.response?.data?.message || err.message || errorConfig.message,
+      }),
     );
   };
 

diff --git a/src/store/scan/scan.effects.ts b/src/store/scan/scan.effects.ts
@@ -561,6 +561,7 @@ const goToConfirm =
     } catch (err: any) {
       if (setButtonState) {
         setButtonState('failed');
+        sleep(1000).then(() => setButtonState?.(null));
       } else {
         dispatch(dismissOnGoingProcessModal());
       }
@@ -571,17 +572,6 @@ const goToConfirm =
       dispatch(
         showBottomNotificationModal({
           ...errorMessageConfig,
-          enableBackdropDismiss: false,
-          actions: [
-            {
-              text: 'OK',
-              action: () => {
-                if (setButtonState) {
-                  setButtonState(undefined);
-                }
-              },
-            },
-          ],
         }),
       );
     }