Conversation
Opt-in prop. When set, every tick, untick and select all calls onChange straight away, the dropdown stays open and the Apply button is not rendered. Off by default, so existing fields keep the Apply step.
With more options than fit in the dropdown, the list, the search field and the Apply button all shrank, and the button ended at about 18px with its label clipped. Only the list shrinks and scrolls now.
|
No actionable comments were generated in the recent review. 🎉 ℹ️ Recent review info⚙️ Run configurationConfiguration used: Organization UI Review profile: CHILL Plan: Advanced Run ID: 📒 Files selected for processing (7)
Included review availability: Your plan provides up to 1 included review per hour; 0 remain after this review. Walkthrough
ChangesMultiSelectField interaction and layout updates
Priority: ⬇️ Low Estimated code review effort: 3 (Moderate) | ~20 minutes Change: Feature Sequence Diagram(s)sequenceDiagram
participant User
participant MultiSelectField
participant onChangeConsumer
User->>MultiSelectField: Select or clear an option
MultiSelectField->>onChangeConsumer: Call onChange with updated values
MultiSelectField-->>User: Keep dropdown open without Apply button
Suggested reviewers: Merge Risk: ⚪ Minimal · up to The opt-in behavior commits selections immediately while preserving existing Apply behavior by default, and the dropdown layout supports scrolling options without blocking controls. The change is ready to merge. 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
Full details: Docstring CoverageExplanation Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 3 files. (4 skipped: 4 unsupported.)
✨ Finishing Touches🧪 Generate unit tests (beta)
Comment |
Why is this pull-request needed?
We (Bambuser) replaced a dropdown that filtered on every click with
MultiSelectField. Users read the pending-then-Apply flow as "the filter does not work", and it came up in review. We also hit a layout bug: with more options than fit in the dropdown, the Apply button shrinks to about 18px and its label is clipped.Main changes
MultiSelectFieldgets an opt-inapplyOnChangeprop. When set, every tick, untick and select all callsonChangestraight away, the dropdown stays open, and the Apply button is not rendered. Default behaviour is unchanged..submitButtonand.searchFieldno longer shrink, and the option list getsmin-height: 0, so only the list shrinks and scrolls when options overflow the dropdown.Test evidence
Before, 30 options, Apply squashed:
After:
applyOnChange: Red and Blue ticked, applied at once, no Apply button:onChangeper tick, no Apply button, select all applies at once, dropdown stays open, default behaviour untouched.ApplyOnChangeandManyOptions.npm run types:check,prettier:check,testgreen.eslint:checkreports three pre-existing warnings in unrelated files.