fix: bugfix for swap (#10467)

DimensionDev · Aug 18, 2023 · 1cb44ae · 1cb44ae
1 parent 117f861
commit 1cb44ae
Show file tree

Hide file tree

Showing 18 changed files with 85 additions and 382 deletions.
diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json
@@ -20,6 +20,7 @@
     "back": "Back",
     "more": "More",
     "remove": "Remove",
+    "to": "To",
     "add": "Add",
     "approve": "Approve",
     "address": "Address",

diff --git a/packages/mask/src/extension/popups/components/NetworkSelector/index.tsx b/packages/mask/src/extension/popups/components/NetworkSelector/index.tsx
@@ -1,4 +1,4 @@
-import { memo, useCallback } from 'react'
+import { memo, useCallback, useMemo } from 'react'
 import { Box, MenuItem, Typography } from '@mui/material'
 import { makeStyles } from '@masknet/theme'
 import { getRegisteredWeb3Networks } from '@masknet/plugin-infra'
@@ -9,8 +9,9 @@ import { ChainIcon, useMenuConfig, WalletIcon } from '@masknet/shared'
 import { Icons } from '@masknet/icons'
 import { Flags } from '@masknet/flags'
 import type { NetworkDescriptor } from '@masknet/web3-shared-base'
-import { NetworkPluginID } from '@masknet/shared-base'
+import { NetworkPluginID, PluginID } from '@masknet/shared-base'
 import { Web3 } from '@masknet/web3-providers'
+import { useActivatedPlugin } from '@masknet/plugin-infra/dom'
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -48,6 +49,14 @@ export const NetworkSelector = memo(() => {
     const { account, chainId, providerType } = useChainContext<NetworkPluginID.PLUGIN_EVM>()
     const networks = getRegisteredWeb3Networks(NetworkPluginID.PLUGIN_EVM)
 
+    const traderDefinition = useActivatedPlugin(PluginID.Trader, 'any')
+    const chainIdList = traderDefinition?.enableRequirement.web3?.[NetworkPluginID.PLUGIN_EVM]?.supportedChainIds ?? []
+
+    const actualNetworks = useMemo(
+        () => networks.filter((x) => chainIdList.includes(x.chainId)),
+        [networks, chainIdList],
+    )
+
     const onChainChange = useCallback(
         async (chainId: Web3Helper.Definition[NetworkPluginID.PLUGIN_EVM]['ChainId']) => {
             await Web3.switchChain?.(chainId)
@@ -57,9 +66,9 @@ export const NetworkSelector = memo(() => {
 
     return (
         <NetworkSelectorUI
-            currentNetwork={networks.find((x) => x.chainId === chainId) ?? networks[0]}
+            currentNetwork={actualNetworks.find((x) => x.chainId === chainId) ?? actualNetworks[0]}
             onChainChange={onChainChange}
-            networks={networks}
+            networks={actualNetworks}
         />
     )
 })

diff --git a/packages/mask/src/extension/popups/components/TransactionPreview/index.tsx b/packages/mask/src/extension/popups/components/TransactionPreview/index.tsx
@@ -180,7 +180,7 @@ export const TransactionPreview = memo<TransactionPreviewProps>(function Transac
                     {receiver ? <Typography className={classes.title}>{receiver}</Typography> : null}
                 </Box>
                 <Box mt={2} display="flex" columnGap={0.5} alignItems="center">
-                    <Typography className={classes.addressTitle}>{t('address')}:</Typography>
+                    <Typography className={classes.addressTitle}>{t('to')}:</Typography>
                     <Typography fontSize={11} fontWeight={700} lineHeight="16px">
                         {to}
                     </Typography>

diff --git a/packages/mask/src/extension/popups/components/UnlockERC20Token/index.tsx b/packages/mask/src/extension/popups/components/UnlockERC20Token/index.tsx
@@ -46,9 +46,11 @@ const useStyles = makeStyles()((theme) => ({
         lineHeight: '16px',
     },
     address: {
-        fontSize: 10,
+        fontSize: 12,
+        transform: 'scale(0.8333)',
         color: theme.palette.maskColor.second,
         fontWeight: 400,
+        transformOrigin: 'left',
     },
     link: {
         width: 16,
@@ -178,7 +180,11 @@ export const UnlockERC20Token = memo<UnlockERC20TokenProps>(function UnlockERC20
                 {token?.address ? (
                     <Box display="flex" columnGap={1} alignItems="center">
                         <CopyButton text={token.address} size={16} />
-                        <Link href={ExplorerResolver.addressLink(chainId, token.address)} className={classes.link}>
+                        <Link
+                            href={ExplorerResolver.addressLink(chainId, token.address)}
+                            className={classes.link}
+                            target="_blank"
+                            rel="noopener noreferrer">
                             <Icons.LinkOut size={16} />
                         </Link>
                     </Box>
@@ -234,6 +240,8 @@ export const UnlockERC20Token = memo<UnlockERC20TokenProps>(function UnlockERC20
                         <Typography className={classes.spenderAddress}>
                             {transaction.formattedTransaction.popup?.spender}{' '}
                             <Link
+                                target="_blank"
+                                rel="noopener noreferrer"
                                 href={ExplorerResolver.addressLink(
                                     chainId,
                                     transaction.formattedTransaction.popup.spender,

diff --git a/packages/mask/src/extension/popups/pages/Personas/Logout/index.tsx b/packages/mask/src/extension/popups/pages/Personas/Logout/index.tsx
@@ -148,20 +148,26 @@ export const LogoutUI = memo<LogoutUIProps>(
         useTitle(t('popups_log_out'))
 
         const onConfirm = useCallback(async () => {
-            if (!backupPassword && !!manageWallets.length) {
-                modalNavigate(PopupModalRoutes.SetBackupPassword, { to: PopupRoutes.ExportPrivateKey })
-                return
-            }
-            if (manageWallets.length && paymentPassword) {
-                const verified = await verifyPaymentPassword(paymentPassword)
-                if (!verified) {
-                    setPaymentPasswordError(t('popups_wallet_persona_log_out_error_payment_password'))
+            if (manageWallets.length) {
+                if (hasPassword) {
+                    const verified = await verifyPaymentPassword(paymentPassword)
+                    if (!verified) {
+                        setPaymentPassword(t('popups_wallet_persona_log_out_error_payment_password'))
+                        return
+                    }
+                } else if (!backupPassword) {
+                    modalNavigate(PopupModalRoutes.SetBackupPassword, { to: PopupRoutes.ExportPrivateKey })
                     return
                 }
             }
-            if (!backupPassword || backupPassword === password) onLogout()
-            else setError(true)
-        }, [onLogout, backupPassword, password, paymentPassword, manageWallets.length])
+            if (backupPassword && backupPassword !== password) {
+                setError(true)
+                return
+            }
+
+            onLogout()
+            return
+        }, [onLogout, backupPassword, password, paymentPassword, manageWallets.length, hasPassword])
 
         const disabled = useMemo(() => {
             if (loading || error || paymentPasswordError) return true
@@ -319,11 +325,11 @@ export const LogoutUI = memo<LogoutUIProps>(
                     </Button>
                     <ActionButton
                         variant="contained"
-                        color={!backupPassword && manageWallets.length ? 'primary' : 'error'}
+                        color={!backupPassword && manageWallets.length && !hasPassword ? 'primary' : 'error'}
                         fullWidth
                         onClick={onConfirm}
                         disabled={disabled}>
-                        {!backupPassword && manageWallets.length ? t('backup') : t('popups_log_out')}
+                        {!backupPassword && manageWallets.length && !hasPassword ? t('backup') : t('popups_log_out')}
                     </ActionButton>
                 </BottomController>
             </Box>