fix: adjust ens link content (DimensionDev#5636)

* fix: adjust ens link content * fix: add margin gas when calculating maxAmount
dmrazzy · Feb 11, 2022 · 6702162 · 6702162
1 parent 088d1ef
commit 6702162
Show file tree

Hide file tree

Showing 3 changed files with 30 additions and 27 deletions.
diff --git a/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC20.tsx b/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC20.tsx
@@ -2,6 +2,7 @@ import { MaskColorVar, MaskTextField } from '@masknet/theme'
 import { Box, Button, IconButton, Link, Popover, Stack, Typography } from '@mui/material'
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import {
+    addGasMargin,
     EthereumTokenType,
     formatWeiToEther,
     FungibleTokenDetailed,
@@ -110,7 +111,7 @@ export const TransferERC20 = memo<TransferERC20Props>(({ token }) => {
 
     const gasFee = useMemo(() => {
         const price = is1559Supported && maxFee ? new BigNumber(maxFee) : gasPrice
-        return multipliedBy(gasLimit, price)
+        return multipliedBy(addGasMargin(gasLimit), price)
     }, [gasLimit, gasPrice, maxFee, is1559Supported])
     const gasFeeInUsd = formatWeiToEther(gasFee).multipliedBy(nativeTokenPrice)
 
@@ -176,12 +177,12 @@ export const TransferERC20 = memo<TransferERC20Props>(({ token }) => {
         if (resolveDomainLoading) return
         if (registeredAddress) {
             return (
-                <Link
-                    href={Utils?.resolveDomainLink?.(address)}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    underline="none">
-                    <Box style={{ padding: 10 }}>
+                <Box style={{ padding: 10 }}>
+                    <Link
+                        href={Utils?.resolveDomainLink?.(address)}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        underline="none">
                         <Typography
                             fontSize={16}
                             lineHeight="22px"
@@ -193,8 +194,8 @@ export const TransferERC20 = memo<TransferERC20Props>(({ token }) => {
                         <Typography fontSize={14} lineHeight="20px" style={{ color: MaskColorVar.textSecondary }}>
                             <FormattedAddress address={registeredAddress} size={4} formatter={Utils?.formatAddress} />
                         </Typography>
-                    </Box>
-                </Link>
+                    </Link>
+                </Box>
             )
         }
 

diff --git a/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx b/packages/dashboard/src/pages/Wallets/components/Transfer/TransferERC721.tsx
@@ -226,12 +226,12 @@ export const TransferERC721 = memo(() => {
         if (resolveDomainLoading) return
         if (registeredAddress) {
             return (
-                <Link
-                    href={Utils?.resolveDomainLink?.(allFormFields.recipient)}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    underline="none">
-                    <Box style={{ padding: 10 }}>
+                <Box style={{ padding: 10 }}>
+                    <Link
+                        href={Utils?.resolveDomainLink?.(allFormFields.recipient)}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        underline="none">
                         <Typography
                             fontSize={16}
                             lineHeight="22px"
@@ -242,8 +242,8 @@ export const TransferERC721 = memo(() => {
                         <Typography fontSize={14} lineHeight="20px" style={{ color: MaskColorVar.textSecondary }}>
                             <FormattedAddress address={registeredAddress} size={4} formatter={Utils?.formatAddress} />
                         </Typography>
-                    </Box>
-                </Link>
+                    </Link>
+                </Box>
             )
         }
 

diff --git a/packages/mask/src/extension/popups/pages/Wallet/Transfer/Transfer1559.tsx b/packages/mask/src/extension/popups/pages/Wallet/Transfer/Transfer1559.tsx
@@ -1,6 +1,7 @@
 import { memo, ReactElement, SyntheticEvent, useCallback, useMemo, useRef, useState } from 'react'
 import { useI18N } from '../../../../../utils'
 import {
+    addGasMargin,
     Asset,
     EthereumTokenType,
     formatBalance,
@@ -364,7 +365,8 @@ export const Transfer1559 = memo<Transfer1559Props>(({ selectedAsset, openAssetM
     )
 
     const maxAmount = useMemo(() => {
-        const gasFee = formatGweiToWei(maxFeePerGas ?? 0).multipliedBy(MIN_GAS_LIMIT)
+        const gasFee = formatGweiToWei(new BigNumber(maxFeePerGas ?? 0)).multipliedBy(addGasMargin(MIN_GAS_LIMIT))
+
         let amount_ = new BigNumber(tokenBalance ?? 0)
         amount_ = selectedAsset?.token.type === EthereumTokenType.Native ? amount_.minus(gasFee) : amount_
         return formatBalance(amount_.toFixed(), selectedAsset?.token.decimals)
@@ -455,12 +457,12 @@ export const Transfer1559 = memo<Transfer1559Props>(({ selectedAsset, openAssetM
 
         if (registeredAddress && !resolveDomainError && Utils?.resolveDomainLink)
             return (
-                <Link
-                    href={Utils.resolveDomainLink(address)}
-                    target="_blank"
-                    rel="noopener noreferrer"
-                    underline="none">
-                    <Box display="flex" justifyContent="space-between" alignItems="center" py={2.5} px={1.5}>
+                <Box display="flex" justifyContent="space-between" alignItems="center" py={2.5} px={1.5}>
+                    <Link
+                        href={Utils.resolveDomainLink(address)}
+                        target="_blank"
+                        rel="noopener noreferrer"
+                        underline="none">
                         <Box>
                             <Typography className={classes.domainName}>{address}</Typography>
                             <Typography className={classes.registeredAddress}>
@@ -471,9 +473,9 @@ export const Transfer1559 = memo<Transfer1559Props>(({ selectedAsset, openAssetM
                                 />
                             </Typography>
                         </Box>
-                        <RightIcon />
-                    </Box>
-                </Link>
+                    </Link>
+                    <RightIcon />
+                </Box>
             )
 
         return