VBA - Connect Bank Account modal keeps opening until page refresh

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email [email protected] to request to join our Slack channel!

---

Version Number: 1.4.50-2
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://expensify.testrail.io/index.php?/cases/view/1971173
Issue reported by: Applause - Internal Team

Action Performed:

Precondition: User has completed Plaid flow VBA & Onfido (TR: https://expensify.testrail.io/index.php?/cases/view/1971173
)

1. On Connect bank account modal window, click 'Yes, let's chat'
2. Navigate to workspace settings > Bank account
3. Click anywhere outside the Connect bank account modal window.

Expected Result:

Connect bank account modal window closes

Actual Result:

Connect bank account modal window briefly closes and opens again, until user refresh the page

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6410086_1710183512258.bandicam_2024-03-11_20-38-38-534.mp4

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @kevinksullivan (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details.

[lanitochka17]

@kevinksullivan FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[bernhardoj]

Proposal

Please re-state the problem that we are trying to solve in this issue.

The bank account page keeps reopening when closing it.

What is the root cause of that problem?

When we press the Let's Chat button, it will navigate to the concierge chat, but the bank account page is still in the nav stack. When we revisit the bank account, it will be pushed to the top of the stack.

[RHP (bank account step), Concierge, RHP (bank account validation step)]

When we try to close the page, the 2nd bank account RHP will be unmounted and clear the bank account data.

App/src/pages/ReimbursementAccount/ReimbursementAccountPage.js

Lines 278 to 283 in b8590c9

	useEffect(
	() => {
	fetchData();
	return () => {
	BankAccounts.clearReimbursementAccount();
	};

This triggers the useEffect for the first RHP that compares the step from params and the step from bank account data Onyx.

App/src/pages/ReimbursementAccount/ReimbursementAccountPage.js

Line 252 in b8590c9

const currentStep = achData.currentStep || CONST.BANK_ACCOUNT.STEP.BANK_ACCOUNT;

App/src/pages/ReimbursementAccount/ReimbursementAccountPage.js

Lines 316 to 344 in b8590c9

	const currentStepRouteParam = getStepToOpenFromRouteParams(route);
	if (currentStepRouteParam === currentStep) {
	// If the user is connecting online with plaid, reset any bank account errors so we don't persist old data from a potential previous connection
	if (currentStep === CONST.BANK_ACCOUNT.STEP.BANK_ACCOUNT && achData.subStep === CONST.BANK_ACCOUNT.SETUP_TYPE.PLAID) {
	BankAccounts.hideBankAccountErrors();
	}
	// The route is showing the correct step, no need to update the route param or clear errors.
	return;
	}
	// Update the data that is returned from back-end to draft value
	const draftStep = reimbursementAccount.draftStep;
	if (draftStep) {
	BankAccounts.updateReimbursementAccountDraft(getBankAccountFields(getFieldsForStep(draftStep)));
	}
	if (currentStepRouteParam !== '') {
	// When we click "Connect bank account", we load the page without the current step param, if there
	// was an error when we tried to disconnect or start over, we want the user to be able to see the error,
	// so we don't clear it. We only want to clear the errors if we are moving between steps.
	BankAccounts.hideBankAccountErrors();
	}
	const backTo = lodashGet(route.params, 'backTo');
	// eslint-disable-next-line no-shadow
	const policyID = lodashGet(route.params, 'policyID');
	Navigation.navigate(ROUTES.BANK_ACCOUNT_WITH_STEP_TO_OPEN.getRoute(getRouteForCurrentStep(currentStep), policyID, backTo));

And because the onyx data is cleared, the navigation logic above is triggered (BankAccountStep !== ValidationStep), making it impossible to leave the page.

This was previously fixed in #34456, but I guess the BA refactor raised this issue again (the component that was used before the refactor is now removed).

What changes do you think we should make in order to solve the problem?

Dismiss the modal (RHP) before navigating to the concierge chat by passing true to the first param (shouldDismissModal).

App/src/pages/ReimbursementAccount/ConnectBankAccount/components/FinishChatCard.tsx

Line 30 in b8590c9

const handleNavigateToConciergeChat = () => Report.navigateToConciergeChat();

[melvin-bot]

@kevinksullivan Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[kevinksullivan]

checking on this

https://expensify.slack.com/archives/C01SKUP7QR0/p1710542480416309

[melvin-bot]

@kevinksullivan Whoops! This issue is 2 days overdue. Let's get this updated quick!

[kevinksullivan]

checking once more

https://expensify.slack.com/archives/C01SKUP7QR0/p1710884216422989

[kevinksullivan]

moving to wave-collect for now, will update if that convo linked above takes a turn though.

[kevinksullivan]

updating priority, no update.

[trjExpensify]

Did you figure out if it was reproducible on a collect workspace editor?

[melvin-bot]

This issue has not been updated in over 15 days. @kevinksullivan eroding to Monthly issue.

P.S. Is everyone reading this sure this is really a near-term priority? Be brave: if you disagree, go ahead and close it out. If someone disagrees, they'll reopen it, and if they don't: one less thing to do!

[kevinksullivan]

Sorry this one fell off. Trying to test with the testrail now and the passport photo throws an error from the testrail @lanitochka17 . Any ideas on getting around this?

[kevinksullivan]

alright, got through with my ID an was unable to reproduce.