Conversation
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
|
Co-authored-by: manudeli <61593290+manudeli@users.noreply.github.com>
Co-authored-by: manudeli <61593290+manudeli@users.noreply.github.com>
…ntation Co-authored-by: manudeli <61593290+manudeli@users.noreply.github.com>
|
@copilot rebase please |
People can be co-author:
|
|
@2-NOW Could you review this with me? because this is your idea initially |
There was a problem hiding this comment.
Pull Request Overview
This PR implements a new ESLint rule @suspensive/check-parent-suspense that ensures components using Suspense-related APIs are properly wrapped in a Suspense boundary to prevent runtime errors.
- Adds comprehensive ESLint rule with configurable options for hooks, components, and wrapper names
- Includes complete test suite validating both valid and invalid usage patterns
- Updates existing codebase files to comply with the new rule using eslint-disable comments
Reviewed Changes
Copilot reviewed 24 out of 25 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| configs/eslint-config/rules/check-parent-suspense.js | Core rule implementation detecting Suspense API usage and validating wrapper boundaries |
| configs/eslint-config/tests/rules/check-parent-suspense.test.js | Comprehensive test suite with valid/invalid test cases |
| configs/eslint-config/plugin.js | Plugin configuration exporting rules and recommended config |
| configs/eslint-config/index.js | Integration of the plugin into React TypeScript configuration |
| packages/react-query-/src/.tsx | Addition of eslint-disable comments for library components |
| examples//src/.tsx | Addition of eslint-disable comments for example usage |
Files not reviewed (1)
- pnpm-lock.yaml: Language not supported
Tip: Customize your code reviews with copilot-instructions.md. Create the file or learn how to get started.
| import { RuleTester } from 'eslint' | ||
| import babelEslintParser from '@babel/eslint-parser' |
There was a problem hiding this comment.
Using the legacy RuleTester from ESLint v8. Consider migrating to the new FlatRuleTester from ESLint v9 for better future compatibility and consistency with the flat config system used elsewhere in the codebase.
I've resolved the merge conflicts and successfully rebased the branch onto main. The conflicts were in:
The rebase is complete and all ESLint rule tests are still passing. The branch is now ready for review with the latest main branch changes integrated. Commit: 2affdbc |
| }) => <>{children(useSuspenseInfiniteQuery(options))}</> | ||
| }) => ( | ||
| <> | ||
| {/* eslint-disable-next-line @suspensive/check-parent-suspense */} |
There was a problem hiding this comment.
I've disabled the @suspensive/check-parent-suspense rule for all files in packages/**/*.{ts,tsx} by adding a configuration block to the ESLint config and removing the individual eslint-disable comments from 13 files across the packages.
The rule is now ignored in all packages while still being enforced in examples and application code.
Commit: 2146269
Co-authored-by: manudeli <61593290+manudeli@users.noreply.github.com>
Sure! Thank you for giving me the opportunity. |
|
@copilot resolve conflict |
I've successfully resolved the merge conflicts and rebased the branch onto the latest main. The conflicts were in:
The rebase is complete and all ESLint rule tests are still passing. The branch is now up to date with the latest main branch changes. Commit: 0ded5c5 |
|
I love it! I really hope this works. I'll review it as well! |
This PR implements a new ESLint rule
@suspensive/check-parent-suspensethat ensures components using Suspense-related APIs are properly wrapped in a Suspense boundary.What it does
The rule detects usage of Suspense-related APIs and validates they are wrapped in a
<Suspense>component:Detected APIs:
useSuspenseQuery,useSuspenseInfiniteQuery,useSuspenseQueriesSuspenseQuery,SuspenseInfiniteQuery,SuspenseQuerieslazy()functionConfiguration
The rule is enabled by default in React TypeScript configurations but disabled for all files in
packages/**to exempt library code from the check while still enforcing it in application code and examples.Examples
❌ Before (produces errors):
✅ After (correct usage):
Implementation details
configs/eslint-config/rules/check-parent-suspense.js@suspensive/eslint-configand enabled by default in React TypeScript configurationspackages/**/*.{ts,tsx}files to allow library components that are designed to be used within Suspense boundariesRecent Updates
configs/eslint-config/package.jsonandpnpm-lock.yamlpackages/**/*.{ts,tsx}filesReal-world impact
The rule successfully identified several legitimate issues in the existing codebase where Suspense-related APIs were used without proper Suspense boundaries, demonstrating its practical value for preventing runtime errors.
For cases where the rule is too strict, developers can use
// eslint-disable-next-line @suspensive/check-parent-suspenseto disable the rule locally, though this is typically not needed since library code in packages is automatically exempted.Fixes #1654.
✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.