refactor: Omnichannel's tag autocompletes to useInfiniteQuery #35874

aleksandernsilva · 2025-04-24T19:37:25Z

Proposed changes (including videos or screenshots)

This PR refactors the useTagsList hook to take advantage of react query's useInfiniteQuery instead of RecordList in combination with useScrollableRecordList.

Issue(s)

CTZ-105

Steps to test or reproduce

Further comments

This change can be tested by visiting pages using tag autocompletes and confirming the expected behavior: fetching, filtering and lazy loading.

Current chats page

This pull request refactors the Omnichannel's tag autocomplete functionality in the Rocket.Chat repository. The main changes include:

New Custom Hook: Introduces a useTagsList hook in TypeScript using @tanstack/react-query. This hook fetches and manages a paginated list of livechat tags from the /v1/livechat/tags endpoint, supporting filtering by text, department, and an option to view all tags. It also handles infinite scrolling logic.
Component Refactor: Updates the AutoCompleteTagsMultiple component to use the new useTagsList hook, simplifying data fetching and pagination logic. It enhances prop handling by deriving types from the PaginatedMultiSelectFiltered component and allowing pass-through props.
Department Editing Logic: Modifies the logic in the department editing form to determine unit requirements by replacing list.itemCount with list.length.

These changes aim to improve the efficiency and maintainability of the tag autocomplete feature in the Omnichannel module.

dionisio-bot · 2025-04-24T19:37:29Z

Looks like this PR is ready to merge! 🎉
If you have any trouble, please check the PR guidelines

changeset-bot · 2025-04-24T19:37:29Z

⚠️ No Changeset found

Latest commit: 841f8ea

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

kodus-ai · 2025-04-24T19:37:30Z

Code Review Completed! 🔥

The code review was successfully completed based on your current configurations.

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

apps/meteor/client/components/Omnichannel/hooks/useTagsList.ts

apps/meteor/client/omnichannel/tags/AutoCompleteTagsMultiple.tsx

github-actions · 2025-04-24T19:52:09Z

PR Preview Action v1.6.1
🚀 View preview at https://RocketChat.github.io/Rocket.Chat/pr-preview/pr-35874/
Built to branch `gh-pages` at 2025-05-19 13:15 UTC. Preview will be ready when the GitHub Pages deployment is complete.

codecov · 2025-04-24T19:53:07Z

Codecov Report

Attention: Patch coverage is 87.83784% with 9 lines in your changes missing coverage. Please review.

Project coverage is 64.96%. Comparing base (29bf978) to head (841f8ea).
Report is 1 commits behind head on develop.

Additional details and impacted files

@@             Coverage Diff             @@
##           develop   #35874      +/-   ##
===========================================
+ Coverage    64.92%   64.96%   +0.03%     
===========================================
  Files         3100     3100              
  Lines        92490    92544      +54     
  Branches     17652    17661       +9     
===========================================
+ Hits         60046    60117      +71     
+ Misses       29677    29665      -12     
+ Partials      2767     2762       -5

Flag	Coverage Δ
e2e	`58.45% <88.88%> (+0.01%)`	⬆️
unit	`72.10% <87.32%> (+0.07%)`	⬆️

Flags with carried forward coverage won't be shown. Click here to find out more.

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

kodus-ai · 2025-04-25T15:32:47Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodus-ai · 2025-05-07T17:42:13Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

apps/meteor/client/components/Omnichannel/hooks/useTagsList.spec.ts

apps/meteor/client/omnichannel/tags/AutoCompleteTagsMultiple.tsx

kodus-ai · 2025-05-13T20:54:12Z

Kody Review Complete

Great news! 🎉
No issues were found that match your current review configurations.

Keep up the excellent work! 🚀

Kody Guide: Usage and Configuration

Interacting with Kody

Request a Review: Ask Kody to review your PR manually by adding a comment with the @kody start-review command at the root of your PR.
Provide Feedback: Help Kody learn and improve by reacting to its comments with a 👍 for helpful suggestions or a 👎 if improvements are needed.

Current Kody Configuration

Review Options

The following review options are enabled or disabled:

Options	Enabled
Security	✅
Code Style	✅
Kody Rules	✅
Refactoring	✅
Error Handling	✅
Maintainability	✅
Potential Issues	✅
Documentation And Comments	✅
Performance And Optimization	✅
Breaking Changes	❌

Access your configuration settings here.

kodiakhq · 2025-05-19T07:09:23Z

This PR currently has a merge conflict. Please resolve this and then re-add the ['stat: ready to merge', 'automerge'] label.

kodus-ai bot reviewed Apr 24, 2025

View reviewed changes

apps/meteor/client/components/Omnichannel/hooks/useTagsList.ts Outdated Show resolved Hide resolved

kodus-ai bot reviewed Apr 24, 2025

View reviewed changes

apps/meteor/client/omnichannel/tags/AutoCompleteTagsMultiple.tsx Show resolved Hide resolved

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from e5b3a29 to cf364fd Compare April 24, 2025 20:43

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from 45ba893 to a200f05 Compare April 25, 2025 17:33

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from a200f05 to 7c119b8 Compare May 5, 2025 16:32

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from 997a4bb to 553a07d Compare May 7, 2025 18:20

aleksandernsilva marked this pull request as ready for review May 7, 2025 20:10

aleksandernsilva requested review from a team as code owners May 7, 2025 20:10

tassoevan requested changes May 13, 2025

View reviewed changes

apps/meteor/client/components/Omnichannel/hooks/useTagsList.spec.ts Outdated Show resolved Hide resolved

apps/meteor/client/omnichannel/tags/AutoCompleteTagsMultiple.tsx Show resolved Hide resolved

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from a82c991 to c64c565 Compare May 14, 2025 19:20

tassoevan previously approved these changes May 15, 2025

View reviewed changes

tassoevan added this to the 7.7.0 milestone May 16, 2025

tassoevan added the stat: QA assured Means it has been tested and approved by a company insider label May 19, 2025

dionisio-bot bot added the stat: ready to merge PR tested and approved waiting for merge label May 19, 2025

kodiakhq bot removed the stat: ready to merge PR tested and approved waiting for merge label May 19, 2025

dionisio-bot bot added the stat: conflict label May 19, 2025

aleksandernsilva added 4 commits May 19, 2025 10:09

feat: implemented useInfiniteTagssList

a3ab30b

refactor: AutoCompleteTagsMultiple to use useInfiniteTagsList

d13b977

chore: improved AutoCompleteTagsMultiple typing

b27ba1b

chore: added initialData to useInfiniteTagsList

ad18dae

aleksandernsilva added 4 commits May 19, 2025 10:09

refactor: renamed useInfiniteTagsList to useTagsList

5d7a1c5

fix: unable to fetch due to incorrect initialData

930cac2

test: added unit tests for useTagsList

77e6c33

test: updated to not test transient state

841f8ea

aleksandernsilva dismissed tassoevan’s stale review via 841f8ea May 19, 2025 13:10

aleksandernsilva force-pushed the refactor/tag-autocomplete-query branch from c64c565 to 841f8ea Compare May 19, 2025 13:10

dionisio-bot bot removed the stat: conflict label May 19, 2025

tassoevan merged commit 6792669 into develop May 19, 2025
54 checks passed

tassoevan deleted the refactor/tag-autocomplete-query branch May 19, 2025 14:34

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

refactor: Omnichannel's tag autocompletes to useInfiniteQuery #35874

refactor: Omnichannel's tag autocompletes to useInfiniteQuery #35874

Uh oh!

aleksandernsilva commented Apr 24, 2025 •

edited

Loading

Uh oh!

dionisio-bot bot commented Apr 24, 2025 •

edited

Loading

Uh oh!

changeset-bot bot commented Apr 24, 2025 •

edited

Loading

Uh oh!

kodus-ai bot commented Apr 24, 2025 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

github-actions bot commented Apr 24, 2025 •

edited

Loading

Built to branch `gh-pages` at 2025-05-19 13:15 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

Uh oh!

codecov bot commented Apr 24, 2025 •

edited

Loading

Uh oh!

kodus-ai bot commented Apr 25, 2025 •

edited

Loading

Uh oh!

kodus-ai bot commented May 7, 2025 •

edited

Loading

Uh oh!

Uh oh!

Uh oh!

kodus-ai bot commented May 13, 2025 •

edited

Loading

Uh oh!

kodiakhq bot commented May 19, 2025

Uh oh!

Uh oh!

Uh oh!

refactor: Omnichannel's tag autocompletes to useInfiniteQuery #35874

refactor: Omnichannel's tag autocompletes to useInfiniteQuery #35874

Uh oh!

Conversation

aleksandernsilva commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Proposed changes (including videos or screenshots)

Issue(s)

Steps to test or reproduce

Further comments

Uh oh!

dionisio-bot bot commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

changeset-bot bot commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

⚠️ No Changeset found

Uh oh!

kodus-ai bot commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Code Review Completed! 🔥

Uh oh!

Uh oh!

Uh oh!

github-actions bot commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Built to branch gh-pages at 2025-05-19 13:15 UTC. Preview will be ready when the GitHub Pages deployment is complete.

Uh oh!

codecov bot commented Apr 24, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

kodus-ai bot commented Apr 25, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Kody Review Complete

Uh oh!

kodus-ai bot commented May 7, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Kody Review Complete

Uh oh!

Uh oh!

Uh oh!

kodus-ai bot commented May 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Kody Review Complete

Uh oh!

kodiakhq bot commented May 19, 2025

Uh oh!

Uh oh!

Uh oh!

aleksandernsilva commented Apr 24, 2025 •

edited

Loading

dionisio-bot bot commented Apr 24, 2025 •

edited

Loading

changeset-bot bot commented Apr 24, 2025 •

edited

Loading

kodus-ai bot commented Apr 24, 2025 •

edited

Loading

github-actions bot commented Apr 24, 2025 •

edited

Loading

Built to branch `gh-pages` at 2025-05-19 13:15 UTC.
Preview will be ready when the GitHub Pages deployment is complete.

codecov bot commented Apr 24, 2025 •

edited

Loading

kodus-ai bot commented Apr 25, 2025 •

edited

Loading

kodus-ai bot commented May 7, 2025 •

edited

Loading

kodus-ai bot commented May 13, 2025 •

edited

Loading