refactor: Upgrade utils and replace useMergedState #161
Conversation
Walkthrough将依赖 @rc-component/util 从 ^1.2.0 升级到 ^1.3.0；在 Switch 组件中用 useControlledState 替换 useMergedState 管理受控/非受控的 checked 状态，初始化逻辑改为以 defaultChecked ?? false 为初值并接受 checked 作为受控值。未改动任何导出签名。 Changes
Sequence Diagram(s)sequenceDiagram
autonumber
actor User as 用户
participant Switch as Switch 组件
participant Hook as useControlledState
participant Parent as 父组件
User->>Switch: 点击/切换
Note right of Switch: 从 props 读取<br/>checked / defaultChecked
Switch->>Hook: 初始化: useControlledState(defaultChecked ?? false, checked)
Hook-->>Switch: 返回 [value, setValue]
alt 受控 (checked 提供)
Switch->>Parent: 触发 onChange(nextChecked)
Parent-->>Switch: 通过 props.checked 传回受控值
Switch->>Hook: 同步受控 value
else 非受控 (无 checked)
Switch->>Hook: setValue(nextChecked)
Switch->>Parent: 触发 onChange(nextChecked)
end
Estimated code review effort🎯 2 (Simple) | ⏱️ ~10 minutes Possibly related PRs
Suggested reviewers
Pre-merge checks (2 passed, 1 warning)❌ Failed checks (1 warning)
✅ Passed checks (2 passed)
Poem
✨ Finishing touches
🧪 Generate 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. Comment |
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
There was a problem hiding this comment.
Summary of Changes
Hello @EmilyyyLiu, I'm Gemini Code Assist1! I'm currently reviewing this pull request and will post my feedback shortly. In the meantime, here's a summary to help you and other reviewers quickly get up to speed!
This pull request refactors the component's internal state management by updating a core utility library and migrating to a more explicit controlled state hook. This change aligns with the latest version of @rc-component/util, ensuring the component leverages improved state handling mechanisms for better predictability and maintainability, as indicated by the related issue.
Highlights
- Dependency Upgrade: The
@rc-component/utildependency has been upgraded from version^1.2.0to^1.3.0. - State Hook Replacement: The
useMergedStatehook has been replaced withuseControlledStateinsrc/index.tsxfor managing component state, aligning with the updated utility library.
Using Gemini Code Assist
The full guide for Gemini Code Assist can be found on our documentation page, here are some quick tips.
Invoking Gemini
You can request assistance from Gemini at any point in your pull request via creating an issue comment (i.e. comment on the pull request page) using either /gemini <command> or @gemini-code-assist <command>. Below is a summary of the supported commands.
| Feature | Command | Description |
|---|---|---|
| Code Review | /gemini review |
Performs a code review for the current pull request in its current state. |
| Pull Request Summary | /gemini summary |
Provides a summary of the current pull request in its current state. |
| Comment | @gemini-code-assist | Responds in comments when explicitly tagged, both in issue comments and review comments. |
| Help | /gemini help |
Displays a list of available commands. |
Customization
To customize Gemini Code Assist for GitHub experience, repository maintainers can create a configuration file and/or provide a custom code review style guide (such as PEP-8 for Python) by creating and adding files to a .gemini/ folder in the base of the repository. Detailed instructions can be found here.
Limitations & Feedback
Gemini Code Assist may make mistakes. Please leave feedback on any instances where its feedback is incorrect or counter productive. You can react with 👍 and 👎 on @gemini-code-assist comments. If you're interested in giving your feedback about your experience with Gemini Code Assist for Github and other Google products, sign up here.
You can also get AI-powered code generation, chat, as well as code reviews directly in the IDE at no cost with the Gemini Code Assist IDE Extension.
Footnotes
-
Review the Privacy Notices, Generative AI Prohibited Use Policy, Terms of Service, and learn how to configure Gemini Code Assist in GitHub here. Gemini can make mistakes, so double check it and use code with caution. ↩
![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/index.tsx (1)
52-55: 状态初始化与受控值顺序正确；可做一次轻量懒初始化微调当前写法等价于原逻辑，建议用懒初始化避免每次渲染都计算默认值（虽为布尔，微优化即可）：
- const [innerChecked, setInnerChecked] = useControlledState<boolean>( - defaultChecked ?? false, - checked, - ); + const [innerChecked, setInnerChecked] = useControlledState<boolean>( + () => (defaultChecked ?? false), + checked, + );另，受控切换为非受控（
checked从 boolean →undefined）时，请确认不会短暂出现innerChecked === undefined影响aria-checked与样式判定；若需兜底，可在渲染处对布尔值取整（可选优化）。可用以下片段在本组件层面补一条行为测试（思路）：
// 伪代码：从受控(true)切到非受控(undefined)后，aria-checked 应仍为 'true' 或回落为 'false' 而非缺失 // render(<Switch checked defaultChecked={false} />) // rerender(<Switch defaultChecked={false} />) // checked -> undefined // expect(screen.getByRole('switch')).toHaveAttribute('aria-checked', expect.stringMatching(/^(true|false)$/))
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (2)
package.json(1 hunks)src/index.tsx(2 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Socket Security: Pull Request Alerts
🔇 Additional comments (2)
package.json (1)
47-47: 已移除 useMergedState；需验证构建能解析新导入路径检查结果：未在 src/** 中发现 useMergedState；src/index.tsx 从 '@rc-component/util/lib/hooks/useControlledState' 和 '@rc-component/util/lib/KeyCode' 导入。
动作：在本地或 CI 运行完整构建/打包以验证上述路径在构建产物中可解析；若解析失败，改为使用包的公共导出或调整导入路径（位置：src/index.tsx）。src/index.tsx (1)
3-3: 切换到useControlledState的引入路径正确
@rc-component/util@1.3.0已新增该 Hook，lib/hooks/useControlledState可用。与该版本的变更相符。 (github.com)
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## master #161 +/- ##
=========================================
Coverage 100.00% 100.00%
=========================================
Files 1 1
Lines 34 34
Branches 8 9 +1
=========================================
Hits 34 34 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
2 participants
关联issue：ant-design/ant-design#54854
替换 useMergedState 为 useControlledState
Summary by CodeRabbit