From e1b12279abab994222fe739ccc6b8d6e6f17ac30 Mon Sep 17 00:00:00 2001
From: Daniel <80175477+dan437@users.noreply.github.com>
Date: Thu, 25 May 2023 19:30:10 +0200
Subject: [PATCH] Show the right "balance needed" value if we fallback from STX
 to regular Swaps (#19230)

* Show the right balance needed value if we fallback from STX to regular Swaps
* Fix usage of StxErrorTypes
---
 ui/ducks/swaps/swaps.js                 |  8 ++++----
 ui/pages/swaps/view-quote/view-quote.js | 18 ++++++++----------
 2 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/ui/ducks/swaps/swaps.js b/ui/ducks/swaps/swaps.js
index 6f5252bc27e9..3a9a1f538be4 100644
--- a/ui/ducks/swaps/swaps.js
+++ b/ui/ducks/swaps/swaps.js
@@ -208,7 +208,7 @@ const slice = createSlice({
     setCurrentSmartTransactionsError: (state, action) => {
       const errorType = Object.values(StxErrorTypes).includes(action.payload)
         ? action.payload
-        : StxErrorTypes.UNAVAILABLE;
+        : StxErrorTypes.unavailable;
       state.currentSmartTransactionsError = errorType;
     },
     setSwapsSTXSubmitLoading: (state, action) => {
@@ -554,7 +554,7 @@ const disableStxIfRegularTxInProgress = (dispatch, transactions) => {
   for (const transaction of transactions) {
     if (IN_PROGRESS_TRANSACTION_STATUSES.includes(transaction.status)) {
       dispatch(
-        setCurrentSmartTransactionsError(StxErrorTypes.REGULAR_TX_IN_PROGRESS),
+        setCurrentSmartTransactionsError(StxErrorTypes.regularTxPending),
       );
       break;
     }
@@ -939,7 +939,7 @@ export const signAndSendSwapsSmartTransaction = ({
       if (!fees) {
         log.error('"fetchSwapsSmartTransactionFees" failed');
         dispatch(setSwapsSTXSubmitLoading(false));
-        dispatch(setCurrentSmartTransactionsError(StxErrorTypes.UNAVAILABLE));
+        dispatch(setCurrentSmartTransactionsError(StxErrorTypes.unavailable));
         return;
       }
       if (approveTxParams) {
@@ -1329,7 +1329,7 @@ export function fetchSwapsSmartTransactionFees({
         const errorObj = parseSmartTransactionsError(e.message);
         if (
           fallbackOnNotEnoughFunds ||
-          errorObj?.error !== StxErrorTypes.NOT_ENOUGH_FUNDS
+          errorObj?.error !== StxErrorTypes.notEnoughFunds
         ) {
           dispatch(setCurrentSmartTransactionsError(errorObj?.error));
         }
diff --git a/ui/pages/swaps/view-quote/view-quote.js b/ui/pages/swaps/view-quote/view-quote.js
index fcfa09292bdc..4be72b2c6425 100644
--- a/ui/pages/swaps/view-quote/view-quote.js
+++ b/ui/pages/swaps/view-quote/view-quote.js
@@ -201,6 +201,8 @@ export default function ViewQuote() {
   );
   const swapsNetworkConfig = useSelector(getSwapsNetworkConfig, shallowEqual);
   const unsignedTransaction = usedQuote.trade;
+  const isSmartTransaction =
+    currentSmartTransactionsEnabled && smartTransactionsOptInStatus;
 
   let gasFeeInputs;
   if (networkAndAccountSupports1559) {
@@ -458,7 +460,7 @@ export default function ViewQuote() {
     : null;
 
   let ethBalanceNeededStx;
-  if (smartTransactionsError?.balanceNeededWei) {
+  if (isSmartTransaction && smartTransactionsError?.balanceNeededWei) {
     ethBalanceNeededStx = decWEIToDecETH(
       smartTransactionsError.balanceNeededWei -
         smartTransactionsError.currentBalanceWei,
@@ -467,7 +469,7 @@ export default function ViewQuote() {
 
   const destinationToken = useSelector(getDestinationTokenInfo, isEqual);
   useEffect(() => {
-    if (currentSmartTransactionsEnabled && smartTransactionsOptInStatus) {
+    if (isSmartTransaction) {
       if (insufficientTokens) {
         dispatch(setBalanceError(true));
       } else if (balanceError && !insufficientTokens) {
@@ -483,8 +485,7 @@ export default function ViewQuote() {
     insufficientEth,
     balanceError,
     dispatch,
-    currentSmartTransactionsEnabled,
-    smartTransactionsOptInStatus,
+    isSmartTransaction,
   ]);
 
   useEffect(() => {
@@ -520,10 +521,7 @@ export default function ViewQuote() {
     ethBalanceNeeded;
 
   // If it's a Smart Transaction and ETH balance is needed, we want to show a warning.
-  const isStxAndEthBalanceIsNeeded =
-    currentSmartTransactionsEnabled &&
-    smartTransactionsOptInStatus &&
-    ethBalanceNeededStx;
+  const isStxAndEthBalanceIsNeeded = isSmartTransaction && ethBalanceNeededStx;
 
   // Indicates if we should show to a user a warning about insufficient funds for swapping.
   const showInsufficientWarning =
@@ -924,14 +922,14 @@ export default function ViewQuote() {
   ]);
 
   useEffect(() => {
-    if (currentSmartTransactionsEnabled && smartTransactionsOptInStatus) {
+    if (isSmartTransaction) {
       // Removes a smart transactions error when the component loads.
       dispatch({
         type: SET_SMART_TRANSACTIONS_ERROR,
         payload: null,
       });
     }
-  }, [currentSmartTransactionsEnabled, smartTransactionsOptInStatus, dispatch]);
+  }, [isSmartTransaction, dispatch]);
 
   return (
     <div className="view-quote">