Improve Resource UX: params ordering, collapsible optionals, metadata defaults#721
Open
pannous wants to merge 3 commits intoMerit-Systems:mainfrom
Open
Improve Resource UX: params ordering, collapsible optionals, metadata defaults#721pannous wants to merge 3 commits intoMerit-Systems:mainfrom
pannous wants to merge 3 commits intoMerit-Systems:mainfrom
Conversation
Show required parameters at the top and collapse optional parameters by default, making it easier to see what's needed at a glance.
Contributor
|
@pannous is attempting to deploy a commit to the Merit Systems Team on Vercel. A member of the Team first needs to authorize it. |
There was a problem hiding this comment.
Pull request overview
This PR updates the resource executor form UI to improve parameter usability by separating required vs optional parameters and collapsing optional parameters by default.
Changes:
- Split header/query/body fields into required vs optional groups and render required fields first.
- Add a Radix
Collapsiblesection for optional parameters with an open/closed chevron indicator. - Conditionally render section titles to reduce visual noise (with some logic differences vs the PR description).
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
You can also share your feedback on Copilot code review. Take the survey.
Comment on lines
+243
to
+262
| <FieldSection | ||
| fields={headerFields} | ||
| fields={headerSplit.required} | ||
| values={headerValues} | ||
| onChange={handleHeaderChange} | ||
| prefix="header" | ||
| title="Header Parameters" | ||
| title={headerSplit.required.length > 0 && allRequired.length > 1 ? "Required Header Parameters" : undefined} | ||
| /> | ||
| <FieldSection | ||
| fields={queryFields} | ||
| fields={querySplit.required} | ||
| values={queryValues} | ||
| onChange={handleQueryChange} | ||
| prefix="query" | ||
| title={querySplit.required.length > 0 && allRequired.length > 1 ? "Required Query Parameters" : undefined} | ||
| /> | ||
| <FieldSection | ||
| fields={bodyFields} | ||
| fields={bodySplit.required} | ||
| values={bodyValues} | ||
| onChange={handleBodyChange} | ||
| prefix="body" | ||
| title="Body Parameters" | ||
| title={bodySplit.required.length > 0 && allRequired.length > 1 ? "Required Body Parameters" : undefined} |
Integrate ResourceRequestMetadata into the public resource display flow so that metadata defaults (headers, query params, body) pre-populate form fields and show as placeholder hints.
- Section title logic now uses requiredCategoryCount (how many categories have required fields) instead of total required field count, so titles only appear when required fields span multiple categories - Add useEffect hooks to sync form state when requestMetadata prop changes, fixing the React bug where useState initializers only run on mount
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.
Closes #107
Summary
Improves the resource parameter UX on x402scan.com with three changes:
Collapsiblecomponent (closed by default) showing a count badge, reducing visual noise for resources with many optional paramsResourceRequestMetadata(headers, query params, body defaults) is now included in the publiclistOriginsWithResourcesquery and flows throughOriginResources → ResourceExecutor → Form. Default values pre-populate form fields and appear as placeholder hints, making resources like the Echo x402 AI router more easily accessibleChanges
services/db/resources/origin.tsrequestMetadata: trueto Prisma includeorigin-resources.tsxrequestMetadatatoResourceExecutorexecutor/index.tsxrequestMetadatapropexecutor/form/index.tsxexecutor/form/field-section.tsxdefaultsprop, pass to field inputsexecutor/form/field-input.tsxplaceholderprop for metadata-sourced hintsTest plan
ResourceRequestMetadatahave pre-populated form defaults