[Due for payment 2025-06-16] [Due for payment 2025-06-13] [$250] expense-Creating expense via report shows submit button briefly

[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: V9.1.51-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: N
Email or phone of affected tester (no customers): Applausetester solo1@applause.expensifail.com
Issue reported by: Applause Internal Team
Device used: Redminote 10s android 13
App Component: Money Requests

Action Performed:

1. Go to https://staging.new.expensify.com/home
2. Login with expensifail account
3. Open a new workspace chat
4. Create a report
5. Click dropdown and create an expense without a category

Expected Result:

Creating expense via report should not show submit button briefly before updating to review button.

Actual Result:

Creating expense via report shows submit button briefly before updating to review button.

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

Bug6840909_1748058931984.Screenrecorder-2025-05-24-09-21-08-295.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021927452237458950247
• Upwork Job ID: 1927452237458950247
• Last Price Increase: 2025-05-27

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @muttmuure

[melvin-bot]

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

[bernhardoj]

Proposal

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

Creating expense on an empty report shows Submit button based on OP, but I see View button briefly.

What is the root cause of that problem?

Since the transaction has violation, the review button should be shown immediately. However, the violation data passed to the ReportPrimaryActionUtils is empty.

App/src/libs/ReportPreviewActionUtils.ts

Lines 170 to 182 in 526a0e4

	function canReview(report: Report, violations: OnyxCollection<TransactionViolation[]>, policy?: Policy, transactions?: Transaction[]) {
	const hasAnyViolations =
	hasMissingSmartscanFields(report.reportID, transactions) ||
	hasViolations(report.reportID, violations) ||
	hasNoticeTypeViolations(report.reportID, violations, true) ||
	hasWarningTypeViolations(report.reportID, violations, true);
	const isSubmitter = isCurrentUserSubmitter(report.reportID);
	const isReimbursed = isSettled(report);
	const isApprover = isApproverMember(policy, getCurrentUserAccountID());
	if (!hasAnyViolations || !(isSubmitter || isApprover) || isReimbursed) {
	return false;
	}

We get the violation from useReportWithTransactionsAndViolations by filtering the violation that only matches the transaction of the report.

App/src/hooks/useReportWithTransactionsAndViolations.ts

Lines 11 to 25 in 526a0e4

	function useReportWithTransactionsAndViolations(reportID?: string): [OnyxEntry<Report>, Transaction[], OnyxCollection<TransactionViolation[]>] {
	const [report] = useOnyx(`${ONYXKEYS.COLLECTION.REPORT}${reportID ?? CONST.DEFAULT_NUMBER_ID}`);
	const [transactions] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION, {
	selector: (_transactions) => reportTransactionsSelector(_transactions, reportID),
	});
	const [violations] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS, {
	selector: (allViolations) =>
	Object.fromEntries(
	Object.entries(allViolations ?? {}).filter(([key]) =>
	transactions?.some((transaction) => transaction.transactionID === key.replace(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS, '')),
	),
	),
	});
	return [report, transactions ?? DEFAULT_TRANSACTIONS, violations ?? DEFAULT_VIOLATIONS];
	}

The problem is that the violation useOnyx is only recalculated when the violation data changes, and when it changes, the transactions onyx are still empty.

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

We need to add transactions as the deps of the violations onyx.

const [violations] = useOnyx(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS, {
    selector: (allViolations) =>
        Object.fromEntries(
            Object.entries(allViolations ?? {}).filter(([key]) =>
                transactions?.some((transaction) => transaction.transactionID === key.replace(ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS, '')),
            ),
        ),
}, [transactions]);

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

N/A

[melvin-bot]

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

[melvin-bot]

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

[dangrous]

Happy to help with internal review here when it's ready!

[Ollyws]

@bernhardoj's proposal LGTM.
🎀👀🎀 C+ reviewed

[melvin-bot]

Current assignee @dangrous is eligible for the choreEngineerContributorManagement assigner, not assigning anyone new.