[Due for payment 2025-09-30] [$250] Expense - Two expenses appear on confirm page when submitting track expense via whisper

[jponikarchuk]

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.2-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: https://test-management.browserstack.com/projects/2219752/test-runs/TR-703/folder/13176877/41237352/881814658
Email or phone of affected tester (no customers): sdidosnjiodsjsoi@gmail.com
Issue reported by: Applause Internal Team
Device used: Mac 15.5 / Chrome
App Component: Money Requests

Action Performed:

Precondition:

• Account has self DM.

1. Go to staging.new.expensify.com
2. Go to self DM.
3. Track a manual expense.
4. Click + > Create expense > Manual.
5. Enter amount > Next.
6. On confirm page, click outside the RHP to close it.
7. Click Submit it to someone on the whisper from Step 3.
8. Select any user.

Expected Result:

On confirm page, there will be only one expense, which is the track expense from Step 3.

Actual Result:

On confirm page, there are two expenses - one track expense from Step 3, and another expense from Step 6 which is exited on confirm page.

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

1.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021966548749913172981
• Upwork Job ID: 1966548749913172981
• Last Price Increase: 2025-09-12

Issue Owner

Current Issue Owner: @clarajones-expensify

[melvin-bot]

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

[nkdengineer]

Proposal

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

On confirm page, there are two expenses - one track expense from Step 3, and another expense from Step 6 which is exited on confirm page.

What is the root cause of that problem?

Click + > Create expense > Manual.
Enter amount > Next.
On confirm page, click outside the RHP to close it.

After these steps, a transactionDraft is created in Onyx and it's not cleared when the flow is closed.

And then in the moving track expense flow, two draft transactions are in Onyx, and we displayed them in the UI.

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

Lines 106 to 109 in a3f8cbc

	const transactions = useMemo(() => {
	const allTransactions = optimisticTransactions && optimisticTransactions.length > 1 ? optimisticTransactions : [initialTransaction];
	return allTransactions.filter((transaction): transaction is Transaction => !!transaction);
	}, [initialTransaction, optimisticTransactions]);

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

If we're moving the track expense, we should only return the initialTransaction (we can only return multiple transactions if it's multi-scan flow).

onst transactions = useMemo(() => {
    if (isMovingTransactionFromTrackExpense) {
        return [initialTransaction]
    }
    const allTransactions = optimisticTransactions && optimisticTransactions.length > 1 ? optimisticTransactions : [initialTransaction];
    return allTransactions.filter((transaction): transaction is Transaction => !!transaction);
}, [initialTransaction, isMovingTransactionFromTrackExpense, optimisticTransactions]);

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

Lines 106 to 109 in a3f8cbc

	const transactions = useMemo(() => {
	const allTransactions = optimisticTransactions && optimisticTransactions.length > 1 ? optimisticTransactions : [initialTransaction];
	return allTransactions.filter((transaction): transaction is Transaction => !!transaction);
	}, [initialTransaction, optimisticTransactions]);

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

None

What alternative solutions did you explore? (Optional)

We can clear the draft transaction when the money request flow is closed without creating expense.

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.

[bernhardoj]

Proposal

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

2 expenses is shown in confirm page.

What is the root cause of that problem?

When we start the money request flow from FAB, it will create a transaction draft with id 1. When we close the page, the draft still exists. It will be cleared once we reopen the page.

App/src/libs/actions/IOU.ts

Lines 1035 to 1042 in 7587a45

	function clearMoneyRequest(transactionID: string, skipConfirmation = false) {
	removeDraftTransactions();
	Onyx.set(`${ONYXKEYS.COLLECTION.SKIP_CONFIRMATION}${transactionID}`, skipConfirmation);
	}
	function startMoneyRequest(iouType: ValueOf<typeof CONST.IOU.TYPE>, reportID: string, requestType?: IOURequestType, skipConfirmation = false, backToReport?: string) {
	Performance.markStart(CONST.TIMING.OPEN_CREATE_EXPENSE);
	clearMoneyRequest(CONST.IOU.OPTIMISTIC_TRANSACTION_ID, skipConfirmation);

But since we press the Submit to someone, it calls the createDraftTransactionAndNavigateToParticipantSelector function which doesn't clear the drafts and also create another draft for moving the expense.

App/src/libs/ReportUtils.ts

Lines 10031 to 10137 in 7587a45

	function createDraftTransactionAndNavigateToParticipantSelector(
	transactionID: string | undefined,
	reportID: string | undefined,
	actionName: IOUAction,
	reportActionID: string | undefined,
	): void {
	if (!transactionID || !reportID) {
	return;
	}
	const transaction = allTransactions?.[`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`] ?? ({} as Transaction);
	const reportActions = allReportActions?.[`${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${reportID}`] ?? ([] as ReportAction[]);
	if (!transaction || !reportActions) {
	return;
	}
	const linkedTrackedExpenseReportAction = Object.values(reportActions)
	.filter(Boolean)
	.find((action) => isMoneyRequestAction(action) && getOriginalMessage(action)?.IOUTransactionID === transactionID);
	const {created, amount, currency, merchant, mccGroup} = getTransactionDetails(transaction) ?? {};
	const comment = getTransactionCommentObject(transaction);
	createDraftTransaction({
	...transaction,
	actionableWhisperReportActionID: reportActionID,
	linkedTrackedExpenseReportAction,
	linkedTrackedExpenseReportID: reportID,
	created,
	modifiedCreated: undefined,
	modifiedAmount: undefined,
	modifiedCurrency: undefined,
	amount,
	currency,
	comment,
	merchant,
	modifiedMerchant: '',
	mccGroup,
	} as Transaction);
	const filteredPolicies = Object.values(allPolicies ?? {}).filter((policy) => shouldShowPolicy(policy, false, currentUserEmail));
	if (actionName === CONST.IOU.ACTION.CATEGORIZE) {
	// This will be fixed as part of https://github.com/Expensify/Expensify/issues/507850
	// eslint-disable-next-line deprecation/deprecation
	const activePolicy = getPolicy(activePolicyID);
	if (activePolicy && shouldRestrictUserBillableActions(activePolicy.id)) {
	Navigation.navigate(ROUTES.RESTRICTED_ACTION.getRoute(activePolicy.id));
	return;
	}
	if (shouldShowPolicy(activePolicy, false, currentUserEmail)) {
	const policyExpenseReportID = getPolicyExpenseChat(currentUserAccountID, activePolicyID)?.reportID;
	setMoneyRequestParticipants(transactionID, [
	{
	selected: true,
	accountID: 0,
	isPolicyExpenseChat: true,
	reportID: policyExpenseReportID,
	policyID: activePolicyID,
	searchText: activePolicy?.name,
	},
	]);
	if (policyExpenseReportID) {
	Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_CATEGORY.getRoute(actionName, CONST.IOU.TYPE.SUBMIT, transactionID, policyExpenseReportID));
	} else {
	Log.warn('policyExpenseReportID is not valid during expense categorizing');
	}
	return;
	}
	if (filteredPolicies.length === 0 || filteredPolicies.length > 1) {
	Navigation.navigate(ROUTES.MONEY_REQUEST_UPGRADE.getRoute(actionName, CONST.IOU.TYPE.SUBMIT, transactionID, reportID));
	return;
	}
	const policyID = filteredPolicies.at(0)?.id;
	const policyExpenseReportID = getPolicyExpenseChat(currentUserAccountID, policyID)?.reportID;
	setMoneyRequestParticipants(transactionID, [
	{
	selected: true,
	accountID: 0,
	isPolicyExpenseChat: true,
	reportID: policyExpenseReportID,
	policyID,
	searchText: activePolicy?.name,
	},
	]);
	if (policyExpenseReportID) {
	Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_CATEGORY.getRoute(actionName, CONST.IOU.TYPE.SUBMIT, transactionID, policyExpenseReportID));
	} else {
	Log.warn('policyExpenseReportID is not valid during expense categorizing');
	}
	return;
	}
	if (actionName === CONST.IOU.ACTION.SHARE) {
	Navigation.navigate(ROUTES.MONEY_REQUEST_ACCOUNTANT.getRoute(actionName, CONST.IOU.TYPE.SUBMIT, transactionID, reportID, Navigation.getActiveRoute()));
	return;
	}
	if (actionName === CONST.IOU.ACTION.SUBMIT || (allPolicies && filteredPolicies.length > 0)) {
	Navigation.navigate(ROUTES.MONEY_REQUEST_STEP_PARTICIPANTS.getRoute(CONST.IOU.TYPE.SUBMIT, transactionID, reportID, undefined, actionName));
	return;
	}
	return createDraftWorkspaceAndNavigateToConfirmationScreen(transactionID, actionName);

So, we have 2 transaction drafts.

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

We can call removeDraftTransactions(); (or clearMoneyRequest, but not necessary) in createDraftTransactionAndNavigateToParticipantSelector.

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

We can merge 1 transaction draft and when calling createDraftTransactionAndNavigateToParticipantSelector, verify there is only 1 draft in onyx.

[lorretheboy]

Proposal

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

Two expenses appear on confirm page when submitting track expense via whisper

What is the root cause of that problem?

Transaction drafts are not properly cleaned up during the whisper submission conversion process.

App/src/libs/actions/IOU.ts

Line 5043 in 27f5fc2

optimisticData?.push(...deleteOptimisticData);

Here is why it leads to the bug

1. User creates manual expense via FAB (Click + > Create expense > Manual)
2. User enters amount and goes to confirm page
3. User closes RHP by clicking outside - this leaves a transaction draft in Onyx
4. When user clicks "Submit it to someone" on whisper, createDraftTransactionAndNavigateToParticipantSelector is called
   This function creates another draft transaction without clearing existing drafts
   

   App/src/libs/ReportUtils.ts

   Line 10030 in 9b653ae

   function createDraftTransactionAndNavigateToParticipantSelector(

Thus, two transaction drafts exist in Onyx

5. Finally, The confirmation page displays both drafts

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

We should remove the transaction draft to prevent duplicate expenses on the confirm page

    if (transactionID) {
        optimisticData.push({
            onyxMethod: Onyx.METHOD.SET,
            key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`,
            value: null,
        });

        // Restore the transaction draft on failure - This is optional as I think we safe to remove draft txn without needing to revert on failure here
        const existingTransactionDraft = allTransactionDrafts[`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`];
        if (existingTransactionDraft) {
            failureData.push({
                onyxMethod: Onyx.METHOD.SET,
                key: `${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`,
                value: existingTransactionDraft,
            });
        }
    }

Add below this

App/src/libs/actions/IOU.ts

Line 5043 in 27f5fc2

optimisticData?.push(...deleteOptimisticData);

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

NA

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.

[melvin-bot]

@adelekennedy Whoops! This issue is 2 days overdue. Let's get this updated quick!

[melvin-bot]

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