From b66e06383fbcb23737c3547abc1899670628a3bc Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Fri, 25 Feb 2022 17:36:05 +0800
Subject: [PATCH 01/24] feat: disable add btn when sns reach limit

---
 .../src/pages/Personas/components/PersonaCard/index.tsx       | 1 +
 .../src/pages/Personas/components/PersonaLine/index.tsx       | 4 +++-
 2 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
index 55cd06a623ad..d44fbf353d06 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
@@ -112,6 +112,7 @@ export const PersonaCardUI = memo<PersonaCardUIProps>((props) => {
                             return (
                                 <ConnectedPersonaLine
                                     isHideOperations
+                                    disableAdd={currentNetworkProfiles.length >= 5}
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index 6af75bd51342..5017b9700274 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -57,10 +57,11 @@ export interface ConnectedPersonaLineProps {
     onDisconnect: (identifier: ProfileIdentifier) => void
     profileIdentifiers: ProfileIdentifier[]
     networkIdentifier: string
+    disableAdd?: boolean
 }
 
 export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
-    ({ profileIdentifiers, onConnect, onDisconnect, networkIdentifier, isHideOperations }) => {
+    ({ profileIdentifiers, onConnect, onDisconnect, networkIdentifier, isHideOperations, disableAdd }) => {
         const t = useDashboardI18N()
         const { openProfilePage } = PersonaContext.useContainer()
         const { classes } = useStyles()
@@ -98,6 +99,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                     {!isHideOperations && (
                         <Box>
                             <Link
+                                disabled={disableAdd}
                                 component="button"
                                 classes={{ button: classes.link }}
                                 variant="caption"

From 21f984f15fc5fbd3f8b9c11961eac144a8073701 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 11:59:45 +0800
Subject: [PATCH 02/24] fix: disable add

---
 .../src/pages/Personas/components/PersonaCard/Row.tsx    | 1 +
 .../src/pages/Personas/components/PersonaCard/index.tsx  | 1 -
 .../src/pages/Personas/components/PersonaLine/index.tsx  | 9 ++++++---
 3 files changed, 7 insertions(+), 4 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 7ae22ff78561..868a222c9882 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -177,6 +177,7 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                         } else {
                             return (
                                 <ConnectedPersonaLine
+                                    disableAdd={currentNetworkProfiles.length >= 5}
                                     isHideOperations={false}
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
index d44fbf353d06..55cd06a623ad 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
@@ -112,7 +112,6 @@ export const PersonaCardUI = memo<PersonaCardUIProps>((props) => {
                             return (
                                 <ConnectedPersonaLine
                                     isHideOperations
-                                    disableAdd={currentNetworkProfiles.length >= 5}
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index 5017b9700274..dbd0e5049421 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -17,6 +17,10 @@ const useStyles = makeStyles()((theme) => ({
     link: {
         height: 28,
     },
+    disabled: {
+        opacity: 0.6,
+        pointerEvents: 'none',
+    },
 }))
 export interface UnconnectedPersonaLineProps {
     onConnect: () => void
@@ -71,7 +75,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         const handleUserIdClick = async (network: string, userId: string) => {
             await openProfilePage(network, userId)
         }
-
+        console.log(disableAdd, 'ffff')
         return (
             <Box className={classes.connect} sx={{ display: 'flex', alignItems: 'center' }}>
                 <Link
@@ -99,9 +103,8 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                     {!isHideOperations && (
                         <Box>
                             <Link
-                                disabled={disableAdd}
                                 component="button"
-                                classes={{ button: classes.link }}
+                                classes={{ button: classes.link, root: disableAdd ? classes.disabled : undefined }}
                                 variant="caption"
                                 sx={{ mr: 1 }}
                                 onClick={(e: MouseEvent) => {

From c3f53c4c3a28c473ef33277a4ec60e5f2903eea7 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 13:50:03 +0800
Subject: [PATCH 03/24] fix: add persona add

---
 .../Personas/components/PersonaLine/index.tsx | 17 ++++++++++++--
 .../icons/general/NextIdPersonaVerfied.tsx    | 19 ++++++++++++++++
 .../icons/general/NextIdPersonaWarning.tsx    | 22 +++++++++++++++++++
 packages/icons/general/index.ts               |  2 ++
 4 files changed, 58 insertions(+), 2 deletions(-)
 create mode 100644 packages/icons/general/NextIdPersonaVerfied.tsx
 create mode 100644 packages/icons/general/NextIdPersonaWarning.tsx

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index dbd0e5049421..eaaeae22fed6 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -6,6 +6,7 @@ import { DisconnectProfileDialog } from '../DisconnectProfileDialog'
 import type { ProfileIdentifier } from '@masknet/shared-base'
 import { SOCIAL_MEDIA_ICON_MAPPING } from '@masknet/shared'
 import { PersonaContext } from '../../hooks/usePersonaContext'
+import { NextIdPersonaWarningIcon, NextIdPersonaVerifiedIcon } from '@masknet/icons'
 
 const useStyles = makeStyles()((theme) => ({
     connect: {
@@ -21,6 +22,11 @@ const useStyles = makeStyles()((theme) => ({
         opacity: 0.6,
         pointerEvents: 'none',
     },
+    userIdBox: {
+        display: 'flex',
+        alignItems: 'center',
+        gap: theme.spacing(0.5),
+    },
 }))
 export interface UnconnectedPersonaLineProps {
     onConnect: () => void
@@ -75,7 +81,14 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         const handleUserIdClick = async (network: string, userId: string) => {
             await openProfilePage(network, userId)
         }
-        console.log(disableAdd, 'ffff')
+        const userIdBox = (id: string, verify: boolean) => {
+            return (
+                <div className={classes.userIdBox}>
+                    <div>@{id}</div>
+                    {verify ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                </div>
+            )
+        }
         return (
             <Box className={classes.connect} sx={{ display: 'flex', alignItems: 'center' }}>
                 <Link
@@ -95,7 +108,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                                     key={x.userId}
                                     onClick={() => handleUserIdClick(networkIdentifier, x.userId)}
                                     sx={{ color: MaskColorVar.textPrimary, fontSize: 13, mr: 1, cursor: 'pointer' }}>
-                                    @{x.userId}
+                                    {userIdBox(x.userId, true)}
                                 </Typography>
                             ))}
                         </Stack>
diff --git a/packages/icons/general/NextIdPersonaVerfied.tsx b/packages/icons/general/NextIdPersonaVerfied.tsx
new file mode 100644
index 000000000000..471d84f8416a
--- /dev/null
+++ b/packages/icons/general/NextIdPersonaVerfied.tsx
@@ -0,0 +1,19 @@
+import { createIcon } from '../utils'
+import type { SvgIcon } from '@mui/material'
+
+export const NextIdPersonaVerifiedIcon: typeof SvgIcon = createIcon(
+    'NextIdPersonaVerified',
+    <g>
+        <path
+            d="M7.18617 1.49397C7.61225 0.991107 8.38783 0.991107 8.81391 1.49397L9.32729 2.09995C9.58857 2.40831 10.0016 2.54254 10.3943 2.44663L11.1658 2.25816C11.8061 2.10176 12.4335 2.55764 12.4827 3.21488L12.5418 4.00691C12.5719 4.40994 12.8272 4.76135 13.2012 4.91453L13.9362 5.21556C14.5461 5.46534 14.7858 6.20299 14.4392 6.76358L14.0215 7.4391C13.809 7.78288 13.809 8.21723 14.0215 8.56102L14.4392 9.23654C14.7858 9.79712 14.5461 10.5348 13.9362 10.7845L13.2012 11.0856C12.8272 11.2388 12.5719 11.5902 12.5418 11.9932L12.4827 12.7852C12.4335 13.4425 11.8061 13.8983 11.1658 13.742L10.3943 13.5535C10.0016 13.4576 9.58857 13.5918 9.32729 13.9002L8.81391 14.5061C8.38783 15.009 7.61225 15.009 7.18617 14.5061L6.67279 13.9002C6.41151 13.5918 5.99844 13.4576 5.6058 13.5535L4.83427 13.742C4.19402 13.8983 3.56655 13.4425 3.51744 12.7852L3.45828 11.9932C3.42816 11.5902 3.17286 11.2388 2.79885 11.0856L2.06388 10.7845C1.45397 10.5348 1.2143 9.79712 1.56089 9.23654L1.97856 8.56102C2.1911 8.21723 2.1911 7.78288 1.97856 7.4391L1.56089 6.76358C1.2143 6.20299 1.45397 5.46534 2.06388 5.21556L2.79885 4.91453C3.17286 4.76135 3.42816 4.40994 3.45828 4.00691L3.51744 3.21488C3.56655 2.55764 4.19402 2.10176 4.83427 2.25816L5.6058 2.44663C5.99844 2.54254 6.41151 2.40831 6.67279 2.09995L7.18617 1.49397Z"
+            fill="#1C68F3"
+        />
+        <path
+            d="M7.19992 9.40003L5.79992 8.00003L5.33325 8.4667L7.19992 10.3334L11.1999 6.33337L10.7333 5.8667L7.19992 9.40003Z"
+            fill="white"
+            stroke="white"
+            strokeWidth="0.4"
+        />
+    </g>,
+    '0 0 16 16',
+)
diff --git a/packages/icons/general/NextIdPersonaWarning.tsx b/packages/icons/general/NextIdPersonaWarning.tsx
new file mode 100644
index 000000000000..e9a6f8c80c8d
--- /dev/null
+++ b/packages/icons/general/NextIdPersonaWarning.tsx
@@ -0,0 +1,22 @@
+import { createIcon } from '../utils'
+import type { SvgIcon } from '@mui/material'
+
+export const NextIdPersonaWarningIcon: typeof SvgIcon = createIcon(
+    'NextIdPersonaWarning',
+    <g>
+        <path
+            opacity="0.2"
+            d="M7.99992 14.6667C11.6818 14.6667 14.6666 11.6819 14.6666 8.00004C14.6666 4.31814 11.6818 1.33337 7.99992 1.33337C4.31802 1.33337 1.33325 4.31814 1.33325 8.00004C1.33325 11.6819 4.31802 14.6667 7.99992 14.6667Z"
+            fill="#FFB915"
+        />
+        <path
+            d="M8.66659 7.33341C8.66659 6.96522 8.36811 6.66675 7.99992 6.66675C7.63173 6.66675 7.33325 6.96522 7.33325 7.33341V10.6667C7.33325 11.0349 7.63173 11.3334 7.99992 11.3334C8.36811 11.3334 8.66659 11.0349 8.66659 10.6667V7.33341Z"
+            fill="#FFB915"
+        />
+        <path
+            d="M8.66659 5.33341C8.66659 4.96522 8.36811 4.66675 7.99992 4.66675C7.63173 4.66675 7.33325 4.96522 7.33325 5.33341C7.33325 5.7016 7.63173 6.00008 7.99992 6.00008C8.36811 6.00008 8.66659 5.7016 8.66659 5.33341Z"
+            fill="#FFB915"
+        />
+    </g>,
+    '0 0 16 16',
+)
diff --git a/packages/icons/general/index.ts b/packages/icons/general/index.ts
index 53d34c78d71c..4a7dd23302db 100644
--- a/packages/icons/general/index.ts
+++ b/packages/icons/general/index.ts
@@ -89,3 +89,5 @@ export * from './Cram'
 export * from './TriangleWarning'
 export * from './OpenSeaColoredIcon'
 export * from './Collectible'
+export * from './NextIdPersonaVerfied'
+export * from './NextIdPersonaWarning'

From 527d2b7f69f7ed6c69279e6469ef57ed8cfc814d Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 15:37:34 +0800
Subject: [PATCH 04/24] fix: change opensea.io to opensea in persona page

---
 .../src/pages/Personas/components/PersonaSetup/index.tsx        | 2 +-
 packages/dashboard/src/pages/Personas/index.tsx                 | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaSetup/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaSetup/index.tsx
index 66806d56f944..50670ba9fe2b 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaSetup/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaSetup/index.tsx
@@ -40,7 +40,7 @@ export const PersonaSetup = memo(({ networkIdentifier, onConnect }: PersonaSetup
                 <LinkIcon color="primary" fontSize="inherit" style={{ fill: 'none' }} viewBox="0 0 36 36" />
             </div>
             <Typography variant="body2" sx={{ marginTop: 2.5, marginBottom: 2.5 }}>
-                {t.personas_setup_connect_tips({ type: networkIdentifier.replace('.com', '') })}
+                {t.personas_setup_connect_tips({ type: networkIdentifier.split('.')[0] })}
             </Typography>
             <Button className={classes.button} onClick={onConnect}>
                 {t.personas_setup_connect()}
diff --git a/packages/dashboard/src/pages/Personas/index.tsx b/packages/dashboard/src/pages/Personas/index.tsx
index 2964f52df5a5..b708110038ce 100644
--- a/packages/dashboard/src/pages/Personas/index.tsx
+++ b/packages/dashboard/src/pages/Personas/index.tsx
@@ -90,7 +90,7 @@ function Personas() {
                                     key={networkIdentifier}
                                     value={networkIdentifier}
                                     // They should be localized
-                                    label={capitalize(networkIdentifier.replace('.com', ''))}
+                                    label={capitalize(networkIdentifier.split('.')[0])}
                                 />
                             ))}
                         </Tabs>

From 991c6842ee7dfcac762ca53412c1f49f85abd8e6 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 16:41:02 +0800
Subject: [PATCH 05/24] fix: fix

---
 .../src/pages/Personas/components/PersonaLine/index.tsx   | 8 +++++---
 1 file changed, 5 insertions(+), 3 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index eaaeae22fed6..d52f0c97dcf6 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -81,11 +81,13 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         const handleUserIdClick = async (network: string, userId: string) => {
             await openProfilePage(network, userId)
         }
-        const userIdBox = (id: string, verify: boolean) => {
+        const userIdBox = (id: string) => {
+            const verifed = false
+            // temp here, further change to get proof verified
             return (
                 <div className={classes.userIdBox}>
                     <div>@{id}</div>
-                    {verify ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                    {verifed ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
                 </div>
             )
         }
@@ -108,7 +110,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                                     key={x.userId}
                                     onClick={() => handleUserIdClick(networkIdentifier, x.userId)}
                                     sx={{ color: MaskColorVar.textPrimary, fontSize: 13, mr: 1, cursor: 'pointer' }}>
-                                    {userIdBox(x.userId, true)}
+                                    {userIdBox(x.userId)}
                                 </Typography>
                             ))}
                         </Stack>

From 2331e16342f2982951ce00b8a12884de20adb7ab Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 16:46:21 +0800
Subject: [PATCH 06/24] fix: proof style

---
 .../Personas/components/PersonaLine/index.tsx     | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index d52f0c97dcf6..97a26d38cd86 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -27,6 +27,13 @@ const useStyles = makeStyles()((theme) => ({
         alignItems: 'center',
         gap: theme.spacing(0.5),
     },
+    proofIconBox: {
+        display: 'flex',
+        alignItems: 'center',
+        ':hover': {
+            opacity: 0.8,
+        },
+    },
 }))
 export interface UnconnectedPersonaLineProps {
     onConnect: () => void
@@ -81,13 +88,19 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         const handleUserIdClick = async (network: string, userId: string) => {
             await openProfilePage(network, userId)
         }
+        const handleProofIconClick = async (e: MouseEvent) => {
+            e.stopPropagation()
+            console.log('prof')
+        }
         const userIdBox = (id: string) => {
             const verifed = false
             // temp here, further change to get proof verified
             return (
                 <div className={classes.userIdBox}>
                     <div>@{id}</div>
-                    {verifed ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                    <div className={classes.proofIconBox} onClick={(e) => handleProofIconClick(e)}>
+                        {verifed ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                    </div>
                 </div>
             )
         }

From 3c69762e9efd02727f51c417047ef5e1a7a1a74f Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 16:58:20 +0800
Subject: [PATCH 07/24] fix: typo

---
 .../src/pages/Personas/components/PersonaLine/index.tsx       | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index 97a26d38cd86..f44291150ca7 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -93,13 +93,13 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
             console.log('prof')
         }
         const userIdBox = (id: string) => {
-            const verifed = false
+            const verified = false
             // temp here, further change to get proof verified
             return (
                 <div className={classes.userIdBox}>
                     <div>@{id}</div>
                     <div className={classes.proofIconBox} onClick={(e) => handleProofIconClick(e)}>
-                        {verifed ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                        {verified ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
                     </div>
                 </div>
             )

From d1fafa81b196ba41391a70ba48c4d4d3e0b412b7 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 17:07:41 +0800
Subject: [PATCH 08/24] fix: typo

---
 .../{NextIdPersonaVerfied.tsx => NextIdPersonaVerified.tsx}     | 0
 packages/icons/general/index.ts                                 | 2 +-
 2 files changed, 1 insertion(+), 1 deletion(-)
 rename packages/icons/general/{NextIdPersonaVerfied.tsx => NextIdPersonaVerified.tsx} (100%)

diff --git a/packages/icons/general/NextIdPersonaVerfied.tsx b/packages/icons/general/NextIdPersonaVerified.tsx
similarity index 100%
rename from packages/icons/general/NextIdPersonaVerfied.tsx
rename to packages/icons/general/NextIdPersonaVerified.tsx
diff --git a/packages/icons/general/index.ts b/packages/icons/general/index.ts
index 4a7dd23302db..a3d4ce6901cf 100644
--- a/packages/icons/general/index.ts
+++ b/packages/icons/general/index.ts
@@ -89,5 +89,5 @@ export * from './Cram'
 export * from './TriangleWarning'
 export * from './OpenSeaColoredIcon'
 export * from './Collectible'
-export * from './NextIdPersonaVerfied'
+export * from './NextIdPersonaVerified'
 export * from './NextIdPersonaWarning'

From 07783b4927b3aface7d4af3e95b701e7a9038114 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 28 Feb 2022 17:39:12 +0800
Subject: [PATCH 09/24] fix: modify dashboard persona text

---
 packages/dashboard/src/locales/en-US.json            |  5 +++--
 .../components/DisconnectProfileDialog/index.tsx     | 12 +++++++-----
 .../pages/Personas/components/PersonaLine/index.tsx  |  2 +-
 3 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/packages/dashboard/src/locales/en-US.json b/packages/dashboard/src/locales/en-US.json
index cd54f3a28465..90c61d0bb82f 100644
--- a/packages/dashboard/src/locales/en-US.json
+++ b/packages/dashboard/src/locales/en-US.json
@@ -219,8 +219,9 @@
     "personas_add_persona": "Add Persona",
     "personas_back_up": "Back Up",
     "personas_connect_to": "Connect to {{internalName}}",
-    "personas_disconnect": "Disconnect",
-    "personas_disconnect_warning": "Are you sure you want to disconnect the {{network}} account of {{userId}}? After disconnection, this account will no longer be able to decrypt and encrypt any information with Mask Network.",
+    "personas_disconnect": "Delete Persona Verification",
+    "personas_disconnect_raw": "Disconnect",
+    "personas_disconnect_warning": "Are you sure you want to delete persona verification?  Your mask friends can no longer send decrypted message to you by this persona or check your Web 3 products related with this persona.",
     "personas_logout_warning": "After logging out, your associated social accounts can no longer decrypt past encrypted messages. If you need to reuse your account, you can use your private key for recovery.",
     "personas_add": "Add",
     "personas_upload_avatar": "Upload an avatar",
diff --git a/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx b/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
index 65bfcd47b6e3..5bcd13095aaa 100644
--- a/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
@@ -12,6 +12,10 @@ const useStyles = makeStyles()((theme) => ({
             fill: getMaskColor(theme).orangeMain,
         },
     },
+    personaTextZone: {
+        marginTop: theme.spacing(4),
+        fontSize: '13px',
+    },
 }))
 
 interface DisconnectProfileDialogProps {
@@ -70,7 +74,7 @@ export const DisconnectProfileDialog = ({
                                             setProfileIdentifier(x)
                                             setCurrentStep(steps.action)
                                         }}>
-                                        {t.personas_disconnect()}
+                                        {t.personas_disconnect_raw()}
                                     </Link>
                                 </Box>
                             </Stack>
@@ -83,11 +87,9 @@ export const DisconnectProfileDialog = ({
                             <WarningIcon className={classes.svg} sx={{ fontSize: 64 }} color="warning" />
                         </Box>
                         <Typography variant="caption" sx={{ color: MaskColorVar.textPrimary, fontSize: 13, mr: 1 }}>
-                            {t.personas_disconnect_warning({
-                                userId: profileIdentifier?.userId ?? '',
-                                network: networkIdentifier,
-                            })}
+                            {t.personas_disconnect_warning()}
                         </Typography>
+                        <div className={classes.personaTextZone}>persona: xxxxxxxxxxxxx</div>
                         <Stack mt={3} mb={1} direction="row" justifyContent="space-around" gap={4}>
                             <Button sx={{ flex: 1 }} onClick={onClose} color="secondary">
                                 {t.cancel()}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index f44291150ca7..a3b2b024d819 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -147,7 +147,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                                 classes={{ button: classes.link }}
                                 variant="caption"
                                 onClick={() => setOpenDisconnectDialog(true)}>
-                                {t.personas_disconnect()}
+                                {t.personas_disconnect_raw()}
                             </Link>
                         </Box>
                     )}

From f9d2a6abc03f7b1f8174cabcd31603254575fbf7 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Wed, 2 Mar 2022 16:20:17 +0800
Subject: [PATCH 10/24] feat: verification added

---
 .../Personas/components/PersonaCard/Row.tsx   | 15 +++++++--
 .../Personas/components/PersonaLine/index.tsx | 31 +++++++++++++------
 .../pages/Personas/hooks/usePersonaContext.ts | 14 ++++++++-
 packages/shared-base/src/NextID/type.ts       |  4 +++
 4 files changed, 51 insertions(+), 13 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 868a222c9882..495f8bea32e8 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -3,7 +3,13 @@ import { makeStyles, MaskColorVar } from '@masknet/theme'
 import { PublicKeyIcon, SettingsIcon } from '@masknet/icons'
 import { Box, IconButton, MenuItem, Stack, Typography } from '@mui/material'
 import { ConnectedPersonaLine, UnconnectedPersonaLine } from '../PersonaLine'
-import { PersonaIdentifier, ProfileIdentifier, ProfileInformation, DashboardRoutes } from '@masknet/shared-base'
+import {
+    PersonaIdentifier,
+    ProfileIdentifier,
+    ProfileInformation,
+    DashboardRoutes,
+    NextIDPersonaBindings,
+} from '@masknet/shared-base'
 import { useMenu } from '@masknet/shared'
 import { useDashboardI18N } from '../../../../locales'
 import { PersonaContext } from '../../hooks/usePersonaContext'
@@ -54,13 +60,14 @@ const MenuText = styled('span')(`
 `)
 
 export const PersonaRowCard = memo(() => {
-    const { currentPersona, connectPersona, disconnectPersona, renamePersona, definedSocialNetworks } =
+    const { currentPersona, connectPersona, disconnectPersona, renamePersona, definedSocialNetworks, verification } =
         PersonaContext.useContainer()
 
     if (!currentPersona) return null
 
     return (
         <PersonaRowCardUI
+            verification={verification}
             nickname={currentPersona.nickname}
             identifier={currentPersona.identifier}
             profiles={currentPersona.linkedProfiles}
@@ -80,6 +87,7 @@ export interface PersonaRowCardUIProps {
     onConnect: (identifier: PersonaIdentifier, networkIdentifier: string) => void
     onDisconnect: (identifier: ProfileIdentifier) => void
     onRename: (identifier: PersonaIdentifier, target: string, callback?: () => void) => Promise<void>
+    verification?: NextIDPersonaBindings
 }
 
 export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
@@ -88,7 +96,7 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
     const { classes } = useStyles()
     const { confirmPassword } = useContext(UserContext)
 
-    const { nickname, definedSocialNetworks, identifier, profiles } = props
+    const { nickname, definedSocialNetworks, identifier, profiles, verification } = props
     const { onConnect, onDisconnect, onRename } = props
 
     const [avatarOn, toggleAvatar] = useToggle(false)
@@ -177,6 +185,7 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                         } else {
                             return (
                                 <ConnectedPersonaLine
+                                    verification={verification}
                                     disableAdd={currentNetworkProfiles.length >= 5}
                                     isHideOperations={false}
                                     key={networkIdentifier}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index a3b2b024d819..fc52ec762ef9 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -3,7 +3,7 @@ import { Box, Button, Link, Stack, Typography } from '@mui/material'
 import { getMaskColor, MaskColorVar, makeStyles } from '@masknet/theme'
 import { useDashboardI18N } from '../../../../locales'
 import { DisconnectProfileDialog } from '../DisconnectProfileDialog'
-import type { ProfileIdentifier } from '@masknet/shared-base'
+import type { NextIDPersonaBindings, ProfileIdentifier } from '@masknet/shared-base'
 import { SOCIAL_MEDIA_ICON_MAPPING } from '@masknet/shared'
 import { PersonaContext } from '../../hooks/usePersonaContext'
 import { NextIdPersonaWarningIcon, NextIdPersonaVerifiedIcon } from '@masknet/icons'
@@ -75,10 +75,19 @@ export interface ConnectedPersonaLineProps {
     profileIdentifiers: ProfileIdentifier[]
     networkIdentifier: string
     disableAdd?: boolean
+    verification?: NextIDPersonaBindings
 }
 
 export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
-    ({ profileIdentifiers, onConnect, onDisconnect, networkIdentifier, isHideOperations, disableAdd }) => {
+    ({
+        profileIdentifiers,
+        onConnect,
+        onDisconnect,
+        networkIdentifier,
+        isHideOperations,
+        disableAdd,
+        verification,
+    }) => {
         const t = useDashboardI18N()
         const { openProfilePage } = PersonaContext.useContainer()
         const { classes } = useStyles()
@@ -90,16 +99,20 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         }
         const handleProofIconClick = async (e: MouseEvent) => {
             e.stopPropagation()
-            console.log('prof')
         }
-        const userIdBox = (id: string) => {
-            const verified = false
-            // temp here, further change to get proof verified
+        const userIdBox = (profile: any) => {
+            const verified = verification?.proofs.find((x) => {
+                return x.platform === profile.network.split('.')[0] && x.identity === profile.userId.toLowerCase()
+            })
             return (
                 <div className={classes.userIdBox}>
-                    <div>@{id}</div>
+                    <div>@{profile.userId}</div>
                     <div className={classes.proofIconBox} onClick={(e) => handleProofIconClick(e)}>
-                        {verified ? <NextIdPersonaVerifiedIcon /> : <NextIdPersonaWarningIcon />}
+                        {verified === undefined ? null : verified ? (
+                            <NextIdPersonaVerifiedIcon />
+                        ) : (
+                            <NextIdPersonaWarningIcon />
+                        )}
                     </div>
                 </div>
             )
@@ -123,7 +136,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                                     key={x.userId}
                                     onClick={() => handleUserIdClick(networkIdentifier, x.userId)}
                                     sx={{ color: MaskColorVar.textPrimary, fontSize: 13, mr: 1, cursor: 'pointer' }}>
-                                    {userIdBox(x.userId)}
+                                    {userIdBox(x)}
                                 </Typography>
                             ))}
                         </Stack>
diff --git a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
index a5b55219216f..36e95dce6588 100644
--- a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
@@ -4,16 +4,27 @@ import { useConnectSocialNetwork, useDisconnectSocialNetwork, useOpenProfilePage
 import { Services } from '../../../API'
 import { useOwnedPersonas, useDefinedSocialNetworkUIs, SocialNetwork, useCurrentPersonaIdentifier } from '../api'
 import { useCreatePersona } from './useCreatePersona'
+import { queryExistedBindingByPersona } from '@masknet/web3-providers'
+import { useAsync, useAsyncRetry } from 'react-use'
+import type { ECKeyIdentifier } from '@masknet/shared-base'
 
 function usePersonaContext() {
     const currentPersonaIdentifier = useCurrentPersonaIdentifier()
     const definedSocialNetworks: SocialNetwork[] = useDefinedSocialNetworkUIs()
-
     const personas = useOwnedPersonas()
     const currentPersona = personas.find((x) => x.identifier.equals(currentPersonaIdentifier))
 
     const [open, setOpen] = useState(false)
 
+    const personaPublicKey = useAsync(async () => {
+        return Services.Identity.queryPersona(currentPersonaIdentifier as ECKeyIdentifier)
+    }, [currentPersonaIdentifier]).value?.publicHexKey
+    const verification = useAsyncRetry(async () => {
+        return queryExistedBindingByPersona(personaPublicKey as string)
+    }, [personaPublicKey]).value
+
+    console.log(verification, 'verification')
+
     const [, connectPersona] = useConnectSocialNetwork()
     const [, openProfilePage] = useOpenProfilePage()
     const [, disconnectPersona] = useDisconnectSocialNetwork()
@@ -33,6 +44,7 @@ function usePersonaContext() {
         openProfilePage,
         drawerOpen: open,
         toggleDrawer: () => setOpen((e) => !e),
+        verification,
     }
 }
 
diff --git a/packages/shared-base/src/NextID/type.ts b/packages/shared-base/src/NextID/type.ts
index c80d44f9528d..2324ea0a861b 100644
--- a/packages/shared-base/src/NextID/type.ts
+++ b/packages/shared-base/src/NextID/type.ts
@@ -21,6 +21,10 @@ export interface NextIDPersonaBindings {
     proofs: {
         platform: string
         identity: string
+        created_at: string
+        invalid_reason: string
+        is_valid: boolean
+        laset_checked_at: string
     }[]
 }
 

From 1f4b1afc354e25d76ef38d38f9e6280cd4bbd87f Mon Sep 17 00:00:00 2001
From: Lantt <laanfor@gmail.com>
Date: Wed, 2 Mar 2022 17:29:56 +0800
Subject: [PATCH 11/24] fix: should not set setup status when use another
 persona connect

---
 packages/mask/src/components/DataSource/useNextID.ts | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/packages/mask/src/components/DataSource/useNextID.ts b/packages/mask/src/components/DataSource/useNextID.ts
index cc57b68e16ac..f4fe8706a8e0 100644
--- a/packages/mask/src/components/DataSource/useNextID.ts
+++ b/packages/mask/src/components/DataSource/useNextID.ts
@@ -46,6 +46,7 @@ export function useNextIDConnectStatus() {
     )
 
     const { value: isVerified = false } = useAsync(async () => {
+        if (lastState.status === SetupGuideStep.FindUsername) return true
         if (isOpenedVerifyDialog) return true
         if (!enableNextID || !username || !personaConnectStatus.connected) return true
 
@@ -65,6 +66,7 @@ export function useNextIDConnectStatus() {
             status: SetupGuideStep.VerifyOnNextID,
             persona: currentPersona?.identifier.toText(),
         })
+
         isOpenedVerifyDialog = true
         return false
     }, [username, enableNextID, lastStateRef.value])

From 0d19cac724a988dfc6a1d7bac759ce55bc84e4bf Mon Sep 17 00:00:00 2001
From: Lantt <laanfor@gmail.com>
Date: Wed, 2 Mar 2022 17:50:27 +0800
Subject: [PATCH 12/24] fix: pass correct persona identifier

---
 packages/mask/src/components/InjectedComponents/SetupGuide.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/mask/src/components/InjectedComponents/SetupGuide.tsx b/packages/mask/src/components/InjectedComponents/SetupGuide.tsx
index 8af270978eff..25d9bd03e074 100644
--- a/packages/mask/src/components/InjectedComponents/SetupGuide.tsx
+++ b/packages/mask/src/components/InjectedComponents/SetupGuide.tsx
@@ -128,7 +128,7 @@ function SetupGuideUI(props: SetupGuideUIProps) {
             const signResult = await Services.Identity.signWithPersona({
                 method: 'eth',
                 message: payload.signPayload,
-                identifier: persona_.publicHexKey,
+                identifier: persona_.identifier.toText(),
             })
             if (!signResult) throw new Error('Failed to sign by persona.')
             const signature = signResult.signature.signature

From 5bcdbf25d2f3d7c69784abd4c886a2d53ce87745 Mon Sep 17 00:00:00 2001
From: Lantt <laanfor@gmail.com>
Date: Fri, 4 Mar 2022 11:41:20 +0800
Subject: [PATCH 13/24] fix: should bypass dismiss verify setting on mobile

---
 packages/mask/src/settings/settings.ts | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/packages/mask/src/settings/settings.ts b/packages/mask/src/settings/settings.ts
index 12f283dde83a..896eebb20d0d 100644
--- a/packages/mask/src/settings/settings.ts
+++ b/packages/mask/src/settings/settings.ts
@@ -61,10 +61,10 @@ export const sayHelloShowed: NetworkSettings<boolean> = createNetworkSettings('s
 export const dismissPinExtensionTip = createGlobalSettings<boolean>('dismissPinExtensionTip', false, {
     primary: () => '',
 })
-export const dismissVerifyNextID: NetworkSettings<{ [key in string]: boolean }> = createNetworkSettings(
-    'dismissVerifyNextID',
-    {},
-)
+export const dismissVerifyNextID: NetworkSettings<{ [key in string]: boolean }> =
+    process.env.architecture === 'app'
+        ? createNetworkSettings('useless', false)
+        : createNetworkSettings('dismissVerifyNextID', {})
 export const bioDescription: NetworkSettings<string> = createNetworkSettings('bioDescription', '')
 export const personalHomepage: NetworkSettings<string> = createNetworkSettings('personalHomepage', '')
 // This is a misuse of concept "NetworkSettings" as "namespaced settings"

From 45a72dea568fc63dff26202b9dc0af09c14a355d Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Fri, 4 Mar 2022 17:21:15 +0800
Subject: [PATCH 14/24] fix: fix

---
 .../Personas/components/PersonaLine/index.tsx | 32 +++++++++++--------
 .../pages/Personas/hooks/usePersonaContext.ts |  2 --
 2 files changed, 18 insertions(+), 16 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index fc52ec762ef9..a8bf434ae9a1 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -97,18 +97,24 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         const handleUserIdClick = async (network: string, userId: string) => {
             await openProfilePage(network, userId)
         }
-        const handleProofIconClick = async (e: MouseEvent) => {
+        const handleProofIconClick = async (e: MouseEvent, proof: any, profile: any) => {
             e.stopPropagation()
+            if (!proof || !proof.is_valid) {
+                onConnect()
+            }
         }
         const userIdBox = (profile: any) => {
-            const verified = verification?.proofs.find((x) => {
-                return x.platform === profile.network.split('.')[0] && x.identity === profile.userId.toLowerCase()
+            const proofSupport = ['twitter.com'].includes(profile.network)
+            const proof = verification?.proofs.find((x) => {
+                return x.platform === 'twitter' && x.identity === profile.userId.toLowerCase()
             })
             return (
                 <div className={classes.userIdBox}>
                     <div>@{profile.userId}</div>
-                    <div className={classes.proofIconBox} onClick={(e) => handleProofIconClick(e)}>
-                        {verified === undefined ? null : verified ? (
+                    <div
+                        className={classes.proofIconBox}
+                        onClick={(e: MouseEvent) => handleProofIconClick(e, proof, profile)}>
+                        {!proofSupport ? null : proof?.is_valid ? (
                             <NextIdPersonaVerifiedIcon />
                         ) : (
                             <NextIdPersonaWarningIcon />
@@ -165,15 +171,13 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                         </Box>
                     )}
                 </Link>
-                {openDisconnectDialog && (
-                    <DisconnectProfileDialog
-                        networkIdentifier={networkIdentifier}
-                        onDisconnect={onDisconnect}
-                        profileIdentifiers={profileIdentifiers}
-                        open={openDisconnectDialog}
-                        onClose={() => setOpenDisconnectDialog(false)}
-                    />
-                )}
+                <DisconnectProfileDialog
+                    networkIdentifier={networkIdentifier}
+                    onDisconnect={onDisconnect}
+                    profileIdentifiers={profileIdentifiers}
+                    open={openDisconnectDialog}
+                    onClose={() => setOpenDisconnectDialog(false)}
+                />
             </Box>
         )
     },
diff --git a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
index 36e95dce6588..c8dbe0edb09f 100644
--- a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
@@ -23,8 +23,6 @@ function usePersonaContext() {
         return queryExistedBindingByPersona(personaPublicKey as string)
     }, [personaPublicKey]).value
 
-    console.log(verification, 'verification')
-
     const [, connectPersona] = useConnectSocialNetwork()
     const [, openProfilePage] = useOpenProfilePage()
     const [, disconnectPersona] = useDisconnectSocialNetwork()

From 7956d57a65e2773575d4237d4397d2258e12cadf Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Fri, 4 Mar 2022 17:46:30 +0800
Subject: [PATCH 15/24] fix: drawer

---
 .../Personas/components/PersonaCard/index.tsx      | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
index 55cd06a623ad..161209d74469 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
@@ -2,7 +2,12 @@ import { memo } from 'react'
 import { makeStyles, MaskColorVar } from '@masknet/theme'
 import { Typography } from '@mui/material'
 import { ConnectedPersonaLine, UnconnectedPersonaLine } from '../PersonaLine'
-import type { PersonaIdentifier, ProfileIdentifier, ProfileInformation } from '@masknet/shared-base'
+import type {
+    NextIDPersonaBindings,
+    PersonaIdentifier,
+    ProfileIdentifier,
+    ProfileInformation,
+} from '@masknet/shared-base'
 import { formatFingerprint } from '@masknet/shared'
 import { PersonaContext } from '../../hooks/usePersonaContext'
 import type { SocialNetwork } from '../../api'
@@ -59,11 +64,12 @@ export interface PersonaCardProps {
 }
 
 export const PersonaCard = memo<PersonaCardProps>((props) => {
-    const { connectPersona, disconnectPersona, definedSocialNetworks } = PersonaContext.useContainer()
+    const { connectPersona, disconnectPersona, definedSocialNetworks, verification } = PersonaContext.useContainer()
 
     return (
         <PersonaCardUI
             {...props}
+            verification={verification}
             onConnect={connectPersona}
             onDisconnect={disconnectPersona}
             definedSocialNetworks={definedSocialNetworks}
@@ -75,10 +81,11 @@ export interface PersonaCardUIProps extends PersonaCardProps {
     definedSocialNetworks: SocialNetwork[]
     onConnect: (identifier: PersonaIdentifier, networkIdentifier: string) => void
     onDisconnect: (identifier: ProfileIdentifier) => void
+    verification?: NextIDPersonaBindings
 }
 
 export const PersonaCardUI = memo<PersonaCardUIProps>((props) => {
-    const { nickname, active = false, definedSocialNetworks, identifier, profiles } = props
+    const { nickname, active = false, definedSocialNetworks, identifier, profiles, verification } = props
     const { onConnect, onDisconnect, onClick } = props
     const { classes } = useStyles()
 
@@ -111,6 +118,7 @@ export const PersonaCardUI = memo<PersonaCardUIProps>((props) => {
                         } else {
                             return (
                                 <ConnectedPersonaLine
+                                    verification={verification}
                                     isHideOperations
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}

From c1c126449e6d2d5ebb71a3359eb4180f0d2ddba9 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 14:45:14 +0800
Subject: [PATCH 16/24] feat: dashboard nextid delete

---
 .../Personas/components/PersonaCard/Row.tsx    | 18 +++++++++++++++---
 .../Personas/components/PersonaLine/index.tsx  | 15 ++++++++++++++-
 .../Personas/hooks/useDeleteBindingProof.ts    |  9 +++++++++
 .../pages/Personas/hooks/usePersonaContext.ts  |  3 +++
 4 files changed, 41 insertions(+), 4 deletions(-)
 create mode 100644 packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 91b33130b0eb..7b3cf474db7b 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -62,8 +62,15 @@ const MenuText = styled('span')(`
 `)
 
 export const PersonaRowCard = memo(() => {
-    const { currentPersona, connectPersona, disconnectPersona, renamePersona, definedSocialNetworks, verification } =
-        PersonaContext.useContainer()
+    const {
+        currentPersona,
+        connectPersona,
+        disconnectPersona,
+        renamePersona,
+        deleteBound,
+        definedSocialNetworks,
+        verification,
+    } = PersonaContext.useContainer()
 
     if (!currentPersona) return null
 
@@ -75,6 +82,7 @@ export const PersonaRowCard = memo(() => {
             profiles={currentPersona.linkedProfiles}
             onConnect={connectPersona}
             onDisconnect={disconnectPersona}
+            onDeleteBound={deleteBound}
             onRename={renamePersona}
             definedSocialNetworks={definedSocialNetworks}
         />
@@ -90,6 +98,7 @@ export interface PersonaRowCardUIProps {
     onDisconnect: (identifier: ProfileIdentifier) => void
     onRename: (identifier: PersonaIdentifier, target: string, callback?: () => void) => Promise<void>
     verification?: NextIDPersonaBindings
+    onDeleteBound: (identifier: PersonaIdentifier, networkIdentifier: string) => void
 }
 
 export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
@@ -99,7 +108,7 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
     const { confirmPassword } = useContext(UserContext)
 
     const { nickname, definedSocialNetworks, identifier, profiles, verification } = props
-    const { onConnect, onDisconnect, onRename } = props
+    const { onConnect, onDisconnect, onRename, onDeleteBound } = props
 
     const { value: privateKey } = useExportPrivateKey(identifier)
     const { value: words } = useExportMnemonicWords(identifier)
@@ -196,6 +205,9 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
+                                    onDeleteBound={() => {
+                                        onDeleteBound(identifier, networkIdentifier)
+                                    }}
                                     profileIdentifiers={currentNetworkProfiles.map((x) => x.identifier)}
                                     networkIdentifier={networkIdentifier}
                                 />
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index a8bf434ae9a1..e0067e315a55 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -72,6 +72,7 @@ export interface ConnectedPersonaLineProps {
     isHideOperations: boolean
     onConnect: () => void
     onDisconnect: (identifier: ProfileIdentifier) => void
+    onDeleteBound?: any
     profileIdentifiers: ProfileIdentifier[]
     networkIdentifier: string
     disableAdd?: boolean
@@ -83,6 +84,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         profileIdentifiers,
         onConnect,
         onDisconnect,
+        onDeleteBound,
         networkIdentifier,
         isHideOperations,
         disableAdd,
@@ -103,6 +105,17 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                 onConnect()
             }
         }
+
+        const handleDisconnect = (profile: ProfileIdentifier) => {
+            const isProved = verification?.proofs.find((x) => {
+                return x.platform === 'twitter' && x.identity === profile.userId.toLowerCase()
+            })
+            if (!isProved) {
+                onDisconnect(profile)
+            } else {
+                onDeleteBound(verification, profile)
+            }
+        }
         const userIdBox = (profile: any) => {
             const proofSupport = ['twitter.com'].includes(profile.network)
             const proof = verification?.proofs.find((x) => {
@@ -173,7 +186,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                 </Link>
                 <DisconnectProfileDialog
                     networkIdentifier={networkIdentifier}
-                    onDisconnect={onDisconnect}
+                    onDisconnect={(profileIdentifier) => handleDisconnect(profileIdentifier)}
                     profileIdentifiers={profileIdentifiers}
                     open={openDisconnectDialog}
                     onClose={() => setOpenDisconnectDialog(false)}
diff --git a/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts b/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
new file mode 100644
index 000000000000..2b95e0d7eae5
--- /dev/null
+++ b/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
@@ -0,0 +1,9 @@
+import type { ECKeyIdentifier } from '@masknet/shared-base'
+import { useAsyncFn } from 'react-use'
+
+export function useDeleteBound(public_key: string) {
+    console.log(public_key, 'sss')
+    return useAsyncFn(async (identifier: ECKeyIdentifier, network) => {
+        console.log('ssss', identifier, network, public_key)
+    })
+}
diff --git a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
index c8dbe0edb09f..62b5c1f79602 100644
--- a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
@@ -4,6 +4,7 @@ import { useConnectSocialNetwork, useDisconnectSocialNetwork, useOpenProfilePage
 import { Services } from '../../../API'
 import { useOwnedPersonas, useDefinedSocialNetworkUIs, SocialNetwork, useCurrentPersonaIdentifier } from '../api'
 import { useCreatePersona } from './useCreatePersona'
+import { useDeleteBound } from './useDeleteBindingProof'
 import { queryExistedBindingByPersona } from '@masknet/web3-providers'
 import { useAsync, useAsyncRetry } from 'react-use'
 import type { ECKeyIdentifier } from '@masknet/shared-base'
@@ -27,6 +28,7 @@ function usePersonaContext() {
     const [, openProfilePage] = useOpenProfilePage()
     const [, disconnectPersona] = useDisconnectSocialNetwork()
     const [, createPersona] = useCreatePersona()
+    const [, deleteBound] = useDeleteBound(personaPublicKey as string)
     const renamePersona = Services.Identity.renamePersona
     const changeCurrentPersona = useCallback(Services.Settings.setCurrentPersonaIdentifier, [])
 
@@ -36,6 +38,7 @@ function usePersonaContext() {
         createPersona,
         renamePersona,
         changeCurrentPersona,
+        deleteBound,
         currentPersona,
         definedSocialNetworks,
         personas,

From 5956ef4348d1fd356187cb3b103da59c9ec6cdb3 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 16:53:00 +0800
Subject: [PATCH 17/24] fix: disconnect

---
 .../Personas/components/PersonaCard/Row.tsx   |  6 ++---
 .../Personas/components/PersonaLine/index.tsx |  2 +-
 .../Personas/hooks/useDeleteBindingProof.ts   | 25 +++++++++++++++----
 .../pages/Personas/hooks/usePersonaContext.ts |  2 +-
 4 files changed, 25 insertions(+), 10 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 7b3cf474db7b..6443912903f9 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -98,7 +98,7 @@ export interface PersonaRowCardUIProps {
     onDisconnect: (identifier: ProfileIdentifier) => void
     onRename: (identifier: PersonaIdentifier, target: string, callback?: () => void) => Promise<void>
     verification?: NextIDPersonaBindings
-    onDeleteBound: (identifier: PersonaIdentifier, networkIdentifier: string) => void
+    onDeleteBound: (identifier: PersonaIdentifier, profile: ProfileInformation, network: string) => void
 }
 
 export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
@@ -205,8 +205,8 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
-                                    onDeleteBound={() => {
-                                        onDeleteBound(identifier, networkIdentifier)
+                                    onDeleteBound={(profile: ProfileInformation) => {
+                                        onDeleteBound(identifier, profile, networkIdentifier)
                                     }}
                                     profileIdentifiers={currentNetworkProfiles.map((x) => x.identifier)}
                                     networkIdentifier={networkIdentifier}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index e0067e315a55..6e02c829c0ce 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -113,7 +113,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
             if (!isProved) {
                 onDisconnect(profile)
             } else {
-                onDeleteBound(verification, profile)
+                onDeleteBound(profile)
             }
         }
         const userIdBox = (profile: any) => {
diff --git a/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts b/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
index 2b95e0d7eae5..e0573ca0d420 100644
--- a/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
@@ -1,9 +1,24 @@
-import type { ECKeyIdentifier } from '@masknet/shared-base'
+import { ECKeyIdentifier, NextIDAction } from '@masknet/shared-base'
+import { bindProof, createPersonaPayload } from '@masknet/web3-providers'
 import { useAsyncFn } from 'react-use'
+import { Services } from '../../../API'
 
-export function useDeleteBound(public_key: string) {
-    console.log(public_key, 'sss')
-    return useAsyncFn(async (identifier: ECKeyIdentifier, network) => {
-        console.log('ssss', identifier, network, public_key)
+export function useDeleteBound() {
+    return useAsyncFn(async (identifier: ECKeyIdentifier, profile, network) => {
+        const persona_ = await Services.Identity.queryPersona(identifier)
+        const username = profile.userId.toLowerCase()
+        const platform = network.split('.')[0] || 'twitter'
+        if (!persona_ || !persona_.publicHexKey) throw new Error('Failed to get person')
+        const payload = await createPersonaPayload(persona_.publicHexKey, NextIDAction.Delete, username, platform)
+        if (!payload) throw new Error('Failed to create persona payload.')
+        const signResult = await Services.Identity.signWithPersona({
+            method: 'eth',
+            message: payload.signPayload,
+            identifier: persona_.identifier.toText(),
+        })
+        if (!signResult) throw new Error('Failed to sign by persona.')
+        const signature = signResult.signature.signature
+        await bindProof(persona_.publicHexKey, NextIDAction.Delete, platform, username, undefined, signature, undefined)
+        await Services.Identity.detachProfile(profile)
     })
 }
diff --git a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
index 62b5c1f79602..5c4a5d20dc1a 100644
--- a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
@@ -28,7 +28,7 @@ function usePersonaContext() {
     const [, openProfilePage] = useOpenProfilePage()
     const [, disconnectPersona] = useDisconnectSocialNetwork()
     const [, createPersona] = useCreatePersona()
-    const [, deleteBound] = useDeleteBound(personaPublicKey as string)
+    const [, deleteBound] = useDeleteBound()
     const renamePersona = Services.Identity.renamePersona
     const changeCurrentPersona = useCallback(Services.Settings.setCurrentPersonaIdentifier, [])
 

From 4d91c8b9f78fce89014aa3db56ae4cc79ba1eb30 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 17:28:46 +0800
Subject: [PATCH 18/24] fix: types

---
 .../components/DisconnectProfileDialog/index.tsx     | 12 ++++++------
 .../pages/Personas/components/PersonaCard/Row.tsx    |  5 +++--
 .../pages/Personas/components/PersonaLine/index.tsx  |  7 +++++--
 3 files changed, 14 insertions(+), 10 deletions(-)

diff --git a/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx b/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
index 5bcd13095aaa..895750ea549a 100644
--- a/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/DisconnectProfileDialog/index.tsx
@@ -2,7 +2,7 @@ import { getMaskColor, makeStyles, MaskColorVar, MaskDialog } from '@masknet/the
 import { Box, Button, DialogContent, Link, Stack, Typography } from '@mui/material'
 import { useDashboardI18N } from '../../../../locales'
 import { SOCIAL_MEDIA_ICON_MAPPING } from '@masknet/shared'
-import type { ProfileIdentifier } from '@masknet/shared-base'
+import type { PersonaIdentifier, ProfileIdentifier } from '@masknet/shared-base'
 import { useState } from 'react'
 import { WarningIcon } from '@masknet/icons'
 
@@ -13,7 +13,7 @@ const useStyles = makeStyles()((theme) => ({
         },
     },
     personaTextZone: {
-        marginTop: theme.spacing(4),
+        margin: `${theme.spacing(4)} 0`,
         fontSize: '13px',
     },
 }))
@@ -24,6 +24,7 @@ interface DisconnectProfileDialogProps {
     onClose(): void
     onDisconnect: (identifier: ProfileIdentifier) => void
     profileIdentifiers: ProfileIdentifier[]
+    personaIdentifier: PersonaIdentifier
 }
 
 enum steps {
@@ -37,16 +38,15 @@ export const DisconnectProfileDialog = ({
     networkIdentifier,
     profileIdentifiers,
     onDisconnect,
+    personaIdentifier,
 }: DisconnectProfileDialogProps) => {
     const t = useDashboardI18N()
     const { classes } = useStyles()
-
     const [currentStep, setCurrentStep] = useState<steps>(steps.selection)
     const [profileIdentifier, setProfileIdentifier] = useState<ProfileIdentifier | null>()
-
     return (
         <MaskDialog open={open} title={t.personas_disconnect()} onClose={onClose}>
-            <DialogContent sx={{ width: 440 }}>
+            <DialogContent sx={{ width: 480 }}>
                 {currentStep === steps.selection && (
                     <Stack minHeight="100px" justifyContent="center">
                         {profileIdentifiers.map((x) => (
@@ -89,7 +89,7 @@ export const DisconnectProfileDialog = ({
                         <Typography variant="caption" sx={{ color: MaskColorVar.textPrimary, fontSize: 13, mr: 1 }}>
                             {t.personas_disconnect_warning()}
                         </Typography>
-                        <div className={classes.personaTextZone}>persona: xxxxxxxxxxxxx</div>
+                        <div className={classes.personaTextZone}>persona: {personaIdentifier.compressedPoint}</div>
                         <Stack mt={3} mb={1} direction="row" justifyContent="space-around" gap={4}>
                             <Button sx={{ flex: 1 }} onClick={onClose} color="secondary">
                                 {t.cancel()}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 6443912903f9..43eb0635e390 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -98,7 +98,7 @@ export interface PersonaRowCardUIProps {
     onDisconnect: (identifier: ProfileIdentifier) => void
     onRename: (identifier: PersonaIdentifier, target: string, callback?: () => void) => Promise<void>
     verification?: NextIDPersonaBindings
-    onDeleteBound: (identifier: PersonaIdentifier, profile: ProfileInformation, network: string) => void
+    onDeleteBound: (identifier: PersonaIdentifier, profile: ProfileIdentifier, network: string) => void
 }
 
 export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
@@ -205,11 +205,12 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                                     key={networkIdentifier}
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
-                                    onDeleteBound={(profile: ProfileInformation) => {
+                                    onDeleteBound={(profile: ProfileIdentifier) => {
                                         onDeleteBound(identifier, profile, networkIdentifier)
                                     }}
                                     profileIdentifiers={currentNetworkProfiles.map((x) => x.identifier)}
                                     networkIdentifier={networkIdentifier}
+                                    personaIdentifier={identifier}
                                 />
                             )
                         }
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index 6e02c829c0ce..6e1c22a93228 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -3,7 +3,7 @@ import { Box, Button, Link, Stack, Typography } from '@mui/material'
 import { getMaskColor, MaskColorVar, makeStyles } from '@masknet/theme'
 import { useDashboardI18N } from '../../../../locales'
 import { DisconnectProfileDialog } from '../DisconnectProfileDialog'
-import type { NextIDPersonaBindings, ProfileIdentifier } from '@masknet/shared-base'
+import type { NextIDPersonaBindings, PersonaIdentifier, ProfileIdentifier } from '@masknet/shared-base'
 import { SOCIAL_MEDIA_ICON_MAPPING } from '@masknet/shared'
 import { PersonaContext } from '../../hooks/usePersonaContext'
 import { NextIdPersonaWarningIcon, NextIdPersonaVerifiedIcon } from '@masknet/icons'
@@ -72,11 +72,12 @@ export interface ConnectedPersonaLineProps {
     isHideOperations: boolean
     onConnect: () => void
     onDisconnect: (identifier: ProfileIdentifier) => void
-    onDeleteBound?: any
+    onDeleteBound: (profile: ProfileIdentifier) => void
     profileIdentifiers: ProfileIdentifier[]
     networkIdentifier: string
     disableAdd?: boolean
     verification?: NextIDPersonaBindings
+    personaIdentifier: PersonaIdentifier
 }
 
 export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
@@ -89,6 +90,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
         isHideOperations,
         disableAdd,
         verification,
+        personaIdentifier,
     }) => {
         const t = useDashboardI18N()
         const { openProfilePage } = PersonaContext.useContainer()
@@ -185,6 +187,7 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
                     )}
                 </Link>
                 <DisconnectProfileDialog
+                    personaIdentifier={personaIdentifier}
                     networkIdentifier={networkIdentifier}
                     onDisconnect={(profileIdentifier) => handleDisconnect(profileIdentifier)}
                     profileIdentifiers={profileIdentifiers}

From 480e6b1b7c660a7b90bf188c2c52da7e45d90cb3 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 17:31:19 +0800
Subject: [PATCH 19/24] fix: typo

---
 packages/shared-base/src/NextID/type.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/shared-base/src/NextID/type.ts b/packages/shared-base/src/NextID/type.ts
index 2324ea0a861b..ff29fe872bd7 100644
--- a/packages/shared-base/src/NextID/type.ts
+++ b/packages/shared-base/src/NextID/type.ts
@@ -24,7 +24,7 @@ export interface NextIDPersonaBindings {
         created_at: string
         invalid_reason: string
         is_valid: boolean
-        laset_checked_at: string
+        latest_checked_at: string
     }[]
 }
 

From 575e64affc52d51a2ed8d5cf7d1c872f954a92d1 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 17:42:16 +0800
Subject: [PATCH 20/24] fix: param action

---
 .../pages/Personas/components/PersonaCard/Row.tsx  | 14 ++++++++++----
 .../Personas/components/PersonaCard/index.tsx      |  1 +
 .../Personas/components/PersonaLine/index.tsx      |  5 +++--
 ...teBindingProof.ts => useOperateBindingProof.ts} | 10 +++++-----
 .../src/pages/Personas/hooks/usePersonaContext.ts  |  6 +++---
 5 files changed, 22 insertions(+), 14 deletions(-)
 rename packages/dashboard/src/pages/Personas/hooks/{useDeleteBindingProof.ts => useOperateBindingProof.ts} (77%)

diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
index 43eb0635e390..6a8bfb8fa683 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/Row.tsx
@@ -9,6 +9,7 @@ import {
     ProfileInformation,
     DashboardRoutes,
     NextIDPersonaBindings,
+    NextIDAction,
 } from '@masknet/shared-base'
 import { useMenu } from '@masknet/shared'
 import { useDashboardI18N } from '../../../../locales'
@@ -67,7 +68,7 @@ export const PersonaRowCard = memo(() => {
         connectPersona,
         disconnectPersona,
         renamePersona,
-        deleteBound,
+        operateBound,
         definedSocialNetworks,
         verification,
     } = PersonaContext.useContainer()
@@ -82,7 +83,7 @@ export const PersonaRowCard = memo(() => {
             profiles={currentPersona.linkedProfiles}
             onConnect={connectPersona}
             onDisconnect={disconnectPersona}
-            onDeleteBound={deleteBound}
+            onDeleteBound={operateBound}
             onRename={renamePersona}
             definedSocialNetworks={definedSocialNetworks}
         />
@@ -98,7 +99,12 @@ export interface PersonaRowCardUIProps {
     onDisconnect: (identifier: ProfileIdentifier) => void
     onRename: (identifier: PersonaIdentifier, target: string, callback?: () => void) => Promise<void>
     verification?: NextIDPersonaBindings
-    onDeleteBound: (identifier: PersonaIdentifier, profile: ProfileIdentifier, network: string) => void
+    onDeleteBound: (
+        identifier: PersonaIdentifier,
+        profile: ProfileIdentifier,
+        network: string,
+        action: NextIDAction,
+    ) => void
 }
 
 export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
@@ -206,7 +212,7 @@ export const PersonaRowCardUI = memo<PersonaRowCardUIProps>((props) => {
                                     onConnect={() => onConnect(identifier, networkIdentifier)}
                                     onDisconnect={onDisconnect}
                                     onDeleteBound={(profile: ProfileIdentifier) => {
-                                        onDeleteBound(identifier, profile, networkIdentifier)
+                                        onDeleteBound(identifier, profile, networkIdentifier, NextIDAction.Delete)
                                     }}
                                     profileIdentifiers={currentNetworkProfiles.map((x) => x.identifier)}
                                     networkIdentifier={networkIdentifier}
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
index 161209d74469..79964aeea168 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaCard/index.tsx
@@ -125,6 +125,7 @@ export const PersonaCardUI = memo<PersonaCardUIProps>((props) => {
                                     onDisconnect={onDisconnect}
                                     profileIdentifiers={currentNetworkProfiles.map((x) => x.identifier)}
                                     networkIdentifier={networkIdentifier}
+                                    personaIdentifier={identifier}
                                 />
                             )
                         }
diff --git a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
index 6e1c22a93228..308cdfe5c00b 100644
--- a/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
+++ b/packages/dashboard/src/pages/Personas/components/PersonaLine/index.tsx
@@ -72,7 +72,7 @@ export interface ConnectedPersonaLineProps {
     isHideOperations: boolean
     onConnect: () => void
     onDisconnect: (identifier: ProfileIdentifier) => void
-    onDeleteBound: (profile: ProfileIdentifier) => void
+    onDeleteBound?: (profile: ProfileIdentifier) => void
     profileIdentifiers: ProfileIdentifier[]
     networkIdentifier: string
     disableAdd?: boolean
@@ -112,7 +112,8 @@ export const ConnectedPersonaLine = memo<ConnectedPersonaLineProps>(
             const isProved = verification?.proofs.find((x) => {
                 return x.platform === 'twitter' && x.identity === profile.userId.toLowerCase()
             })
-            if (!isProved) {
+
+            if (!isProved || !onDeleteBound) {
                 onDisconnect(profile)
             } else {
                 onDeleteBound(profile)
diff --git a/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts b/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
similarity index 77%
rename from packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
rename to packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
index e0573ca0d420..5e3b217c2615 100644
--- a/packages/dashboard/src/pages/Personas/hooks/useDeleteBindingProof.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
@@ -1,15 +1,15 @@
-import { ECKeyIdentifier, NextIDAction } from '@masknet/shared-base'
+import type { ECKeyIdentifier } from '@masknet/shared-base'
 import { bindProof, createPersonaPayload } from '@masknet/web3-providers'
 import { useAsyncFn } from 'react-use'
 import { Services } from '../../../API'
 
-export function useDeleteBound() {
-    return useAsyncFn(async (identifier: ECKeyIdentifier, profile, network) => {
+export function useOperateBound() {
+    return useAsyncFn(async (identifier: ECKeyIdentifier, profile, network, action) => {
         const persona_ = await Services.Identity.queryPersona(identifier)
         const username = profile.userId.toLowerCase()
         const platform = network.split('.')[0] || 'twitter'
         if (!persona_ || !persona_.publicHexKey) throw new Error('Failed to get person')
-        const payload = await createPersonaPayload(persona_.publicHexKey, NextIDAction.Delete, username, platform)
+        const payload = await createPersonaPayload(persona_.publicHexKey, action, username, platform)
         if (!payload) throw new Error('Failed to create persona payload.')
         const signResult = await Services.Identity.signWithPersona({
             method: 'eth',
@@ -18,7 +18,7 @@ export function useDeleteBound() {
         })
         if (!signResult) throw new Error('Failed to sign by persona.')
         const signature = signResult.signature.signature
-        await bindProof(persona_.publicHexKey, NextIDAction.Delete, platform, username, undefined, signature, undefined)
+        await bindProof(persona_.publicHexKey, action, platform, username, undefined, signature, undefined)
         await Services.Identity.detachProfile(profile)
     })
 }
diff --git a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
index 5c4a5d20dc1a..8694fb2117c9 100644
--- a/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/usePersonaContext.ts
@@ -4,10 +4,10 @@ import { useConnectSocialNetwork, useDisconnectSocialNetwork, useOpenProfilePage
 import { Services } from '../../../API'
 import { useOwnedPersonas, useDefinedSocialNetworkUIs, SocialNetwork, useCurrentPersonaIdentifier } from '../api'
 import { useCreatePersona } from './useCreatePersona'
-import { useDeleteBound } from './useDeleteBindingProof'
 import { queryExistedBindingByPersona } from '@masknet/web3-providers'
 import { useAsync, useAsyncRetry } from 'react-use'
 import type { ECKeyIdentifier } from '@masknet/shared-base'
+import { useOperateBound } from './useOperateBindingProof'
 
 function usePersonaContext() {
     const currentPersonaIdentifier = useCurrentPersonaIdentifier()
@@ -28,7 +28,7 @@ function usePersonaContext() {
     const [, openProfilePage] = useOpenProfilePage()
     const [, disconnectPersona] = useDisconnectSocialNetwork()
     const [, createPersona] = useCreatePersona()
-    const [, deleteBound] = useDeleteBound()
+    const [, operateBound] = useOperateBound()
     const renamePersona = Services.Identity.renamePersona
     const changeCurrentPersona = useCallback(Services.Settings.setCurrentPersonaIdentifier, [])
 
@@ -38,7 +38,7 @@ function usePersonaContext() {
         createPersona,
         renamePersona,
         changeCurrentPersona,
-        deleteBound,
+        operateBound,
         currentPersona,
         definedSocialNetworks,
         personas,

From 6ebbc590ce75f195dd1de96ec120ffe4d05cb954 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 17:58:48 +0800
Subject: [PATCH 21/24] fix: lock

---
 pnpm-lock.yaml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index cdb96108fd71..e4dd4c34be10 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -18477,7 +18477,7 @@ packages:
   /jsonfile/4.0.0:
     resolution: {integrity: sha1-h3Gq4HmbZAdrdmQPygWPnBDjPss=}
     optionalDependencies:
-      graceful-fs: 4.2.8
+      graceful-fs: 4.2.9
 
   /jsonfile/6.1.0:
     resolution: {integrity: sha512-5dgndWOriYSm5cnYaJNhalLNDKOqFwyDB/rr1E9ZsGciGvKPs8R2xYGCacuf3z6K1YKDz182fd+fY3cn3pMqXQ==}

From 953a7d7a2cc66704ff4088849f0d38e136c25b0d Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Mon, 7 Mar 2022 18:14:23 +0800
Subject: [PATCH 22/24] fix: build

---
 packages/dashboard/package.json | 1 +
 pnpm-lock.yaml                  | 2 ++
 2 files changed, 3 insertions(+)

diff --git a/packages/dashboard/package.json b/packages/dashboard/package.json
index 0e70d86be516..36604424fd9c 100644
--- a/packages/dashboard/package.json
+++ b/packages/dashboard/package.json
@@ -24,6 +24,7 @@
     "@masknet/theme": "workspace:*",
     "@masknet/web3-shared-base": "workspace:*",
     "@masknet/web3-shared-evm": "workspace:*",
+    "@masknet/web3-providers":"workspace:*",
     "@msgpack/msgpack": "^2.7.2",
     "@servie/events": "^3.0.0",
     "@types/color": "^3.0.3",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index e4dd4c34be10..bdb125363a84 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -146,6 +146,7 @@ importers:
       '@masknet/shared-base': workspace:*
       '@masknet/storybook-shared': workspace:*
       '@masknet/theme': workspace:*
+      '@masknet/web3-providers': workspace:*
       '@masknet/web3-shared-base': workspace:*
       '@masknet/web3-shared-evm': workspace:*
       '@msgpack/msgpack': ^2.7.2
@@ -200,6 +201,7 @@ importers:
       '@masknet/shared-base': link:../shared-base
       '@masknet/storybook-shared': link:../storybook-shared
       '@masknet/theme': link:../theme
+      '@masknet/web3-providers': link:../web3-providers
       '@masknet/web3-shared-base': link:../web3-shared/base
       '@masknet/web3-shared-evm': link:../web3-shared/evm
       '@msgpack/msgpack': 2.7.2

From 08562ae8f30e077cd4ad0d8481ef3d0b91f17b07 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Thu, 10 Mar 2022 14:10:43 +0800
Subject: [PATCH 23/24] fix: change warnnig icon

---
 packages/icons/general/NextIdPersonaWarning.tsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/packages/icons/general/NextIdPersonaWarning.tsx b/packages/icons/general/NextIdPersonaWarning.tsx
index e9a6f8c80c8d..5dc2cbd8b565 100644
--- a/packages/icons/general/NextIdPersonaWarning.tsx
+++ b/packages/icons/general/NextIdPersonaWarning.tsx
@@ -6,15 +6,15 @@ export const NextIdPersonaWarningIcon: typeof SvgIcon = createIcon(
     <g>
         <path
             opacity="0.2"
-            d="M7.99992 14.6667C11.6818 14.6667 14.6666 11.6819 14.6666 8.00004C14.6666 4.31814 11.6818 1.33337 7.99992 1.33337C4.31802 1.33337 1.33325 4.31814 1.33325 8.00004C1.33325 11.6819 4.31802 14.6667 7.99992 14.6667Z"
+            d="M8.00004 14.6666C11.6819 14.6666 14.6667 11.6819 14.6667 7.99998C14.6667 4.31808 11.6819 1.33331 8.00004 1.33331C4.31814 1.33331 1.33337 4.31808 1.33337 7.99998C1.33337 11.6819 4.31814 14.6666 8.00004 14.6666Z"
             fill="#FFB915"
         />
         <path
-            d="M8.66659 7.33341C8.66659 6.96522 8.36811 6.66675 7.99992 6.66675C7.63173 6.66675 7.33325 6.96522 7.33325 7.33341V10.6667C7.33325 11.0349 7.63173 11.3334 7.99992 11.3334C8.36811 11.3334 8.66659 11.0349 8.66659 10.6667V7.33341Z"
+            d="M8.66671 4.85472C8.66671 4.48653 8.36823 4.18805 8.00004 4.18805C7.63185 4.18805 7.33337 4.48653 7.33337 4.85472V8.18805C7.33337 8.55624 7.63185 8.85472 8.00004 8.85472C8.36823 8.85472 8.66671 8.55624 8.66671 8.18805V4.85472Z"
             fill="#FFB915"
         />
         <path
-            d="M8.66659 5.33341C8.66659 4.96522 8.36811 4.66675 7.99992 4.66675C7.63173 4.66675 7.33325 4.96522 7.33325 5.33341C7.33325 5.7016 7.63173 6.00008 7.99992 6.00008C8.36811 6.00008 8.66659 5.7016 8.66659 5.33341Z"
+            d="M8.66671 10.6667C8.66671 10.2985 8.36823 10 8.00004 10C7.63185 10 7.33337 10.2985 7.33337 10.6667C7.33337 11.0349 7.63185 11.3333 8.00004 11.3333C8.36823 11.3333 8.66671 11.0349 8.66671 10.6667Z"
             fill="#FFB915"
         />
     </g>,

From 4b810ac4b649608e90bd7976c3eee7d23d0b84a2 Mon Sep 17 00:00:00 2001
From: billy <Billy@mask.io>
Date: Thu, 10 Mar 2022 17:19:09 +0800
Subject: [PATCH 24/24] fix: build

---
 .../src/pages/Personas/hooks/useOperateBindingProof.ts        | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts b/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
index 5e3b217c2615..9789559471c6 100644
--- a/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
+++ b/packages/dashboard/src/pages/Personas/hooks/useOperateBindingProof.ts
@@ -18,7 +18,9 @@ export function useOperateBound() {
         })
         if (!signResult) throw new Error('Failed to sign by persona.')
         const signature = signResult.signature.signature
-        await bindProof(persona_.publicHexKey, action, platform, username, undefined, signature, undefined)
+        await bindProof(persona_.publicHexKey, action, platform, username, {
+            signature: signature,
+        })
         await Services.Identity.detachProfile(profile)
     })
 }