Merge remote-tracking branch 'origin/develop' into feat_coingecko_rec…

…ommended
shapeshift · Sep 23, 2024 · 2d11a95 · 2d11a95
2 parents cdd1a8d + c026b52
commit 2d11a95
Show file tree

Hide file tree

Showing 3 changed files with 59 additions and 28 deletions.
diff --git a/src/assets/translations/en/main.json b/src/assets/translations/en/main.json
@@ -938,6 +938,7 @@
     "receiveAddress": "Receive Address",
     "receiveAddressDescription": "No %{chainName} address found from connected wallet. Manually enter an address",
     "disableThorNativeSmartContractReceive": "We've detected that you're sending to a smart contract address on %{chainName}. Due to THORChain limitations, receiving %{nativeAssetSymbol} to a smart contract address is not supported. Please enter another address",
+    "disableThorTaprootReceive": "We've detected that you're sending to a taproot Bitcoin address. Due to THORChain limitations, receiving BTC to a taproot address is not currently supported. Please enter another address.",
     "toContinue": "to continue.",
     "addressPlaceholder": "%{chainName} address",
     "priceImpactWarning": "Due to the size of this trade relative to available liquidity, the expected price impact of this trade is %{priceImpactPercentage}%. Are you sure you want to trade?",

diff --git a/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx b/src/components/MultiHopTrade/components/TradeInput/components/ConfirmSummary.tsx
@@ -1,6 +1,7 @@
 import { Alert, AlertIcon, Button, CardFooter, useMediaQuery } from '@chakra-ui/react'
 import { isEvmChainId } from '@shapeshiftoss/chain-adapters'
 import { SwapperName } from '@shapeshiftoss/swapper'
+import { isUtxoChainId } from '@shapeshiftoss/utils'
 import type { InterpolationOptions } from 'node-polyglot'
 import { useCallback, useMemo } from 'react'
 import { useTranslate } from 'react-polyglot'
@@ -98,6 +99,18 @@ export const ConfirmSummary = ({
   const { data: _isSmartContractReceiveAddress, isLoading: isReceiveAddressByteCodeLoading } =
     useIsSmartContractAddress(receiveAddress ?? '', buyAsset.chainId)
 
+  const isTaprootReceiveAddress = useMemo(
+    () => isUtxoChainId(buyAsset.chainId) && receiveAddress?.startsWith('bc1p'),
+    [buyAsset.chainId, receiveAddress],
+  )
+
+  const disableThorTaprootReceiveAddress = useMemo(() => {
+    // Taproot addresses are not supported by THORChain swapper currently
+    if (activeSwapperName === SwapperName.Thorchain && isTaprootReceiveAddress) return true
+
+    return false
+  }, [activeSwapperName, isTaprootReceiveAddress])
+
   const disableThorNativeSmartContractReceive = useMemo(() => {
     // THORChain is only affected by the sc limitation for native EVM receives
     // https://dev.thorchain.org/protocol-development/chain-clients/evm-chains.html#admonition-warning
@@ -124,7 +137,7 @@ export const ConfirmSummary = ({
     if (disableThorNativeSmartContractReceive) return true
 
     return false
-  }, [walletSupportsBuyAssetChain, disableThorNativeSmartContractReceive, isAccountMetadataLoading])
+  }, [isAccountMetadataLoading, walletSupportsBuyAssetChain, disableThorNativeSmartContractReceive])
 
   const quoteHasError = useMemo(() => {
     if (!isAnyTradeQuoteLoaded) return false
@@ -148,6 +161,8 @@ export const ConfirmSummary = ({
       isLoading ||
       // don't execute trades for smart contract receive addresses for THOR native assets receives
       disableThorNativeSmartContractReceive ||
+      // Taproot not supported by THORChain swapper currently
+      disableThorTaprootReceiveAddress ||
       // don't allow non-existent quotes to be executed
       !activeQuote ||
       !hasUserEnteredAmount ||
@@ -157,17 +172,18 @@ export const ConfirmSummary = ({
       isTradeQuoteApiQueryPending[activeSwapperName]
     )
   }, [
+    isAccountMetadataLoading,
     quoteHasError,
     manualReceiveAddressIsValidating,
     manualReceiveAddressIsEditing,
     manualReceiveAddressIsValid,
     isLoading,
     disableThorNativeSmartContractReceive,
+    disableThorTaprootReceiveAddress,
     activeQuote,
     hasUserEnteredAmount,
     activeSwapperName,
     isTradeQuoteApiQueryPending,
-    isAccountMetadataLoading,
   ])
 
   const quoteStatusTranslation = useMemo(() => {
@@ -298,6 +314,11 @@ export const ConfirmSummary = ({
           shouldUse={Boolean(receiveAddress) && disableThorNativeSmartContractReceive === false}
           shouldForceManualAddressEntry={disableThorNativeSmartContractReceive}
           component={RecipientAddress}
+          description={
+            disableThorTaprootReceiveAddress
+              ? translate('trade.disableThorTaprootReceive')
+              : undefined
+          }
         />
         <WithLazyMount
           shouldUse={displayManualAddressEntry}

diff --git a/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx b/src/components/MultiHopTrade/components/TradeInput/components/RecipientAddress.tsx
@@ -35,10 +35,12 @@ const closeIcon = <CloseIcon />
 
 type RecipientAddressProps = {
   shouldForceManualAddressEntry?: boolean
+  description?: string
 }
 
 export const RecipientAddress: React.FC<RecipientAddressProps> = ({
   shouldForceManualAddressEntry,
+  description,
 }) => {
   const translate = useTranslate()
   const dispatch = useAppDispatch()
@@ -202,32 +204,39 @@ export const RecipientAddress: React.FC<RecipientAddressProps> = ({
       </FormControl>
     </form>
   ) : (
-    <Row alignItems='center' fontSize='sm' fontWeight='medium'>
-      <Row.Label>
-        <Text translation={recipientAddressTranslation} />
-      </Row.Label>
-      <Row.Value whiteSpace='nowrap'>
-        {isCustomRecipientAddress ? (
-          <Tooltip label={translate('trade.thisIsYourCustomRecipientAddress')} placement='top'>
-            <Tag size='md' colorScheme='blue'>
-              <TagLabel>{middleEllipsis(receiveAddress)}</TagLabel>
-              <TagCloseButton onClick={resetManualReceiveAddress} />
-            </Tag>
-          </Tooltip>
-        ) : (
-          <Stack direction='row' spacing={1} alignItems='center'>
-            <RawText>{middleEllipsis(receiveAddress)}</RawText>
-            <Tooltip label={translate('trade.customRecipientAddressDescription')} placement='top'>
-              <IconButton
-                aria-label='Edit recipient address'
-                icon={editIcon}
-                variant='ghost'
-                onClick={handleEditRecipientAddressClick}
-              />
+    <>
+      {description && (
+        <Row alignItems='center' fontSize='sm' fontWeight='medium'>
+          <Row.Label>{description}</Row.Label>
+        </Row>
+      )}
+      <Row alignItems='center' fontSize='sm' fontWeight='medium'>
+        <Row.Label>
+          <Text translation={recipientAddressTranslation} />
+        </Row.Label>
+        <Row.Value whiteSpace='nowrap'>
+          {isCustomRecipientAddress ? (
+            <Tooltip label={translate('trade.thisIsYourCustomRecipientAddress')} placement='top'>
+              <Tag size='md' colorScheme='blue'>
+                <TagLabel>{middleEllipsis(receiveAddress)}</TagLabel>
+                <TagCloseButton onClick={resetManualReceiveAddress} />
+              </Tag>
             </Tooltip>
-          </Stack>
-        )}
-      </Row.Value>
-    </Row>
+          ) : (
+            <Stack direction='row' spacing={1} alignItems='center'>
+              <RawText>{middleEllipsis(receiveAddress)}</RawText>
+              <Tooltip label={translate('trade.customRecipientAddressDescription')} placement='top'>
+                <IconButton
+                  aria-label='Edit recipient address'
+                  icon={editIcon}
+                  variant='ghost'
+                  onClick={handleEditRecipientAddressClick}
+                />
+              </Tooltip>
+            </Stack>
+          )}
+        </Row.Value>
+      </Row>
+    </>
   )
 }