[$250] Expense - Back button opens same chat after opening main chat from report details page

[vincdargento]

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.1.6-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: Yes, reproducible on both
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): applausetester+sj9032@applause.expensifail.com
Issue reported by: Applause Internal Team
Device used: iPhone 15 Pro Max / iOS 18.3
App Component: Money Requests

Action Performed:

1. Launch ND or hybrid app.
2. Go to workspace chat.
3. Submit a manual expense to workspace chat.
4. Tap on the expense preview to go to expense report.
5. Tap report header.
6. Tap on the link in "From" subtitle to go back to main chat.
7. Tap app back button.

Expected Result:

App will return to the previous page which is expense report or it should go to LHN.

Actual Result:

App returns to the same main chat.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

bug.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021894825228645680995
• Upwork Job ID: 1894825228645680995
• Last Price Increase: 2025-03-05

Issue Owner

Current Issue Owner: @DylanDylann

[melvin-bot]

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

[daledah]

🚨 Edited by proposal-police: This proposal was edited at 2025-02-26 15:11:43 UTC.

Proposal

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

App returns to the same main chat.

What is the root cause of that problem?

We use goBack to REPORT_WITH_ID here

App/src/components/ParentNavigationSubtitle.tsx

Lines 48 to 51 in 2f645ba

	if (isVisibleAction) {
	// Pop the chat report screen before navigating to the linked report action.
	Navigation.goBack(ROUTES.REPORT_WITH_ID.getRoute(parentReportID, parentReportActionID));
	}

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

1. We should add new props for ParentNavigationSubtitle component like shouldUseForceReplace

2. Add shouldUseForceReplace as true in here

App/src/pages/ReportDetailsPage.tsx

Lines 821 to 826 in 2f645ba

	<ParentNavigationSubtitle
	parentNavigationSubtitleData={parentNavigationSubtitleData}
	parentReportID={report?.parentReportID}
	parentReportActionID={report?.parentReportActionID}
	pressableStyles={[styles.mt1, styles.mw100]}
	/>

3. We will use navigate with forceReplace: true if shouldWeForceReplace is true

        Navigation.navigate(ROUTES.REPORT_WITH_ID.getRoute(parentReportID, parentReportActionID), {forceReplace: true});

OR: we can backTo props

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

None

This is navigation bug no need to test. But if it needed, we can make one in NavigationTests here

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[zanyrenney]

Hmm this is finky.

[zanyrenney]

Funky 😂

[melvin-bot]

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

[melvin-bot]

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

[bernhardoj]

Proposal

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

Pressing back button arrives at the same report but without the linked action.

What is the root cause of that problem?

When we press the From "xx" text link, it will go back twice.

App/src/components/ParentNavigationSubtitle.tsx

Lines 47 to 51 in 7d0bcb4

	Navigation.goBack(ROUTES.REPORT_WITH_ID.getRoute(parentReportID));
	if (isVisibleAction) {
	// Pop the chat report screen before navigating to the linked report action.
	Navigation.goBack(ROUTES.REPORT_WITH_ID.getRoute(parentReportID, parentReportActionID));
	}

First, it goes back to the parent report, second, it goes back to the parent report with the linked action. This works fine if we press the From "xx" text link from the report header, but it becomes a problem when we do it from the report details RHP.

When we open chat report -> expense report -> report details page, the nav stack is:
[ReportsSplitNavigator: [Home, Chat Report, Expense Report], [RHP]]

The first go back will close the RHP. For the 2nd go back, it replaces the expense report with the chat report with the linked action. It's because it can't find the target screen on the stack because the params are different. The Chat Report on the stack doesn't have reportActionID param, but the target report has a reportActionID param.

App/src/libs/Navigation/Navigation.ts

Lines 281 to 289 in 7d0bcb4

	const indexOfBackToRoute = targetState.routes.findLastIndex((route) => doesRouteMatchToMinimalActionPayload(route, minimalAction, compareParams));
	const distanceToPop = targetState.routes.length - indexOfBackToRoute - 1;
	// If we need to pop more than one route from rootState, we replace the current route to not lose visited routes from the navigation state
	if (indexOfBackToRoute === -1 || (isRootNavigatorState(targetState) && distanceToPop > 1)) {
	const replaceAction = {...minimalAction, type: CONST.NAVIGATION.ACTION_TYPE.REPLACE} as NavigationAction;
	navigationRef.current.dispatch(replaceAction);
	return;
	}

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

We need to dismiss the RHP first when clicking the From "xx" text link, similar to what we did with leave room case.

App/src/pages/ReportDetailsPage.tsx

Lines 326 to 335 in 7d0bcb4

	const leaveChat = useCallback(() => {
	Navigation.dismissModal();
	Navigation.isNavigationReady().then(() => {
	if (isRootGroupChat) {
	leaveGroupChat(report.reportID);
	return;
	}
	const isWorkspaceMemberLeavingWorkspaceRoom = (report.visibility === CONST.REPORT.VISIBILITY.RESTRICTED || isPolicyExpenseChat) && isPolicyEmployee;
	leaveRoom(report.reportID, isWorkspaceMemberLeavingWorkspaceRoom);
	});

We can add a new props to the ParentNavigationSubtitle whether we want to dismiss the modal first or not.

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

I think we can test this by rendering the navigation container with report and report details screen, with 2 reports and 1 report detail on the nav stack, then when pressing the From "xx" text link, we will verify the nav stack is updated correctly that it only contains the chat report.