feat(ui): add SelectField renderer to InspectorPane for enum-constrained strings#375
Merged
streamer45 merged 5 commits intomainfrom Apr 25, 2026
Merged
Conversation
…ned strings Detect when a tunable string property has an enum constraint in its JSON Schema and render a <select> dropdown instead of a free-text <input> in the Inspector/Monitor View. - Add FormSelect styled component matching existing FormInput pattern - Add SelectField renderer following existing StringField/NumberField/BooleanField pattern - Route enum-constrained strings to SelectField in renderField switch - Send UpdateParams on selection change via existing handleInputChange Closes #328 Signed-off-by: StreamKit Devin <devin@streamkit.dev> Co-Authored-By: Claudio Costa <cstcld91@gmail.com>
Contributor
Author
|
✅ Reviewed on |
Contributor
Author
🤖 Devin AI EngineerI'll be helping with this pull request! Here's what you should know: ✅ I will automatically:
Note: I can only respond to comments from users who have write access to this repository. ⚙️ Control Options:
|
Move enum-value resolution into SelectField so the dropdown always shows a valid option. When the resolved param value does not match any enum entry (e.g. empty string fallback), falls back to schema.default or the first enum value. Add InspectorPane unit tests covering: - select dropdown rendering for enum-constrained strings - fallback to first enum value on unmatched currentValue - UpdateParams dispatch on selection change - text input rendering for non-enum strings - disabled state for non-tunable params in monitor view Signed-off-by: StreamKit Devin <devin@streamkit.dev> Co-Authored-By: Claudio Costa <cstcld91@gmail.com>
Signed-off-by: StreamKit Devin <devin@streamkit.dev> Co-Authored-By: Claudio Costa <cstcld91@gmail.com>
…e tests Signed-off-by: StreamKit Devin <devin@streamkit.dev> Co-Authored-By: Claudio Costa <cstcld91@gmail.com>
Ensure the fallback value is always a valid enum member. If schema.default is not in the enum array, fall back to the first option instead of using the invalid default. Add test for schema.default not in enum edge case. Signed-off-by: StreamKit Devin <devin@streamkit.dev> Co-Authored-By: Claudio Costa <cstcld91@gmail.com>
Contributor
Author
ReviewOverall: Good implementation. Matches existing field renderer patterns, proper fallback chain, and addressed Devin Review findings iteratively. Must fix before merge
Looks good
Nits (non-blocking)
|
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
The Stream View (overlay controls) renders enum-constrained string properties as
<select>dropdowns (added in PR #327), but the Inspector/Monitor View renders the same properties as free-text<input>fields. This PR fixes the inconsistency.Changes in
ui/src/panes/InspectorPane.tsx:FormSelectstyled component — matches the existingFormInputpattern (same padding, border, color tokens, focus ring) withcursor: pointerand a disabled state.SelectFieldrenderer — follows theStringField/NumberField/BooleanFieldpattern. Renders a<select>populated fromschema.enumvalues and firesonChangewith the selected string value. Resolves the initial value to a valid enum option (falls back toschema.defaultthen first enum entry) to prevent UI/state desync whencurrentValuedoesn't match any option.renderFieldrouting — in thecase 'string':branch, checksschema.enumlength before falling through toStringField. This mirrors the logic inschemaToControlConfigs(ui/src/utils/jsonSchema.ts).The field uses WebSocket-driven state (Jotai
nodeParamsAtom) as the source of truth and sendsUpdateParamsthrough the existinghandleInputChangepath, respectingschema.pathoverrides and theisMonitorViewdisabled logic for non-tunable params.New test file
ui/src/panes/InspectorPane.test.tsx(5 tests):currentValuedoesn't matchUpdateParamsdispatch on selection changeReview & Testing Checklist for Human
servoplugin'sviewport_resolution) and verify the Inspector pane renders a dropdown, not a text inputUpdateParamsmessage is sent (check WS traffic or observe the node reacting)Notes
extractTextConfigsinjsonSchema.tsalready excludes enum strings (line 324), so no changes needed there.max-lineslint warning onInspectorPane.tsxwas already present before this PR (file was 528 lines, limit is 500).Closes #328
Link to Devin session: https://staging.itsdev.in/sessions/8c7942c445034b79b686fdb141e923e4
Requested by: @streamer45