Merge pull request #28164 from hungvu193/fix-19366

Fix: email is not shown in authenticator app

src/pages/settings/Security/TwoFactorAuth/Steps/VerifyStep.js

@@ -1,6 +1,7 @@
 import React, {useEffect} from 'react';
 import {withOnyx} from 'react-native-onyx';
 import {ScrollView, View} from 'react-native';
+import PropTypes from 'prop-types';
 import * as Session from '../../../../../libs/actions/Session';
 import styles from '../../../../../styles/styles';
 import Button from '../../../../../components/Button';
@@ -22,7 +23,14 @@ import {defaultAccount, TwoFactorAuthPropTypes} from '../TwoFactorAuthPropTypes'
 
 const TROUBLESHOOTING_LINK = 'https://community.expensify.com/discussion/7736/faq-troubleshooting-two-factor-authentication-issues/p1?new=1';
 
-function VerifyStep({account = defaultAccount}) {
+const defaultProps = {
+    account: defaultAccount,
+    session: {
+        email: null,
+    },
+};
+
+function VerifyStep({account, session}) {
     const {translate} = useLocalize();
 
     const formRef = React.useRef(null);
@@ -61,7 +69,7 @@ function VerifyStep({account = defaultAccount}) {
      * @returns {string}
      */
     function buildAuthenticatorUrl() {
-        return `otpauth://totp/Expensify:${account.primaryLogin}?secret=${account.twoFactorAuthSecretKey}&issuer=Expensify`;
+        return `otpauth://totp/Expensify:${account.primaryLogin || session.email}?secret=${account.twoFactorAuthSecretKey}&issuer=Expensify`;
     }
 
     return (
@@ -128,9 +136,20 @@ function VerifyStep({account = defaultAccount}) {
     );
 }
 
-VerifyStep.propTypes = TwoFactorAuthPropTypes;
+VerifyStep.propTypes = {
+    /** Information about the users account that is logging in */
+    account: TwoFactorAuthPropTypes.account,
+
+    /** Session of currently logged in user */
+    session: PropTypes.shape({
+        /** Email address */
+        email: PropTypes.string.isRequired,
+    }),
+};
+VerifyStep.defaultProps = defaultProps;
 
 // eslint-disable-next-line rulesdir/onyx-props-must-have-default
 export default withOnyx({
     account: {key: ONYXKEYS.ACCOUNT},
+    session: {key: ONYXKEYS.SESSION},
 })(VerifyStep);