Skip to content

fix:Select with maxCount limit does not allow removal of selected opt… #1148

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Open
wants to merge 2 commits into
base: master
Choose a base branch
from
Open

fix:Select with maxCount limit does not allow removal of selected opt… #1148

wants to merge 2 commits into from

Conversation

765477020
Copy link

@765477020 765477020 commented May 8, 2025 •
edited by coderabbitai bot
Loading

解决这个问题，ant-design/ant-design#53637

Summary by CodeRabbit

  • 优化
    • 改进了使用回车键选择选项时的逻辑，提升了对禁用或缺失选项的处理体验，并优化了最大选择数情况下的交互反馈。
  • 测试
    • 新增测试覆盖在达到最大选择数时按回车键的行为，确保选项的正确取消选择和回调触发。

@coderabbitai coderabbitai
Copy link
Contributor

coderabbitai bot commented May 8, 2025 •
edited
Loading 

## Walkthrough

此次更改调整了 OptionList 组件中 ENTER 键的键盘事件处理逻辑。现在会优先判断当前激活项是否缺失或被禁用，若是，则直接调用 onSelectValue(undefined) 并返回；否则根据 maxCount 和当前值集合判断是否允许选择或取消选择。

## Changes

| 文件或文件组                  | 变更摘要                                               |
|------------------------------|--------------------------------------------------------|
| src/OptionList.tsx           | 优化了 ENTER 键的选择逻辑，明确处理激活项缺失、禁用和最大数量限制的情况。 |
| tests/OptionList.test.tsx    | 新增测试用例，验证多选且达到最大选择数时按 ENTER 键的行为，确保触发正确的取消选择回调。 |

## Sequence Diagram(s)

```mermaid
sequenceDiagram
    participant User as 用户
    participant OptionList as OptionList组件
    participant onSelectValue as onSelectValue回调

    User->>OptionList: 按下 ENTER 键
    OptionList->>OptionList: 检查激活项是否缺失或禁用
    alt 缺失或禁用
        OptionList->>onSelectValue: onSelectValue(undefined)
        OptionList-->>User: 结束
    else 存在且可用
        OptionList->>OptionList: 检查maxCount和rawValues
        alt 可选择或已选中
            OptionList->>onSelectValue: onSelectValue(激活项值)
        else 不可选择
            OptionList->>onSelectValue: onSelectValue(undefined)
        end
    end

Possibly related PRs

Suggested reviewers

  • afc163
  • zombieJ

Poem

小兔敲下 ENTER 键，
选项逻辑更明确。
缺失禁用先退出，
数量已满也不慌。
代码如跳跃，
选择更灵光！
🐇✨


<!-- walkthrough_end -->
<!-- This is an auto-generated comment: all tool run failures by coderabbit.ai -->

> [!WARNING]
> There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.
> 
> <details>
> <summary>🔧 ESLint</summary>
> 
> > If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.
> 
> <details>
> <summary>tests/OptionList.test.tsx</summary>
> 
> 
> Oops! Something went wrong! :(
> 
> ESLint: 8.57.1
> 
> Error: Cannot read config file: /.eslintrc.js
> Error: Cannot find module '@umijs/fabric/dist/eslint'
> Require stack:
> - /.eslintrc.js
> - /node_modules/.pnpm/@eslint+eslintrc@2.1.4/node_modules/@eslint/eslintrc/dist/eslintrc.cjs
> - /node_modules/.pnpm/eslint@8.57.1/node_modules/eslint/lib/cli-engine/cli-engine.js
> - /node_modules/.pnpm/eslint@8.57.1/node_modules/eslint/lib/eslint/eslint.js
> - /node_modules/.pnpm/eslint@8.57.1/node_modules/eslint/lib/eslint/index.js
> - /node_modules/.pnpm/eslint@8.57.1/node_modules/eslint/lib/cli.js
> - /node_modules/.pnpm/eslint@8.57.1/node_modules/eslint/bin/eslint.js
>     at Module._resolveFilename (node:internal/modules/cjs/loader:1248:15)
>     at Module._load (node:internal/modules/cjs/loader:1074:27)
>     at TracingChannel.traceSync (node:diagnostics_channel:315:14)
>     at wrapModuleLoad (node:internal/modules/cjs/loader:217:24)
>     at Module.require (node:internal/modules/cjs/loader:1339:12)
>     at require (node:internal/modules/helpers:135:16)
>     at Object.<anonymous> (/.eslintrc.js:1:14)
>     at Module._compile (node:internal/modules/cjs/loader:1546:14)
>     at Module._extensions..js (node:internal/modules/cjs/loader:1691:10)
>     at Module.load (node:internal/modules/cjs/loader:1317:32)
> 
> </details>
> 
> </details>

<!-- end of auto-generated comment: all tool run failures by coderabbit.ai -->

<!-- announcements_start -->

> [!TIP]
> <details>
> <summary>⚡️ Faster reviews with caching</summary>
> 
> - CodeRabbit now supports caching for code and dependencies, helping speed up reviews. This means quicker feedback, reduced wait times, and a smoother review experience overall. Cached data is encrypted and stored securely. This feature will be automatically enabled for all accounts on May 16th. To opt out, configure `Review - Disable Cache` at either the organization or repository level. If you prefer to disable all data retention across your organization, simply turn off the `Data Retention` setting under your Organization Settings.
> 
> Enjoy the performance boost—your workflow just got faster.
> 
> </details>

<!-- announcements_end -->

---

<details>
<summary>📜 Recent review details</summary>

**Configuration used: CodeRabbit UI**
**Review profile: CHILL**
**Plan: Pro**

<details>
<summary>📥 Commits</summary>

Reviewing files that changed from the base of the PR and between 1d99aa5608dedc3fe0fc7dcf4e4ee66bbdedebc2 and 7da39494de3b9a2fdf605326182e31b0c03b596f.

</details>

<details>
<summary>📒 Files selected for processing (1)</summary>

* `tests/OptionList.test.tsx` (1 hunks)

</details>

<details>
<summary>🔇 Additional comments (1)</summary><blockquote>

<details>
<summary>tests/OptionList.test.tsx (1)</summary>

`465-511`: **测试用例实现良好，有效验证了修复功能**

测试用例清晰地验证了当达到 maxCount 限制时，允许通过 Enter 键取消选择已选项的功能。测试设置初始状态有两个已选项（'1'和'2'），maxCount 设为 2，然后模拟 Enter 键操作并验证正确取消了选项 '1' 的选择，同时没有触发其他选择操作。

测试覆盖了 PR 描述中提到的问题："Select with maxCount limit does not allow removal of selected options"，验证逻辑全面且断言明确。

</details>

</blockquote></details>

</details>
<!-- internal state start -->


<!-- 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= -->

<!-- internal state end -->
<!-- finishing_touch_checkbox_start -->

<details open="true">
<summary>✨ Finishing Touches</summary>

- [ ] <!-- {"checkboxId": "7962f53c-55bc-4827-bfbf-6a18da830691"} --> 📝 Generate Docstrings

</details>

<!-- finishing_touch_checkbox_end -->
<!-- tips_start -->

---

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.

<details>
<summary>❤️ Share</summary>

- [X](https://twitter.com/intent/tweet?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A&url=https%3A//coderabbit.ai)
- [Mastodon](https://mastodon.social/share?text=I%20just%20used%20%40coderabbitai%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20the%20proprietary%20code.%20Check%20it%20out%3A%20https%3A%2F%2Fcoderabbit.ai)
- [Reddit](https://www.reddit.com/submit?title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&text=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code.%20Check%20it%20out%3A%20https%3A//coderabbit.ai)
- [LinkedIn](https://www.linkedin.com/sharing/share-offsite/?url=https%3A%2F%2Fcoderabbit.ai&mini=true&title=Great%20tool%20for%20code%20review%20-%20CodeRabbit&summary=I%20just%20used%20CodeRabbit%20for%20my%20code%20review%2C%20and%20it%27s%20fantastic%21%20It%27s%20free%20for%20OSS%20and%20offers%20a%20free%20trial%20for%20proprietary%20code)

</details>

<details>
<summary>🪧 Tips</summary>

### Chat

There are 3 ways to chat with [CodeRabbit](https://coderabbit.ai?utm_source=oss&utm_medium=github&utm_campaign=react-component/select&utm_content=1148):

- Review comments: Directly reply to a review comment made by CodeRabbit. Example:
  - `I pushed a fix in commit <commit_id>, please review it.`
  - `Explain this complex logic.`
  - `Open a follow-up GitHub issue for this discussion.`
- Files and specific lines of code (under the "Files changed" tab): Tag `@coderabbitai` in a new review comment at the desired location with your query. Examples:
  - `@coderabbitai explain this code block.`
  -	`@coderabbitai modularize this function.`
- PR comments: Tag `@coderabbitai` in a new PR comment to ask questions about the PR branch. For the best results, please provide a very specific query, as very limited context is provided in this mode. Examples:
  - `@coderabbitai gather interesting stats about this repository and render them as a table. Additionally, render a pie chart showing the language distribution in the codebase.`
  - `@coderabbitai read src/utils.ts and explain its main purpose.`
  - `@coderabbitai read the files in the src/scheduler package and generate a class diagram using mermaid and a README in the markdown format.`
  - `@coderabbitai help me debug CodeRabbit configuration file.`

### Support

Need help? Create a ticket on our [support page](https://www.coderabbit.ai/contact-us/support) for assistance with any issues or questions.

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)

- `@coderabbitai pause` to pause the reviews on a PR.
- `@coderabbitai resume` to resume the paused reviews.
- `@coderabbitai review` to trigger an incremental review. This is useful when automatic reviews are disabled for the repository.
- `@coderabbitai full review` to do a full review from scratch and review all the files again.
- `@coderabbitai summary` to regenerate the summary of the PR.
- `@coderabbitai generate docstrings` to [generate docstrings](https://docs.coderabbit.ai/finishing-touches/docstrings) for this PR.
- `@coderabbitai generate sequence diagram` to generate a sequence diagram of the changes in this PR.
- `@coderabbitai resolve` resolve all the CodeRabbit review comments.
- `@coderabbitai configuration` to show the current CodeRabbit configuration for the repository.
- `@coderabbitai help` to get help.

### Other keywords and placeholders

- Add `@coderabbitai ignore` anywhere in the PR description to prevent this PR from being reviewed.
- Add `@coderabbitai summary` to generate the high-level summary at a specific location in the PR description.
- Add `@coderabbitai` anywhere in the PR title to generate the title automatically.

### CodeRabbit Configuration File (`.coderabbit.yaml`)

- You can programmatically configure CodeRabbit by adding a `.coderabbit.yaml` file to the root of your repository.
- Please see the [configuration documentation](https://docs.coderabbit.ai/guides/configure-coderabbit) for more information.
- If your editor has YAML language server enabled, you can add the path at the top of this file to enable auto-completion and validation: `# yaml-language-server: $schema=https://coderabbit.ai/integrations/schema.v2.json`

### Documentation and Community

- Visit our [Documentation](https://docs.coderabbit.ai) for detailed information on how to use CodeRabbit.
- Join our [Discord Community](http://discord.gg/coderabbit) to get help, request features, and share feedback.
- Follow us on [X/Twitter](https://twitter.com/coderabbitai) for updates and announcements.

</details>

<!-- tips_end -->

@vercel Vercel
Copy link

vercel bot commented May 8, 2025 •
edited
Loading

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
select ✅ Ready (Inspect) Visit Preview 💬 Add feedback May 14, 2025 11:14am

@765477020
Copy link
Author

@afc163 @zombieJ 有空瞅瞅

@afc163
Copy link
Member

afc163 commented May 14, 2025

需要补一个测试用例。

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.
2 participants
@765477020 @afc163