fix(eslint-plugin-query): handle array-destructured useQueries results in no-unstable-deps (fix #10746)#10747
fix(eslint-plugin-query): handle array-destructured useQueries results in no-unstable-deps (fix #10746)#10747vinamra1102 wants to merge 2 commits into
Conversation
…s in no-unstable-deps The `collectVariableNames` function in the `no-unstable-deps` rule only handled `Identifier` patterns. When users array-destructure `useQueries` or `useSuspenseQueries` results (e.g. `const [q1, q2] = useQueries(...)`), the individual variables were not tracked as unstable. This meant passing them directly to React hook dependency arrays was never flagged. Extend `collectVariableNames` to also handle `ArrayPattern` — including plain identifier elements and rest elements. Fixes TanStack#10746
…tern fix(eslint-plugin-query): handle array-destructured useQueries result…
📝 WalkthroughWalkthroughThis PR fixes a false-negative gap in the ChangesArray Destructuring Support for no-unstable-deps
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Poem
🚥 Pre-merge checks | ✅ 5✅ Passed checks (5 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
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 |
There was a problem hiding this comment.
Actionable comments posted: 1
🤖 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.
Inline comments:
In
`@packages/eslint-plugin-query/src/rules/no-unstable-deps/no-unstable-deps.rule.ts`:
- Around line 67-80: In collectVariableNames, ArrayPattern handling currently
only records Identifier and RestElement identifiers and misses AssignmentPattern
elements (e.g., const [q = fallback] = useQueries(...)); add a branch to treat
element.type === AST_NODE_TYPES.AssignmentPattern and, when element.left.type
=== AST_NODE_TYPES.Identifier, register trackedVariables[element.left.name] =
queryHook (similarly handle RestElement whose argument might be an
AssignmentPattern if applicable) so default-value array destructuring is
tracked.
🪄 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: defaults
Review profile: CHILL
Plan: Pro
Run ID: a3f0b505-6822-4e93-aa85-85c7e1e82dfc
📒 Files selected for processing (3)
.changeset/fix-no-unstable-deps-array-pattern.mdpackages/eslint-plugin-query/src/__tests__/no-unstable-deps.test.tspackages/eslint-plugin-query/src/rules/no-unstable-deps/no-unstable-deps.rule.ts
|
Updated the PR to also handle Workflows are awaiting approval could a maintainer please approve |
What does this PR fix?
The
no-unstable-depsrule silently ignores array-destructured resultsfrom
useQueriesanduseSuspenseQueries. Writing:const [userQuery, postsQuery] = useQueries({ queries: [...] })
causes neither variable to be tracked as unstable, so using them in
useEffectdependency arrays is never flagged — even though it should be.Root cause
collectVariableNamesinno-unstable-deps.rule.tsonly handledIdentifierpatterns. When the result is array-destructured, theidnode is an
ArrayPatternwhich was silently ignored.Evidence this is unintentional
The sibling rule
no-rest-destructuringalready handlesArrayPatterncorrectly for
useQueriesanduseSuspenseQueries(lines 69–86 ofno-rest-destructuring.rule.ts), confirming this pattern is expectedand
no-unstable-depshad a gap.Fix
Added
ArrayPatternhandling tocollectVariableNamesto iterate overelements and track each destructured variable individually, including
rest elements.
Tests added
useQueriesarray element used as dep → flaggeduseSuspenseQueriesarray element used as dep → flagged...restQueries) used as dep → flaggedRelated issue
Fixes #10746
Summary by CodeRabbit
Release Notes
no-unstable-depsESLint rule to properly handle array-destructured results fromuseQueriesanduseSuspenseQuerieshooks, improving detection of unstable dependencies in these patterns.