-
Notifications
You must be signed in to change notification settings - Fork 19.3k
chore: integrate @tanstack/eslint-plugin-query and fix service layer lint errors #30444
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
Conversation
Summary of ChangesHello @lyzno1, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed! This pull request focuses on improving the codebase's quality and maintainability by introducing a dedicated ESLint plugin for React Query. This integration helps enforce best practices for data fetching and caching. Concurrently, it addresses and rectifies existing linting issues related to missing dependencies in Highlights
🧠 New Feature in Public Preview: You can now enable Memory to help Gemini Code Assist learn from your team's feedback. This makes future code reviews more consistent and personalized to your project's style. Click here to enable Memory in your admin console. Using Gemini Code AssistThe full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips. Invoking Gemini You can request assistance from Gemini at any point by creating a comment using either
Customization To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a Limitations & Feedback Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here. You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension. Footnotes
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request successfully integrates @tanstack/eslint-plugin-query and resolves several exhaustive-deps linting errors across various service hooks. The changes correctly update queryKeys to include all dependencies from the queryFn, which is great for data consistency. However, some of the fixes, particularly those involving spreading objects into the queryKey (e.g., { ...params }), introduce potential performance issues by creating new object references on every render. This can lead to unnecessary query refetches. I've added specific comments with suggestions to improve query key stability and prevent these performance problems.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Pull request overview
This PR integrates @tanstack/eslint-plugin-query to enforce React Query best practices and resolves exhaustive-deps violations in service hooks by ensuring queryKey arrays include all variables used in queryFn.
Key Changes:
- Added
@tanstack/eslint-plugin-queryv5.91.2 as a dev dependency and enabled the flat/recommended configuration - Updated queryKey arrays across 8 service files to include all external variables referenced in queryFn
- Fixed cache key inconsistencies to ensure proper data freshness and invalidation behavior
Reviewed changes
Copilot reviewed 10 out of 11 changed files in this pull request and generated 9 comments.
Show a summary per file
| File | Description |
|---|---|
| web/package.json | Added @tanstack/eslint-plugin-query dev dependency |
| web/pnpm-lock.yaml | Updated lock file with new plugin and transitive dependency version updates |
| web/eslint.config.mjs | Imported and enabled the query plugin's flat/recommended rule set |
| web/service/use-plugins.ts | Updated queryKey to include full currentProvider object and normalized file name |
| web/service/use-pipeline.ts | Changed queryKey to include full params object instead of individual properties |
| web/service/use-models.ts | Added missing configFrom parameter to queryKey |
| web/service/use-explore.ts | Added systemFeatures.webapp_auth.enabled to queryKey |
| web/service/use-apps.ts | Wrapped params in object literal with spread operator for two statistics queries |
| web/service/knowledge/use-segment.ts | Changed queryKey to spread params in object literal for segment and child segment lists |
| web/service/knowledge/use-document.ts | Added params to queryKey in document list, detail, and metadata queries |
| web/service/access-control.ts | Added systemFeatures.webapp_auth.enabled and isInstalledApp to queryKey |
Files not reviewed (1)
- web/pnpm-lock.yaml: Language not supported
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
|
/gemini review |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Code Review
This pull request successfully integrates @tanstack/eslint-plugin-query and addresses several exhaustive-deps linting errors across the service layer. The changes correctly add missing dependencies to queryKey arrays in various useQuery hooks.
However, I've identified a couple of instances where the fix, while satisfying the linter, introduces potential performance issues by using unstable object references in queryKey. This can lead to unnecessary data refetching. I've left specific comments with suggestions to improve the stability of these query keys while still adhering to the exhaustive-deps rule.
Overall, this is a valuable cleanup, and with the suggested adjustments, it will be a solid improvement to the codebase's reliability and performance.
Summary
This PR integrates
@tanstack/eslint-plugin-queryto improve code quality and reliability by enforcing React Query best practices. It also resolves multipleexhaustive-depsviolations identified in theservice/directory.Changes
@tanstack/eslint-plugin-queryas a dev dependency.eslint.config.mjsto enable theflat/recommendedrule set.queryKeyacross multiple service hooks to ensure data freshness and correct caching behavior.Fix Details
Fixed
exhaustive-depserrors in the following files by ensuring all external variables used inqueryFnare included in thequeryKey:service/use-apps.tsservice/use-explore.tsservice/use-models.tsservice/use-pipeline.tsservice/use-plugins.tsservice/knowledge/use-segment.tsservice/access-control.tsservice/knowledge/use-document.tsapp/components/goto-anything/index.tsxRelated Issue
Closes #30443