Skip to content

fix(eslint-plugin-query): handle array-destructured useQueries results in no-unstable-deps (fix #10746)#10747

Open
vinamra1102 wants to merge 2 commits into
TanStack:mainfrom
vinamra1102:main
Open

fix(eslint-plugin-query): handle array-destructured useQueries results in no-unstable-deps (fix #10746)#10747
vinamra1102 wants to merge 2 commits into
TanStack:mainfrom
vinamra1102:main

Conversation

@vinamra1102
Copy link
Copy Markdown

@vinamra1102 vinamra1102 commented May 21, 2026

What does this PR fix?

The no-unstable-deps rule silently ignores array-destructured results
from useQueries and useSuspenseQueries. Writing:

const [userQuery, postsQuery] = useQueries({ queries: [...] })

causes neither variable to be tracked as unstable, so using them in
useEffect dependency arrays is never flagged — even though it should be.

Root cause

collectVariableNames in no-unstable-deps.rule.ts only handled
Identifier patterns. When the result is array-destructured, the id
node is an ArrayPattern which was silently ignored.

Evidence this is unintentional

The sibling rule no-rest-destructuring already handles ArrayPattern
correctly for useQueries and useSuspenseQueries (lines 69–86 of
no-rest-destructuring.rule.ts), confirming this pattern is expected
and no-unstable-deps had a gap.

Fix

Added ArrayPattern handling to collectVariableNames to iterate over
elements and track each destructured variable individually, including
rest elements.

Tests added

  • Invalid: useQueries array element used as dep → flagged
  • Invalid: useSuspenseQueries array element used as dep → flagged
  • Invalid: rest element (...restQueries) used as dep → flagged

Related issue

Fixes #10746

Summary by CodeRabbit

Release Notes

  • Bug Fixes
    • Fixed the no-unstable-deps ESLint rule to properly handle array-destructured results from useQueries and useSuspenseQueries hooks, improving detection of unstable dependencies in these patterns.

Review Change Stack

vinamra1102 and others added 2 commits May 21, 2026 11:39
…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…
@coderabbitai
Copy link
Copy Markdown
Contributor

coderabbitai Bot commented May 21, 2026

📝 Walkthrough

Walkthrough

This PR fixes a false-negative gap in the no-unstable-deps ESLint rule where array-destructured results from useQueries and useSuspenseQueries were not being flagged as unstable dependencies. The fix extends collectVariableNames to handle ArrayPattern destructuring, matching existing coverage in the sibling no-rest-destructuring rule. Test cases validate both valid and invalid scenarios.

Changes

Array Destructuring Support for no-unstable-deps

Layer / File(s) Summary
Array pattern handling in collectVariableNames
packages/eslint-plugin-query/src/rules/no-unstable-deps/no-unstable-deps.rule.ts
collectVariableNames now recognizes ArrayPattern bindings, iterating through destructured elements and mapping identifiers (including rest elements) to their originating query hook name.
Test coverage for array destructuring patterns
packages/eslint-plugin-query/src/__tests__/no-unstable-deps.test.ts
Valid test case confirms array-destructured element properties are stable; invalid test cases confirm the rule flags whole elements and rest arrays from useQueries and useSuspenseQueries as unstable dependencies.
Patch release documentation
.changeset/fix-no-unstable-deps-array-pattern.md
Changeset marks a patch release documenting the fix for handling array-destructured useQueries and useSuspenseQueries results.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

🐰 A rabbit hops through destructured arrays,
Detecting unstable hooks in ESLint's maze,
Array patterns now shine in the linting light,
Where useQueries deps are caught just right!

🚥 Pre-merge checks | ✅ 5
✅ Passed checks (5 passed)
Check name Status Explanation
Title check ✅ Passed The PR title clearly describes the fix: handling array-destructured useQueries results in the no-unstable-deps rule, with reference to the related issue.
Description check ✅ Passed The PR description comprehensively explains the bug, root cause, evidence, fix approach, tests added, and relates to issue #10746, aligning with the repository's template requirements.
Linked Issues check ✅ Passed The code changes fully address issue #10746 by extending collectVariableNames to handle ArrayPattern for useQueries and useSuspenseQueries, with comprehensive test coverage for array destructuring scenarios.
Out of Scope Changes check ✅ Passed All changes are in-scope: the rule implementation fix handles ArrayPattern, test cases cover the reported bug scenarios, and the changeset documents the patch release appropriately.
Docstring Coverage ✅ Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✏️ Tip: You can configure your own custom pre-merge checks in the settings.

✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests

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.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

Copy link
Copy Markdown
Contributor

@coderabbitai coderabbitai Bot left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

📥 Commits

Reviewing files that changed from the base of the PR and between 3a5753f and 6ce381a.

📒 Files selected for processing (3)
  • .changeset/fix-no-unstable-deps-array-pattern.md
  • packages/eslint-plugin-query/src/__tests__/no-unstable-deps.test.ts
  • packages/eslint-plugin-query/src/rules/no-unstable-deps/no-unstable-deps.rule.ts

@vinamra1102
Copy link
Copy Markdown
Author

Updated the PR to also handle AssignmentPattern elements in array
destructuring (e.g. const [query = fallback] = useQueries(...)),
as suggested by CodeRabbit.

Workflows are awaiting approval could a maintainer please approve
CI to run? Happy to address any further feedback. Thank you!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[Bug] no-unstable-deps rule misses array-destructured useQueries results

1 participant