From 1c58bf8d4533c19e4c22a1eef86262b293c25f73 Mon Sep 17 00:00:00 2001
From: Hom Yan <yanzhihong23@qq.com>
Date: Wed, 30 Mar 2022 02:10:21 +0800
Subject: [PATCH 1/2] feat: persona QR code

---
 .../src/pages/SignUp/steps/PreviewDialog.tsx      | 15 +++++++--------
 1 file changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx b/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
index 01770a118261..34dd50043f6c 100644
--- a/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
+++ b/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
@@ -3,7 +3,7 @@ import { makeStyles, MaskDialog, MaskColorVar, MaskLightTheme, useCustomSnackbar
 import { Box, Button, DialogContent, ThemeProvider, Typography } from '@mui/material'
 import { MnemonicReveal } from '../../../components/Mnemonic'
 import { MiniMaskIcon, InfoIcon, CopyIcon } from '@masknet/icons'
-import { ForwardedRef, forwardRef, useEffect, useRef } from 'react'
+import { ForwardedRef, forwardRef, useEffect, useMemo, useRef } from 'react'
 import { useReactToPrint } from 'react-to-print'
 import { toJpeg } from 'html-to-image'
 import { WatermarkURL } from '../../../assets'
@@ -107,6 +107,11 @@ const ComponentToPrint = forwardRef((props: PreviewDialogProps, ref: ForwardedRe
     const [state, copyToClipboard] = useCopyToClipboard()
     const { showSnackbar } = useCustomSnackbar()
 
+    const qrValue = useMemo(() => {
+        const main = words?.length ? `mnemonic/${btoa(words.join(' '))}` : `privatekey/${privateKey}`
+        return `mask://persona/${main}?nickname=${personaName}`
+    }, [words, privateKey, personaName])
+
     useEffect(() => {
         if (state.value) {
             showSnackbar(t.personas_export_persona_copy_success(), { variant: 'success' })
@@ -157,13 +162,7 @@ const ComponentToPrint = forwardRef((props: PreviewDialogProps, ref: ForwardedRe
                             </Typography>
                         </Box>
                     </Box>
-                    <QRCode
-                        value={`mask://persona/privatekey/${privateKey}`}
-                        ecLevel="L"
-                        size={120}
-                        quietZone={6}
-                        qrStyle="dots"
-                    />
+                    <QRCode value={qrValue} ecLevel="L" size={120} quietZone={6} qrStyle="dots" />
                 </Box>
                 {words?.length ? (
                     <>

From 4337af4a927d5433bb7c15d5a9fd2bf7631451f2 Mon Sep 17 00:00:00 2001
From: Hom <yanzhihong23@qq.com>
Date: Wed, 30 Mar 2022 20:03:26 +0800
Subject: [PATCH 2/2] chore: reply review

Co-authored-by: guanbinrui <52657989+guanbinrui@users.noreply.github.com>
---
 packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx b/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
index 34dd50043f6c..86828c94d9e3 100644
--- a/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
+++ b/packages/dashboard/src/pages/SignUp/steps/PreviewDialog.tsx
@@ -110,7 +110,7 @@ const ComponentToPrint = forwardRef((props: PreviewDialogProps, ref: ForwardedRe
     const qrValue = useMemo(() => {
         const main = words?.length ? `mnemonic/${btoa(words.join(' '))}` : `privatekey/${privateKey}`
         return `mask://persona/${main}?nickname=${personaName}`
-    }, [words, privateKey, personaName])
+    }, [words?.join(), privateKey, personaName])
 
     useEffect(() => {
         if (state.value) {