[Due for payment 2026-05-22] [$250] Expense - The pay amount is not updated after approving unheld part of the report in offline

[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: v9.3.25-4
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from BrowserStack: https://github.com/Expensify/Expensify/issues/484277
Email or phone of affected tester (no customers): n/a
Issue reported by: Applause Internal Team
Bug source: Exploratory - Critical User Impact
Device used: Mac 15.4.1 Safari/Chrome
App Component: Money Requests

Action Performed:

1. Go to https://staging.new.expensify.com
2. Log in as workspace admin with Manually Submissions, Approvals and Payments enabled
3. Go to workspace xhat
4. Create 2 money requests
5. Hold one of them
6. Go to offline
7. Approve unheld part

Expected Result:

After approving an unheld expense in offline mode, the report total should update immediately to reflect the newly approved expense

Actual Result:

After approving an unheld expense in offline mode, the Pay dropdown still displays the old total amount for the entire report. The user is able to proceed with payment using the incorrect amount.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

1.mp4

View all open jobs on GitHub

Issue Owner

Current Issue Owner: @mallenexpensify

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~022043609562376896250
• Upwork Job ID: 2043609562376896250
• Last Price Increase: 2026-04-27
• Automatic offers:
• wildan-m | Contributor | 111314107

[annaweber830]

Proposal

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

When an approver is offline and chooses to approve only the unheld part of an expense report, the Pay amount in the header/dropdown still shows the pre-approval total. This lets the user continue with a stale amount instead of the newly approved partial amount.

What is the root cause of that problem?

MoneyReportHeader computes the Pay label from getTotalAmountForIOUReportPreviewButton(), which reads report.total from getMoneyRequestSpendBreakdown(). During partial approval, approveMoneyRequest() builds optimistic state/status updates and moves held transactions/actions to a new hold report, but it does not optimistically merge the original report totals (total, nonReimbursableTotal, and unheld counterparts) to the unheld-only values. So offline UI keeps using the old total until server reconciliation.

App/src/components/MoneyReportHeader.tsx

Lines 901 to 912 in 8af1e14

	const getAmount = (actionType: ValueOf<typeof CONST.REPORT.REPORT_PREVIEW_ACTIONS>) => ({
	formattedAmount: getTotalAmountForIOUReportPreviewButton(moneyRequestReport, policy, actionType),
	});
	const {formattedAmount: totalAmount} = getAmount(CONST.REPORT.PRIMARY_ACTIONS.PAY);
	const paymentButtonOptions = usePaymentOptions({
	currency: moneyRequestReport?.currency,
	iouReport: moneyRequestReport,
	chatReportID: chatReport?.reportID,
	formattedAmount: totalAmount,
	policyID: moneyRequestReport?.policyID,

App/src/libs/ReportUtils.ts

Lines 4325 to 4347 in 8af1e14

	function getMoneyRequestSpendBreakdown(report: OnyxInputOrEntry<Report>, searchReports?: Report[]): SpendBreakdown {
	const reports = searchReports ?? allReports;
	let moneyRequestReport: OnyxEntry<Report>;
	if (report && (isMoneyRequestReport(report, searchReports) || isInvoiceReport(report))) {
	moneyRequestReport = report;
	}
	if (reports && report?.iouReportID) {
	moneyRequestReport = getReport(report.iouReportID, allReports);
	}
	if (moneyRequestReport) {
	let nonReimbursableSpend = moneyRequestReport.nonReimbursableTotal ?? 0;
	let totalSpend = moneyRequestReport.total ?? 0;
	if (nonReimbursableSpend + totalSpend !== 0) {
	// There is a possibility that if the Expense report has a negative total.
	// This is because there are instances where you can get a credit back on your card,
	// or you enter a negative expense to "offset" future expenses
	nonReimbursableSpend = isExpenseReport(moneyRequestReport) ? nonReimbursableSpend * -1 : Math.abs(nonReimbursableSpend);
	totalSpend = isExpenseReport(moneyRequestReport) ? totalSpend * -1 : Math.abs(totalSpend);
	const totalDisplaySpend = totalSpend;
	const reimbursableSpend = totalDisplaySpend - nonReimbursableSpend;

App/src/libs/actions/IOU/index.ts

Lines 10611 to 10638 in 8af1e14

	const updatedExpenseReport = {
	...expenseReport,
	...(shouldAddOptimisticApproveAction
	? {
	lastMessageText: getReportActionText(optimisticApprovedReportAction),
	lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
	}
	: {}),
	// For DEW policies, don't optimistically update stateNum, statusNum, managerID, or nextStep
	// because DEW determines the actual workflow on the backend
	...(isDEWPolicy
	? {}
	: {
	stateNum: predictedNextState,
	statusNum: predictedNextStatus,
	managerID,
	nextStep: optimisticNextStep ?? undefined,
	pendingFields: {
	partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	},
	}),
	};
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
	value: updatedExpenseReport,
	});

const getAmount = (actionType: ValueOf<typeof CONST.REPORT.REPORT_PREVIEW_ACTIONS>) => ({
    formattedAmount: getTotalAmountForIOUReportPreviewButton(moneyRequestReport, policy, actionType),
});

function getMoneyRequestSpendBreakdown(report: OnyxInputOrEntry<Report>, searchReports?: Report[]): SpendBreakdown {
    // ...
    let totalSpend = moneyRequestReport.total ?? 0;
    // ...
}

const updatedExpenseReport = {
    ...expenseReport,
    ...(shouldAddOptimisticApproveAction
        ? {
              lastMessageText: getReportActionText(optimisticApprovedReportAction),
              lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
          }
        : {}),
    ...(isDEWPolicy
        ? {}
        : {
              stateNum: predictedNextState,
              statusNum: predictedNextStatus,
              managerID,
              nextStep: optimisticNextStep ?? undefined,
              pendingFields: {
                  partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                  nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
              },
          }),
};

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

Update approveMoneyRequest() so that in partial approval (full === false) with held expenses, we also optimistically merge the remaining-unheld totals onto the original expense report. This keeps the offline Pay amount in sync with the just-approved partial state. Also add corresponding rollback values in failureData for these amount fields.

App/src/libs/actions/IOU/index.ts

Lines 10525 to 10875 in 8af1e14

	function approveMoneyRequest(
	expenseReport: OnyxEntry<OnyxTypes.Report>,
	policy: OnyxEntry<OnyxTypes.Policy>,
	currentUserAccountIDParam: number,
	currentUserEmailParam: string,
	hasViolations: boolean,
	isASAPSubmitBetaEnabled: boolean,
	expenseReportCurrentNextStepDeprecated: OnyxEntry<OnyxTypes.ReportNextStepDeprecated>,
	betas: OnyxEntry<OnyxTypes.Beta[]>,
	full?: boolean,
	) {
	if (!expenseReport) {
	return;
	}
	if (expenseReport.policyID && shouldRestrictUserBillableActions(expenseReport.policyID)) {
	Navigation.navigate(ROUTES.RESTRICTED_ACTION.getRoute(expenseReport.policyID));
	return;
	}
	let total = expenseReport.total ?? 0;
	const hasHeldExpenses = hasHeldExpensesReportUtils(expenseReport.reportID);
	const hasDuplicates = hasDuplicateTransactions(currentUserEmailParam, currentUserAccountIDParam, expenseReport, policy, allTransactionViolations);
	if (hasHeldExpenses && !full && !!expenseReport.unheldTotal) {
	total = expenseReport.unheldTotal;
	}
	const optimisticApprovedReportAction = buildOptimisticApprovedReportAction(total, expenseReport.currency ?? '', expenseReport.reportID);
	const isDEWPolicy = hasDynamicExternalWorkflow(policy);
	const shouldAddOptimisticApproveAction = !isDEWPolicy || isOffline();
	const nextApproverAccountID = getNextApproverAccountID(expenseReport);
	const predictedNextStatus = !nextApproverAccountID ? CONST.REPORT.STATUS_NUM.APPROVED : CONST.REPORT.STATUS_NUM.SUBMITTED;
	const predictedNextState = !nextApproverAccountID ? CONST.REPORT.STATE_NUM.APPROVED : CONST.REPORT.STATE_NUM.SUBMITTED;
	const managerID = !nextApproverAccountID ? expenseReport.managerID : nextApproverAccountID;
	// buildOptimisticNextStep is used in parallel
	const optimisticNextStepDeprecated = isDEWPolicy
	? null
	: // eslint-disable-next-line @typescript-eslint/no-deprecated
	buildNextStepNew({
	report: expenseReport,
	policy,
	currentUserAccountIDParam,
	currentUserEmailParam,
	hasViolations,
	isASAPSubmitBetaEnabled,
	predictedNextStatus,
	});
	const optimisticNextStep = isDEWPolicy
	? null
	: buildOptimisticNextStep({
	report: expenseReport,
	policy,
	currentUserAccountIDParam,
	currentUserEmailParam,
	hasViolations,
	isASAPSubmitBetaEnabled,
	predictedNextStatus,
	});
	const chatReport = getReportOrDraftReport(expenseReport.chatReportID);
	const optimisticData: Array<
	OnyxUpdate<
	| typeof ONYXKEYS.COLLECTION.REPORT
	| typeof ONYXKEYS.COLLECTION.REPORT_ACTIONS
	| typeof ONYXKEYS.COLLECTION.TRANSACTION
	| typeof ONYXKEYS.COLLECTION.NEXT_STEP
	| typeof ONYXKEYS.COLLECTION.REPORT_METADATA
	| typeof ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS
	>
	> = [];
	if (shouldAddOptimisticApproveAction) {
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${expenseReport.reportID}`,
	value: {
	[optimisticApprovedReportAction.reportActionID]: {
	...(optimisticApprovedReportAction as OnyxTypes.ReportAction),
	pendingAction: CONST.RED_BRICK_ROAD_PENDING_ACTION.ADD,
	},
	},
	});
	}
	const updatedExpenseReport = {
	...expenseReport,
	...(shouldAddOptimisticApproveAction
	? {
	lastMessageText: getReportActionText(optimisticApprovedReportAction),
	lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
	}
	: {}),
	// For DEW policies, don't optimistically update stateNum, statusNum, managerID, or nextStep
	// because DEW determines the actual workflow on the backend
	...(isDEWPolicy
	? {}
	: {
	stateNum: predictedNextState,
	statusNum: predictedNextStatus,
	managerID,
	nextStep: optimisticNextStep ?? undefined,
	pendingFields: {
	partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	},
	}),
	};
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
	value: updatedExpenseReport,
	});
	if (chatReport) {
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.chatReportID}`,
	value: {
	hasOutstandingChildRequest: hasOutstandingChildRequest(chatReport, updatedExpenseReport, currentUserEmail, currentUserAccountIDParam, allTransactionViolations, undefined),
	},
	});
	}
	if (!isDEWPolicy) {
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.NEXT_STEP}${expenseReport.reportID}`,
	value: optimisticNextStepDeprecated,
	});
	}
	if (isDEWPolicy) {
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_METADATA}${expenseReport.reportID}`,
	value: {
	pendingExpenseAction: CONST.EXPENSE_PENDING_ACTION.APPROVE,
	},
	});
	}
	const successData: Array<OnyxUpdate<typeof ONYXKEYS.COLLECTION.REPORT | typeof ONYXKEYS.COLLECTION.REPORT_ACTIONS | typeof ONYXKEYS.COLLECTION.REPORT_METADATA>> = [];
	if (!isDEWPolicy) {
	successData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
	value: {
	pendingFields: {
	partial: null,
	nextStep: null,
	},
	},
	});
	}
	if (shouldAddOptimisticApproveAction) {
	successData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${expenseReport.reportID}`,
	value: {
	[optimisticApprovedReportAction.reportActionID]: {
	pendingAction: null,
	},
	},
	});
	}
	if (isDEWPolicy) {
	successData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_METADATA}${expenseReport.reportID}`,
	value: {
	pendingExpenseAction: null,
	},
	});
	}
	const failureData: Array<
	OnyxUpdate<
	| typeof ONYXKEYS.COLLECTION.REPORT
	| typeof ONYXKEYS.COLLECTION.REPORT_ACTIONS
	| typeof ONYXKEYS.COLLECTION.NEXT_STEP
	| typeof ONYXKEYS.COLLECTION.REPORT_METADATA
	| typeof ONYXKEYS.COLLECTION.TRANSACTION
	| typeof ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS
	>
	> = [
	{
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.chatReportID}`,
	value: {
	hasOutstandingChildRequest: chatReport?.hasOutstandingChildRequest,
	},
	},
	{
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.NEXT_STEP}${expenseReport.reportID}`,
	value: expenseReportCurrentNextStepDeprecated ?? null,
	},
	];
	if (!isDEWPolicy) {
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
	value: {
	statusNum: expenseReport.statusNum,
	stateNum: expenseReport.stateNum,
	nextStep: expenseReport.nextStep ?? null,
	pendingFields: {
	partial: null,
	nextStep: null,
	},
	},
	});
	}
	if (shouldAddOptimisticApproveAction) {
	if (isDEWPolicy) {
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${expenseReport.reportID}`,
	value: {
	[optimisticApprovedReportAction.reportActionID]: null,
	},
	});
	} else {
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_ACTIONS}${expenseReport.reportID}`,
	value: {
	[optimisticApprovedReportAction.reportActionID]: {
	errors: getMicroSecondOnyxErrorWithTranslationKey('iou.error.other'),
	},
	},
	});
	}
	}
	if (isDEWPolicy) {
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT_METADATA}${expenseReport.reportID}`,
	value: {
	pendingExpenseAction: null,
	},
	});
	}
	// Clear hold reason of all transactions if we approve all requests
	if (full && hasHeldExpenses) {
	const heldTransactions = getAllHeldTransactionsReportUtils(expenseReport.reportID);
	for (const heldTransaction of heldTransactions) {
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.TRANSACTION}${heldTransaction.transactionID}`,
	value: {
	comment: {
	hold: '',
	},
	},
	});
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.TRANSACTION}${heldTransaction.transactionID}`,
	value: {
	comment: {
	hold: heldTransaction.comment?.hold,
	},
	},
	});
	}
	}
	let optimisticHoldReportID;
	let optimisticHoldActionID;
	let optimisticHoldReportExpenseActionIDs;
	let optimisticReportActionCopyIDs;
	let optimisticCreatedReportForUnapprovedTransactionsActionID;
	if (!full && !!chatReport && !!expenseReport) {
	const originalCreated = getReportOriginalCreationTimestamp(expenseReport);
	const holdReportOnyxData = getReportFromHoldRequestsOnyxData({
	chatReport,
	iouReport: expenseReport,
	recipient: {accountID: expenseReport.ownerAccountID},
	policy,
	createdTimestamp: originalCreated,
	isApprovalFlow: true,
	betas,
	});
	optimisticData.push(...holdReportOnyxData.optimisticData);
	successData.push(...holdReportOnyxData.successData);
	failureData.push(...holdReportOnyxData.failureData);
	optimisticHoldReportID = holdReportOnyxData.optimisticHoldReportID;
	optimisticHoldActionID = holdReportOnyxData.optimisticHoldActionID;
	optimisticCreatedReportForUnapprovedTransactionsActionID = holdReportOnyxData.optimisticCreatedReportForUnapprovedTransactionsActionID;
	optimisticHoldReportExpenseActionIDs = JSON.stringify(holdReportOnyxData.optimisticHoldReportExpenseActionIDs);
	optimisticReportActionCopyIDs = JSON.stringify(holdReportOnyxData.optimisticReportActionCopyIDs);
	}
	// Remove duplicates violations if we approve the report
	if (hasDuplicates) {
	let transactions = getReportTransactions(expenseReport.reportID).filter((transaction) =>
	isDuplicate(
	transaction,
	currentUserEmailParam,
	currentUserAccountIDParam,
	expenseReport,
	policy,
	allTransactionViolations?.[ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS + transaction.transactionID],
	),
	);
	if (!full) {
	transactions = transactions.filter((transaction) => !isOnHold(transaction));
	}
	for (const transaction of transactions) {
	const transactionViolations = allTransactionViolations?.[`${ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS}${transaction.transactionID}`] ?? [];
	const newTransactionViolations = transactionViolations.filter((violation) => violation.name !== CONST.VIOLATIONS.DUPLICATED_TRANSACTION);
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS}${transaction.transactionID}`,
	value: newTransactionViolations,
	});
	failureData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS}${transaction.transactionID}`,
	value: transactionViolations,
	});
	}
	}
	const parameters: ApproveMoneyRequestParams = {
	reportID: expenseReport.reportID,
	approvedReportActionID: optimisticApprovedReportAction.reportActionID,
	full,
	optimisticHoldReportID,
	optimisticHoldActionID,
	optimisticHoldReportExpenseActionIDs,
	optimisticReportActionCopyIDs,
	optimisticCreatedReportForUnapprovedTransactionsActionID,
	};
	playSound(SOUNDS.SUCCESS);
	API.write(WRITE_COMMANDS.APPROVE_MONEY_REQUEST, parameters, {optimisticData, successData, failureData});
	return optimisticHoldReportID;

Current code:

const updatedExpenseReport = {
    ...expenseReport,
    ...(shouldAddOptimisticApproveAction
        ? {
              lastMessageText: getReportActionText(optimisticApprovedReportAction),
              lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
          }
        : {}),
    ...(isDEWPolicy
        ? {}
        : {
              stateNum: predictedNextState,
              statusNum: predictedNextStatus,
              managerID,
              nextStep: optimisticNextStep ?? undefined,
              pendingFields: {
                  partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                  nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
              },
          }),
};

failureData.push({
    onyxMethod: Onyx.METHOD.MERGE,
    key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
    value: {
        statusNum: expenseReport.statusNum,
        stateNum: expenseReport.stateNum,
        nextStep: expenseReport.nextStep ?? null,
        pendingFields: {
            partial: null,
            nextStep: null,
        },
    },
});

Updated code:

const shouldUpdateTotalsForPartialApproval = hasHeldExpenses && !full;

const updatedExpenseReport = {
    ...expenseReport,
    ...(shouldAddOptimisticApproveAction
        ? {
              lastMessageText: getReportActionText(optimisticApprovedReportAction),
              lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
          }
        : {}),
    ...(shouldUpdateTotalsForPartialApproval
        ? {
              total: expenseReport.unheldTotal ?? expenseReport.total,
              unheldTotal: expenseReport.unheldTotal ?? expenseReport.total,
              nonReimbursableTotal: expenseReport.unheldNonReimbursableTotal ?? expenseReport.nonReimbursableTotal,
              unheldNonReimbursableTotal: expenseReport.unheldNonReimbursableTotal ?? expenseReport.nonReimbursableTotal,
          }
        : {}),
    ...(isDEWPolicy
        ? {}
        : {
              stateNum: predictedNextState,
              statusNum: predictedNextStatus,
              managerID,
              nextStep: optimisticNextStep ?? undefined,
              pendingFields: {
                  partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
                  nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
              },
          }),
};

failureData.push({
    onyxMethod: Onyx.METHOD.MERGE,
    key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
    value: {
        statusNum: expenseReport.statusNum,
        stateNum: expenseReport.stateNum,
        nextStep: expenseReport.nextStep ?? null,
        ...(shouldUpdateTotalsForPartialApproval
            ? {
                  total: expenseReport.total,
                  unheldTotal: expenseReport.unheldTotal,
                  nonReimbursableTotal: expenseReport.nonReimbursableTotal,
                  unheldNonReimbursableTotal: expenseReport.unheldNonReimbursableTotal,
              }
            : {}),
        pendingFields: {
            partial: null,
            nextStep: null,
        },
    },
});

What alternative solutions did you explore? (Optional)

I considered recalculating the Pay amount in MoneyRequestReportUtils from transaction lists instead of report.total, but that would broaden the change surface and could impact other report-preview amount paths. Updating the optimistic totals at the source action keeps behavior aligned with the existing Onyx optimistic-update pattern and fixes this specific offline regression with minimal risk.

[mukhrr]

Proposal

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

When a workspace admin partially approves an expense report (approving only the unheld expenses) while offline, the Pay dropdown still displays the full report total instead of just the approved (unheld) amount. This allows the user to proceed with payment using the incorrect, inflated amount.

What is the root cause of that problem?

When partial approval is triggered (full=false), the approveMoneyRequest function in IOU/index.ts builds optimistic data that moves held transactions to a new hold report via getReportFromHoldRequestsOnyxData, but it never updates the original expense report's total, nonReimbursableTotal, unheldTotal, or unheldNonReimbursableTotal fields.

App/src/libs/actions/IOU/index.ts

Lines 10611 to 10636 in 8af1e14

	const updatedExpenseReport = {
	...expenseReport,
	...(shouldAddOptimisticApproveAction
	? {
	lastMessageText: getReportActionText(optimisticApprovedReportAction),
	lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
	}
	: {}),
	// For DEW policies, don't optimistically update stateNum, statusNum, managerID, or nextStep
	// because DEW determines the actual workflow on the backend
	...(isDEWPolicy
	? {}
	: {
	stateNum: predictedNextState,
	statusNum: predictedNextStatus,
	managerID,
	nextStep: optimisticNextStep ?? undefined,
	pendingFields: {
	partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
	},
	}),
	};
	optimisticData.push({
	onyxMethod: Onyx.METHOD.MERGE,
	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,

The updatedExpenseReport object only updates lastMessageText, lastMessageHtml, stateNum, statusNum, managerID, nextStep, and pendingFields — but not the monetary totals.

As a result, the Pay button calls getMoneyRequestSpendBreakdown which reads report.total directly, and getNonHeldAndFullAmount which reads report.unheldTotal. Both still contain the stale pre-approval values. Since the held transactions have already been optimistically moved to the new report (their reportID is updated), the report's total no longer matches the sum of its remaining transactions, causing the Pay button to display the wrong amount.

App/src/libs/ReportUtils.ts

Lines 4325 to 4360 in 8af1e14

	function getMoneyRequestSpendBreakdown(report: OnyxInputOrEntry<Report>, searchReports?: Report[]): SpendBreakdown {
	const reports = searchReports ?? allReports;
	let moneyRequestReport: OnyxEntry<Report>;
	if (report && (isMoneyRequestReport(report, searchReports) || isInvoiceReport(report))) {
	moneyRequestReport = report;
	}
	if (reports && report?.iouReportID) {
	moneyRequestReport = getReport(report.iouReportID, allReports);
	}
	if (moneyRequestReport) {
	let nonReimbursableSpend = moneyRequestReport.nonReimbursableTotal ?? 0;
	let totalSpend = moneyRequestReport.total ?? 0;
	if (nonReimbursableSpend + totalSpend !== 0) {
	// There is a possibility that if the Expense report has a negative total.
	// This is because there are instances where you can get a credit back on your card,
	// or you enter a negative expense to "offset" future expenses
	nonReimbursableSpend = isExpenseReport(moneyRequestReport) ? nonReimbursableSpend * -1 : Math.abs(nonReimbursableSpend);
	totalSpend = isExpenseReport(moneyRequestReport) ? totalSpend * -1 : Math.abs(totalSpend);
	const totalDisplaySpend = totalSpend;
	const reimbursableSpend = totalDisplaySpend - nonReimbursableSpend;
	return {
	nonReimbursableSpend,
	reimbursableSpend,
	totalDisplaySpend,
	};
	}
	}
	return {
	nonReimbursableSpend: 0,
	reimbursableSpend: 0,
	totalDisplaySpend: 0,
	};
	}

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

1. In approveMoneyRequest, when doing a partial approval (!full), optimistically update the original expense report's totals to reflect that held transactions have been moved out. Set total to unheldTotal, nonReimbursableTotal to unheldNonReimbursableTotal, and clear unheldTotal/unheldNonReimbursableTotal (since the remaining transactions are all unheld).
   

   App/src/libs/actions/IOU/index.ts

   Lines 10611 to 10636 in 8af1e14

   	const updatedExpenseReport = {
   	...expenseReport,
   	...(shouldAddOptimisticApproveAction
   	? {
   	lastMessageText: getReportActionText(optimisticApprovedReportAction),
   	lastMessageHtml: getReportActionHtml(optimisticApprovedReportAction),
   	}
   	: {}),
   	// For DEW policies, don't optimistically update stateNum, statusNum, managerID, or nextStep
   	// because DEW determines the actual workflow on the backend
   	...(isDEWPolicy
   	? {}
   	: {
   	stateNum: predictedNextState,
   	statusNum: predictedNextStatus,
   	managerID,
   	nextStep: optimisticNextStep ?? undefined,
   	pendingFields: {
   	partial: full ? null : CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
   	nextStep: CONST.RED_BRICK_ROAD_PENDING_ACTION.UPDATE,
   	},
   	}),
   	};
   	optimisticData.push({
   	onyxMethod: Onyx.METHOD.MERGE,
   	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,

--- a/src/libs/actions/IOU/index.ts
+++ b/src/libs/actions/IOU/index.ts
@@ -10611,6 +10611,13 @@
     const updatedExpenseReport = {
         ...expenseReport,
+        // When partially approving (unheld only), update totals to reflect
+        // that held transactions will be moved to a separate report
+        ...(!full && hasHeldExpenses ? {
+            total: expenseReport.unheldTotal ?? 0,
+            nonReimbursableTotal: expenseReport.unheldNonReimbursableTotal ?? 0,
+            unheldTotal: 0,
+            unheldNonReimbursableTotal: 0,
+        } : {}),
         ...(shouldAddOptimisticApproveAction
             ? {
                   lastMessageText: getReportActionText(optimisticApprovedReportAction),

2. In the failure data, restore the original totals when partial approval fails so the report reverts correctly.
   

   App/src/libs/actions/IOU/index.ts

   Lines 10730 to 10742 in 8af1e14

   	failureData.push({
   	onyxMethod: Onyx.METHOD.MERGE,
   	key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
   	value: {
   	statusNum: expenseReport.statusNum,
   	stateNum: expenseReport.stateNum,
   	nextStep: expenseReport.nextStep ?? null,
   	pendingFields: {
   	partial: null,
   	nextStep: null,
   	},
   	},
   	});

--- a/src/libs/actions/IOU/index.ts
+++ b/src/libs/actions/IOU/index.ts
@@ -10730,6 +10730,10 @@
             key: `${ONYXKEYS.COLLECTION.REPORT}${expenseReport.reportID}`,
             value: {
                 statusNum: expenseReport.statusNum,
                 stateNum: expenseReport.stateNum,
+                total: expenseReport.total,
+                nonReimbursableTotal: expenseReport.nonReimbursableTotal,
+                unheldTotal: expenseReport.unheldTotal,
+                unheldNonReimbursableTotal: expenseReport.unheldNonReimbursableTotal,
                 nextStep: expenseReport.nextStep ?? null,
                 pendingFields: {
                     partial: null,

These two changes ensure that:

• On optimistic update: the original report's totals immediately reflect only the unheld (approved) expenses, so the Pay button shows the correct amount
• On failure: the original totals are fully restored

[MelvinBot]

Proposal

What is the root cause of that problem?

During partial approval (full=false), approveMoneyRequest builds an updatedExpenseReport that only overrides stateNum, statusNum, managerID, nextStep, and pendingFields — it never touches total, unheldTotal, nonReimbursableTotal, or unheldNonReimbursableTotal. Meanwhile, getReportFromHoldRequestsOnyxData moves held transactions to a new report but also does not update the original report's totals.

After the optimistic update, the held transactions are gone from the original report (moved to a new hold report), so hasHeldExpenses returns false. This causes getTotalAmountForIOUReportPreviewButton to skip the nonHeldAmount path and fall through to reimbursableSpend, which is derived from the stale, unchanged report.total — showing the old full amount on the Pay button.

The local variable total at IOU/index.ts:5110-5116 is correctly computed as unheldTotal for the approved action message text, but is never written back to the report object itself.

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

In approveMoneyRequest at IOU/index.ts:5176-5198, when !full && hasHeldExpenses, optimistically set the expense report's totals to reflect only the unheld (approved) expenses:

• total → expenseReport.unheldTotal
• nonReimbursableTotal → expenseReport.unheldNonReimbursableTotal
• Clear unheldTotal and unheldNonReimbursableTotal to 0 (since after partial approval, all remaining transactions on this report are unheld)

In the corresponding failureData entry at IOU/index.ts:5295-5307, restore all four original total fields so the report reverts correctly on failure.

What alternative solutions did you explore? (Optional)

Recalculating the Pay amount from transaction lists in MoneyRequestReportUtils would also work but widens the change surface and could affect other report-preview paths. Updating totals at the source action keeps behavior aligned with the existing Onyx optimistic-update pattern.

Supporting evidence

Data flow of the bug:

1. approveMoneyRequest(full=false) → updatedExpenseReport spreads original report, totals unchanged
2. getReportFromHoldRequestsOnyxData moves held transactions to new report, does NOT update original totals
3. hasHeldExpenses returns false on original report (held txns moved away)
4. getTotalAmountForIOUReportPreviewButton skips nonHeldAmount path → falls through to reimbursableSpend from stale report.total
5. Pay button shows old full amount

Key code locations:

• updatedExpenseReport missing totals: IOU/index.ts:5176-5198
• getReportFromHoldRequestsOnyxData doesn't update original report: IOU/index.ts:4552-4746
• Pay button reads stale total: MoneyRequestReportUtils.ts:156-192

Note: getReportFromHoldRequestsOnyxData is also called from PayMoneyRequest.ts — that path may have the same issue and should be checked.

---

Next Steps for Contributor+ team: Reply with @MelvinBot implement this to create a draft PR, @MelvinBot <your feedback> to refine this analysis, or explain why you are rejecting Melvin's proposal.