Merge pull request #4246 from Expensify/rocio-VBAVerification

Show verification modal instead of redirecting to concierge
Expensify · Aug 2, 2021 · 95f5dba · 95f5dba
2 parents 609826f + 69320a4
commit 95f5dba
Show file tree

Hide file tree

Showing 4 changed files with 72 additions and 5 deletions.
diff --git a/src/libs/actions/BankAccounts.js b/src/libs/actions/BankAccounts.js
@@ -9,7 +9,6 @@ import * as API from '../API';
 import BankAccount from '../models/BankAccount';
 import promiseAllSettled from '../promiseAllSettled';
 import Growl from '../Growl';
-import Navigation from '../Navigation/Navigation';
 import {translateLocal} from '../translate';
 
 /**
@@ -552,8 +551,11 @@ function validateBankAccount(bankAccountID, validateCode) {
         .then((response) => {
             if (response.jsonCode === 200) {
                 Growl.show('Bank Account successfully validated!', CONST.GROWL.SUCCESS, 3000);
-                Navigation.dismissModal();
-                Onyx.merge(ONYXKEYS.REIMBURSEMENT_ACCOUNT, {loading: false, error: ''});
+                API.User_IsUsingExpensifyCard()
+                    .then(({isUsingExpensifyCard}) => {
+                        Onyx.merge(ONYXKEYS.USER, {isUsingExpensifyCard});
+                        Onyx.merge(ONYXKEYS.REIMBURSEMENT_ACCOUNT, {loading: false, error: ''});
+                    });
                 return;
             }
 

diff --git a/src/pages/ReimbursementAccount/EnableStep.js b/src/pages/ReimbursementAccount/EnableStep.js
@@ -0,0 +1,56 @@
+import React from 'react';
+import {Image, View} from 'react-native';
+import styles from '../../styles/styles';
+import withLocalize, {withLocalizePropTypes} from '../../components/withLocalize';
+import {navigateToConciergeChat} from '../../libs/actions/Report';
+import HeaderWithCloseButton from '../../components/HeaderWithCloseButton';
+import Navigation from '../../libs/Navigation/Navigation';
+import Text from '../../components/Text';
+import CONST from '../../CONST';
+import TextLink from '../../components/TextLink';
+import compose from '../../libs/compose';
+
+const propTypes = {
+    ...withLocalizePropTypes,
+};
+
+const EnableStep = ({translate}) => {
+    const verifyingUrl = `${CONST.CLOUDFRONT_URL}/images/icons/emptystates/emptystate_reviewing.gif`;
+    return (
+        <View style={[styles.flex1, styles.justifyContentBetween]}>
+            <HeaderWithCloseButton
+                title={translate('validationStep.headerTitle')}
+                onCloseButtonPress={Navigation.dismissModal}
+            />
+            <View style={[styles.flex1]}>
+                <Image
+                    source={{uri: verifyingUrl}}
+                    style={[styles.workspaceInviteWelcome]}
+                    resizeMode="center"
+                />
+                <Text style={[styles.mh5, styles.mb5]}>
+                    {translate('validationStep.reviewingInfo')}
+                    <TextLink
+                        onPress={() => {
+                            // There are two modals that must be dismissed before we can reveal the Concierge
+                            // chat underneath these screens
+                            Navigation.dismissModal();
+                            Navigation.dismissModal();
+                            navigateToConciergeChat();
+                        }}
+                    >
+                        {translate('common.here')}
+                    </TextLink>
+                    {translate('validationStep.forNextSteps')}
+                </Text>
+            </View>
+        </View>
+    );
+};
+
+EnableStep.propTypes = propTypes;
+EnableStep.displayName = 'EnableStep';
+
+export default compose(
+    withLocalize,
+)(EnableStep);
diff --git a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js
@@ -24,6 +24,7 @@ import CompanyStep from './CompanyStep';
 import RequestorStep from './RequestorStep';
 import ValidationStep from './ValidationStep';
 import BeneficialOwnersStep from './BeneficialOwnersStep';
+import EnableStep from './EnableStep';
 import ROUTES from '../../ROUTES';
 import HeaderWithCloseButton from '../../components/HeaderWithCloseButton';
 
@@ -232,6 +233,11 @@ class ReimbursementAccountPage extends React.Component {
                             error={error}
                         />
                     )}
+                    {currentStep === CONST.BANK_ACCOUNT.STEP.ENABLE && (
+                        <EnableStep
+                            achData={this.props.reimbursementAccount.achData}
+                        />
+                    )}
                 </KeyboardAvoidingView>
             </ScreenWrapper>
         );

diff --git a/src/pages/workspace/WorkspaceCardPage.js b/src/pages/workspace/WorkspaceCardPage.js
@@ -22,6 +22,7 @@ import CONST from '../../CONST';
 import Permissions from '../../libs/Permissions';
 import HeroCardWebImage from '../../../assets/images/cascading-cards-web.svg';
 import HeroCardMobileImage from '../../../assets/images/cascading-cards-mobile.svg';
+import BankAccount from '../../libs/models/BankAccount';
 import {openSignedInLink} from '../../libs/actions/App';
 
 const propTypes = {
@@ -72,13 +73,15 @@ const WorkspaceCardPage = ({
     isSmallScreenWidth,
     reimbursementAccount,
 }) => {
-    const isVerifying = lodashGet(reimbursementAccount, 'achData.state', '') === CONST.BANK_ACCOUNT.STATE.VERIFYING;
+    const isVerifying = lodashGet(reimbursementAccount, 'achData.state', '') === BankAccount.STATE.VERIFYING;
+    const isNotAutoProvisioned = !user.isUsingExpensifyCard
+        && lodashGet(reimbursementAccount, 'achData.state', '') === BankAccount.STATE.OPEN;
     let buttonText;
     if (user.isFromPublicDomain) {
         buttonText = translate('workspace.card.addEmail');
     } else if (user.isUsingExpensifyCard) {
         buttonText = translate('workspace.card.manageCards');
-    } else if (isVerifying) {
+    } else if (isVerifying || isNotAutoProvisioned) {
         buttonText = translate('workspace.card.finishSetup');
     } else {
         buttonText = translate('workspace.card.getStarted');