From befba45da966fab171be244de339059ce8244d45 Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 10:18:55 +0800
Subject: [PATCH 1/7] fix: DAO tab

---
 .../src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx    | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
index 8af942239e14..67b42aa2c12e 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
@@ -41,13 +41,11 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
     const { t } = useI18N()
     const classes = useStylesExtends(useStyles(), props)
 
-    //#region identity
     const identity = useCurrentVisitingIdentity()
     const { value: addressNames, loading: loadingAddressNames } = useAddressNames(identity)
-    //#endregion
+    const { value: daoPayload, loading: loadingDAO } = useDao(identity.identifier)
 
     const [hidden, setHidden] = useState(true)
-    const { value: daoPayload } = useDao(identity.identifier)
     const [currentTag, setCurrentTag] = useState<PageTags>(PageTags.NFTTag)
 
     useLocationChange(() => {
@@ -112,7 +110,7 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
 
     if (hidden) return null
 
-    if (loadingAddressNames)
+    if (loadingAddressNames || loadingDAO)
         return (
             <div className={classes.root}>
                 <Box
@@ -125,7 +123,7 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
             </div>
         )
 
-    if (!addressName)
+    if (!addressName && !daoPayload)
         return (
             <div className={classes.root}>
                 <Box

From 5973d3604c316040d409d78120a82c28d07f500c Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Thu, 23 Dec 2021 00:34:03 +0800
Subject: [PATCH 2/7] fix: rss3 links

---
 packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
index 2393ada10c2e..a0f1c057f706 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
@@ -14,7 +14,7 @@ const getDonationLink = (address: string, donation: GeneralAssetWithTags) => {
         platform,
         identity,
         id,
-        type,
+        type: type.replaceAll('-', '.'),
     })
 }
 

From 0eb6343680d2e8b1d53910508dbbbdb1394390e3 Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 10:43:51 +0800
Subject: [PATCH 3/7] fix: the wallet discovery rules

---
 packages/mask/shared-ui/locales/en-US.json             | 10 +++++-----
 packages/mask/shared-ui/locales/qya-AA.json            |  2 +-
 packages/mask/shared-ui/locales/zh-CN.json             | 10 +++++-----
 .../src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx |  8 +++++---
 .../Profile/SNSAdaptor/components/AddressViewer.tsx    |  2 +-
 packages/mask/src/plugins/Wallet/services/domain.ts    |  2 +-
 6 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json
index 01c040ad091b..ecbe018b8887 100644
--- a/packages/mask/shared-ui/locales/en-US.json
+++ b/packages/mask/shared-ui/locales/en-US.json
@@ -1004,11 +1004,11 @@
     "nft_button_add_collectible": "Add Collectible",
     "nft_avatar": "NFT Avatar",
     "plugin_profile_no_wallets": "Connect your wallet here.<br/>This section will be shown to your encrypted friends.<br/>The display content includes digital art, donations, badges<br/>and other public information on chain.",
-    "plugin_profile_binding_rules_title": "The NFT gallary will show NFTs as below rules:",
-    "plugin_profile_binding_rule1": "Twitter nickname is ENS.",
-    "plugin_profile_binding_rule2": "Twitter bio contains ENS(e.g. vitalik.eth) or valid address.",
-    "plugin_profile_binding_rule3": "Twitter ID + {{suffix}} is ENS.",
-    "plugin_profile_binding_rule4": "Address used to sign the avatar.",
+    "plugin_profile_binding_rules_title": "The wallet address discovery rules:",
+    "plugin_profile_binding_rule1": "The nickname is ENS or RNS.",
+    "plugin_profile_binding_rule2": "The bio contains ENS, RNS or a valid address.",
+    "plugin_profile_binding_rule3": "The ID + suffix is ENS or RNS.",
+    "plugin_profile_binding_rule4": "The address used to sign the PFP NFTs.",
     "plugin_profile_current_display_of": "Current display of {{type}}: ",
     "plugin_profile_loading": "Loading...",
     "plugin_profile_error_no_address": "Failed to find any valid address.",
diff --git a/packages/mask/shared-ui/locales/qya-AA.json b/packages/mask/shared-ui/locales/qya-AA.json
index 513d60779375..ab9103f0495c 100644
--- a/packages/mask/shared-ui/locales/qya-AA.json
+++ b/packages/mask/shared-ui/locales/qya-AA.json
@@ -1006,7 +1006,7 @@
     "plugin_profile_binding_rules_title": "crwdns10417:0crwdne10417:0",
     "plugin_profile_binding_rule1": "crwdns10419:0crwdne10419:0",
     "plugin_profile_binding_rule2": "crwdns10421:0crwdne10421:0",
-    "plugin_profile_binding_rule3": "crwdns10423:0{{suffix}}crwdne10423:0",
+    "plugin_profile_binding_rule3": "crwdns10423:0crwdne10423:0",
     "plugin_profile_binding_rule4": "crwdns10425:0crwdne10425:0",
     "plugin_profile_current_display_of": "crwdns10427:0{{type}}crwdne10427:0",
     "plugin_profile_loading": "crwdns10669:0crwdne10669:0",
diff --git a/packages/mask/shared-ui/locales/zh-CN.json b/packages/mask/shared-ui/locales/zh-CN.json
index 5966413499b0..8fabcca5564a 100644
--- a/packages/mask/shared-ui/locales/zh-CN.json
+++ b/packages/mask/shared-ui/locales/zh-CN.json
@@ -886,11 +886,11 @@
     "nft_button_add_collectible": "添加收藏品",
     "nft_avatar": "NFT 头像",
     "plugin_profile_no_wallets": "在此连接您的钱包。<br/>此部分将显示给您的加密朋友。<br/>显示内容包括数字艺术、捐赠、徽章<br/>和其他链上的公开信息。",
-    "plugin_profile_binding_rules_title": "Web3 按如下规则展示NFTs：",
-    "plugin_profile_binding_rule1": "您的Twitter 昵称为ENS。",
-    "plugin_profile_binding_rule2": "您的Twitter bio 包含 ENS(例如，vitalik.eth) 或有效地址。",
-    "plugin_profile_binding_rule3": "您的Twitter ID + {{suffix}} 是ENS。",
-    "plugin_profile_binding_rule4": "用于签署NFT 头像的地址。",
+    "plugin_profile_binding_rules_title": "Web3 按如下规则发现钱包地址：",
+    "plugin_profile_binding_rule1": "您的昵称为 ENS 或者 RNS。",
+    "plugin_profile_binding_rule2": "您的个人介绍中包含 ENS、RNS 或有效地址。",
+    "plugin_profile_binding_rule3": "您的 ID + 词缀是 ENS 或者 RNS。",
+    "plugin_profile_binding_rule4": "用于签署 NFT 头像的地址。",
     "plugin_profile_current_display_of": "当前显示 {{type}}： ",
     "plugin_vcent_last_offer_at": "最新的OFFER为"
 }
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
index 67b42aa2c12e..067ec2b5a70a 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
@@ -142,9 +142,11 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
             <div className={classes.tags}>
                 <PageTag address={address} daoPayload={daoPayload} tag={currentTag} onChange={setCurrentTag} />
             </div>
-            <div className={classes.metadata}>
-                <AddressViewer addressName={addressName} />
-            </div>
+            {addressName ? (
+                <div className={classes.metadata}>
+                    <AddressViewer addressName={addressName} />
+                </div>
+            ) : null}
             <div className={classes.content}>{content}</div>
         </div>
     )
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/components/AddressViewer.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/components/AddressViewer.tsx
index 80988f60870d..0d86a466c530 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/components/AddressViewer.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/components/AddressViewer.tsx
@@ -56,7 +56,7 @@ export function AddressViewer({ addressName }: AddressViewerProps) {
     const rulesTipMap = [
         t('plugin_profile_binding_rule1'),
         t('plugin_profile_binding_rule2'),
-        t('plugin_profile_binding_rule3', { suffix: `".eth"` }),
+        t('plugin_profile_binding_rule3'),
         t('plugin_profile_binding_rule4'),
     ]
 
diff --git a/packages/mask/src/plugins/Wallet/services/domain.ts b/packages/mask/src/plugins/Wallet/services/domain.ts
index 3c6263f2e59a..430be1df9732 100644
--- a/packages/mask/src/plugins/Wallet/services/domain.ts
+++ b/packages/mask/src/plugins/Wallet/services/domain.ts
@@ -116,7 +116,7 @@ export async function getAddressNames(identity: {
         isValidAddress(addressRSS3)
             ? {
                   type: AddressNameType.RSS3,
-                  label: `${RSS3Id}.rss`,
+                  label: `${RSS3Id}.rss3`,
                   resolvedAddress: addressRSS3,
               }
             : null,

From b3acf1e6d9321963be83c99a2b856908c9ab0cbe Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 11:40:46 +0800
Subject: [PATCH 4/7] fix: hide nfts tab if non-address found

---
 .../src/plugins/Profile/SNSAdaptor/PageTag.tsx   | 16 +++++++++-------
 1 file changed, 9 insertions(+), 7 deletions(-)

diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
index dcf77987e852..80a901dacd97 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
@@ -68,13 +68,15 @@ export function PageTag(props: PageTagProps) {
                 size="medium">
                 {t('wallets')}
             </Button>
-            <Button
-                variant="outlined"
-                className={tag === PageTags.NFTTag ? classes.selected : classes.button}
-                onClick={() => onChange(PageTags.NFTTag)}
-                size="medium">
-                {t('nfts')}
-            </Button>
+            {address ? (
+                <Button
+                    variant="outlined"
+                    className={tag === PageTags.NFTTag ? classes.selected : classes.button}
+                    onClick={() => onChange(PageTags.NFTTag)}
+                    size="medium">
+                    {t('nfts')}
+                </Button>
+            ) : null}
             {hasDonations ? (
                 <Button
                     variant="outlined"

From b1fd5566a5815ffa248ee48a7a24b6e0f505f626 Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 11:57:08 +0800
Subject: [PATCH 5/7] refactor: the empty indicator

---
 packages/mask/shared-ui/locales/en-US.json    |  2 +-
 .../CollectibleList/index.tsx                 | 65 ++++++-------
 .../Profile/SNSAdaptor/DonationsPage.tsx      | 18 +---
 .../Profile/SNSAdaptor/EnhancedProfile.tsx    | 95 +++++++++++++------
 .../Profile/SNSAdaptor/FootprintPage.tsx      | 19 +---
 .../plugins/Profile/SNSAdaptor/NFTPage.tsx    | 12 ---
 .../plugins/Profile/SNSAdaptor/PageTag.tsx    | 29 +++---
 .../Profile/SNSAdaptor/hooks/useDonations.ts  | 11 +--
 .../Profile/SNSAdaptor/hooks/useFootprints.ts | 11 +--
 9 files changed, 129 insertions(+), 133 deletions(-)

diff --git a/packages/mask/shared-ui/locales/en-US.json b/packages/mask/shared-ui/locales/en-US.json
index ecbe018b8887..5d0dceda7fd0 100644
--- a/packages/mask/shared-ui/locales/en-US.json
+++ b/packages/mask/shared-ui/locales/en-US.json
@@ -66,7 +66,7 @@
     "unknown": "Unknown",
     "message": "Message",
     "dashboard_tab_collectibles": "Collectibles",
-    "dashboard_no_collectible_found": "No collectible found",
+    "dashboard_no_collectible_found": "No collectible found.",
     "days": "Every {{days}} days",
     "decrypted_postbox_add_recipients": "Append recipients",
     "decrypted_postbox_decrypting": "Mask decrypting…",
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 51ada8636acc..27ca10376005 100644
--- a/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx
+++ b/packages/mask/src/extension/options-page/DashboardComponents/CollectibleList/index.tsx
@@ -117,10 +117,11 @@ interface CollectibleListUIProps extends withClasses<'empty' | 'button' | 'text'
 }
 function CollectibleListUI(props: CollectibleListUIProps) {
     const { provider, wallet, collectibles, loading, collectiblesRetry, error, readonly, hasRetry = true } = props
-    const classes = useStylesExtends(useStyles(), props)
     const { t } = useI18N()
+    const classes = useStylesExtends(useStyles(), props)
+
+    useEffect(() => WalletMessages.events.erc721TokensUpdated.on(collectiblesRetry))
 
-    WalletMessages.events.erc721TokensUpdated.on(collectiblesRetry)
     if (loading)
         return (
             <Box className={classes.root}>
@@ -171,13 +172,13 @@ function CollectibleListUI(props: CollectibleListUIProps) {
     )
 }
 
-export interface CollectibleListAddressProps extends withClasses<'empty' | 'button'> {
+export interface CollectibleListProps extends withClasses<'empty' | 'button'> {
     address: string
     collection?: string
     setCount: (count: number) => void
 }
 
-export function CollectibleListAddress(props: CollectibleListAddressProps) {
+export function CollectibleList(props: CollectibleListProps) {
     const { address, collection, setCount } = props
     const provider = useValueRef(currentNonFungibleAssetDataProviderSettings)
     const chainId = ChainId.Mainnet
@@ -198,20 +199,15 @@ export function CollectibleListAddress(props: CollectibleListAddressProps) {
     }, [provider, address])
 
     useEffect(() => {
-        if (collectibles.length) {
-            setRendCollectibles([...rendCollectibles, ...collectibles])
-            if (hasNextPage) {
-                const timer = setTimeout(() => {
-                    setPage(page + 1)
-                }, 1000)
-
-                return () => {
-                    clearTimeout(timer)
-                }
-            }
+        if (!collectibles.length) return
+        setRendCollectibles([...rendCollectibles, ...collectibles])
+        if (!hasNextPage) return
+        const timer = setTimeout(() => {
+            setPage(page + 1)
+        }, 1000)
+        return () => {
+            clearTimeout(timer)
         }
-
-        return () => {}
     }, [collectibles])
 
     useEffect(() => {
@@ -233,8 +229,9 @@ export function CollectibleListAddress(props: CollectibleListAddressProps) {
 }
 
 export function CollectionList({ address }: { address: string }) {
-    const provider = useValueRef(currentNonFungibleAssetDataProviderSettings)
     const chainId = ChainId.Mainnet
+    const provider = useValueRef(currentNonFungibleAssetDataProviderSettings)
+    const { t } = useI18N()
     const [page, setPage] = useState(0)
     const { classes } = useStyles()
     const [counts, setCounts] = useState<number[]>([])
@@ -248,22 +245,26 @@ export function CollectionList({ address }: { address: string }) {
     }, [provider, address])
 
     useEffect(() => {
-        if (collections.length) {
-            setRendCollections([...rendCollections, ...collections])
-            if (hasNextPage) {
-                const timer = setTimeout(() => {
-                    setPage(page + 1)
-                }, 3000)
-
-                return () => {
-                    clearTimeout(timer)
-                }
-            }
+        if (!collections.length) return
+        setRendCollections([...rendCollections, ...collections])
+        if (!hasNextPage) return
+        const timer = setTimeout(() => {
+            setPage(page + 1)
+        }, 3000)
+        return () => {
+            clearTimeout(timer)
         }
-
-        return () => {}
     }, [collections])
 
+    if (!rendCollections.length)
+        return (
+            <Box display="flex" alignItems="center" justifyContent="center">
+                <Typography color="textPrimary" sx={{ paddingTop: 4, paddingBottom: 4 }}>
+                    {t('dashboard_no_collectible_found')}
+                </Typography>
+            </Box>
+        )
+
     return (
         <Box>
             {rendCollections.map((x, i) => (
@@ -281,7 +282,7 @@ export function CollectionList({ address }: { address: string }) {
                             {counts[i] ? `(${counts[i]})` : null}
                         </Typography>
                     </Box>
-                    <CollectibleListAddress
+                    <CollectibleList
                         address={address}
                         collection={x.slug}
                         setCount={(count) => {
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
index a0f1c057f706..2a223556397b 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
@@ -1,10 +1,9 @@
 import { makeStyles } from '@masknet/theme'
-import { CircularProgress, Link } from '@mui/material'
+import { Link } from '@mui/material'
 import urlcat from 'urlcat'
-import type { GeneralAssetWithTags } from '../types'
+import type { GeneralAsset, GeneralAssetWithTags } from '../types'
 import { RSS3_DEFAULT_IMAGE } from '../constants'
 import { DonationCard } from './components'
-import { useDonations } from './hooks'
 import { useI18N } from '../../../utils'
 
 const getDonationLink = (address: string, donation: GeneralAssetWithTags) => {
@@ -31,21 +30,14 @@ const useStyles = makeStyles()((theme) => ({
 
 export interface DonationPageProps {
     address: string
+    donations?: GeneralAsset[]
 }
 
 export function DonationPage(props: DonationPageProps) {
-    const { address } = props
-    const { classes } = useStyles()
-    const { donations, loading } = useDonations(address)
+    const { address, donations = [] } = props
     const { t } = useI18N()
+    const { classes } = useStyles()
 
-    if (loading) {
-        return (
-            <div className="flex justify-center items-center">
-                <CircularProgress />
-            </div>
-        )
-    }
     return (
         <section className="grid grid-cols-1 gap-4 py-4">
             {donations.map((donation) => (
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
index 067ec2b5a70a..46c316daf999 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
@@ -3,7 +3,7 @@ import { useUpdateEffect } from 'react-use'
 import { Box, Typography } from '@mui/material'
 import { unreachable } from '@dimensiondev/kit'
 import { makeStyles, useStylesExtends } from '@masknet/theme'
-import { AddressNameType, useAddressNames } from '@masknet/web3-shared-evm'
+import { AddressName, AddressNameType, useAddressNames } from '@masknet/web3-shared-evm'
 import { MaskMessages, useI18N } from '../../../utils'
 import { useLocationChange } from '../../../utils/hooks/useLocationChange'
 import { WalletsPage } from './WalletsPage'
@@ -15,7 +15,33 @@ import { PageTags } from '../types'
 import { PageTag } from './PageTag'
 import { AddressViewer } from './components/AddressViewer'
 import { useCurrentVisitingIdentity } from '../../../components/DataSource/useActivatedUI'
-import { useDao } from './hooks'
+import { useDao, useDonations, useFootprints } from './hooks'
+
+function getAddressName(currentTag: PageTags, addressNames: AddressName[]) {
+    const getAddressByType = (type: AddressNameType) => addressNames?.find((x) => x.type === type)
+
+    const addressLiteral = getAddressByType(AddressNameType.ADDRESS)
+    const addressENS = getAddressByType(AddressNameType.ENS)
+    const addressUNS = getAddressByType(AddressNameType.UNS)
+    const addressGUN = getAddressByType(AddressNameType.GUN)
+    const addressRSS3 = getAddressByType(AddressNameType.RSS3)
+    const addressTheGraph = getAddressByType(AddressNameType.THE_GRAPH)
+
+    switch (currentTag) {
+        case PageTags.WalletTag:
+            return
+        case PageTags.NFTTag:
+            return addressENS || addressUNS || addressRSS3 || addressLiteral || addressGUN || addressTheGraph
+        case PageTags.DonationTag:
+            return addressRSS3 || addressENS || addressUNS || addressLiteral || addressGUN || addressTheGraph
+        case PageTags.FootprintTag:
+            return addressRSS3 || addressENS || addressUNS || addressLiteral || addressGUN || addressTheGraph
+        case PageTags.DAOTag:
+            return
+        default:
+            unreachable(currentTag)
+    }
+}
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -42,14 +68,13 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
     const classes = useStylesExtends(useStyles(), props)
 
     const identity = useCurrentVisitingIdentity()
-    const { value: addressNames, loading: loadingAddressNames } = useAddressNames(identity)
-    const { value: daoPayload, loading: loadingDAO } = useDao(identity.identifier)
+    const { value: addressNames = [], loading: loadingAddressNames } = useAddressNames(identity)
 
     const [hidden, setHidden] = useState(true)
-    const [currentTag, setCurrentTag] = useState<PageTags>(PageTags.NFTTag)
+    const [currentTag, setCurrentTag] = useState<PageTags | undefined>()
 
     useLocationChange(() => {
-        setCurrentTag(PageTags.NFTTag)
+        setCurrentTag(undefined)
         MaskMessages.events.profileNFTsTabUpdated.sendToLocal('reset')
     })
 
@@ -60,53 +85,53 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
     }, [identity])
 
     useUpdateEffect(() => {
-        setCurrentTag(PageTags.NFTTag)
+        setCurrentTag(undefined)
     }, [identity.identifier])
 
-    const addressName = useMemo(() => {
-        const getAddressByType = (type: AddressNameType) => addressNames?.find((x) => x.type === type)
+    const addressNFTs = getAddressName(PageTags.NFTTag, addressNames)
+    const addressRSS3 = getAddressName(PageTags.DonationTag, addressNames)
 
-        const addressLiteral = getAddressByType(AddressNameType.ADDRESS)
-        const addressENS = getAddressByType(AddressNameType.ENS)
-        const addressUNS = getAddressByType(AddressNameType.UNS)
-        const addressGUN = getAddressByType(AddressNameType.GUN)
-        const addressRSS3 = getAddressByType(AddressNameType.RSS3)
-        const addressTheGraph = getAddressByType(AddressNameType.THE_GRAPH)
+    const { value: daoPayload, loading: loadingDAO } = useDao(identity.identifier)
+    const { value: donations, loading: loadingDonations } = useDonations(addressRSS3?.resolvedAddress ?? '')
+    const { value: footprints, loading: loadingFootprints } = useFootprints(addressRSS3?.resolvedAddress ?? '')
 
-        switch (currentTag) {
+    const currentTagComputed = currentTag ?? (addressNFTs ? PageTags.NFTTag : daoPayload ? PageTags.DAOTag : undefined)
+
+    const addressName = useMemo(() => {
+        if (!currentTagComputed) return
+        switch (currentTagComputed) {
             case PageTags.WalletTag:
                 return
             case PageTags.NFTTag:
-                return addressENS || addressUNS || addressRSS3 || addressLiteral || addressGUN || addressTheGraph
+                return addressNFTs
             case PageTags.DonationTag:
-                return addressRSS3 || addressENS || addressUNS || addressLiteral || addressGUN || addressTheGraph
+                return addressRSS3
             case PageTags.FootprintTag:
-                return addressRSS3 || addressENS || addressUNS || addressLiteral || addressGUN || addressTheGraph
+                return addressRSS3
             case PageTags.DAOTag:
                 return
             default:
-                unreachable(currentTag)
+                unreachable(currentTagComputed)
         }
-    }, [currentTag, addressNames])
-
-    const address = addressName?.resolvedAddress ?? ''
+    }, [currentTagComputed, addressNFTs, addressRSS3])
 
     const content = useMemo(() => {
-        switch (currentTag) {
+        if (!currentTagComputed) return null
+        switch (currentTagComputed) {
             case PageTags.WalletTag:
                 return <WalletsPage />
             case PageTags.NFTTag:
-                return <NFTPage address={address} />
+                return <NFTPage address={addressNFTs?.resolvedAddress ?? ''} />
             case PageTags.DonationTag:
-                return <DonationPage address={address} />
+                return <DonationPage address={addressRSS3?.resolvedAddress ?? ''} donations={donations} />
             case PageTags.FootprintTag:
-                return <FootprintPage address={address} />
+                return <FootprintPage address={addressRSS3?.resolvedAddress ?? ''} footprints={footprints} />
             case PageTags.DAOTag:
                 return <DAOPage payload={daoPayload} identifier={identity.identifier} />
             default:
-                unreachable(currentTag)
+                unreachable(currentTagComputed)
         }
-    }, [address, currentTag, daoPayload, identity.identifier])
+    }, [addressNFTs, addressRSS3, currentTagComputed, daoPayload, donations, footprints, identity.identifier])
 
     if (hidden) return null
 
@@ -123,7 +148,7 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
             </div>
         )
 
-    if (!addressName && !daoPayload)
+    if (!addressNFTs && !addressRSS3 && !daoPayload)
         return (
             <div className={classes.root}>
                 <Box
@@ -140,7 +165,15 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
         <div className={classes.root}>
             <link rel="stylesheet" href={new URL('./styles/tailwind.css', import.meta.url).toString()} />
             <div className={classes.tags}>
-                <PageTag address={address} daoPayload={daoPayload} tag={currentTag} onChange={setCurrentTag} />
+                <PageTag
+                    addressNFTs={addressNFTs}
+                    addressRSS3={addressRSS3}
+                    daoPayload={daoPayload}
+                    donations={donations}
+                    footprints={footprints}
+                    tag={currentTagComputed}
+                    onChange={setCurrentTag}
+                />
             </div>
             {addressName ? (
                 <div className={classes.metadata}>
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
index 21cf9d77e585..d72029074428 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
@@ -1,10 +1,10 @@
 import urlcat from 'urlcat'
 import { makeStyles } from '@masknet/theme'
-import { CircularProgress, Link } from '@mui/material'
-import type { GeneralAssetWithTags } from '../types'
+import { Link } from '@mui/material'
+import type { GeneralAsset, GeneralAssetWithTags } from '../types'
 import { RSS3_DEFAULT_IMAGE } from '../constants'
 import { FootprintCard } from './components'
-import { useFootprints, useRss3Profile } from './hooks'
+import { useRss3Profile } from './hooks'
 
 const useStyles = makeStyles()((theme) => ({
     address: {
@@ -30,24 +30,15 @@ const getFootprintLink = (address: string, footprint: GeneralAssetWithTags) => {
 
 export interface FootprintPageProps {
     address: string
+    footprints?: GeneralAsset[]
 }
 
 export function FootprintPage(props: FootprintPageProps) {
-    const { address } = props
+    const { address, footprints = [] } = props
     const { classes } = useStyles()
     const { value: profile } = useRss3Profile(address)
     const username = profile?.name
 
-    const { footprints, loading } = useFootprints(address)
-
-    if (loading) {
-        return (
-            <div className="flex justify-center items-center">
-                <CircularProgress />
-            </div>
-        )
-    }
-
     return (
         <section className="grid items-center justify-start grid-cols-1 gap-2 py-4">
             {footprints.map((footprint) => (
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/NFTPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/NFTPage.tsx
index 03bf9848f2ae..8f5f64b7d9d1 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/NFTPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/NFTPage.tsx
@@ -1,7 +1,5 @@
 import { getMaskColor, makeStyles, useStylesExtends } from '@masknet/theme'
-import { Box, Typography } from '@mui/material'
 import { CollectionList } from '../../../extension/options-page/DashboardComponents/CollectibleList'
-import { useI18N } from '../../../utils'
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -22,18 +20,8 @@ export interface NFTPageProps extends withClasses<'text' | 'button'> {
 
 export function NFTPage(props: NFTPageProps) {
     const { address } = props
-    const { t } = useI18N()
     const classes = useStylesExtends(useStyles(), props)
 
-    if (!address)
-        return (
-            <div className={classes.root}>
-                <Box className={classes.text} display="flex" alignItems="center" justifyContent="center">
-                    <Typography color="textSecondary">{t('dashboard_no_collectible_found')}</Typography>
-                </Box>
-            </div>
-        )
-
     return (
         <div className={classes.root}>
             <CollectionList address={address} />
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
index 80a901dacd97..2cdfa68795c2 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/PageTag.tsx
@@ -2,8 +2,9 @@ import classNames from 'classnames'
 import { makeStyles } from '@masknet/theme'
 import { Button } from '@mui/material'
 import { useI18N } from '../../../utils'
-import { PageTags } from '../types'
-import { useDonations, useFootprints, Dao_Payload } from './hooks'
+import { GeneralAsset, PageTags } from '../types'
+import type { AddressName } from '@masknet/web3-shared-evm'
+import type { Dao_Payload } from './hooks'
 
 const useStyles = makeStyles()((theme) => ({
     root: {
@@ -43,21 +44,21 @@ const useStyles = makeStyles()((theme) => ({
 }))
 
 export interface PageTagProps {
-    tag: PageTags
-    address: string
-    daoPayload: Dao_Payload | undefined
+    tag?: PageTags
+    daoPayload?: Dao_Payload
+    donations?: GeneralAsset[]
+    footprints?: GeneralAsset[]
+    addressNFTs?: AddressName
+    addressRSS3?: AddressName
     onChange: (tag: PageTags) => void
 }
 
 export function PageTag(props: PageTagProps) {
-    const { classes } = useStyles()
-    const { onChange, tag, address, daoPayload } = props
+    const { tag, daoPayload, donations, footprints, addressNFTs, addressRSS3, onChange } = props
     const { t } = useI18N()
+    const { classes } = useStyles()
 
-    const { donations } = useDonations(address)
-    const { footprints } = useFootprints(address)
-    const hasDonations = donations.length > 0
-    const hasFootprints = footprints.length > 0
+    if (!tag) return null
 
     return (
         <div className={classes.root}>
@@ -68,7 +69,7 @@ export function PageTag(props: PageTagProps) {
                 size="medium">
                 {t('wallets')}
             </Button>
-            {address ? (
+            {addressNFTs ? (
                 <Button
                     variant="outlined"
                     className={tag === PageTags.NFTTag ? classes.selected : classes.button}
@@ -77,7 +78,7 @@ export function PageTag(props: PageTagProps) {
                     {t('nfts')}
                 </Button>
             ) : null}
-            {hasDonations ? (
+            {donations?.length ? (
                 <Button
                     variant="outlined"
                     className={tag === PageTags.DonationTag ? classes.selected : classes.button}
@@ -86,7 +87,7 @@ export function PageTag(props: PageTagProps) {
                     {t('donations')}
                 </Button>
             ) : null}
-            {hasFootprints ? (
+            {footprints?.length ? (
                 <Button
                     variant="outlined"
                     className={classNames(classes.button, tag === PageTags.FootprintTag ? classes.selected : '')}
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useDonations.ts b/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useDonations.ts
index dc29236d2242..29f7f2f3ef7b 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useDonations.ts
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useDonations.ts
@@ -2,13 +2,8 @@ import { useAsync } from 'react-use'
 import { PluginProfileRPC } from '../../messages'
 
 export function useDonations(address: string) {
-    const { value: donations = [], loading } = useAsync(async () => {
-        const rsp = await PluginProfileRPC.getDonations(address)
-        return rsp.status ? rsp.assets : []
+    return useAsync(async () => {
+        const response = await PluginProfileRPC.getDonations(address)
+        return response.status ? response.assets : []
     }, [address])
-
-    return {
-        donations,
-        loading,
-    }
 }
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useFootprints.ts b/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useFootprints.ts
index 5e81e2bbc370..7fdb8e206fca 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useFootprints.ts
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/hooks/useFootprints.ts
@@ -2,13 +2,8 @@ import { useAsync } from 'react-use'
 import { PluginProfileRPC } from '../../messages'
 
 export function useFootprints(address: string) {
-    const { value: footprints = [], loading } = useAsync(async () => {
-        const rsp = await PluginProfileRPC.getFootprints(address)
-        return rsp.status ? rsp.assets : []
+    return useAsync(async () => {
+        const response = await PluginProfileRPC.getFootprints(address)
+        return response.status ? response.assets : []
     }, [address])
-
-    return {
-        footprints,
-        loading,
-    }
 }

From 07c269e250760caeb1e19ea972e047a202f4435e Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 14:16:51 +0800
Subject: [PATCH 6/7] fix: the link path of footprint

---
 packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
index d72029074428..299e0ec207a4 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
@@ -24,7 +24,7 @@ const getFootprintLink = (address: string, footprint: GeneralAssetWithTags) => {
         platform,
         identity,
         id,
-        type,
+        type: type.replaceAll('-', '.'),
     })
 }
 

From ffc449c915399562008394b20036a3c5ae32435f Mon Sep 17 00:00:00 2001
From: guanbinrui <guanbinrui@dimension.im>
Date: Fri, 24 Dec 2021 14:29:12 +0800
Subject: [PATCH 7/7] fix: the redirect bug

---
 .../plugins/Profile/SNSAdaptor/DonationsPage.tsx | 16 +++++++++-------
 .../Profile/SNSAdaptor/EnhancedProfile.tsx       |  4 ++--
 .../plugins/Profile/SNSAdaptor/FootprintPage.tsx | 16 +++++++++-------
 3 files changed, 20 insertions(+), 16 deletions(-)

diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
index 2a223556397b..04bd28ed30ae 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/DonationsPage.tsx
@@ -1,15 +1,15 @@
+import urlcat from 'urlcat'
 import { makeStyles } from '@masknet/theme'
 import { Link } from '@mui/material'
-import urlcat from 'urlcat'
+import type { AddressName } from '@masknet/web3-shared-evm'
 import type { GeneralAsset, GeneralAssetWithTags } from '../types'
 import { RSS3_DEFAULT_IMAGE } from '../constants'
 import { DonationCard } from './components'
 import { useI18N } from '../../../utils'
 
-const getDonationLink = (address: string, donation: GeneralAssetWithTags) => {
+const getDonationLink = (label: string, donation: GeneralAssetWithTags) => {
     const { platform, identity, id, type } = donation
-    return urlcat('https://rss3.bio/:address/singlegitcoin/:platform/:identity/:id/:type', {
-        address,
+    return urlcat(`https://${label}.bio/singlegitcoin/:platform/:identity/:id/:type`, {
         platform,
         identity,
         id,
@@ -29,21 +29,23 @@ const useStyles = makeStyles()((theme) => ({
 }))
 
 export interface DonationPageProps {
-    address: string
+    addressName?: AddressName
     donations?: GeneralAsset[]
 }
 
 export function DonationPage(props: DonationPageProps) {
-    const { address, donations = [] } = props
+    const { addressName, donations = [] } = props
     const { t } = useI18N()
     const { classes } = useStyles()
 
+    if (!addressName) return null
+
     return (
         <section className="grid grid-cols-1 gap-4 py-4">
             {donations.map((donation) => (
                 <Link
                     className={classes.link}
-                    href={getDonationLink(address, donation)}
+                    href={getDonationLink(addressName.label, donation)}
                     key={donation.id}
                     target="_blank"
                     rel="noopener noreferrer">
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
index 46c316daf999..f3d530424382 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/EnhancedProfile.tsx
@@ -123,9 +123,9 @@ export function EnhancedProfilePage(props: EnhancedProfilePageProps) {
             case PageTags.NFTTag:
                 return <NFTPage address={addressNFTs?.resolvedAddress ?? ''} />
             case PageTags.DonationTag:
-                return <DonationPage address={addressRSS3?.resolvedAddress ?? ''} donations={donations} />
+                return <DonationPage addressName={addressRSS3} donations={donations} />
             case PageTags.FootprintTag:
-                return <FootprintPage address={addressRSS3?.resolvedAddress ?? ''} footprints={footprints} />
+                return <FootprintPage addressName={addressRSS3} footprints={footprints} />
             case PageTags.DAOTag:
                 return <DAOPage payload={daoPayload} identifier={identity.identifier} />
             default:
diff --git a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
index 299e0ec207a4..d3c0ab8dd04b 100644
--- a/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
+++ b/packages/mask/src/plugins/Profile/SNSAdaptor/FootprintPage.tsx
@@ -1,6 +1,7 @@
 import urlcat from 'urlcat'
 import { makeStyles } from '@masknet/theme'
 import { Link } from '@mui/material'
+import type { AddressName } from '@masknet/web3-shared-evm'
 import type { GeneralAsset, GeneralAssetWithTags } from '../types'
 import { RSS3_DEFAULT_IMAGE } from '../constants'
 import { FootprintCard } from './components'
@@ -17,10 +18,9 @@ const useStyles = makeStyles()((theme) => ({
     },
 }))
 
-const getFootprintLink = (address: string, footprint: GeneralAssetWithTags) => {
+const getFootprintLink = (label: string, footprint: GeneralAssetWithTags) => {
     const { platform, identity, id, type } = footprint
-    return urlcat('https://rss3.bio/:address/singlefootprint/:platform/:identity/:id/:type', {
-        address,
+    return urlcat(`https://${label}.bio/singlefootprint/:platform/:identity/:id/:type`, {
         platform,
         identity,
         id,
@@ -29,22 +29,24 @@ const getFootprintLink = (address: string, footprint: GeneralAssetWithTags) => {
 }
 
 export interface FootprintPageProps {
-    address: string
+    addressName?: AddressName
     footprints?: GeneralAsset[]
 }
 
 export function FootprintPage(props: FootprintPageProps) {
-    const { address, footprints = [] } = props
+    const { addressName, footprints = [] } = props
     const { classes } = useStyles()
-    const { value: profile } = useRss3Profile(address)
+    const { value: profile } = useRss3Profile(addressName?.resolvedAddress ?? '')
     const username = profile?.name
 
+    if (!addressName) return null
+
     return (
         <section className="grid items-center justify-start grid-cols-1 gap-2 py-4">
             {footprints.map((footprint) => (
                 <Link
                     className={classes.link}
-                    href={getFootprintLink(address, footprint)}
+                    href={getFootprintLink(addressName.label, footprint)}
                     key={footprint.id}
                     target="_blank"
                     rel="noopener noreferrer">