[Due for payment 2026-05-07] Android & iOS - Reports - Missing < Sort by in Sort by menu in landscape mode

[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.3.60-0
Reproducible in staging?: Yes
Reproducible in production?: N/A - new feature, doesn't exist in prod
If this was caught during regression testing, add the test name, ID and link from BrowserStack: #86297
Email or phone of affected tester (no customers): soidnjsoidjoisjdiosj@gmail.com
Issue reported by: Applause Internal Team
Bug source: Exploratory - Significant User Experience Deterioration
Device used: iPhone 15 Pro Max / iOS 26.3
App Component: Search

Action Performed:

1. Launch Expensify app in landscape mode.
2. Go to Reports > Expenses.
3. Tap Settings button.
4. Tap Sort by.

Expected Result:

< Sort by header will be shown in landscape mode.

Actual Result:

< Sort by header is missing in landscape mode.
User is unable to return to previous page because the back button is missing.

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Video.mp4

View all open jobs on GitHub

Issue Owner

Current Issue Owner: @bernhardoj

[melvin-bot]

You have been assigned to this deploy blocker because you recently merged this PR: #86297

[melvin-bot]

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

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

[OSBotify]

Investigation Summary

Classification: Frontend bug
Causing PR: #86297 - "[Wiring the UI] Revamp search page actions bar" by @bernhardoj (High confidence)
Related Issues: None

Recommendation: REVERT

PR #86297 introduced the revamped search actions bar including DisplayPopup, DropdownButton, and SortByPopup. The bug is contained entirely within the new UI components it introduced, and a clean revert should restore prior behavior.

Assigned: @bernhardoj (PR author), @aimane-chnaif, @JS00001, @luacmartins (approving reviewers)
Labels: DeployBlockerCash kept (App PR caused the issue). DeployBlocker is not present and should not be added.

Detailed Analysis

Evidence

• The issue body directly links to PR 86297 as the regression test that triggered this bug.
• PR 86297 introduced the entire DisplayPopup / DropdownButton / SortByPopup component tree used when tapping Sort by in the new search actions bar.
• PR 86297 is confirmed in the StagingDeployCash checklist (item 96 chronologically), and the bug is staging-only, not reproducible in production where this feature does not exist yet.
• DropdownButton.tsx explicitly passes shouldWrapModalChildrenInScrollViewIfBottomDockedInLandscapeMode={false} to PopoverWithMeasuredContent. On small screens, PopoverWithMeasuredContent renders as a BOTTOM_DOCKED modal.

Verification

• Affected files: src/components/Search/FilterDropdowns/DropdownButton.tsx, src/components/Search/FilterDropdowns/DisplayPopup.tsx
• Both files are confirmed modified by PR 86297 via the GitHub API.

Root Cause

In landscape mode on small screens, BaseModal.tsx applies a maxHeight constraint to BOTTOM_DOCKED modals (maxHeight: windowHeight * CONST.MODAL_MAX_HEIGHT_TO_WINDOW_HEIGHT_RATIO_LANDSCAPE_MODE). Because DropdownButton passes shouldWrapModalChildrenInScrollViewIfBottomDockedInLandscapeMode={false}, the modal content is not wrapped in a ScrollView. When the user navigates into the Sort by sub-page inside DisplayPopup, the component renders a HeaderWithBackButton at the top followed by the SortByPopup list. In landscape mode the available modal height is reduced, and without scroll support the header and back button are pushed out of view or clipped, leaving the user unable to return to the previous page.

[MelvinBot]

Proposal

What is the root cause of that problem?

In landscape mode on mobile, the bottom-docked modal has a maxHeight of 75% of the window height, overflow: 'hidden', and justifyContent: 'center'. The SortByPopup content (header + sort order row + selection list + buttons) exceeds this maxHeight because getSelectionListPopoverHeight calculates the selection list height using the full 75% budget without subtracting space for the DisplayPopup header or SortByPopup's sort order menu item above it. With justifyContent: 'center', the overflowing content is centered and clipped from both top and bottom, hiding the header with its back button.

Additionally, shouldWrapModalChildrenInScrollViewIfBottomDockedInLandscapeMode is hardcoded to false in DropdownButton, so the content cannot be scrolled to reveal the clipped header.

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

Update getSelectionListPopoverHeight to accept an optional parameter for additional content height (header + sort order row) and subtract it from the available height budget. When SortByPopup calls this function (via SingleSelectPopup), it should pass the height of the extra elements rendered above the selection list so the list doesn't claim more space than is actually available within the modal's maxHeight.

What alternative solutions did you explore? (Optional)

1. Enable shouldWrapModalChildrenInScrollViewIfBottomDockedInLandscapeMode — this would make the content scrollable so the header is accessible, but it doesn't fix the root cause (selection list claiming too much height) and may introduce scroll-within-scroll issues.
2. Change justifyContent: 'center' to 'flex-start' for this modal type — this would clip overflow from the bottom instead of the top, keeping the header visible. However, it doesn't fix the underlying height miscalculation and would clip action buttons at the bottom instead.

---

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.

[trjExpensify]

Landscape mode is being partially supported and very recent, not a blocker IMO. @dubielzyk-expensify for a second opinion.