[Due for payment 2025-05-22] [$250] Expense - Background changes from Inbox to Reports after clicking Replace on the receipt view

[mitarachim]

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.38-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from TestRail: Exp
Email or phone of affected tester (no customers): applausetester+cnmnmc6@applause.expensifail.com
Issue reported by: Applause Internal Team
Device used: Mac 15.3 / Chrome
App Component: Money Requests

Action Performed:

Precondition:

• Log in with Expensifail account.

1. Go to staging.new.expensify.com
2. Go to 1:1 DM.
3. Submit two expenses to the user. At least one expense has a receipt.
4. Tap on the expense preview to go to expense report.
5. Tap on any expense with receipt.
6. Tap on the receipt.
7. Tap 3-dot menu.
8. Tap Replace.

Expected Result:

The background will not change after clicking Replace on the receipt view.

Actual Result:

The background changes to Reports after clicking Replace on the receipt view.
On narrow screen (mweb and iOS), it shows Reports screen briefly.

Workaround:

Unknown

Platforms:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6817257_1745984132925.20250430_113058.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021918130245630551268
• Upwork Job ID: 1918130245630551268
• Last Price Increase: 2025-05-02
• Automatic offers:
• nkdengineer | Contributor | 107196267

Issue Owner

Current Issue Owner: @rushatgabhane

[melvin-bot]

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

[ishakakkad]

🚨 Edited by proposal-police: This proposal was edited at 2025-04-30 05:43:44 UTC.

Proposal

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

Background changes from Inbox to Reports after clicking Replace on the receipt view

What is the root cause of that problem?

• When we click on expense from inbox it will open the side bar with /search/view/<> URL.
• on click we open AttachmentModal
• When we click on replaceReceipt button first we close the modal and then we redirect to Scan page from here.

App/src/components/AttachmentModal.tsx

Lines 539 to 546 in 4453806

	Navigation.navigate(
	ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(
	iouAction ?? CONST.IOU.ACTION.EDIT,
	iouType,
	draftTransactionID ?? transaction?.transactionID,
	report?.reportID,
	Navigation.getActiveRouteWithoutParams(),
	),

During redirect we calculate backTo getActiveRouteWithoutParams() which returns /search/view/ due to this we are seeing search page on background.

App/src/components/AttachmentModal.tsx

Line 545 in 4453806

Navigation.getActiveRouteWithoutParams(),

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

• We need to pass replaceReceiptBackTo (Or any other name) in following route
  

  App/src/ROUTES.ts

  Lines 1936 to 1947 in 4453806

  	TRANSACTION_RECEIPT: {
  	route: 'r/:reportID/transaction/:transactionID/receipt/:action?/:iouType?',
  	getRoute: (reportID: string | undefined, transactionID: string | undefined, readonly = false, isFromReviewDuplicates = false, action?: IOUAction, iouType?: IOUType) => {
  	if (!reportID) {
  	Log.warn('Invalid reportID is used to build the TRANSACTION_RECEIPT route');
  	}
  	if (!transactionID) {
  	Log.warn('Invalid transactionID is used to build the TRANSACTION_RECEIPT route');
  	}
  	return `r/${reportID}/transaction/${transactionID}/receipt${action ? `/${action}` : ''}${iouType ? `/${iouType}` : ''}?readonly=${readonly}${
  	isFromReviewDuplicates ? '&isFromReviewDuplicates=true' : ''
  	}` as const;

• We need to fetch replaceReceiptBackTo like below

App/src/pages/TransactionReceiptPage.tsx

Line 31 in 4453806

const action = route.params.action;

• We need to pass the replaceReceiptBackTo prop from the parent and add following logic

 const route = ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(
      iouAction ?? CONST.IOU.ACTION.EDIT,
      iouType,
      draftTransactionID ?? transaction?.transactionID,
      report?.reportID,
      replaceReceiptBackTo || Navigation.getActiveRouteWithoutParams(),
  );

App/src/components/AttachmentModal.tsx

Lines 539 to 546 in 4453806

	Navigation.navigate(
	ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(
	iouAction ?? CONST.IOU.ACTION.EDIT,
	iouType,
	draftTransactionID ?? transaction?.transactionID,
	report?.reportID,
	Navigation.getActiveRouteWithoutParams(),
	),

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

None UI bug

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.

[nkdengineer]

🚨 Edited by proposal-police: This proposal was edited at 2025-04-30 05:41:49 UTC.

Proposal

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

The background changes to Reports after clicking Replace on the receipt view.
On narrow screen (mweb and iOS), it shows Reports screen briefly.

What is the root cause of that problem?

When users open the replace receipt modal, we're getting the current active route without param for backTo of MONEY_REQUEST_STEP_SCAN

App/src/components/AttachmentModal.tsx

Line 545 in 6000a8c

Navigation.getActiveRouteWithoutParams(),

so the backTo from previous route is removed. In this case the activeRouteWithoutParams is search/view/reportID, so the background changes to Reports

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

We should use Navigation.getActiveRoute() instead of getActiveRouteWithoutParams to preserve the backTo from previous route

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

UI issue

What alternative solutions did you explore? (Optional)

Currently the transaction thread uses search/view path, and we can consider to add the new path for it like /r/view/... and navigate to it when users open transaction thread

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.

[melvin-bot]

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

[melvin-bot]

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