[Seedless Onboarding]: Settings password form

src/components/common/ConnectWallet/AccountCenter.tsx

@@ -13,7 +13,7 @@ import useAddressBook from '@/hooks/useAddressBook'
 import { type ConnectedWallet } from '@/hooks/wallets/useOnboard'
 import WalletInfo from '../WalletInfo'
 import ChainIndicator from '@/components/common/ChainIndicator'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 import SocialLoginInfo from '@/components/common/SocialLoginInfo'
 
 const AccountCenter = ({ wallet }: { wallet: ConnectedWallet }) => {
@@ -51,6 +51,8 @@ const AccountCenter = ({ wallet }: { wallet: ConnectedWallet }) => {
   const open = Boolean(anchorEl)
   const id = open ? 'simple-popover' : undefined
 
+  const isSocialLogin = isSocialLoginWallet(wallet.label)
+
   return (
     <>
       <ButtonBase onClick={handleClick} aria-describedby={id} disableRipple sx={{ alignSelf: 'stretch' }}>
@@ -82,7 +84,7 @@ const AccountCenter = ({ wallet }: { wallet: ConnectedWallet }) => {
           <Box className={css.accountContainer}>
             <ChainIndicator />
             <Box className={css.addressContainer}>
-              {wallet.label === ONBOARD_MPC_MODULE_LABEL ? (
+              {isSocialLogin ? (
                 <SocialLoginInfo wallet={wallet} chainInfo={chainInfo} />
               ) : (
                 <EthHashInfo

src/components/common/ConnectWallet/MPCLogin.tsx

@@ -13,7 +13,7 @@
 import { MPC_WALLET_EVENTS } from '@/services/analytics/events/mpcWallet'
 import useChains, { useCurrentChain } from '@/hooks/useChains'
 import { isSocialWalletEnabled } from '@/hooks/wallets/wallets'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 import { CGW_NAMES } from '@/hooks/wallets/consts'
 import { type ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'
 
@@ -58,16 +58,18 @@
   const recoverPassword = async (password: string, storeDeviceFactor: boolean) => {
     const success = await recoverFactorWithPassword(password, storeDeviceFactor)
 
     if (success) {
       onLogin?.()
     }
   }
 
+  const isSocialLogin = isSocialLoginWallet(wallet?.label)
+
   return (
     <>
       <Box sx={{ width: '100%' }}>
-        {wallet?.label === ONBOARD_MPC_MODULE_LABEL && userInfo ? (
-          <Track {...CREATE_SAFE_EVENTS.CONTINUE_TO_CREATION} label={wallet.label}>
+        {isSocialLogin && userInfo ? (
+          <Track {...CREATE_SAFE_EVENTS.CONTINUE_TO_CREATION}>
             <Button
               variant="outlined"
               sx={{ px: 2, py: 1, borderWidth: '1px !important' }}

src/components/common/NetworkSelector/index.tsx

@@ -12,7 +12,7 @@ import { useCallback } from 'react'
 import { AppRoutes } from '@/config/routes'
 import { trackEvent, OVERVIEW_EVENTS } from '@/services/analytics'
 import useWallet from '@/hooks/wallets/useWallet'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 
 const keepPathRoutes = [AppRoutes.welcome, AppRoutes.newSafe.create, AppRoutes.newSafe.load]
 
@@ -56,8 +56,10 @@ const NetworkSelector = (): ReactElement => {
     }
   }
 
+  const isSocialLogin = isSocialLoginWallet(wallet?.label)
+
   return configs.length ? (
-    <FormControl disabled={wallet?.label === ONBOARD_MPC_MODULE_LABEL}>
+    <FormControl disabled={isSocialLogin}>
       <Select
         value={chainId}
         onChange={onChange}

src/components/common/WalletInfo/index.tsx

@@ -9,7 +9,7 @@ import { useAppSelector } from '@/store'
 import { selectChainById } from '@/store/chainsSlice'
 
 import css from './styles.module.css'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 import SocialLoginInfo from '@/components/common/SocialLoginInfo'
 
 export const UNKNOWN_CHAIN_NAME = 'Unknown'
@@ -18,7 +18,7 @@ const WalletInfo = ({ wallet }: { wallet: ConnectedWallet }): ReactElement => {
   const walletChain = useAppSelector((state) => selectChainById(state, wallet.chainId))
   const prefix = walletChain?.shortName
 
-  const isSocialLogin = wallet.label === ONBOARD_MPC_MODULE_LABEL
+  const isSocialLogin = isSocialLoginWallet(wallet.label)
 
   if (isSocialLogin) {
     return (

src/components/new-safe/create/index.tsx

@@ -19,7 +19,7 @@ import CreateSafeInfos from '@/components/new-safe/create/CreateSafeInfos'
 import { type ReactElement, useMemo, useState } from 'react'
 import ExternalLink from '@/components/common/ExternalLink'
 import { HelpCenterArticle } from '@/config/constants'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 
 export type NewSafeFormData = {
   name: string
@@ -165,7 +165,8 @@ const CreateSafe = () => {
   }
 
   // Jump to review screen when using social login
-  const initialStep = wallet?.label === ONBOARD_MPC_MODULE_LABEL ? 2 : 0
+  const isSocialLogin = isSocialLoginWallet(wallet?.label)
+  const initialStep = isSocialLogin ? 2 : 0
 
   const onClose = () => {
     router.push(AppRoutes.welcome)

src/components/new-safe/create/steps/ReviewStep/index.tsx

@@ -27,7 +27,7 @@
 import { BigNumber } from 'ethers'
 import { usePendingSafe } from '../StatusStep/usePendingSafe'
 import { LATEST_SAFE_VERSION } from '@/config/constants'
-import { ONBOARD_MPC_MODULE_LABEL } from '@/services/mpc/module'
+import { isSocialLoginWallet } from '@/services/mpc/module'
 import { SPONSOR_LOGOS } from '@/components/tx/SponsoredBy'
 import Image from 'next/image'
 import { type ChainInfo } from '@safe-global/safe-gateway-typescript-sdk'
@@ -43,7 +43,7 @@
 }) => {
   const wallet = useWallet()
 
-  const isSocialLogin = wallet?.label === ONBOARD_MPC_MODULE_LABEL
+  const isSocialLogin = isSocialLoginWallet(wallet?.label)
 
   if (!isSocialLogin) {
     return (
@@ -168,7 +168,7 @@
     onSubmit(pendingSafe)
   }
 
-  const isSocialLogin = wallet?.label === ONBOARD_MPC_MODULE_LABEL
+  const isSocialLogin = isSocialLoginWallet(wallet?.label)
   const isDisabled = isWrongChain || (isSocialLogin && !willRelay)
 
   return (

src/components/settings/SignerAccountMFA/PasswordForm.test.tsx

@@ -0,0 +1,45 @@
+import { _getPasswordStrength, PasswordStrength } from '@/components/settings/SignerAccountMFA/PasswordForm'
+
+describe('_getPasswordStrength', () => {
+  it('should return weak if the value has fewer than 9 characters', () => {
+    const result = _getPasswordStrength('Testpw1!')
+
+    expect(result).toEqual(PasswordStrength.weak)
+  })
+
+  it('should return weak if the value has no uppercase letter', () => {
+    const result = _getPasswordStrength('testpassword1!')
+
+    expect(result).toEqual(PasswordStrength.weak)
+  })
+
+  it('should return weak if the value has no number', () => {
+    const result = _getPasswordStrength('Testpassword!')
+
+    expect(result).toEqual(PasswordStrength.weak)
+  })
+
+  it('should return weak if the value has no special character', () => {
+    const result = _getPasswordStrength('Testpassword123')
+
+    expect(result).toEqual(PasswordStrength.weak)
+  })
+
+  it('should return weak if the value has 12 or more characters but no uppercase letter', () => {
+    const result = _getPasswordStrength('testpassword123!')
+
+    expect(result).toEqual(PasswordStrength.weak)
+  })
+
+  it('should return medium if the value has 9 or more characters, uppercase, number and special character', () => {
+    const result = _getPasswordStrength('Testpw123!')
+
+    expect(result).toEqual(PasswordStrength.medium)
+  })
+
+  it('should return strong if the value has 12 or more characters, uppercase, number and special character', () => {
+    const result = _getPasswordStrength('Testpassword123!')
+
+    expect(result).toEqual(PasswordStrength.strong)
+  })
+})