[FEAT] Swaps support for hardware wallet

app/components/Nav/Main/RootRPCMethodsUI.js

@@ -24,11 +24,11 @@ import {
   getMethodData,
   TOKEN_METHOD_TRANSFER,
   APPROVE_FUNCTION_SIGNATURE,
-  decodeApproveData,
   getTokenValueParam,
   getTokenAddressParam,
   calcTokenAmount,
   getTokenValueParamAsHex,
+  isSwapTransaction,
 } from '../../../util/transactions';
 import { BN } from 'ethereumjs-util';
 import Logger from '../../../util/Logger';
@@ -277,17 +277,7 @@ const RootRPCMethodsUI = (props) => {
       const to = transactionMeta.transaction.to?.toLowerCase();
       const { data } = transactionMeta.transaction;
 
-      // if approval data includes metaswap contract
-      // if destination address is metaswap contract
-      if (
-        transactionMeta.origin === process.env.MM_FOX_CODE &&
-        to &&
-        (swapsUtils.isValidContractAddress(props.chainId, to) ||
-          (data &&
-            data.substr(0, 10) === APPROVE_FUNCTION_SIGNATURE &&
-            decodeApproveData(data).spenderAddress?.toLowerCase() ===
-              swapsUtils.getSwapsContractAddress(props.chainId)))
-      ) {
+      if (isSwapTransaction(data, transactionMeta.origin, to, props.chainId)) {
         autoSign(transactionMeta);
       } else {
         const {

app/components/UI/Swaps/QuotesView.js

@@ -14,7 +14,12 @@ import MaterialCommunityIcons from 'react-native-vector-icons/MaterialCommunityI
 import BigNumber from 'bignumber.js';
 import { useNavigation, useRoute } from '@react-navigation/native';
 import { swapsUtils } from '@metamask/swaps-controller';
-import { WalletDevice, util, GAS_ESTIMATE_TYPES } from '@metamask/controllers/';
+import {
+  WalletDevice,
+  util,
+  GAS_ESTIMATE_TYPES,
+  TransactionStatus,
+} from '@metamask/controllers/';
 
 import {
   addHexPrefix,
@@ -67,6 +72,7 @@ import { decGWEIToHexWEI } from '../../../util/conversions';
 import FadeAnimationView from '../FadeAnimationView';
 import Logger from '../../../util/Logger';
 import { useAppThemeFromContext, mockTheme } from '../../../util/theme';
+import { isQRHardwareAccount } from '../../../util/address';
 
 const POLLING_INTERVAL = 30000;
 const SLIPPAGE_BUCKETS = {
@@ -800,50 +806,111 @@ function SwapsQuotesView({
     ],
   );
 
-  const handleCompleteSwap = useCallback(async () => {
-    if (!selectedQuote) {
-      return;
-    }
+  const startSwapAnalytics = useCallback(
+    (selectedQuote) => {
+      InteractionManager.runAfterInteractions(() => {
+        const parameters = {
+          token_from: sourceToken.symbol,
+          token_from_amount: fromTokenMinimalUnitString(
+            sourceAmount,
+            sourceToken.decimals,
+          ),
+          token_to: destinationToken.symbol,
+          token_to_amount: fromTokenMinimalUnitString(
+            selectedQuote.destinationAmount,
+            destinationToken.decimals,
+          ),
+          request_type: hasEnoughTokenBalance ? 'Order' : 'Quote',
+          slippage,
+          custom_slippage: slippage !== AppConstants.SWAPS.DEFAULT_SLIPPAGE,
+          best_quote_source: selectedQuote.aggregator,
+          available_quotes: allQuotes,
+          other_quote_selected: allQuotes[selectedQuoteId] === selectedQuote,
+          network_fees_USD: weiToFiat(
+            toWei(selectedQuoteValue?.ethFee),
+            conversionRate,
+            'usd',
+          ),
+          network_fees_ETH: renderFromWei(toWei(selectedQuoteValue?.ethFee)),
+          chain_id: chainId,
+        };
+        Analytics.trackEventWithParameters(
+          ANALYTICS_EVENT_OPTS.SWAP_STARTED,
+          {},
+        );
+        Analytics.trackEventWithParameters(
+          ANALYTICS_EVENT_OPTS.SWAP_STARTED,
+          parameters,
+          true,
+        );
+      });
+    },
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    [
+      chainId,
+      sourceAmount,
+      hasEnoughTokenBalance,
+      slippage,
+      allQuotes,
+      selectedQuoteValue,
+      selectedQuoteId,
+      conversionRate,
+      destinationToken,
+    ],
+  );
 
-    InteractionManager.runAfterInteractions(() => {
-      const parameters = {
-        token_from: sourceToken.symbol,
-        token_from_amount: fromTokenMinimalUnitString(
-          sourceAmount,
-          sourceToken.decimals,
-        ),
-        token_to: destinationToken.symbol,
-        token_to_amount: fromTokenMinimalUnitString(
-          selectedQuote.destinationAmount,
-          destinationToken.decimals,
-        ),
-        request_type: hasEnoughTokenBalance ? 'Order' : 'Quote',
-        slippage,
-        custom_slippage: slippage !== AppConstants.SWAPS.DEFAULT_SLIPPAGE,
-        best_quote_source: selectedQuote.aggregator,
-        available_quotes: allQuotes,
-        other_quote_selected: allQuotes[selectedQuoteId] === selectedQuote,
-        network_fees_USD: weiToFiat(
-          toWei(selectedQuoteValue?.ethFee),
-          conversionRate,
-          'usd',
-        ),
-        network_fees_ETH: renderFromWei(toWei(selectedQuoteValue?.ethFee)),
-        chain_id: chainId,
-      };
-      Analytics.trackEventWithParameters(ANALYTICS_EVENT_OPTS.SWAP_STARTED, {});
-      Analytics.trackEventWithParameters(
-        ANALYTICS_EVENT_OPTS.SWAP_STARTED,
-        parameters,
-        true,
-      );
-    });
+  const handleSwapTransaction = useCallback(
+    async (
+      TransactionController,
+      newSwapsTransactions,
+      approvalTransactionMetaId,
+    ) => {
+      if (!selectedQuote) {
+        return;
+      }
 
-    const { TransactionController } = Engine.context;
-    const newSwapsTransactions =
-      TransactionController.state.swapsTransactions || {};
-    let approvalTransactionMetaId;
-    if (approvalTransaction) {
+      try {
+        const { transactionMeta } = await TransactionController.addTransaction(
+          {
+            ...selectedQuote.trade,
+            ...getTransactionPropertiesFromGasEstimates(
+              gasEstimateType,
+              gasEstimates,
+            ),
+            gas: new BigNumber(gasLimit).toString(16),
+          },
+          process.env.MM_FOX_CODE,
+          WalletDevice.MM_MOBILE,
+        );
+        updateSwapsTransactions(
+          transactionMeta,
+          approvalTransactionMetaId,
+          newSwapsTransactions,
+        );
+        await addTokenToAssetsController(destinationToken);
+        await addTokenToAssetsController(sourceToken);
+      } catch (e) {
+        // send analytics
+      }
+    },
+    [
+      destinationToken,
+      gasEstimateType,
+      gasEstimates,
+      gasLimit,
+      selectedQuote,
+      sourceToken,
+      updateSwapsTransactions,
+    ],
+  );
+
+  const handleApprovaltransaction = useCallback(
+    async (
+      TransactionController,
+      newSwapsTransactions,
+      approvalTransactionMetaId,
+      isHardwareAccount,
+    ) => {
       try {
         const { transactionMeta } = await TransactionController.addTransaction(
           {
@@ -869,54 +936,79 @@ function SwapsQuotesView({
             16,
           ).toString(10),
         };
+        if (isHardwareAccount) {
+          TransactionController.hub.once(
+            `${transactionMeta.id}:finished`,
+            (transactionMeta) => {
+              if (transactionMeta.status === TransactionStatus.submitted) {
+                handleSwapTransaction(
+                  TransactionController,
+                  newSwapsTransactions,
+                  approvalTransactionMetaId,
+                  isHardwareAccount,
+                );
+              }
+            },
+          );
+        }
       } catch (e) {
         // send analytics
       }
+    },
+    [
+      approvalTransaction,
+      gasEstimateType,
+      gasEstimates,
+      handleSwapTransaction,
+      sourceToken.address,
+      sourceToken.decimals,
+    ],
+  );
+
+  const handleCompleteSwap = useCallback(async () => {
+    if (!selectedQuote) {
+      return;
     }
 
-    try {
-      const { transactionMeta } = await TransactionController.addTransaction(
-        {
-          ...selectedQuote.trade,
-          ...getTransactionPropertiesFromGasEstimates(
-            gasEstimateType,
-            gasEstimates,
-          ),
-          gas: new BigNumber(gasLimit).toString(16),
-        },
-        process.env.MM_FOX_CODE,
-        WalletDevice.MM_MOBILE,
-      );
-      updateSwapsTransactions(
-        transactionMeta,
-        approvalTransactionMetaId,
+    const isHardwareAccount = isQRHardwareAccount(selectedAddress);
+
+    startSwapAnalytics(selectedQuote);
+
+    const { TransactionController } = Engine.context;
+    const newSwapsTransactions =
+      TransactionController.state.swapsTransactions || {};
+    let approvalTransactionMetaId;
+
+    if (approvalTransaction) {
+      handleApprovaltransaction(
+        TransactionController,
         newSwapsTransactions,
+        approvalTransactionMetaId,
+        isHardwareAccount,
       );
-      await addTokenToAssetsController(destinationToken);
-      await addTokenToAssetsController(sourceToken);
-    } catch (e) {
-      // send analytics
+
+      if (isHardwareAccount) {
+        navigation.dangerouslyGetParent()?.pop();
+        return;
+      }
     }
 
+    handleSwapTransaction(
+      TransactionController,
+      newSwapsTransactions,
+      approvalTransactionMetaId,
+      isHardwareAccount,
+    );
+
     navigation.dangerouslyGetParent()?.pop();
   }, [
-    chainId,
-    navigation,
     selectedQuote,
+    selectedAddress,
     approvalTransaction,
-    sourceToken,
-    sourceAmount,
-    destinationToken,
-    hasEnoughTokenBalance,
-    slippage,
-    allQuotes,
-    selectedQuoteValue,
-    selectedQuoteId,
-    conversionRate,
-    gasEstimateType,
-    gasEstimates,
-    gasLimit,
-    updateSwapsTransactions,
+    startSwapAnalytics,
+    handleApprovaltransaction,
+    handleSwapTransaction,
+    navigation,
   ]);
 
   const onEditQuoteTransactionsGas = useCallback(() => {

app/util/transactions/index.js

@@ -1407,3 +1407,17 @@ export const minimumTokenAllowance = (tokenDecimals) => {
     .toFixed(tokenDecimals)
     .toString(10);
 };
+
+/**
+ *
+ */
+export const isSwapTransaction = (data, origin, to, chainId) =>
+  // if approval data includes metaswap contract
+  // if destination address is metaswap contract
+  origin === process.env.MM_FOX_CODE &&
+  to &&
+  (swapsUtils.isValidContractAddress(chainId, to) ||
+    (data &&
+      data.substr(0, 10) === APPROVE_FUNCTION_SIGNATURE &&
+      decodeApproveData(data).spenderAddress?.toLowerCase() ===
+        swapsUtils.getSwapsContractAddress(chainId)));