[HOLD for payment 2024-11-11] [$250] mWeb/Chrome - Workspace Settings-Back arrow leads to the forward page instead of the back page

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.0.50
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: N/A
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):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by:
Slack conversation:

Issue found when executing PR #50307

Action Performed:

Prerequisite: The user is logged in to the app

1. Go to Settings
2. Go to Workspaces
3. Go to any workspace
4. Go to Accounting
5. Tap on "Export" menu under QuickBooks Desktop connection
6. Tap on "Export date"
7. Selecting any option from the list
8. Tap the back arrow until you reach Workspaces again

Expected Result:

The back arrow leads to the back page

Actual Result:

The back arrow leads to the forward page instead of the back page

Workaround:

Unknown

Platforms:

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

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6638967_1729272438158.50307.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021847870580076584100
• Upwork Job ID: 1847870580076584100
• Last Price Increase: 2024-10-20
• Automatic offers:
• ikevin127 | Reviewer | 104566717
• truph01 | Contributor | 104566719

Issue Owner

Current Issue Owner: @jliexpensify

[melvin-bot]

Triggered auto assignment to @dylanexpensify (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.

[melvin-bot]

Triggered auto assignment to @jliexpensify (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.

[dylanexpensify]

Hey @jliexpensify! I'm heading out on parental leave so reassigning this! TY! 🙇‍♂️

[truph01]

Edited by proposal-police: This proposal was edited at 2024-10-18 23:33:52 UTC.

Proposal

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

The back arrow leads to the forward page instead of the back page

What is the root cause of that problem?

• In this:

App/src/pages/workspace/accounting/qbd/export/QuickbooksDesktopExportPage.tsx

Line 87 in f7d08e0

onBackButtonPress={() => Navigation.goBack(ROUTES.POLICY_ACCOUNTING.getRoute(policyID))}

we call the goBack function with fallbackRoute leads to it navigates to new FullScreenNavigator instead of back to the existed one:

App/src/libs/Navigation/Navigation.ts

Lines 234 to 237 in f7d08e0

	if (shouldEnforceFallback || (isFirstRouteInNavigator && fallbackRoute)) {
	navigate(fallbackRoute, CONST.NAVIGATION.TYPE.UP);
	return;
	}

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

• Just need to use Navigation.goBack() in this case.

• The similar bug appears in other connections, such as qbo, netsuite, ... and we should fix it as well.

What alternative solutions did you explore? (Optional)

[NJ-2020]

Edited by proposal-police: This proposal was edited at 2024-10-20 05:49:59 UTC.

Proposal

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

The back arrow leads to the forward page instead of the back page

What is the root cause of that problem?

We pass fallback route to policy accounting page when when back button is pressed

App/src/pages/workspace/accounting/qbd/export/QuickbooksDesktopExportPage.tsx

Line 87 in f7d08e0

onBackButtonPress={() => Navigation.goBack(ROUTES.POLICY_ACCOUNTING.getRoute(policyID))}

Since we pass the fallbackRoute it will create a new FullScreenNavigator

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

Instead of redirecting to policy account page we can pass the backTo params since we also have this page for RHP

Navigation.goBack(route.params?.backTo);

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

Line 421 in 66cf824

[SCREENS.WORKSPACE.ACCOUNTING.QUICKBOOKS_DESKTOP_EXPORT]: {path: ROUTES.POLICY_ACCOUNTING_QUICKBOOKS_DESKTOP_EXPORT.route},

We can do the same approach in other pages like QBO, NetSuite, etc

What alternative solutions did you explore? (Optional)

[melvin-bot]

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

[melvin-bot]

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

[jliexpensify]

I'm on Android 51-1 (Pixel 7) and can inconsistently reproduce this. I'll set it as External in case @ikevin127 can consistently reproduce.

[truph01]

@ikevin127 Can you reproduce the bug?

[ikevin127]

Will attempt to reproduce and if I can will proceed with reviewing proposals, otherwise let you know.

[NJ-2020]

I've tried to reproduce the issue again with the latest main, and it's still reproducible

Screen.Recording.2024-10-22.at.21.11.52.mov

[ikevin127]

I was able to reproduce consistently even though not being able to connect Quickbooks Desktop, but the issue is present in Quickbooks Online connection as well:

android-mweb-repro.webm

Given this, I Identified the following components where the same navigation go back with fallback logic is being used and by looking at previous PRs (like this one) I couldn't find a specific reason as to why the fallback was added.

These are the components where the same logic is used:

QuickbooksImportPage
QuickbooksAdvancedPage
✅ QuickbooksExportConfigurationPage
QuickbooksDesktopAdvancedPage
QuickbooksDesktopImportPage
✅ QuickbooksDesktopExportPage

SageIntacctAdvancedPage
XeroOrganizationConfigurationPage

The only ones which lead to our issue from what I tested are the ✅ ones and I'm not saying we should remove the fallback from all of them as that would be out of scope for our issue and also we would risk regressions.

[ikevin127]

Given the context from the comment above, @truph01's proposal looks good to me since it identified the root cause and proposed a working solution which fixes our issue.

🎀👀🎀 C+ reviewed

[melvin-bot]

Triggered auto assignment to @mountiny, see https://stackoverflow.com/c/expensify/questions/7972 for more details.

[ikevin127]

@NJ-2020 Thanks for your proposal. Unfortunately it came in second, the only difference being the replacement of the fallback route with route.params?.backTo which I don't see a strong reason for, but if you think I'm missing something and having no fallback would be a bad idea, please let us know why.

[melvin-bot]

📣 @ikevin127 🎉 An offer has been automatically sent to your Upwork account for the Reviewer role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job

[melvin-bot]

📣 @truph01 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[FitseTLT]

@ikevin127 the purpose of backTo is usually to provide a fallbackRoute in the case of direct link access, especially in small screens, are you sure the proposed changes will not break that?

FYI we have an issue with the same RCA as this one and proposing a general fix that will prevent similar issues as this 👍

[ikevin127]

especially in small screens, are you sure the proposed changes will not break that?

@FitseTLT Unless you tested the selected solution in this specific issue's case and have found that it breaks something - I think we're good to go here.

I looked over at your proposal's RCA and solution from the other issue and the solution is suggesting calling goBack and navigate one after the other which means calling 2 functions, honestly I'd be reserved to move forward with that solution because it doesn't show a deep understanding of the RCA nor an elegant solution.

If CME (@mountiny) considers that we should hold for the other issue / proposed solution, I won't have anything against that - as this is not about who get's to push their solution first 👍

[truph01]

@ikevin127 I saw in this docs, connecting QBD requires Windows device but I don't have. Can you connect it?

[ikevin127]

@truph01 Wasn't able to connect QBD for the same reason but we have the same issue on Quickbooks Online integration which you should be able to connect - you can show that in your videos for the PR Checklist and make sure to apply the fix for the Quickbooks Desktop integration.

[melvin-bot]

@jliexpensify, @mountiny, @ikevin127, @truph01 Whoops! This issue is 2 days overdue. Let's get this updated quick!

[ikevin127]

Looks like PR was not opened yet. @truph01 Any updates ?

[truph01]

I am working on the PR

[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.56-9 and is now subject to a 7-day regression period 📆. Here is the list of pull requests that resolve this issue:

• fix: navigate back in export page #51446

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

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

• @ikevin127 requires payment automatic offer (Reviewer)
• @truph01 requires payment automatic offer (Contributor)

[melvin-bot]

@ikevin127 @jliexpensify 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]

[ikevin127]

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
• 2b. Reported on staging (deploy blocker)
• 2c. 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.

  1st PR: https://github.com/Expensify/App/pull/50164/files#r1828564227.
  2nd PR: https://github.com/Expensify/App/pull/46511/files#r1828564191.

• [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: Not needed as this wasn't a critical / interrupting a core flow issue.

• [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.

• [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:

• The user is logged in to the app.

Test 1

Prerequisite: User has connected to QBD.

1. Go to Settings.
2. Go to Workspaces.
3. Go to any workspace.
4. Go to Accounting.
5. Tap on "Export" menu under QuickBooks Desktop connection.
6. Tap on "Export date".
7. Selecting any option from the list.
8. Tap the back arrow until you reach Workspaces again and verify that the navigation goes back as expected with each click / tap.

Test 2

Prerequisite: User has connected to QBO.

1. Go to Settings.
2. Go to Workspaces.
3. Go to any workspace.
4. Go to Accounting.
5. Tap on "Export" menu under QuickBooks Online connection.
6. Tap on "Export date".
7. Selecting any option from the list.
8. Tap the back arrow until you reach Workspaces again and verify that the navigation goes back as expected with each click / tap.

Do we agree 👍 or 👎.

[jliexpensify]

Payment Summary

• C: @truph01 $250
• C+: @ikevin127 $250

Upwork job

[jliexpensify]

Paid and job closed!