fix: pagination state on search for custom sounds and emojis - #40115
fix: pagination state on search for custom sounds and emojis#40115nazabucciarelli wants to merge 3 commits into
Conversation
|
Looks like this PR is not ready to merge, because of the following issues:
Please fix the issues and try again If you have any trouble, please check the PR guidelines |
🦋 Changeset detectedLatest commit: 2194484 The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
Note Reviews pausedIt looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the Use the following commands to manage reviews:
Use the checkboxes below for quick actions:
WalkthroughCustom Emoji and Custom Sounds now reset pagination to page 0 when filter text changes. Custom Emoji also updates its no-results check. A changeset declares patch releases for ChangesAdmin pagination reset
Estimated code review effort: 2 (Simple) | ~8 minutes Suggested reviewers: 🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✨ Finishing Touches 💡 1🛠️ Fix failing CI checks 💡
Warning Review ran into problems🔥 ProblemsErrors were encountered while retrieving linked issues. Errors (1)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 Prompt for all review comments with AI agents
Verify each finding against the current code and only fix it if needed.
Inline comments:
In @.changeset/real-suns-float.md:
- Line 5: Update the changeset description string that currently reads "Fixes
pagination reset on search for Customs Sounds and Emojis" to use the correct
wording "Custom Sounds" (i.e., change "Customs Sounds" → "Custom Sounds") so the
description becomes "Fixes pagination reset on search for Custom Sounds and
Emojis"; ensure only the typo is corrected and punctuation/capitalization
remains consistent.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 8f2e7b1d-0bb3-4f4a-ae81-9d97ae3b6e81
📒 Files selected for processing (3)
.changeset/real-suns-float.mdapps/meteor/client/views/admin/customEmoji/CustomEmoji.tsxapps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
📜 Review details
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (3)
- GitHub Check: 📦 Build Packages
- GitHub Check: cubic · AI code reviewer
- GitHub Check: CodeQL-Build
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation
Files:
apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsxapps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
🧠 Learnings (5)
📚 Learning: 2026-02-24T19:09:09.561Z
Learnt from: ahmed-n-abdeltwab
Repo: RocketChat/Rocket.Chat PR: 38974
File: apps/meteor/app/api/server/v1/im.ts:220-221
Timestamp: 2026-02-24T19:09:09.561Z
Learning: In RocketChat/Rocket.Chat OpenAPI migration PRs for apps/meteor/app/api/server/v1 endpoints, maintainers prefer to avoid any logic changes; style-only cleanups (like removing inline comments) may be deferred to follow-ups to keep scope tight.
Applied to files:
.changeset/real-suns-float.md
📚 Learning: 2026-02-24T19:05:56.710Z
Learnt from: ahmed-n-abdeltwab
Repo: RocketChat/Rocket.Chat PR: 0
File: :0-0
Timestamp: 2026-02-24T19:05:56.710Z
Learning: Rocket.Chat repo context: When a workspace manifest on develop already pins a dependency version (e.g., packages/web-ui-registration → "rocket.chat/ui-contexts": "27.0.1"), a lockfile change in a feature PR that upgrades only that dependency’s resolution is considered a manifest-driven sync and can be kept, preferably as a small "chore: sync yarn.lock with manifests" commit.
Applied to files:
.changeset/real-suns-float.md
📚 Learning: 2025-11-19T18:20:07.720Z
Learnt from: gabriellsh
Repo: RocketChat/Rocket.Chat PR: 37419
File: packages/i18n/src/locales/en.i18n.json:918-921
Timestamp: 2025-11-19T18:20:07.720Z
Learning: Repo: RocketChat/Rocket.Chat — i18n/formatting
Learning: This repository uses a custom message formatting parser in UI blocks/messages; do not assume standard Markdown rules. For keys like Call_ended_bold, Call_not_answered_bold, Call_failed_bold, and Call_transferred_bold in packages/i18n/src/locales/en.i18n.json, retain the existing single-asterisk emphasis unless maintainers request otherwise.
Applied to files:
.changeset/real-suns-float.md
📚 Learning: 2026-03-16T21:50:37.589Z
Learnt from: amitb0ra
Repo: RocketChat/Rocket.Chat PR: 39676
File: .changeset/migrate-users-register-openapi.md:3-3
Timestamp: 2026-03-16T21:50:37.589Z
Learning: For changes related to OpenAPI migrations in Rocket.Chat/OpenAPI, when removing endpoint types and validators from rocket.chat/rest-typings (e.g., UserRegisterParamsPOST, /v1/users.register) document this as a minor changeset (not breaking) per RocketChat/Rocket.Chat-Open-API#150 Rule 7. Note that the endpoint type is re-exposed via a module augmentation .d.ts in the consuming package (e.g., packages/web-ui-registration/src/users-register.d.ts). In reviews, ensure the changeset clearly states: this is a non-breaking change, the major version should not be bumped, and the changeset reflects a minor version bump. Do not treat this as a breaking change during OpenAPI migrations.
Applied to files:
.changeset/real-suns-float.md
📚 Learning: 2026-03-27T14:52:56.865Z
Learnt from: dougfabris
Repo: RocketChat/Rocket.Chat PR: 39892
File: apps/meteor/client/views/room/contextualBar/Threads/Thread.tsx:150-155
Timestamp: 2026-03-27T14:52:56.865Z
Learning: In Rocket.Chat, there are two different `ModalBackdrop` components with different prop APIs. During review, confirm the import source: (1) `rocket.chat/fuselage` `ModalBackdrop` uses `ModalBackdropProps` based on `BoxProps` (so it supports `onClick` and other Box/DOM props) and does not have an `onDismiss` prop; (2) `rocket.chat/ui-client` `ModalBackdrop` uses a narrower props interface like `{ children?: ReactNode; onDismiss?: () => void }` and handles Escape keypress and outside mouse-up, and it does not forward arbitrary DOM props such as `onClick`. Flag mismatched props (e.g., `onDismiss` passed to the fuselage component or `onClick` passed to the ui-client component) and ensure the usage matches the correct component being imported.
Applied to files:
apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsxapps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
🔇 Additional comments (2)
apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx (1)
68-74: Good fix: page index reset is applied at the right place.Resetting
currentinside the searchonChangehandler correctly prevents stale offsets during filtered queries.apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx (1)
71-77: Looks correct: search now reliably starts from page 1.This change properly resets pagination state when the filter text changes.
Codecov Report❌ Patch coverage is Additional details and impacted files@@ Coverage Diff @@
## develop #40115 +/- ##
===========================================
- Coverage 68.61% 68.48% -0.13%
===========================================
Files 4133 4159 +26
Lines 160773 158822 -1951
Branches 29243 28361 -882
===========================================
- Hits 110315 108770 -1545
+ Misses 45348 44845 -503
- Partials 5110 5207 +97
Flags with carried forward coverage won't be shown. Click here to find out more. 🚀 New features to boost your workflow:
|
dougfabris
left a comment
dougfabris
left a comment
There was a problem hiding this comment.
This fix seems a little weak, I'm wondering if we could have a more wider solution under the usePagination or something else, so all places we use it, could benefit from a potential fix
6c822db to
e341162
Compare
There was a problem hiding this comment.
Pull request overview
This PR fixes an admin UI pagination bug where searching in Custom Sounds / Custom Emojis could keep the previous page offset, resulting in empty/out-of-range results. It does so by extending the shared usePagination hook to allow resetting the current page when specified “reset trigger” values change.
Changes:
- Extended
usePaginationto accept an optionalresetDependenciesarray that triggerssetCurrent(0)when any dependency changes. - Wired Custom Sounds and Custom Emojis tables to reset pagination when the search text changes.
- Added a changeset entry for a patch release.
Reviewed changes
Copilot reviewed 4 out of 4 changed files in this pull request and generated 2 comments.
| File | Description |
|---|---|
| packages/ui-client/src/components/GenericTable/hooks/usePagination.ts | Adds optional reset-dependencies support to reset pagination state when filters/search change. |
| apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx | Passes search text into usePagination so pagination resets on search changes. |
| apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx | Passes search text into usePagination so pagination resets on search changes; minor null-safe condition tweak. |
| .changeset/real-suns-float.md | Patch release note for the pagination reset fix. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
e341162 to
c45e386
Compare
There was a problem hiding this comment.
🧹 Nitpick comments (2)
apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx (2)
32-32: 🗄️ Data Integrity & Integration | 🔵 Trivial | 🏗️ Heavy liftConfirm the intended pagination reset contract.
usePagination()is not scoped totext; the reset now exists only in theFilterByTexthandler at Line 73-76. The PR objective describes a reusableresetDependenciesarray, but the current hook definition accepts no reset dependency and only resets onitemsPerPage. Confirm which contract is intended. If the hook-level contract is required, restore it and pass[text]; otherwise, update the objective and keep the local reset deliberate. (raw.githubusercontent.com)🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx` at line 32, Clarify and implement the intended pagination reset contract: update usePagination to accept the reusable resetDependencies input and pass [text] from CustomEmoji, or explicitly retain the local FilterByText reset if that is the intended design. Keep reset behavior consistent with the selected contract and update related documentation/objective accordingly.
71-77: 🎯 Functional Correctness | 🔵 Trivial | ⚡ Quick winAdd a regression test for the filtered-page reset.
When
currentis non-zero, changeFilterByTextand advance the 500 ms debounce. Assert that the request usesoffset: 0and that the first-page result renders. This covers the reported page-2 search path. (github.com)🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx` around lines 71 - 77, Add a regression test around the CustomEmoji filtering flow: set the current page to a non-zero value, change FilterByText, advance the 500 ms debounce, and assert the request uses offset: 0 and the first-page results render. Anchor the test to the CustomEmoji component and its FilterByText/onSetCurrent behavior.
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Nitpick comments:
In `@apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx`:
- Line 32: Clarify and implement the intended pagination reset contract: update
usePagination to accept the reusable resetDependencies input and pass [text]
from CustomEmoji, or explicitly retain the local FilterByText reset if that is
the intended design. Keep reset behavior consistent with the selected contract
and update related documentation/objective accordingly.
- Around line 71-77: Add a regression test around the CustomEmoji filtering
flow: set the current page to a non-zero value, change FilterByText, advance the
500 ms debounce, and assert the request uses offset: 0 and the first-page
results render. Anchor the test to the CustomEmoji component and its
FilterByText/onSetCurrent behavior.
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: CHILL
Plan: Pro Plus
Run ID: f12eb372-0fd0-4725-8611-26c9f65941f0
📒 Files selected for processing (3)
.changeset/real-suns-float.mdapps/meteor/client/views/admin/customEmoji/CustomEmoji.tsxapps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
💤 Files with no reviewable changes (1)
- .changeset/real-suns-float.md
🚧 Files skipped from review as they are similar to previous changes (1)
- apps/meteor/client/views/admin/customSounds/CustomSoundsTable/CustomSoundsTable.tsx
📜 Review details
⏰ Context from checks skipped due to timeout. (4)
- GitHub Check: 📦 Build Packages
- GitHub Check: CodeQL-Build
- GitHub Check: Hacktron Security Check
- GitHub Check: CodeQL-Build
⚠️ CI failures not shown inline (3)
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
GitHub Check: Dionisio QA: Some checks did not pass
Conclusion: failure
**Conclusion:** failure
### Steps
- ✅ **No merge conflicts**
- ❌ **QA assured** — This PR is missing the 'stat: QA assured' label
- ✅ **Mergeable**
- ✅ **Has milestone or project**
- ✅ **Valid PR title**
- ✅ **Correct target version**
🧰 Additional context used
📓 Path-based instructions (1)
**/*.{ts,tsx,js}
📄 CodeRabbit inference engine (.cursor/rules/playwright.mdc)
**/*.{ts,tsx,js}: Write concise, technical TypeScript/JavaScript with accurate typing in Playwright tests
Avoid code comments in the implementation
Files:
apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
🧠 Learnings (2)
📚 Learning: 2026-03-27T14:52:56.865Z
Learnt from: dougfabris
Repo: RocketChat/Rocket.Chat PR: 39892
File: apps/meteor/client/views/room/contextualBar/Threads/Thread.tsx:150-155
Timestamp: 2026-03-27T14:52:56.865Z
Learning: In Rocket.Chat, there are two different `ModalBackdrop` components with different prop APIs. During review, confirm the import source: (1) `rocket.chat/fuselage` `ModalBackdrop` uses `ModalBackdropProps` based on `BoxProps` (so it supports `onClick` and other Box/DOM props) and does not have an `onDismiss` prop; (2) `rocket.chat/ui-client` `ModalBackdrop` uses a narrower props interface like `{ children?: ReactNode; onDismiss?: () => void }` and handles Escape keypress and outside mouse-up, and it does not forward arbitrary DOM props such as `onClick`. Flag mismatched props (e.g., `onDismiss` passed to the fuselage component or `onClick` passed to the ui-client component) and ensure the usage matches the correct component being imported.
Applied to files:
apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
📚 Learning: 2026-05-06T12:21:44.083Z
Learnt from: juliajforesti
Repo: RocketChat/Rocket.Chat PR: 40256
File: apps/meteor/client/components/CreateDiscussion/CreateDiscussion.tsx:121-149
Timestamp: 2026-05-06T12:21:44.083Z
Learning: Field wrappers in rocket.chat/fuselage-forms (Field, FieldLabel, FieldRow, FieldError, FieldHint) auto-create htmlFor/id associations, aria-describedby, and role="alert" for errors. Do not manually set htmlFor, id, aria-describedby, or role attributes when using these wrappers. This automatic wiring does not apply to plain rocket.chat/fuselage components, which require explicit ID wiring per the accessibility docs. In code reviews, prefer using fuselage-forms wrappers for form fields and verify there is no unnecessary manual ID/aria wiring in files that use these wrappers. If a component uses plain fuselage components, ensure proper id wiring as per docs.
Applied to files:
apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx
🔇 Additional comments (1)
apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx (1)
123-123: LGTM!
![cubic-dev-ai[bot]](https://avatars.githubusercontent.com/in/1082092?s=60&v=4){kind=small}
There was a problem hiding this comment.
1 issue found across 5 files (changes from recent commits).
Prompt for AI agents (unresolved issues)
Check if these issues are valid — if so, understand the root cause of each and fix them. If appropriate, use sub-agents to investigate and fix each issue separately.
<file name="apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx">
<violation number="1" location="apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx:75">
P3: The new search-reset behavior is not covered by a regression test: the current specs never search from a later page or assert that the resulting custom emoji/sound request uses offset 0. Adding an interaction test that navigates to page 2, types a search term, and verifies the endpoint query would make CORE-2096 resistant to regressions.
(Based on your team's feedback about meaningful behavior and edge-case tests.) .</violation>
</file>
Tip: Review your code locally with the cubic CLI to iterate faster.
Re-trigger cubic
| value={text} | ||
| onChange={(event) => { | ||
| setText(event.target.value); | ||
| onSetCurrent(0); |
There was a problem hiding this comment.
P3: The new search-reset behavior is not covered by a regression test: the current specs never search from a later page or assert that the resulting custom emoji/sound request uses offset 0. Adding an interaction test that navigates to page 2, types a search term, and verifies the endpoint query would make CORE-2096 resistant to regressions.
(Based on your team's feedback about meaningful behavior and edge-case tests.) .
Prompt for AI agents
Check if this issue is valid — if so, understand the root cause and fix it. At apps/meteor/client/views/admin/customEmoji/CustomEmoji.tsx, line 75:
<comment>The new search-reset behavior is not covered by a regression test: the current specs never search from a later page or assert that the resulting custom emoji/sound request uses offset 0. Adding an interaction test that navigates to page 2, types a search term, and verifies the endpoint query would make CORE-2096 resistant to regressions.
(Based on your team's feedback about meaningful behavior and edge-case tests.) .</comment>
<file context>
@@ -68,7 +68,13 @@ const CustomEmoji = ({ onClick, reload }: CustomEmojiProps) => {
+ value={text}
+ onChange={(event) => {
+ setText(event.target.value);
+ onSetCurrent(0);
+ }}
+ />
</file context>
Proposed changes (including videos or screenshots)
Introduced a new optional parameter
resetDependencies(an array) to theusePaginationcustom hook. When any value inside this array changes, the hook automatically resets the current page to 0.Instead of accepting a single value for the reset trigger, I implemented it directly as an array. This allows any table using this hook to easily handle multiple simultaneous filters in the future (e.g., [text, status, category]) without modifying the hook's signature again.
Issue(s)
CORE-2096 [Improvement] Pagination not resetting on search in Custom Sounds and Custom Emojis tables
Steps to test or reproduce
Further comments
Summary by CodeRabbit
Bug Fixes