diff --git a/src/libs/actions/BankAccounts.js b/src/libs/actions/BankAccounts.js index b1cb09a8a5e2..941e175b1132 100644 --- a/src/libs/actions/BankAccounts.js +++ b/src/libs/actions/BankAccounts.js @@ -57,10 +57,10 @@ function clearOnfidoToken() { /** * Helper method to build the Onyx data required during setup of a Verified Business Bank Account - * + * @param {String | undefined} currentStep The name of the bank account setup step for which we will update the draft value when we receive the response from the API. * @returns {Object} */ -function getVBBADataForOnyx() { +function getVBBADataForOnyx(currentStep = undefined) { return { optimisticData: [ { @@ -79,6 +79,12 @@ function getVBBADataForOnyx() { value: { isLoading: false, errors: null, + // When setting up a bank account, we save the draft form values in Onyx. + // When we update the information for a step, the value of some fields that are returned from the API + // can be different from the value that we stored as the draft in Onyx (i.e. the phone number is formatted). + // This is why we store the current step used to call the API in order to update the corresponding draft data in Onyx. + // If currentStep is undefined that means this step don't need to update the data of the draft in Onyx. + draftStep: currentStep, }, }, ], @@ -222,7 +228,7 @@ function deletePaymentBankAccount(bankAccountID) { * @param {Boolean} [params.isOnfidoSetupComplete] */ function updatePersonalInformationForBankAccount(params) { - API.write('UpdatePersonalInformationForBankAccount', params, getVBBADataForOnyx()); + API.write('UpdatePersonalInformationForBankAccount', params, getVBBADataForOnyx(CONST.BANK_ACCOUNT.STEP.REQUESTOR)); } /** @@ -339,7 +345,7 @@ function openReimbursementAccountPage(stepToOpen, subStep, localCurrentStep) { * @param {String} policyID */ function updateCompanyInformationForBankAccount(bankAccount, policyID) { - API.write('UpdateCompanyInformationForBankAccount', {...bankAccount, policyID}, getVBBADataForOnyx()); + API.write('UpdateCompanyInformationForBankAccount', {...bankAccount, policyID}, getVBBADataForOnyx(CONST.BANK_ACCOUNT.STEP.COMPANY)); } /** @@ -376,7 +382,7 @@ function connectBankAccountManually(bankAccountID, accountNumber, routingNumber, routingNumber, plaidMask, }, - getVBBADataForOnyx(), + getVBBADataForOnyx(CONST.BANK_ACCOUNT.STEP.BANK_ACCOUNT), ); } diff --git a/src/libs/actions/ReimbursementAccount/index.js b/src/libs/actions/ReimbursementAccount/index.js index 49ff30e7be8e..68774d0ba8b0 100644 --- a/src/libs/actions/ReimbursementAccount/index.js +++ b/src/libs/actions/ReimbursementAccount/index.js @@ -31,6 +31,7 @@ function setWorkspaceIDForReimbursementAccount(workspaceID) { */ function updateReimbursementAccountDraft(bankAccountData) { Onyx.merge(ONYXKEYS.REIMBURSEMENT_ACCOUNT_DRAFT, bankAccountData); + Onyx.merge(ONYXKEYS.REIMBURSEMENT_ACCOUNT, {draftStep: undefined}); } /** diff --git a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js index c6f53c2474f4..d78b23fdfa28 100644 --- a/src/pages/ReimbursementAccount/ReimbursementAccountPage.js +++ b/src/pages/ReimbursementAccount/ReimbursementAccountPage.js @@ -157,6 +157,12 @@ class ReimbursementAccountPage extends React.Component { return; } + // Update the data that is returned from back-end to draft value + const draftStep = this.props.reimbursementAccount.draftStep; + if (draftStep) { + BankAccounts.updateReimbursementAccountDraft(this.getBankAccountFields(this.getFieldsForStep(draftStep))); + } + const currentStepRouteParam = this.getStepToOpenFromRouteParams(); if (currentStepRouteParam === currentStep) { // The route is showing the correct step, no need to update the route param or clear errors. @@ -177,6 +183,42 @@ class ReimbursementAccountPage extends React.Component { Navigation.navigate(ROUTES.BANK_ACCOUNT_WITH_STEP_TO_OPEN.getRoute(this.getRouteForCurrentStep(currentStep), policyId, backTo)); } + getFieldsForStep(step) { + switch (step) { + case CONST.BANK_ACCOUNT.STEP.BANK_ACCOUNT: + return ['routingNumber', 'accountNumber', 'bankName', 'plaidAccountID', 'plaidAccessToken', 'isSavings']; + case CONST.BANK_ACCOUNT.STEP.COMPANY: + return [ + 'companyName', + 'addressStreet', + 'addressZipCode', + 'addressCity', + 'addressState', + 'companyPhone', + 'website', + 'companyTaxID', + 'incorporationType', + 'incorporationDate', + 'incorporationState', + ]; + case CONST.BANK_ACCOUNT.STEP.REQUESTOR: + return ['firstName', 'lastName', 'dob', 'ssnLast4', 'requestorAddressStreet', 'requestorAddressCity', 'requestorAddressState', 'requestorAddressZipCode']; + default: + return []; + } + } + + /** + * @param {Array} fieldNames + * + * @returns {*} + */ + getBankAccountFields(fieldNames) { + return { + ..._.pick(lodashGet(this.props.reimbursementAccount, 'achData'), ...fieldNames), + }; + } + /* * Calculates the state used to show the "Continue with setup" view. If a bank account setup is already in progress and * no specific further step was passed in the url we'll show the workspace bank account reset modal if the user wishes to start over