[CP Staging] Fix selection, keyboard nav, and highlight regressions in group-by split rendering by Krishna2323 · Pull Request #93540 · Expensify/App

Krishna2323 · 2026-06-14T02:41:13Z

Explanation of Change

Fixes all regressions from PR: Add sticky group headers to Spend table (two-phase approach) #92067

#93526 — Only expanded headers were sticky, so the last one stayed stuck with nothing to push it off. Fix: make all group headers sticky so collapsed ones push the previous header away.

#93527 — SearchList stopped counting lazy-loaded groupBy groups as selectable, and GroupHeader treated unloaded groups as empty. Fix: restore pre-#92067 selection counting and don’t disable groups that have transactionsQueryJSON.

#93534 — Split rendering added invisible children_container rows between headers, so arrow keys needed two presses. Fix: skip those indices in keyboard nav and clean up border styling so the focus box renders fully.

#93535 — Selection highlight/border only applied to the header after the split. Fix: align selection styling so the full group (header + children) highlights together.

#93536 — New-expense highlight lived on the old single wrapper; after the split only GroupHeader animated. Fix: add useAnimatedHighlightStyle to GroupChildrenContainer so the expanded section highlights too.

Fixed Issues

$ #88926
$ #93526
$ #93527
$ #93534
$ #93535
$ #93536
PROPOSAL:

Tests

Test #93526

Precondition:
- Account has many reports.

Go to staging.new.expensify.com
Go to Spend > Expenses.
Type group-by:from in the search field and search.
Expand the first report.
Scroll down.
Verify the first expanded header is not sticky when the list scrolls and the second group pushes it

Test #93527

Precondition:
- Account has many expenses from different users.

Go to staging.new.expensify.com
Go to Spend > Cash accruals
Click Select all checkbox
Verify it selects all items
Expand the first report
Verify checkboxes for other reports are not disabled

Test #93534

Precondition:
-Account has many expenses from different users.

Go to staging.new.expensify.com
Go to Spend > Cash accruals.
Press keyboard down arrow a few times.
Verify one press on keyboard down arrow navigates to the next report.
Verify blue boxes have complete borders.

Test for #93535

Go to staging.new.expensify.com
Go to workspace chat.
Create an expense.
Go to Spend > Cash accruals.
Expand the report.
Click Select all checkbox.
Verify the entire report group is highlighted.

Test for #93536

Go to new.expensify
Open Spend tab
Go to Cash Accruals and expand a report with an expense that is on an open report
Open the expense and click More > Add expense > Create expense
Add amount and Merchant and click Create
Exit the report view to see the accrual expenses page
Verify newly added expense causes the expanded section and header of the accrual expenses to get highlighted

Verify that no errors appear in the JS console

Offline tests

Same as tests

QA Steps

Same as tests
Verify that no errors appear in the JS console

PR Author Checklist

Screenshots/Videos

Android: Native

Android: mWeb Chrome

iOS: Native

iOS: mWeb Safari

MacOS: Chrome / Safari

new_expense_highlight_issue.mp4

remaining_bugs.mp4

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

codecov · 2026-06-14T02:56:30Z

Codecov Report

❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.

Files with missing lines	Coverage Δ
src/styles/index.ts	`59.37% <ø> (ø)`
src/styles/utils/index.ts	`52.76% <100.00%> (ø)`
...ponents/Search/SearchList/BaseSearchList/index.tsx	`0.00% <0.00%> (ø)`
...ponents/Search/SearchList/ListItem/GroupHeader.tsx	`16.78% <16.66%> (-0.12%)`	⬇️
src/hooks/useExpandCollapseAnimation.ts	`4.54% <0.00%> (-1.34%)`	⬇️
...rch/SearchList/ListItem/GroupChildrenContainer.tsx	`0.00% <0.00%> (ø)`
src/components/Search/SearchList/index.tsx	`51.47% <46.87%> (+2.79%)`	⬆️
... and 20 files with indirect coverage changes

melvin-bot · 2026-06-14T03:03:11Z

@DylanDylann Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button]

Krishna2323 · 2026-06-14T03:03:57Z

Sorry for the bump @DylanDylann, @ZhenjaHorbach will review this.

chatgpt-codex-connector

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 457b83fa21

ℹ️ About Codex in GitHub

Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you

Open a pull request for review
Mark a draft as ready
Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".

JmillsExpensify

LGTM

… on web Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

JmillsExpensify

LGTM

…imation Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Krishna2323 · 2026-06-14T22:00:16Z

@codex review

JS00001

Lets go ahead w/ merge here, maybe we can follow up to clean code, but not too important

JS00001 · 2026-06-15T13:44:03Z

+        for (let i = 0; i < splitData.length; i++) {
+            const item = splitData.at(i);
+            if (item && isGroupChildrenContainerItem(item)) {
+                childrenIndices.push(i);
+            }
+        }


NAB, prob simpler to do:

Suggested change

for (let i = 0; i < splitData.length; i++) {

const item = splitData.at(i);

if (item && isGroupChildrenContainerItem(item)) {

childrenIndices.push(i);

}

}

for (const [item, index] of splitData.entries()) {

if (isGroupChildrenContainerItem(item)) {

childrenIndices.push(index);

}

}

…remains [CP Staging] Fix selection, keyboard nav, and highlight regressions in group-by split rendering (cherry picked from commit 04ddc38) (cherry-picked to staging by puneetlath)

OSBotify · 2026-06-15T13:51:53Z

✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release.

github-actions · 2026-06-15T14:06:04Z

🚧 @JS00001 has triggered a test Expensify/App build. You can view the workflow run here.

github-actions · 2026-06-15T14:11:32Z

🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
Built from App PR #93540.

Android 🤖	iOS 🍎
https://ad-hoc-expensify-cash.s3.us-east-1.amazonaws.com/rock-artifacts/ad-hoc/rock-android-Adhoc-04ddc38c707-fdecf54-ca247ba6df2b847ba5f472b66a2f3381d8122f1b/index.html	https://ad-hoc-expensify-cash.s3.us-east-1.amazonaws.com/rock-artifacts/ad-hoc/rock-ios-device-AdHoc-04ddc38-fdecf54-230f2664d601bc4bc258c3dda60cfbd6b542b45f/index.html

Web 🕸️
https://93540.pr-testing.expensify.com

👀 View the workflow run that generated this build 👀

OSBotify · 2026-06-15T14:21:37Z

🚀 Cherry-picked to staging by https://github.com/puneetlath in version: 9.4.7-3 🚀

platform	result
🕸 web 🕸	success ✅
🤖 android 🤖	success ✅
🍎 iOS 🍎	success ✅

Bundle Size Analysis (Sentry):

Android
iOS

MelvinBot · 2026-06-15T14:23:52Z

🤖 No help site changes required.

I reviewed the changes in this PR and they are all internal regression fixes to the group-by split rendering in the Search list — none of them alter customer-facing features, flows, settings, labels, or copy that the help site documents.

Why no docs update is needed

The diff is limited to behavioral/visual bug fixes in the SearchList components:

Sticky headers ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend- Group header remains sticky on top when expenses are scrolled away after scrolling down #93526) — making all group headers sticky so collapsed ones push the previous header off.
Selection counting ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Select all checkbox is disabled, checkboxes are disabled when selected #93527) — restoring pre-split selection counts and not disabling lazy-loaded groups.
Keyboard navigation ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Two presses on keyboard down arrow are needed to navigate to the next report #93534) — skipping invisible children_container indices so arrow keys advance one report per press, plus border styling cleanup.
Selection highlight/border ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Line between table header and report group is not highlighted when selected #93535) — aligning highlight styling so the full group highlights together.
New-expense highlight ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Added expense to a report from Cash accrual is not highlighted #93536) — adding the highlight animation to GroupChildrenContainer so the expanded section animates.

No new strings, labels, buttons, or user-facing copy were added (the only string-like changes are code symbols and theme color references). Help site articles under App/docs/articles describe customer-facing product behavior and how-tos, not internal list-rendering details like sticky-header behavior, focus-box borders, or keyboard-navigation indexing — so there is nothing to update.

Since no documentation changes are required, I did not create a draft PR.

@Krishna2323, please confirm you agree no help site updates are needed here. If you believe a specific article should be updated, let me know which behavior is customer-facing and I'll draft the changes.

OSBotify · 2026-06-15T17:54:09Z

🚀 Deployed to production by https://github.com/puneetlath in version: 9.4.7-4 🚀

platform	result
🕸 web 🕸	success ✅
🤖 android 🤖	success ✅
🍎 iOS 🍎	success ✅

OSBotify · 2026-06-15T18:13:52Z

🚀 Cherry-picked to staging by https://github.com/puneetlath in version: 9.4.8-0 🚀

platform	result
🕸 web 🕸	success ✅
🤖 android 🤖	failure ❌
🍎 iOS 🍎	success ✅

Bundle Size Analysis (Sentry):

iOS

MelvinBot · 2026-06-15T18:15:40Z

Help site review — no changes required

I reviewed the changes in this PR against the help site files under App/docs/articles.

Conclusion: No help site updates are required.

Why: This PR is a regression fix for the group-by split-rendering work from #92067. All changes are internal rendering/interaction fixes in src/components/Search/SearchList/, src/hooks/useExpandCollapseAnimation.ts, and src/styles/:

Sticky group headers ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend- Group header remains sticky on top when expenses are scrolled away after scrolling down #93526)
Selection counting for lazy-loaded groupBy groups ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Select all checkbox is disabled, checkboxes are disabled when selected #93527)
Keyboard arrow navigation skipping invisible split rows ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Two presses on keyboard down arrow are needed to navigate to the next report #93534)
Selection highlight/border covering the full group ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Line between table header and report group is not highlighted when selected #93535)
New-expense highlight on the expanded section ([Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Added expense to a report from Cash accrual is not highlighted #93536)

These restore previously-intended behavior. They do not introduce any new feature, setting, tab, button, or label, and they do not change any documented product behavior. Help articles describe how to use features (e.g., searching, grouping, and selecting expenses), and that documented behavior is unchanged by these fixes — so there is nothing to add or correct in the docs, and no draft PR was created.

@Krishna2323, since no help site changes are required, there's no linked help site PR to review. If you believe a specific article should change, let me know which behavior is documented incorrectly and I'll create the draft PR.

OSBotify · 2026-06-15T19:04:58Z

🚀 Cherry-picked to staging by https://github.com/puneetlath in version: 9.4.8-0 🚀

platform	result
🕸 web 🕸	success ✅
🤖 android 🤖	success ✅
🍎 iOS 🍎	success ✅

Bundle Size Analysis (Sentry):

Android
iOS

MelvinBot · 2026-06-15T19:06:52Z

🤖 Help site review: no changes required.

I reviewed the changes in this PR against the help site articles under docs/articles. No updates are needed, so I did not create a draft docs PR.

Why: This is a bug-fix-only PR. All 8 changed files are internal frontend code — src/components/Search/SearchList/*, src/hooks/useExpandCollapseAnimation.ts, and src/styles/*. The fixes restore intended UI/interaction behavior that regressed from #92067:

[Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend- Group header remains sticky on top when expenses are scrolled away after scrolling down #93526 — sticky group headers
[Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Select all checkbox is disabled, checkboxes are disabled when selected #93527 — selection counting for lazy-loaded groupBy groups
[Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Two presses on keyboard down arrow are needed to navigate to the next report #93534 — single-press keyboard navigation
[Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Line between table header and report group is not highlighted when selected #93535 — group selection highlight
[Due for payment 2026-06-23] [Due for payment 2026-06-22] Spend - Added expense to a report from Cash accrual is not highlighted #93536 — new-expense highlight animation

None of these introduce, rename, or alter a user-facing feature, setting, tab, or workflow. The group-by search operator that help articles like Use-Search-Operators-to-Filter-and-Analyze.md document is unchanged — its syntax, purpose, and documented behavior are unaffected. These fixes are implementation-level rendering/interaction corrections that the help site does not describe.

@Krishna2323, if you believe a specific article should be updated to reflect behavior changed here, let me know which one and I'll draft the changes.

OSBotify · 2026-06-16T19:46:02Z

🚀 Deployed to production by https://github.com/puneetlath in version: 9.4.8-3 🚀

platform	result
🕸 web 🕸	success ✅
🤖 android 🤖	success ✅
🍎 iOS 🍎	success ✅

Krishna2323 added 6 commits June 14, 2026 02:55

fix: restore selection logic for lazy-loaded groupBy queries

cbcf9d0

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

fix: skip collapsed children containers during keyboard navigation

93b8d2e

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

fix subheader missing border.

7eaa367

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

fix focus broder visibility.

d96d56e

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

remove border cover from header.

b5457ec

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

highlight group child containers on new expense.

a2636df

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

melvin-bot Bot assigned Krishna2323 Jun 14, 2026

fix prettier.

457b83f

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Krishna2323 changed the title ~~Krishna/fix sticky header remains~~ Fix selection, keyboard nav, and highlight regressions in group-by split rendering Jun 14, 2026

Krishna2323 marked this pull request as ready for review June 14, 2026 03:03

Krishna2323 requested review from a team as code owners June 14, 2026 03:03

melvin-bot Bot requested review from DylanDylann and JmillsExpensify and removed request for a team June 14, 2026 03:03

Krishna2323 mentioned this pull request Jun 14, 2026

[Due for payment 2026-06-23] [Due for payment 2026-06-22] [$250] Make the group headers appear sticky when scrolling down the Spend table #88926

Closed

chatgpt-codex-connector Bot reviewed Jun 14, 2026

View reviewed changes

Comment thread src/components/Search/SearchList/BaseSearchList/index.tsx Outdated

JmillsExpensify previously approved these changes Jun 14, 2026

View reviewed changes

perf: Filter collapsed group children and narrow SearchList extraData…

4995a7f

… on web Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Krishna2323 dismissed JmillsExpensify’s stale review via 4995a7f June 14, 2026 21:15

fix: Scope sticky header FlashList props to web split path in SearchList

f932f88

Signed-off-by: krishna2323 <belivethatkg@gmail.com>

JmillsExpensify previously approved these changes Jun 14, 2026

View reviewed changes

fix: Keep group children rows mounted for reliable expand/collapse an…

12e15e0

…imation Signed-off-by: krishna2323 <belivethatkg@gmail.com>

Krishna2323 dismissed JmillsExpensify’s stale review via 12e15e0 June 14, 2026 22:00

melvin-bot Bot requested review from Valforte and mollfpr June 15, 2026 08:02

JS00001 removed request for Valforte, carlosmiceli, cristipaval, flodnv and mollfpr June 15, 2026 11:52

JS00001 approved these changes Jun 15, 2026

View reviewed changes

JS00001 changed the title ~~Fix selection, keyboard nav, and highlight regressions in group-by split rendering~~ [CP Staging] Fix selection, keyboard nav, and highlight regressions in group-by split rendering Jun 15, 2026

JS00001 approved these changes Jun 15, 2026

View reviewed changes

JS00001 merged commit 04ddc38 into Expensify:main Jun 15, 2026
36 of 38 checks passed

OSBotify added the CP Staging marks PRs that have been CP'd to staging label Jun 15, 2026

OSBotify mentioned this pull request Jun 15, 2026

Deploy Checklist: New Expensify 2026-06-12 #93470

Closed

62 tasks

Uh oh!

Conversation

Krishna2323 commented Jun 14, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Explanation of Change

Fixed Issues

Tests

Test #93526

Test #93527

Test #93534

Test for #93535

Test for #93536

Offline tests

QA Steps

PR Author Checklist

Screenshots/Videos

Uh oh!

codecov Bot commented Jun 14, 2026 • edited by github-actions Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

melvin-bot Bot commented Jun 14, 2026

Uh oh!

Krishna2323 commented Jun 14, 2026

Uh oh!

chatgpt-codex-connector Bot left a comment

Choose a reason for hiding this comment

💡 Codex Review

Uh oh!

Uh oh!

JmillsExpensify left a comment

Choose a reason for hiding this comment

Uh oh!

JmillsExpensify left a comment

Choose a reason for hiding this comment

Uh oh!

Krishna2323 commented Jun 14, 2026

Uh oh!

JS00001 left a comment

Choose a reason for hiding this comment

Uh oh!

JS00001 Jun 15, 2026

Choose a reason for hiding this comment

Uh oh!

Uh oh!

OSBotify commented Jun 15, 2026

Uh oh!

github-actions Bot commented Jun 15, 2026

Uh oh!

github-actions Bot commented Jun 15, 2026

Uh oh!

OSBotify commented Jun 15, 2026

Uh oh!

MelvinBot commented Jun 15, 2026

Uh oh!

OSBotify commented Jun 15, 2026

Uh oh!

OSBotify commented Jun 15, 2026

Uh oh!

MelvinBot commented Jun 15, 2026

Help site review — no changes required

Uh oh!

OSBotify commented Jun 15, 2026

Uh oh!

MelvinBot commented Jun 15, 2026

Uh oh!

OSBotify commented Jun 16, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Krishna2323 commented Jun 14, 2026 •

edited

Loading

codecov Bot commented Jun 14, 2026 •

edited by github-actions Bot

Loading