Reports - Huge gap between expense row and header after selecting and unselecting expense

[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.1.75-0
Reproducible in staging?: Yes
Reproducible in production?: No
If this was caught during regression testing, add the test name, ID and link from TestRail: Exploratory
Email or phone of affected tester (no customers): sdjiosdnjsdoisjdoi@gmail.com
Issue reported by: Applause Internal Team
Device used: Samsung Galaxy Z Fold 4 / Android 15
App Component: Search

Action Performed:

1. Go to staging.new.expensify.com
2. Go to workspace chat.
3. Submit an expense.
4. Go to Reports.
5. Long tap on the expense > Select.
6. Tap on the same expense to unselect it

Expected Result:

There will be no big gap between the expense row and the header.

Actual Result:

• There is a huge gap between the expense row and the header.
• Dropdown button disappears and search field and menu button are present while still in the selection mode.
• This issue also happens when holding and unholding expense in Reports.

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

[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]

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

[melvin-bot]

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

[melvin-bot]

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

[BlameGPT]

Possible culprit PRs for this issue

• Feat: Updated the "Download" option to be a push row in both the bulk actions menu and in the More secondary action menu #65246: Refactored bulk-action export handling and modified SearchPageHeader and useSelectedTransactionsActions, which control the header shown when selecting/unselecting expenses, so the new layout could leave excess space after exiting selection mode.
• perf: bottom bar switching and search popovers #65240: Changed DropdownButton and SearchPageHeader rendering for performance; these header alterations may mis-calculate height when selection state changes, producing the observed gap.

If not above, check these

• Bump react-native-onyx to 2.0.113 #65161: Bumping react-native-onyx alters the data-store’s update cycle that drives report list and header state, so the header no longer re-renders correctly after toggling selection, leaving the large gap described.