ROX-33497: Fix checkbox select dropdowns in reporting UI#19324
ROX-33497: Fix checkbox select dropdowns in reporting UI#19324dvail wants to merge 1 commit intodv/ROX-28622-pf-6from
Conversation
|
This change is part of the following stack: Change managed by git-spice. |
|
Skipping CI for Draft Pull Request. |
|
Images are ready for the commit at 3c0e60d. To use with deploy scripts, first |
427a12f to
a04b174
Compare
|
|
||
| type CheckboxSelectWithArrayCallback = CheckboxSelectBaseProps & { | ||
| onChange: (selections: string[]) => void; | ||
| onItemSelect?: never; |
There was a problem hiding this comment.
onItemSelect is not used by any instance of this component, so we can simplify this aspect as well.
a04b174 to
3c0e60d
Compare
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## dv/ROX-28622-pf-6 #19324 +/- ##
====================================================
Coverage ? 49.56%
====================================================
Files ? 2675
Lines ? 201838
Branches ? 0
====================================================
Hits ? 100034
Misses ? 94347
Partials ? 7457
Flags with carried forward coverage won't be shown. Click here to find out more. ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
| ReactNode, | ||
| Ref, | ||
| } from 'react'; | ||
| import { Children, cloneElement, isValidElement, useMemo, useState } from 'react'; |
There was a problem hiding this comment.
Off the subject of this change:
- This is the only PatternFly component that calls
cloneElementfunction. - Classic
Widgetis the only other in the application.
| shouldFocusToggleOnSelect | ||
| popperProps={popperProps} | ||
| > | ||
| <SelectList>{enhancedChildren}</SelectList> |
There was a problem hiding this comment.
Another observation off the subject: although I suspect I have done it myself, providing SelectList element within component prevents caller to provide multiple of them if needed.
Description
The
onBluroverride added to this custom component was breaking the default functionality, so it was removed. PatternFly natively handles closing the<Select>menu when focus is removed from the element.Instead of tapping into
formik.onBlurto handle validation for the CheckboxSelect components, we use the thirdshouldValidate = trueparameter of the async field change function.User-facing documentation
Testing and quality
Automated testing
How I validated my change
Test checkbox selects and verify that the values are
applied immediately, and that formik validation occurs correctly on the components that previously used
onBlur.Screen.Recording.2026-03-06.at.11.57.17.AM.mov
Verify that day selection dropdowns are now working as expected:
