chore: update maintenance dependencies#367
Conversation
|
Deployment failed with the following error: Learn More: https://vercel.com/react-component?upgradeToPro=build-rate-limit |
|
Warning Review limit reached
Next review available in: 7 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (7)
Walkthrough本次变更迁移 ESLint 至 Flat Config、调整 tsconfig 编译选项并新增 global.d.ts 全局类型声明，将多个组件与 hooks 中的 ref 类型改为可空（HTMLElement | null），示例组件切换为 React.forwardRef，同时升级依赖版本（含 React 19 约束），并对 README、dependabot.yml 做文档与 CI 配置微调。 Changes工具链与类型系统更新
Estimated code review effort: 3 (Moderate) | ~25 minutes Possibly related PRs
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ 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 |
|
Review the following changes in direct dependencies. Learn more about Socket for GitHub. |
|
All alerts resolved. Learn more about Socket for GitHub. This PR previously contained dependency changes with security issues that have been resolved, removed, or ignored. |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Code Review
This pull request updates the project to support React 19 and TypeScript 6, which includes upgrading dependencies, migrating to ESLint's flat configuration, refactoring components to use React.forwardRef, and adding compatibility type declarations. Feedback on these changes highlights several type safety and compatibility concerns: declaring the deprecated hydrate method in react-dom risks runtime errors in React 19, overriding Jest globals with any disables type safety in tests, disabling @typescript-eslint/no-unused-vars globally can lead to dead code, and disabling strict compiler flags in tsconfig.json significantly reduces type safety.
Important
The consumer version of Gemini Code Assist on GitHub is being sunset. Starting June 18, 2026, new organization installations will be blocked, and all code review activity will officially cease on July 17, 2026.
For more details on the timeline and next steps, please review the Help Documentation.
|
React Doctor found 25 issues in 4 files · 25 warnings · score 62 / 100 (Needs work) · vs 25 warnings
Reviewed by React Doctor for commit |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
❌ Deploy failed
📋 Build log (last lines)🤖 Powered by surge-preview |
|||||||||
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #367 +/- ##
=======================================
Coverage 97.50% 97.50%
=======================================
Files 19 19
Lines 800 801 +1
Branches 193 191 -2
=======================================
+ Hits 780 781 +1
Misses 20 20 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
|
Deployment failed with the following error: Learn More: https://vercel.com/afc163s-projects?upgradeToPro=build-rate-limit |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (2)
examples/switch.tsx (1)
9-24: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick win去掉对
MyItem的二次forwardRef包装
MyItem在第 9 行已经是forwardRef组件，第 26 行再包一层会把组件对象当成 render 函数传入，运行时会报错。直接复用MyItem即可。建议修改
-const ForwardMyItem = React.forwardRef(MyItem as any); +const ForwardMyItem = MyItem;🤖 Prompt for 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. In `@examples/switch.tsx` around lines 9 - 24, `MyItem` is already created with React.forwardRef, so remove the extra forwardRef wrapping where it is reused to avoid passing the component object as a render function. Update the usage in the switch example to reference `MyItem` directly, and keep the existing `MyItem` definition unchanged.examples/no-virtual.tsx (1)
10-26: 🎯 Functional Correctness | 🟠 Major | ⚡ Quick win删除多余的
forwardRef包装
MyItem已经是forwardRef组件了，ForwardMyItem = React.forwardRef(MyItem as any)会把组件对象当成 render function 继续包装，渲染时会出错。这里直接复用MyItem即可。建议修改
-const ForwardMyItem = React.forwardRef(MyItem as any); +const ForwardMyItem = MyItem;🤖 Prompt for 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. In `@examples/no-virtual.tsx` around lines 10 - 26, Remove the extra React.forwardRef wrapping around MyItem in the no-virtual example. MyItem is already created with React.forwardRef, so ForwardMyItem should reuse MyItem directly instead of treating the component object as a render function. Update the usage site that defines ForwardMyItem to point to MyItem as-is and keep the existing MyItem component definition unchanged.
🧹 Nitpick comments (1)
.github/dependabot.yml (1)
11-14: 🧹 Nitpick | 🔵 Trivial通配符分组会把所有依赖（含主版本升级）合并到同一个 PR。
patterns: ['*']会将所有 npm/GitHub Actions 更新都归入单个分组 PR，补丁、次要及主版本升级会混在一起，一旦某个主版本升级导致构建失败，会阻塞其余安全补丁的合入。如非刻意如此，可考虑按更新类型（如update-types: ["patch", "minor"]单独分组，major 单独处理）进一步细分。Also applies to: 24-27
🤖 Prompt for 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. In @.github/dependabot.yml around lines 11 - 14, The current npm-dependencies group uses a wildcard pattern that buckets all updates, including major upgrades, into one Dependabot PR. Update the Dependabot grouping config in the groups block to split updates by type so patch/minor changes can land separately from major upgrades, and keep the relevant group definition aligned with the npm-dependencies symbol in the dependabot config.
🤖 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 `@react-compat.d.ts`:
- Around line 3-11: The module augmentation in react-compat.d.ts is
reintroducing pre-React-19 signatures for useRef, isValidElement, and
cloneElement, which leaks incompatible public types. Update the zero-argument
useRef<T>() call sites under src and examples to React 19-compatible usage
first, then remove the react module augmentation entirely so the package matches
`@types/react`@19. Use the symbols useRef, isValidElement, and cloneElement to
find and eliminate the compatibility shim.
In `@src/Item.tsx`:
- Around line 9-13: The ref callback in Item.tsx must accept null because React
will call it with null during unmount and StrictMode replay. Update the setRef
signature in ItemProps and the refFunc callback to use HTMLElement | null, and
ensure the value is passed through unchanged so downstream callers can handle
cleanup safely.
In `@tsconfig.json`:
- Line 5: The JSX compiler setting is still using the old transform, so update
the tsconfig JSX option from the legacy React mode to the modern React JSX
transform. Change the tsconfig configuration entry for jsx to the newer
react-jsx value so React 19 builds use the current transform and avoid the
outdated JSX warning.
---
Outside diff comments:
In `@examples/no-virtual.tsx`:
- Around line 10-26: Remove the extra React.forwardRef wrapping around MyItem in
the no-virtual example. MyItem is already created with React.forwardRef, so
ForwardMyItem should reuse MyItem directly instead of treating the component
object as a render function. Update the usage site that defines ForwardMyItem to
point to MyItem as-is and keep the existing MyItem component definition
unchanged.
In `@examples/switch.tsx`:
- Around line 9-24: `MyItem` is already created with React.forwardRef, so remove
the extra forwardRef wrapping where it is reused to avoid passing the component
object as a render function. Update the usage in the switch example to reference
`MyItem` directly, and keep the existing `MyItem` definition unchanged.
---
Nitpick comments:
In @.github/dependabot.yml:
- Around line 11-14: The current npm-dependencies group uses a wildcard pattern
that buckets all updates, including major upgrades, into one Dependabot PR.
Update the Dependabot grouping config in the groups block to split updates by
type so patch/minor changes can land separately from major upgrades, and keep
the relevant group definition aligned with the npm-dependencies symbol in the
dependabot config.
🪄 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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: c72c44df-debf-4340-bfa5-067e6a375b4e
📒 Files selected for processing (11)
.github/dependabot.ymlREADME.mdREADME.zh-CN.mdeslint.config.mjsexamples/no-virtual.tsxexamples/switch.tsxglobal.d.tspackage.jsonreact-compat.d.tssrc/Item.tsxtsconfig.json
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 2
🧹 Nitpick comments (1)
tsconfig.json (1)
16-22: 🎯 Functional Correctness | 🔵 Trivial | 🏗️ Heavy lift
strictNullChecks: false削弱了同一 cohort 中 ref 可空化改造的实际收益。本次 cohort 将
Item.tsx、useChildren.tsx、useHeights.tsx、useScrollTo.tsx、List.tsx、ScrollBar.tsx中的 ref 类型统一改为支持null/undefined，但此处strictNullChecks仍为false（非本次新增，但与新引入的可空类型标注方向不一致）。关闭该项后，TypeScript 不会在编译期强制校验对可能为null的 ref 的使用，可空类型标注更多是文档层面的说明，无法真正防止运行时的空引用问题。建议评估后续单独开启strictNullChecks（可考虑逐步迁移），以让类型标注真正发挥作用。🤖 Prompt for 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. In `@tsconfig.json` around lines 16 - 22, `strictNullChecks` is still disabled in tsconfig, which makes the new nullable ref typings in Item.tsx, useChildren.tsx, useHeights.tsx, useScrollTo.tsx, List.tsx, and ScrollBar.tsx largely unenforced. Update the TypeScript configuration to enable `strictNullChecks` (or plan a staged rollout if needed) so the ref nullability changes are actually checked by the compiler and the new types provide real safety.
🤖 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 `@README.md`:
- Line 53: The install command in the README is incorrect: replace the stray “ut
install” entry with the intended package manager install command. Update the
relevant README install instructions consistently (including any other
occurrences) so they match the project’s actual setup, using the same command
style already referenced elsewhere in the document.
In `@README.zh-CN.md`:
- Line 53: The installation command in the README is incorrect and should match
the standard package manager used elsewhere in the docs. Update the install step
in the Chinese README to use the same command as README.md, and make sure the
wording in the installation section is consistent by fixing the command text in
the relevant README install instructions.
---
Nitpick comments:
In `@tsconfig.json`:
- Around line 16-22: `strictNullChecks` is still disabled in tsconfig, which
makes the new nullable ref typings in Item.tsx, useChildren.tsx, useHeights.tsx,
useScrollTo.tsx, List.tsx, and ScrollBar.tsx largely unenforced. Update the
TypeScript configuration to enable `strictNullChecks` (or plan a staged rollout
if needed) so the ref nullability changes are actually checked by the compiler
and the new types provide real safety.
🪄 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: Organization UI
Review profile: CHILL
Plan: Pro
Run ID: 7ff69d02-6660-4161-8509-3156abba9178
📒 Files selected for processing (13)
README.mdREADME.zh-CN.mdeslint.config.mjsexamples/animate.tsxexamples/switch.tsxpackage.jsonsrc/Item.tsxsrc/List.tsxsrc/ScrollBar.tsxsrc/hooks/useChildren.tsxsrc/hooks/useHeights.tsxsrc/hooks/useScrollTo.tsxtsconfig.json
✅ Files skipped from review due to trivial changes (1)
- src/List.tsx
🚧 Files skipped from review as they are similar to previous changes (4)
- src/Item.tsx
- examples/switch.tsx
- package.json
- eslint.config.mjs
|
Related to ant-design/ant-design#58514. |
There was a problem hiding this comment.
Pull request overview
Maintenance-focused update that modernizes the repo’s tooling (React/TS/ESLint/testing deps, lint configuration, Dependabot grouping) while tightening ref-related typing across the virtual list implementation and examples, plus small README link/format updates.
Changes:
- Updated core dev tooling dependencies and added an ESLint flat config (
eslint.config.mjs), removing legacy.eslintrc.js. - Ref/DOM handling cleanup: refs initialized with
null, callback refs updated to allownull, and event handlers stabilized viauseEvent. - Documentation tweaks: link Ant Design ecosystem logo to https://ant.design and minor README formatting adjustments; Dependabot grouped updates.
Reviewed changes
Copilot reviewed 15 out of 17 changed files in this pull request and generated 3 comments.
Show a summary per file
| File | Description |
|---|---|
| tsconfig.json | Switch to bundler module resolution / react-jsx, adjust include/exclude, add module setting. |
| src/ScrollBar.tsx | Stabilize thumb handler with useEvent; ref initialization and timeout ref typing cleanup. |
| src/List.tsx | Ref initialization to null and minor type cleanups for internal refs. |
| src/Item.tsx | Allow callback ref to receive null and ensure callback updates with setRef. |
| src/hooks/useScrollTo.tsx | Tighten ref typing to `number |
| src/hooks/useHeights.tsx | Allow instance refs to be cleared with null (unmount support). |
| src/hooks/useChildren.tsx | Allow node refs to be cleared with null through setNodeRef. |
| README.zh-CN.md | Link Ant Design logo to ant.design and adjust table formatting/whitespace. |
| README.md | Link Ant Design logo to ant.design and adjust whitespace. |
| package.json | Dependency/tooling upgrades (React/TS/ESLint/testing/lint-staged/etc). |
| global.d.ts | Add global type references and module declarations for styles and a few modules. |
| examples/switch.tsx | Update example component ref usage (but currently contains an invalid forwardRef wrapping). |
| examples/no-virtual.tsx | Update example component ref usage (but currently contains an invalid forwardRef wrapping). |
| examples/animate.tsx | Initialize listRef with null. |
| eslint.config.mjs | Add ESLint flat config with TS/React/Jest integration (currently uses nonstandard import.meta.dirname). |
| .github/dependabot.yml | Group npm and GitHub Actions updates. |
| .eslintrc.js | Remove legacy ESLint config (replaced by flat config). |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| ); | ||
| )); | ||
|
|
||
| const ForwardMyItem = React.forwardRef(MyItem as any); |
| }; | ||
| }); | ||
|
|
||
| const ForwardMyItem = React.forwardRef(MyItem as any); |
| projectService: true, | ||
| tsconfigRootDir: import.meta.dirname, | ||
| }, |
Summary
Test Plan
Summary by CodeRabbit