Add create new option, add query for missing elements in combobobx#6278
Add create new option, add query for missing elements in combobobx#6278witoszekdev merged 10 commits intomainfrom
Conversation
🦋 Changeset detectedLatest commit: 6ed2736 The changes in this PR will be included in the next version bump. Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
Codecov Report❌ Patch coverage is
Additional details and impacted files@@ Coverage Diff @@
## main #6278 +/- ##
==========================================
+ Coverage 42.54% 42.63% +0.08%
==========================================
Files 2486 2488 +2
Lines 42944 43005 +61
Branches 9685 9696 +11
==========================================
+ Hits 18271 18334 +63
+ Misses 24638 24635 -3
- Partials 35 36 +1 ☔ View full report in Codecov by Sentry. 🚀 New features to boost your workflow:
|
There was a problem hiding this comment.
Pull request overview
Adds “create new value” behavior and improved querying to attribute comboboxes, and updates how dropdown attribute values are serialized in the attributes input payload.
Changes:
- Introduces a new
DropdownRowcomponent for dropdown attributes with custom “Add new value” option and debounced querying. - Updates
SwatchRowto use shared combobox handlers and to support query-on-input plus fetch-more. - Changes dropdown attribute input serialization to use a
dropdown: { value } | nullshape and updates tests accordingly.
Reviewed changes
Copilot reviewed 6 out of 6 changed files in this pull request and generated 7 comments.
Show a summary per file
| File | Description |
|---|---|
| src/components/Attributes/useAttributeDropdown.ts | New hook to handle dropdown combobox fetching + custom option label/option creation. |
| src/components/Attributes/SwatchRow.tsx | Adds debounced querying, standardized focus/scroll handlers, and loading indicator wiring. |
| src/components/Attributes/DropdownRow.tsx | New dropdown attribute row component with “Add new value” option handling. |
| src/components/Attributes/AttributeRow.tsx | Refactors DROPDOWN rendering to use DropdownRow. |
| src/attributes/utils/handlers.ts | Serializes DROPDOWN attributes using dropdown field instead of values. |
| src/attributes/utils/handlers.test.ts | Updates expectations for the new dropdown input shape and changed-attribute behavior. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| const [selectedValue, setSelectedValue] = useState<Option | null>( | ||
| attribute.value[0] | ||
| ? { | ||
| value: attribute.value[0], | ||
| label: getSingleDisplayValue(attribute, attributeValues), | ||
| } | ||
| : null, | ||
| ); |
There was a problem hiding this comment.
selectedValue is initialized from attribute.value/attributeValues once, but it won’t update if the parent changes attribute.value (e.g. form reset, external update, attributeValues fetched later). This can leave the combobox showing a stale selection. Prefer deriving value directly from props each render, or add an effect to sync selectedValue when attribute.value[0] / attributeValues change.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 8 out of 8 changed files in this pull request and generated 4 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 8 out of 8 changed files in this pull request and generated 1 comment.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
There was a problem hiding this comment.
Pull request overview
Copilot reviewed 9 out of 9 changed files in this pull request and generated 2 comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
2 participants
This PR adds "Add new value: " to combobox in Attribute selection. New attributes (like previous component) are created once page is saved.
New values are fetched when user enters new text into the combobox, since we only fetch 20 items on first focus (also in previous component).