[HOLD for payment 2024-12-07] [$250] Pay Someone - Wallet page opens when refreshing in "Validate your account" page

[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: 9.0.45-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: N/A
Email or phone of affected tester (no customers): [email protected]
Issue reported by: Applause - internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Log in with a new Gmail account
3. Complete the onboarding
4. Open DM with any user
5. Click + >. Pay someone
6. Select currency in USD, enter amount and click Next
7. Click Pay with Expensify
8. Refresh the page

Expected Result:

Wallet page is not opened. DM chat is shown

Actual Result:

The DM chat page changes to Wallet page after refreshing in "Validate your account" 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

Bug6625141_1728100368377.Screen_Recording_2024-10-05_at_6.35.48_in_the_morning.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021845915923804552896
• Upwork Job ID: 1845915923804552896
• Last Price Increase: 2024-10-21
• Automatic offers:
• alitoshmatov | Reviewer | 104631143

Issue Owner

Current Issue Owner: @slafortune

[melvin-bot]

Triggered auto assignment to @slafortune (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[lanitochka17]

@slafortune 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

[truph01]

Edited by proposal-police: This proposal was edited at 2024-10-05 16:08:40 UTC.

Proposal

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

The DM chat page changes to Wallet page after refreshing in "Validate your account" page

What is the root cause of that problem?

• We are navigating to RHN settings/wallet/verify in:

App/src/components/SettlementButton/index.tsx

Line 193 in 99f280b

Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute());

which will be mapped to wallet page.

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

• We can create a new route for the pages/settings/Wallet/VerifyAccountPage, can be settings/verify like we did in there for categories page, there for tags page and there for wallet and expensify card page.

1. In there, add:

    VERIFY_ACCOUNT: {route: 'settings/verify', getRoute: (backTo?: string) => getUrlWithBackToParam('settings/verify', backTo)},

2. In there, add:

   VERIFY_ACCOUNT: {
        VERIFY_ACCOUNT_ROOT: 'Verify_Account_Root,
    },

3. In there create new navigator:

const VerifyAccountModalStackNavigator = createModalStackNavigator({
    [SCREENS.VERIFY_ACCOUNT_ROOT]: () => require<ReactComponentModule>('../../../../pages/settings/Wallet/VerifyAccountPage').default,

4. In there add:

                   <Stack.Screen
                        name={SCREENS.RIGHT_MODAL.VERIFY_ACCOUNT}
                        component={ModalStackNavigators.VefiryAccountModalStackNavigator}
                    />

5. In there, add:

 [SCREENS.RIGHT_MODAL.VERIFY_ACCOUNT]: {
                    screens: {
                        [SCREENS.VERIFY_ACCOUNT.VERIFY_ACCOUNT_ROOT]: ROUTES.VERIFY_ACCOUNT.route,
                    },
                },

6. In there, use:

                Navigation.navigate(ROUTES.VERIFY_ACCOUNT.getRoute());

instead.

What alternative solutions did you explore? (Optional)

[twilight2294]

regression from #50169 #49523 @ikevin127 @cretadn22

[truph01]

IMO, I don't think this issue is a regression from that PR, as the issue is more of an improvement, and we can't reproduce the same behavior in production for comparison.

[truph01]

Proposal updated

[bernhardoj]

Proposal

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

Page behind RHP changes to wallet page after refresh while on the wallet verify account page.

What is the root cause of that problem?

By default, wallet verify account page is mapped to the wallet page.

App/src/libs/Navigation/linkingConfig/CENTRAL_PANE_TO_RHP_MAPPING.ts

Lines 28 to 40 in 99f280b

	[SCREENS.SETTINGS.WALLET.ROOT]: [
	SCREENS.SETTINGS.WALLET.DOMAIN_CARD,
	SCREENS.SETTINGS.WALLET.CARD_GET_PHYSICAL.NAME,
	SCREENS.SETTINGS.WALLET.CARD_GET_PHYSICAL.PHONE,
	SCREENS.SETTINGS.WALLET.CARD_GET_PHYSICAL.ADDRESS,
	SCREENS.SETTINGS.WALLET.CARD_GET_PHYSICAL.CONFIRM,
	SCREENS.SETTINGS.WALLET.TRANSFER_BALANCE,
	SCREENS.SETTINGS.WALLET.CHOOSE_TRANSFER_ACCOUNT,
	SCREENS.SETTINGS.WALLET.ENABLE_PAYMENTS,
	SCREENS.SETTINGS.WALLET.CARD_ACTIVATE,
	SCREENS.SETTINGS.WALLET.REPORT_VIRTUAL_CARD_FRAUD,
	SCREENS.SETTINGS.WALLET.CARDS_DIGITAL_DETAILS_UPDATE_ADDRESS,
	SCREENS.SETTINGS.WALLET.VERIFY_ACCOUNT,

So, refreshing it will show the matching route, that is the wallet page.

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

We can pass backTo when opening the wallet verify account page,

App/src/components/SettlementButton/index.tsx

Line 193 in 99f280b

Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute());

Navigation.navigate(ROUTES.SETTINGS_WALLET_VERIFY_ACCOUNT.getRoute(Navigation.getActiveRoute()));

so it will be used as the matching screen. In our case, the backTo is the pay someone confirm page which will return a report screen as the matching screen.

App/src/libs/Navigation/linkingConfig/getAdaptedStateFromPath.ts

Lines 112 to 125 in 99f280b

	function getMatchingRootRouteForRHPRoute(route: NavigationPartialRoute): NavigationPartialRoute<CentralPaneName | typeof NAVIGATORS.FULL_SCREEN_NAVIGATOR> | undefined {
	// Check for backTo param. One screen with different backTo value may need diferent screens visible under the overlay.
	if (route.params && 'backTo' in route.params && typeof route.params.backTo === 'string') {
	const stateForBackTo = getStateFromPath(route.params.backTo, config);
	if (stateForBackTo) {
	// If there is rhpNavigator in the state generated for backTo url, we want to get root route matching to this rhp screen.
	const rhpNavigator = stateForBackTo.routes.find((rt) => rt.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR);
	if (rhpNavigator && rhpNavigator.state) {
	const isRHPinState = stateForBackTo.routes.at(0)?.name === NAVIGATORS.RIGHT_MODAL_NAVIGATOR;
	if (isRHPinState) {
	return getMatchingRootRouteForRHPRoute(findFocusedRoute(stateForBackTo) as NavigationPartialRoute);
	}
	}

But there is currently another bug where the backTo as the matching screen doesn't work which should be handled here.

[truph01]

Proposal updated

[melvin-bot]

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

[slafortune]

@lanitochka17 Did you verify the account?

how did you refresh?

I'm not surprised that you land back on the wallet page - since you requested to pay someone but don't have anything to pay them with - you need to enter it.

[lanitochka17]

Issue is still reproducible
The account has not been verified.

Screen.Recording.2024-10-09.at.8.43.09.in.the.evening.mp4

[melvin-bot]

@slafortune Huh... This is 4 days overdue. Who can take care of this?

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021845915923804552896

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @alitoshmatov (External)

[melvin-bot]

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

[slafortune]

@alitoshmatov did you have a chance to review the proposals?

[bernhardoj]

it looks that issue is closed so has this been resolved already?

Yes, that issue has been resolved.

PR is ready

cc: @alitoshmatov

[melvin-bot]

Reviewing label has been removed, please complete the "BugZero Checklist".

[melvin-bot]

The solution for this issue has been 🚀 deployed to production 🚀 in version 9.0.68-7 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• Fix wallet page opens when refreshing in "Validate your account" page #51630

If no regressions arise, payment will be issued on 2024-12-07. 🎊

For reference, here are some details about the assignees on this issue:

• @bernhardoj requires payment through NewDot Manual Requests
• @alitoshmatov requires payment automatic offer (Reviewer)

[melvin-bot]

@alitoshmatov @slafortune @alitoshmatov The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed. Please copy/paste the BugZero Checklist from here into a new comment on this GH and complete it. If you have the K2 extension, you can simply click: [this button]

[slafortune]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production (eg. bug slipped through the normal regression and PR testing process on staging)
• 2b. Reported on staging (eg. found during regression or PR testing)
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

  Link to comment:

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

  Link to discussion:

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

Regression Test Proposal Template

• [BugZero Assignee] Create a GH issue for creating/updating the regression test once above steps have been agreed upon.

  Link to issue:

Regression Test Proposal

Precondition:

Test:

Do we agree 👍 or 👎

[slafortune]

@alitoshmatov can you please complete the checklist?

[bernhardoj]

Requested in ND.

[alitoshmatov]

BugZero Checklist:

• [Contributor] Classify the bug:

Bug classification

Source of bug:

• 1a. Result of the original design (eg. a case wasn't considered)
• 1b. Mistake during implementation
• 1c. Backend bug
• 1z. Other:

Where bug was reported:

• 2a. Reported on production (eg. bug slipped through the normal regression and PR testing process on staging)
• 2b. Reported on staging (eg. found during regression or PR testing)
• 2d. Reported on a PR
• 2z. Other:

Who reported the bug:

• 3a. Expensify user
• 3b. Expensify employee
• 3c. Contributor
• 3d. QA
• 3z. Other:

• [Contributor] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake.

  Link to comment: https://github.com/Expensify/App/pull/51267/files#r1878070220

• [Contributor] If the regression was CRITICAL (e.g. interrupts a core flow) A discussion in #expensify-open-source has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner.

  Link to discussion: No discussion

• [Contributor] If it was decided to create a regression test for the bug, please propose the regression test steps using the template below to ensure the same bug will not reach production again.

I think, no regression is needed

[alitoshmatov]

@slafortune Completed the checklist, sorry for late response

[alitoshmatov]

FYI I was assigned to the issue on 15th of October and I should receive payment in ND for any issues assigned after 2024-10-10. But payment summery is showing upwork job. Can we make sure that I receive payment in ND.

cc: @slafortune

[slafortune]

Thanks for the heads up @alitoshmatov - I canceled the upwork contract.

@bernhardoj Role Contributor- requires payment through NewDot Manual Requests - owned $250
@alitoshmatov Role C+ - requires payment through NewDot Manual Requests - owned $250

[JmillsExpensify]

$250 approved for @alitoshmatov

[JmillsExpensify]

$250 approved for @bernhardoj