[Better Expense Report View] Header checkbox in the expense thread doesn't show indeterminate state

[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.1.32-0
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: N/A
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Issue reported by: Applause - Internal Team

Action Performed:

Precondition - use Expensifail account

1. Go to https://staging.new.expensify.com/
2. Go to any chat and submit at least 3 expenses.
3. Open the thread, then select some checkboxes (not all)

Expected Result:

The header checkbox in the expense thread should display an indeterminate state when some of the individual checkboxes are selected, to be consistent with other areas where checkboxes are used

Actual Result:

The header checkbox remains in the unchecked state even when some checkboxes are selected, instead of showing the indeterminate state

Workaround:

Unknown

Platforms:

Select the officially supported platforms where the issue was reproduced:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Platforms Tested:

On which of our officially supported platforms was this issue tested:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6810947_1745435939793.bandicam_2025-04-23_22-18-13-999.mp4

View all open jobs on GitHub

[melvin-bot]

Triggered auto assignment to @Julesssss (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[melvin-bot]

💬 A slack conversation has been started in #expensify-open-source

[nkdengineer]

🚨 Edited by proposal-police: This proposal was edited at 2025-04-23 20:26:31 UTC.

Proposal

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

The header checkbox remains in the unchecked state even when some checkboxes are selected, instead of showing the indeterminate state

What is the root cause of that problem?

We forgot to add the isIndeterminate in this CheckBox

App/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx

Lines 149 to 159 in cbe2ca9

	<Checkbox
	onPress={() => {
	if (selectedTransactionsID.length === transactions.length) {
	setSelectedTransactionsID([]);
	} else {
	setSelectedTransactionsID(transactions.map((t) => t.transactionID));
	}
	}}
	accessibilityLabel={CONST.ROLE.CHECKBOX}
	isChecked={selectedTransactionsID.length === transactions.length}
	/>

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

1. We should add this prop

    isIndeterminate={selectedTransactionsID.length > 0 && selectedTransactionsID.length !== transactions.length}

App/src/components/MoneyRequestReportView/MoneyRequestReportTransactionList.tsx

Lines 149 to 159 in cbe2ca9

	<Checkbox
	onPress={() => {
	if (selectedTransactionsID.length === transactions.length) {
	setSelectedTransactionsID([]);
	} else {
	setSelectedTransactionsID(transactions.map((t) => t.transactionID));
	}
	}}
	accessibilityLabel={CONST.ROLE.CHECKBOX}
	isChecked={selectedTransactionsID.length === transactions.length}
	/>

2. We also need to update the onPress function

           onPress={() => {
                if (selectedTransactionsID.length > 0) {
                    setSelectedTransactionsID([]);
                } else {
                    setSelectedTransactionsID(transactions.map((t) => t.transactionID));
              }

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)

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.

[Julesssss]

Verified on staging, just for users in this beta. It's not going to be a blocker as the feature is behind a beta flag.

FYI @mountiny, as I believe you're working on this