From 796bd352141a0c10399bcb9d6e801b74c3e4bfad Mon Sep 17 00:00:00 2001
From: schmanu <manu@safe.global>
Date: Fri, 6 Oct 2023 11:40:33 +0200
Subject: [PATCH] fix: review issues (2)

---
 .../common/ConnectWallet/MPCLogin.tsx         |  2 +-
 .../ConnectWallet/MPCWalletProvider.tsx       | 13 +++--------
 .../welcome/WelcomeLogin/WalletLogin.tsx      | 21 +++++-------------
 .../mpc/__tests__/useMPCWallet.test.ts        |  2 +-
 src/hooks/wallets/mpc/useMPCWallet.ts         | 22 ++++++-------------
 5 files changed, 17 insertions(+), 43 deletions(-)

diff --git a/src/components/common/ConnectWallet/MPCLogin.tsx b/src/components/common/ConnectWallet/MPCLogin.tsx
index 1c602202fb..e55a32647b 100644
--- a/src/components/common/ConnectWallet/MPCLogin.tsx
+++ b/src/components/common/ConnectWallet/MPCLogin.tsx
@@ -30,7 +30,7 @@ const MPCLogin = ({ onLogin }: { onLogin?: () => void }) => {
 
   return (
     <>
-      {wallet && userInfo.email ? (
+      {wallet && userInfo ? (
         <>
           <Button
             variant="outlined"
diff --git a/src/components/common/ConnectWallet/MPCWalletProvider.tsx b/src/components/common/ConnectWallet/MPCWalletProvider.tsx
index ff7b72790c..4f91450e26 100644
--- a/src/components/common/ConnectWallet/MPCWalletProvider.tsx
+++ b/src/components/common/ConnectWallet/MPCWalletProvider.tsx
@@ -1,4 +1,5 @@
 import { useMPCWallet, MPCWalletState } from '@/hooks/wallets/mpc/useMPCWallet'
+import { type UserInfo } from '@web3auth/mpc-core-kit'
 import { createContext, type ReactElement } from 'react'
 
 type MPCWalletContext = {
@@ -8,11 +9,7 @@ type MPCWalletContext = {
   upsertPasswordBackup: (password: string) => Promise<void>
   recoverFactorWithPassword: (password: string, storeDeviceFactor: boolean) => Promise<void>
   walletState: MPCWalletState
-  userInfo: {
-    email: string | undefined
-    profileImage: string | undefined
-    name: string | undefined
-  }
+  userInfo: UserInfo | undefined
 }
 
 export const MpcWalletContext = createContext<MPCWalletContext>({
@@ -22,11 +19,7 @@ export const MpcWalletContext = createContext<MPCWalletContext>({
   resetAccount: () => Promise.resolve(),
   upsertPasswordBackup: () => Promise.resolve(),
   recoverFactorWithPassword: () => Promise.resolve(),
-  userInfo: {
-    email: undefined,
-    profileImage: undefined,
-    name: undefined,
-  },
+  userInfo: undefined,
 })
 
 export const MpcWalletProvider = ({ children }: { children: ReactElement }) => {
diff --git a/src/components/welcome/WelcomeLogin/WalletLogin.tsx b/src/components/welcome/WelcomeLogin/WalletLogin.tsx
index b3e06b85db..758a3b23c7 100644
--- a/src/components/welcome/WelcomeLogin/WalletLogin.tsx
+++ b/src/components/welcome/WelcomeLogin/WalletLogin.tsx
@@ -9,15 +9,6 @@ const WalletLogin = ({ onLogin }: { onLogin?: () => void }) => {
   const wallet = useWallet()
   const connectWallet = useConnectWallet()
 
-  const connectedWalletInfo =
-    wallet !== null && wallet?.label !== ONBOARD_MPC_MODULE_LABEL
-      ? {
-          address: wallet?.address,
-          label: wallet?.label,
-          icon: wallet?.icon,
-        }
-      : undefined
-
   const [loginTriggered, setLoginTriggered] = useState(false)
 
   const login = async () => {
@@ -32,23 +23,21 @@ const WalletLogin = ({ onLogin }: { onLogin?: () => void }) => {
     }
   }, [loginTriggered, onLogin, wallet])
 
-  if (connectedWalletInfo) {
+  if (wallet !== null && wallet?.label !== ONBOARD_MPC_MODULE_LABEL) {
     return (
       <Button variant="contained" sx={{ padding: '8px 16px' }} fullWidth onClick={onLogin}>
         <Box width="100%" justifyContent="space-between" display="flex" flexDirection="row" alignItems="center" gap={1}>
           <Box display="flex" flexDirection="column" alignItems="flex-start">
             <Typography variant="subtitle2" fontWeight={700}>
-              Continue with {connectedWalletInfo.label}
+              Continue with {wallet.label}
             </Typography>
-            {connectedWalletInfo.address && (
-              <EthHashInfo address={connectedWalletInfo.address} shortAddress avatarSize={16} />
-            )}
+            {wallet.address && <EthHashInfo address={wallet.address} shortAddress avatarSize={16} />}
           </Box>
-          {connectedWalletInfo.icon && (
+          {wallet.icon && (
             <img
               width="24px"
               height="24px"
-              src={`data:image/svg+xml;utf8,${encodeURIComponent(connectedWalletInfo.icon)}`}
+              src={`data:image/svg+xml;utf8,${encodeURIComponent(wallet.icon)}`}
               alt="icon"
             />
           )}
diff --git a/src/hooks/wallets/mpc/__tests__/useMPCWallet.test.ts b/src/hooks/wallets/mpc/__tests__/useMPCWallet.test.ts
index c6af1f84dd..2b7cf6ec42 100644
--- a/src/hooks/wallets/mpc/__tests__/useMPCWallet.test.ts
+++ b/src/hooks/wallets/mpc/__tests__/useMPCWallet.test.ts
@@ -79,7 +79,7 @@ describe('useMPCWallet', () => {
   it('should have state NOT_INITIALIZED initially', () => {
     const { result } = renderHook(() => useMPCWallet())
     expect(result.current.walletState).toBe(MPCWalletState.NOT_INITIALIZED)
-    expect(result.current.userInfo.email).toBeUndefined()
+    expect(result.current.userInfo?.email).toBeUndefined()
   })
 
   describe('triggerLogin', () => {
diff --git a/src/hooks/wallets/mpc/useMPCWallet.ts b/src/hooks/wallets/mpc/useMPCWallet.ts
index 548e3c345c..9b32f78056 100644
--- a/src/hooks/wallets/mpc/useMPCWallet.ts
+++ b/src/hooks/wallets/mpc/useMPCWallet.ts
@@ -2,7 +2,7 @@ import { useState } from 'react'
 import useMPC from './useMPC'
 import BN from 'bn.js'
 import { GOOGLE_CLIENT_ID, WEB3AUTH_VERIFIER_ID } from '@/config/constants'
-import { COREKIT_STATUS, getWebBrowserFactor } from '@web3auth/mpc-core-kit'
+import { COREKIT_STATUS, getWebBrowserFactor, type UserInfo } from '@web3auth/mpc-core-kit'
 import useOnboard, { connectWallet } from '../useOnboard'
 import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
 import { SecurityQuestionRecovery } from './recovery/SecurityQuestionRecovery'
@@ -21,11 +21,7 @@ export type MPCWalletHook = {
   walletState: MPCWalletState
   triggerLogin: () => Promise<void>
   resetAccount: () => Promise<void>
-  userInfo: {
-    email: string | undefined
-    profileImage: string | undefined
-    name: string | undefined
-  }
+  userInfo: UserInfo | undefined
 }
 
 export const useMPCWallet = (): MPCWalletHook => {
@@ -83,19 +79,19 @@ export const useMPCWallet = (): MPCWalletHook => {
         }
       }
 
-      finalizeLogin()
+      await finalizeLogin()
     } catch (error) {
       setWalletState(MPCWalletState.NOT_INITIALIZED)
       console.error(error)
     }
   }
 
-  const finalizeLogin = () => {
+  const finalizeLogin = async () => {
     if (!mpcCoreKit || !onboard) {
       return
     }
     if (mpcCoreKit.status === COREKIT_STATUS.LOGGED_IN) {
-      connectWallet(onboard, {
+      await connectWallet(onboard, {
         autoSelect: {
           label: ONBOARD_MPC_MODULE_LABEL,
           disableModals: true,
@@ -122,7 +118,7 @@ export const useMPCWallet = (): MPCWalletHook => {
         await deviceShareRecovery.createAndStoreDeviceFactor()
       }
 
-      finalizeLogin()
+      await finalizeLogin()
     }
   }
 
@@ -132,10 +128,6 @@ export const useMPCWallet = (): MPCWalletHook => {
     recoverFactorWithPassword,
     resetAccount: criticalResetAccount,
     upsertPasswordBackup: () => Promise.resolve(),
-    userInfo: {
-      email: mpcCoreKit?.state.userInfo?.email,
-      profileImage: mpcCoreKit?.state.userInfo?.profileImage,
-      name: mpcCoreKit?.state.userInfo?.name,
-    },
+    userInfo: mpcCoreKit?.state.userInfo,
   }
 }