From 6252d4e2b9fc369091fdd6c99c301ae7583f9c83 Mon Sep 17 00:00:00 2001
From: nuanyang233 <528944303@qq.com>
Date: Mon, 21 Mar 2022 14:17:35 +0800
Subject: [PATCH] chore: rename reverse address component

---
 .../DashboardComponents/CollectibleList/index.tsx           | 6 +++---
 packages/mask/src/plugins/Avatar/SNSAdaptor/NFTAvatar.tsx   | 4 ++--
 .../mask/src/plugins/Collectible/SNSAdaptor/NFTPage.tsx     | 4 ++--
 .../{ReverseAddress => ReversedAddress}/index.tsx           | 6 +++---
 packages/shared/src/UI/components/index.ts                  | 2 +-
 5 files changed, 11 insertions(+), 11 deletions(-)
 rename packages/shared/src/UI/components/{ReverseAddress => ReversedAddress}/index.tsx (71%)

diff --git a/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx b/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx
index 18854f54afee..c3bcccfe6b19 100644
--- a/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx
+++ b/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx
@@ -21,7 +21,7 @@ import { WalletMessages } from '@masknet/plugin-wallet'
 import { CollectionIcon } from './CollectionIcon'
 import { uniqBy } from 'lodash-unified'
 import KeyboardArrowDownIcon from '@mui/icons-material/KeyboardArrowDown'
-import { ReverseAddress } from '@masknet/shared'
+import { ReversedAddress } from '@masknet/shared'
 
 export const CollectibleContext = createContext<{
     collectiblesRetry: () => void
@@ -301,7 +301,7 @@ export function CollectionList({
                                 className={classes.button}
                                 variant="outlined"
                                 size="small">
-                                <ReverseAddress address={addressName.resolvedAddress} addressSize={5} />
+                                <ReversedAddress address={addressName.resolvedAddress} />
                                 <KeyboardArrowDownIcon />
                             </Button>
                         </Box>
@@ -330,7 +330,7 @@ export function CollectionList({
                 </Stack>
                 <Box display="flex" alignItems="center" justifyContent="flex-end" flexWrap="wrap">
                     <Button onClick={onSelectAddress} className={classes.button} variant="outlined" size="small">
-                        <ReverseAddress address={addressName.resolvedAddress} addressSize={5} />
+                        <ReversedAddress address={addressName.resolvedAddress} />
                         <KeyboardArrowDownIcon />
                     </Button>
                 </Box>
diff --git a/packages/mask/src/plugins/Avatar/SNSAdaptor/NFTAvatar.tsx b/packages/mask/src/plugins/Avatar/SNSAdaptor/NFTAvatar.tsx
index 8ed966851826..ab5233b8f5c1 100644
--- a/packages/mask/src/plugins/Avatar/SNSAdaptor/NFTAvatar.tsx
+++ b/packages/mask/src/plugins/Avatar/SNSAdaptor/NFTAvatar.tsx
@@ -17,7 +17,7 @@ import { EthereumChainBoundary } from '../../../web3/UI/EthereumChainBoundary'
 import { AddNFT } from './AddNFT'
 import { NFTImage } from './NFTImage'
 import { useAccount, useWeb3State } from '@masknet/plugin-infra'
-import { ReverseAddress } from '@masknet/shared'
+import { ReversedAddress } from '@masknet/shared'
 
 const useStyles = makeStyles()((theme) => ({
     root: {},
@@ -143,7 +143,7 @@ export function NFTAvatar(props: NFTAvatarProps) {
                     </Typography>
                     {account ? (
                         <Typography variant="body1" color="textPrimary" className={classes.account}>
-                            {t('nft_wallet_label')}: <ReverseAddress address={account} addressSize={4} />
+                            {t('nft_wallet_label')}: <ReversedAddress address={account} size={4} />
                             {!hideWallet ? (
                                 <Button
                                     variant="text"
diff --git a/packages/mask/src/plugins/Collectible/SNSAdaptor/NFTPage.tsx b/packages/mask/src/plugins/Collectible/SNSAdaptor/NFTPage.tsx
index 649c8cda1665..303f1a0b5dfb 100644
--- a/packages/mask/src/plugins/Collectible/SNSAdaptor/NFTPage.tsx
+++ b/packages/mask/src/plugins/Collectible/SNSAdaptor/NFTPage.tsx
@@ -4,7 +4,7 @@ import { MenuItem } from '@mui/material'
 import type { AddressName } from '@masknet/web3-shared-evm'
 import { CollectionList } from '../../../extension/options-page/DashboardComponents/CollectibleList'
 import { first, uniqBy } from 'lodash-unified'
-import { ReverseAddress } from '@masknet/shared'
+import { ReversedAddress } from '@masknet/shared'
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -71,7 +71,7 @@ export function NFTPage(props: NFTPageProps) {
                 {uniqBy(addressNames ?? [], (x) => x.resolvedAddress.toLowerCase()).map((x) => {
                     return (
                         <MenuItem key={x.resolvedAddress} value={x.resolvedAddress} onClick={() => onSelect(x)}>
-                            <ReverseAddress address={x.resolvedAddress} addressSize={5} />
+                            <ReversedAddress address={x.resolvedAddress} />
                         </MenuItem>
                     )
                 })}
diff --git a/packages/shared/src/UI/components/ReverseAddress/index.tsx b/packages/shared/src/UI/components/ReversedAddress/index.tsx
similarity index 71%
rename from packages/shared/src/UI/components/ReverseAddress/index.tsx
rename to packages/shared/src/UI/components/ReversedAddress/index.tsx
index 95fd5ba26e99..32028f42e208 100644
--- a/packages/shared/src/UI/components/ReverseAddress/index.tsx
+++ b/packages/shared/src/UI/components/ReversedAddress/index.tsx
@@ -5,14 +5,14 @@ interface ReverseAddressProps {
     address: string
     pluginId?: NetworkPluginID
     domainSize?: number
-    addressSize?: number
+    size?: number
 }
 
-export const ReverseAddress = memo<ReverseAddressProps>(({ address, pluginId, domainSize, addressSize }) => {
+export const ReversedAddress = memo<ReverseAddressProps>(({ address, pluginId, domainSize, size = 5 }) => {
     const { value: domain } = useReverseAddress(address, pluginId)
     const { Utils } = useWeb3State(pluginId)
 
-    if (!domain || !Utils?.formatDomainName) return <>{Utils?.formatAddress?.(address, addressSize) ?? address}</>
+    if (!domain || !Utils?.formatDomainName) return <>{Utils?.formatAddress?.(address, size) ?? address}</>
 
     return <>{Utils.formatDomainName(domain, domainSize)}</>
 })
diff --git a/packages/shared/src/UI/components/index.ts b/packages/shared/src/UI/components/index.ts
index 67b00cd5a88d..b4d86259c80c 100644
--- a/packages/shared/src/UI/components/index.ts
+++ b/packages/shared/src/UI/components/index.ts
@@ -12,4 +12,4 @@ export * from './AddressViewer'
 export * from './I18NextProviderHMR'
 export * from './AssetPlayer'
 export * from './NFTCardStyledAssetPlayer'
-export * from './ReverseAddress'
+export * from './ReversedAddress'