chore: use @rc-component/resize-observer #302
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
|
Warning Rate limit exceeded@li-jia-nan has exceeded the limit for the number of commits or files that can be reviewed per hour. Please wait 20 minutes and 41 seconds before requesting another review. ⌛ How to resolve this issue?After the wait time has elapsed, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans have higher rate limits than the trial, open-source and free plans. In all cases, we re-allow further reviews after a brief timeout. Please see our FAQ for further information. 📒 Files selected for processing (5)
概述演练这个拉取请求主要涉及将包从 变更
可能相关的 PR
诗歌
Thank you for using CodeRabbit. We offer it for free to the OSS community and would appreciate your support in helping us grow. If you find it useful, would you consider giving us a shout-out on your favorite social media? 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
|
New, updated, and removed dependencies detected. Learn more about Socket for GitHub ↗︎
🚮 Removed packages: npm/[email protected] |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 0
🧹 Nitpick comments (1)
src/List.tsx (1)
151-153: 改进：使用 useRef 的泛型类型建议为 useRef 添加明确的泛型类型，以提高类型安全性：
-const componentRef = useRef<HTMLDivElement>(null); -const fillerInnerRef = useRef<HTMLDivElement>(null); -const containerRef = useRef<HTMLDivElement>(null); +const componentRef = useRef<HTMLDivElement | null>(null); +const fillerInnerRef = useRef<HTMLDivElement | null>(null); +const containerRef = useRef<HTMLDivElement | null>(null);
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (14)
.gitignore(1 hunks)examples/animate.tsx(5 hunks)package.json(4 hunks)src/Filler.tsx(2 hunks)src/List.tsx(6 hunks)src/ScrollBar.tsx(3 hunks)src/hooks/useFrameWheel.ts(1 hunks)src/hooks/useHeights.tsx(1 hunks)src/hooks/useMobileTouchMove.ts(1 hunks)src/hooks/useScrollDrag.ts(1 hunks)src/hooks/useScrollTo.tsx(2 hunks)src/mock.tsx(1 hunks)tests/scroll.test.js(1 hunks)tests/scrollWidth.test.tsx(1 hunks)
✅ Files skipped from review due to trivial changes (7)
- src/mock.tsx
- src/hooks/useScrollDrag.ts
- src/hooks/useMobileTouchMove.ts
- src/hooks/useHeights.tsx
- tests/scrollWidth.test.tsx
- src/hooks/useFrameWheel.ts
- tests/scroll.test.js
🔇 Additional comments (14)
src/Filler.tsx (2)
2-2: 导入路径更新符合最新规范从
rc-resize-observer更新到@rc-component/resize-observer的变更与代码库中的其他更改保持一致。
98-100: 优化了生产环境的代码体积在非生产环境下才设置 displayName，这样可以在保持开发体验的同时优化生产环境的代码体积。
src/hooks/useScrollTo.tsx (2)
3-3: 统一更新了工具函数的导入路径将
rc-util包中的工具函数导入路径更新为@rc-component/util，保持了代码库的一致性。Also applies to: 6-6, 7-7
40-40: 明确初始化 ref 值为 null使用
null显式初始化 React ref 是一个好的实践，可以避免 undefined 带来的潜在问题。examples/animate.tsx (3)
8-8: 更新了 useLayoutEffect 的导入路径将 useLayoutEffect 的导入路径从 rc-util 更新为 @rc-component/util，与代码库的其他部分保持一致。
138-138: 明确初始化 listRef使用
null显式初始化 listRef，这是一个推荐的做法。
148-148: 箭头函数的格式保持一致代码格式的统一性有助于提高可读性和可维护性。
Also applies to: 162-165, 169-173
src/ScrollBar.tsx (2)
2-2: 更新了 raf 工具函数的导入路径将 raf 的导入路径从 rc-util 更新为 @rc-component/util，保持了代码库的一致性。
52-53: 统一使用 null 初始化所有 ref对所有 React ref 使用 null 进行显式初始化，包括：
- scrollbarRef
- thumbRef
- visibleTimeoutRef
- enableScrollRangeRef
- enableOffsetRangeRef
这种做法提高了代码的类型安全性和可预测性。
Also applies to: 57-57, 123-126
package.json (2)
2-3: 需要更新 CHANGELOG包名更改为
@rc-component/virtual-list且版本从 3.18.1 重置为 1.0.0 是一个重大变更。建议：
- 在 CHANGELOG 中详细说明迁移步骤
- 添加迁移指南文档
68-69: 验证 React 19 兼容性将 React 依赖更新到 19.0.0 版本是一个重大变更：
- 需要验证组件在 React 19 下的兼容性
- peerDependencies 设置为 >=16.9.0 可能需要重新评估
Also applies to: 72-74
✅ Verification successful
React 19 兼容性检查结果良好
代码库检查结果显示：
- 未发现使用已废弃的生命周期方法
- 主要使用 Hooks API，符合 React 现代最佳实践
- 现有的 peerDependencies (>=16.9.0) 配置适用于 React 19
🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # 检查是否有使用已废弃的 React API rg -l "componentWillMount|componentWillReceiveProps|componentWillUpdate" --type typescriptLength of output: 127
Script:
#!/bin/bash # 检查废弃的生命周期方法和 API echo "=== 检查废弃的 React API ===" rg -l "componentWillMount|componentWillReceiveProps|componentWillUpdate|React\.createClass" --type js --type jsx --type ts --type tsx echo -e "\n=== 检查类组件使用情况 ===" rg -l "class.*extends.*React\.Component|class.*extends.*Component" --type js --type jsx --type ts --type tsx echo -e "\n=== 检查 package.json 中的 peerDependencies ===" cat package.json | jq '.peerDependencies' echo -e "\n=== 检查 React Hooks 使用情况 ===" rg -l "use[A-Z].*\(" --type js --type jsx --type ts --type tsxLength of output: 772
Script:
#!/bin/bash # 首先找到所有的 React 相关文件 echo "=== 查找 React 文件 ===" fd -e js -e jsx -e tsx -e ts echo -e "\n=== 检查文件内容 ===" # 使用找到的文件进行内容搜索 fd -e js -e jsx -e tsx -e ts -x rg -l "componentWillMount|componentWillReceiveProps|componentWillUpdate|React\.createClass" {} \; echo -e "\n=== 检查类组件 ===" fd -e js -e jsx -e tsx -e ts -x rg -l "class.*extends.*React\.Component|class.*extends.*Component" {} \; echo -e "\n=== 检查 Hooks 使用 ===" fd -e js -e jsx -e tsx -e ts -x rg -l "use[A-Z].*\(" {} \;Length of output: 1910
.gitignore (1)
11-11: 确保测试 mock 路径正确配置mock 路径从
rc-util更改为@rc-component/util，请确保：
- 所有测试用例都已更新以使用新路径
- CI 管道中的测试配置已相应更新
src/List.tsx (2)
670-672: 优化：条件性设置 displayName良好的实践：在非生产环境下设置 displayName 以便调试。
2-5: 更新依赖导入路径已将导入路径从
rc-util和rc-resize-observer更新为@rc-component范围。确保所有相关组件都已更新。✅ Verification successful
导入路径更新已完成验证
经过全面检查，确认所有组件都已更新为使用
@rc-component范围的新导入路径。代码库中未发现任何遗留的rc-util或rc-resize-observer旧路径引用。🏁 Scripts executed
The following scripts were executed for the analysis:
Script:
#!/bin/bash # 检查是否还有旧的导入路径 rg -l "from 'rc-(util|resize-observer)" --type typescriptLength of output: 97
Script:
#!/bin/bash # Search for old import paths in .ts and .tsx files rg -l -g '*.ts' -g '*.tsx' "from ['\"]rc-(util|resize-observer)" # Show the actual import statements with context rg -A 1 -g '*.ts' -g '*.tsx' "from ['\"]rc-(util|resize-observer)"Length of output: 139
Script:
#!/bin/bash # Search for any mention of old package names rg -g '*.ts' -g '*.tsx' "rc-util|rc-resize-observer"Length of output: 54
Summary by CodeRabbit
新功能
rc-virtual-list更改为@rc-component/virtual-list重构
依赖变更
1.0.0开发调整
displayName.gitignore配置