Update WorkspacePageWithSections to use OpenWorkspaceView instead of fetchFreePlanVerifiedBankAccount

src/libs/actions/BankAccounts.js

@@ -321,6 +321,10 @@ function verifyIdentityForBankAccount(bankAccountID, onfidoData) {
     }, getVBBADataForOnyx());
 }
 
+function openWorkspaceView() {
+    API.read('OpenWorkspaceView');
+}
+
 export {
     addPersonalBankAccount,
     connectBankAccountManually,
@@ -333,6 +337,7 @@ export {
     updateCompanyInformationForBankAccount,
     updatePersonalInformationForBankAccount,
     updatePlaidData,
+    openWorkspaceView,
     validateBankAccount,
     verifyIdentityForBankAccount,
 };

src/pages/workspace/WorkspacePageWithSections.js

@@ -22,6 +22,8 @@ import networkPropTypes from '../../components/networkPropTypes';
 import FullPageNotFoundView from '../../components/BlockingViews/FullPageNotFoundView';
 
 const propTypes = {
+    shouldSkipVBBACall: PropTypes.bool,
+
     /** Information about the network from Onyx */
     network: networkPropTypes.isRequired,
 
@@ -38,7 +40,7 @@ const propTypes = {
     }).isRequired,
 
     /** From Onyx */
-    /** Bank account currently in setup */
+    /** Bank account attached to free plan */
     reimbursementAccount: reimbursementAccountPropTypes,
 
     /** User Data from Onyx */
@@ -71,6 +73,7 @@ const defaultProps = {
     footer: null,
     guidesCallTaskID: '',
     shouldUseScrollView: false,
+    shouldSkipVBBACall: false,
 };
 
 class WorkspacePageWithSections extends React.Component {
@@ -87,8 +90,11 @@ class WorkspacePageWithSections extends React.Component {
     }
 
     fetchData() {
-        const achState = lodashGet(this.props.reimbursementAccount, 'achData.state', '');
-        BankAccounts.fetchFreePlanVerifiedBankAccount('', achState);
+        if (this.props.shouldSkipVBBACall) {
+            return;
+        }
+
+        BankAccounts.openWorkspaceView();
     }
 
     render() {

src/pages/workspace/reimburse/WorkspaceReimbursePage.js

@@ -27,9 +27,10 @@ const WorkspaceReimbursePage = props => (
         headerText={props.translate('workspace.common.reimburse')}
         route={props.route}
         guidesCallTaskID={CONST.GUIDES_CALL_TASK_IDS.WORKSPACE_REIMBURSE}
+        shouldSkipVBBACall
     >
-        {hasVBA => (
-            <WorkspaceReimburseView policy={props.policy} hasVBA={hasVBA} />
+        {() => (
+            <WorkspaceReimburseView policy={props.policy} />
         )}
     </WorkspacePageWithSections>
 );

src/pages/workspace/reimburse/WorkspaceReimburseView.js

@@ -1,5 +1,6 @@
 import React from 'react';
 import {View} from 'react-native';
+import {withOnyx} from 'react-native-onyx';
 import PropTypes from 'prop-types';
 import lodashGet from 'lodash/get';
 import _ from 'underscore';
@@ -17,6 +18,9 @@ import compose from '../../../libs/compose';
 import * as Policy from '../../../libs/actions/Policy';
 import CONST from '../../../CONST';
 import Button from '../../../components/Button';
+import ONYXKEYS from '../../../ONYXKEYS';
+import BankAccount from '../../../libs/models/BankAccount';
+import reimbursementAccountPropTypes from '../../ReimbursementAccount/reimbursementAccountPropTypes';
 import getPermittedDecimalSeparator from '../../../libs/getPermittedDecimalSeparator';
 import {withNetwork} from '../../../components/OnyxProvider';
 import OfflineWithFeedback from '../../../components/OfflineWithFeedback';
@@ -49,12 +53,20 @@ const propTypes = {
         lastModified: PropTypes.number,
     }).isRequired,
 
+    /** From Onyx */
+    /** Bank account attached to free plan */
+    reimbursementAccount: reimbursementAccountPropTypes,
+
     /** Information about the network */
     network: networkPropTypes.isRequired,
 
     ...withLocalizePropTypes,
 };
 
+const defaultProps = {
+    reimbursementAccount: {},
+};
+
 class WorkspaceReimburseView extends React.Component {
     constructor(props) {
         super(props);
@@ -199,6 +211,8 @@ class WorkspaceReimburseView extends React.Component {
     }
 
     render() {
+        const achState = lodashGet(this.props.reimbursementAccount, 'achData.state', '');
+        const hasVBA = achState === BankAccount.STATE.OPEN;
         return (
             <>
                 <Section
@@ -267,7 +281,7 @@ class WorkspaceReimburseView extends React.Component {
                         </View>
                     </OfflineWithFeedback>
                 </Section>
-                {this.props.hasVBA ? (
+                {hasVBA ? (
                     <Section
                         title={this.props.translate('workspace.reimburse.fastReimbursementsHappyMembers')}
                         icon={Illustrations.BankUserGreen}
@@ -310,9 +324,15 @@ class WorkspaceReimburseView extends React.Component {
     }
 }
 
+WorkspaceReimburseView.defaultProps = defaultProps;
 WorkspaceReimburseView.propTypes = propTypes;
 
 export default compose(
     withLocalize,
     withNetwork(),
+    withOnyx({
+        reimbursementAccount: {
+            key: ONYXKEYS.REIMBURSEMENT_ACCOUNT,
+        },
+    }),
 )(WorkspaceReimburseView);