Expense - Confirm page becomes broken after adding a receipt on confirm 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.2.85-0
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from BrowserStack: Exp
Email or phone of affected tester (no customers): sdjoisdonijosdinjosd@gmail.com
Issue reported by: Applause Internal Team
Bug source: Exploratory - Critical User Impact
Device used: Mac 26.1 / Chrome
App Component: Money Requests

Action Performed:

Preconditon:

• Account has self DM and workspace.

1. Go to staging.new.expensify.com
2. Go to self DM.
3. Create a manual expense without receipt.
4. Click Submit it to someone.
5. Select workspace chat.
6. On confirm page, add a receipt.

Expected Result:

After adding a receipt on confirm page, confirm page will retain all the fields.

Actual Result:

After adding a receipt on confirm page, confirm page is broken.
To field, Category field and Reimbursable toggle are missing.
Amount changes to $0.00.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug7034451_1766240761964.23.mp4

View all open jobs on GitHub

[melvin-bot]

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

[apeyada]

Proposal

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

Expense - Confirm page becomes broken after adding a receipt on confirm page

What is the root cause of that problem?

Draft transaction is removed here

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 634 to 636 in 3056db6

	if (!isMultiScanEnabled) {
	removeDraftTransactions(true);
	}

And then merge receipt to draft transaction here

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Line 650 in 3056db6

setMoneyRequestReceipt(transactionID, source, file.name ?? '', true, file.type);

Finally, draft transaction contains only receipt, all other fields are removed and this causes confirm page hide fields with missing values.

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

• pass correct IOU action here:
  

  App/src/components/MoneyRequestConfirmationListFooter.tsx

  Line 1043 in 3056db6

  Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_SCAN.getRoute(CONST.IOU.ACTION.CREATE, iouType, transactionID, reportID, Navigation.getActiveRoute()));

(action instead of CONST.IOU.ACTION.CREATE so that it would be submit when "Submit it to someone" in self DM)

• clear draft transactions only when action === CONST.IOU.ACTION.CREATE (or action !== CONST.IOU.ACTION.SUBMIT)

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 634 to 636 in 3056db6

	if (!isMultiScanEnabled) {
	removeDraftTransactions(true);
	}

if (!isMultiScanEnabled && action === CONST.IOU.ACTION.CREATE) {

(Also fix this in native file)

App/src/pages/iou/request/step/IOURequestStepScan/index.native.tsx

Lines 618 to 620 in 3056db6

	if (!isMultiScanEnabled) {
	removeDraftTransactions(true);
	}

What alternative solutions did you explore? (Optional)

Clear draft transactions only when backTo doesn't exist (means that this is create action)
if (!isMultiScanEnabled && !backTo) {

[dmkt9]

Proposal

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

After adding a receipt on confirm page, confirm page is broken.
To field, Category field and Reimbursable toggle are missing.
Amount changes to $0.00.

What is the root cause of that problem?

Because at this point we always delete all draft transactions whose transactionID is different from CONST.IOU.OPTIMISTIC_TRANSACTION_ID when setting the receipt file.

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 634 to 636 in 68d90e4

	if (!isMultiScanEnabled) {
	removeDraftTransactions(true);
	}

Meanwhile, when we "submit to someone" or add a new receipt file to an existing transaction, the transactionID will never be CONST.IOU.OPTIMISTIC_TRANSACTION_ID, so it gets deleted.

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

The transaction with CONST.IOU.OPTIMISTIC_TRANSACTION_ID will always be set in the create expense flow, even when we delete a transaction that currently has transactionID = CONST.IOU.OPTIMISTIC_TRANSACTION_ID.

App/src/pages/iou/request/step/IOURequestStepConfirmation.tsx

Lines 1252 to 1263 in 68d90e4

	const removeCurrentTransaction = () => {
	if (currentTransactionID === CONST.IOU.OPTIMISTIC_TRANSACTION_ID) {
	const nextTransaction = transactions.at(currentTransactionIndex + 1);
	replaceDefaultDraftTransaction(nextTransaction);
	setRemoveConfirmModalVisible(false);
	return;
	}
	removeDraftTransaction(currentTransactionID);
	setRemoveConfirmModalVisible(false);
	showPreviousTransaction();
	};

The root cause code that triggers this issue is used to reset during the process of submitting a new expense from PR #77816.

Therefore, we will check if the transaction contains one with CONST.IOU.OPTIMISTIC_TRANSACTION_ID before calling removeDraftTransactions(true) or check isStartingScan here.

if (!isMultiScanEnabled && isStartingScan) {
    removeDraftTransactions(true);
}

App/src/pages/iou/request/step/IOURequestStepScan/index.tsx

Lines 634 to 636 in 68d90e4

	if (!isMultiScanEnabled) {
	removeDraftTransactions(true);
	}

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

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

[heyjennahay]

@lanitochka17 can you please re perform this test but complete the Description, Merchant and Category (in addition to date and amount you already did) before adding the receipt to see if only the amount is cleared or that any of the other fields are also affected? Thanks and let me know if you have any questions :)

[melvin-bot]

@heyjennahay Still overdue 6 days?! Let's take care of this!

[melvin-bot]

@heyjennahay Now this issue is 8 days overdue. Are you sure this should be a Daily? Feel free to change it!

[melvin-bot]

@heyjennahay this issue was created 2 weeks ago. Are we close to a solution? Let's make sure we're treating this as a top priority. Don't hesitate to create a thread in #expensify-open-source to align faster in real time. Thanks!