Skip to content

feat(oc-docs): resolve variables in playground example and request URLs - #145

Closed
sundram-bruno wants to merge 3 commits into
opencollection-dev:mainfrom
sundram-bruno:feat/oc-docs-playground-variable-resolution
Closed

feat(oc-docs): resolve variables in playground example and request URLs#145
sundram-bruno wants to merge 3 commits into
opencollection-dev:mainfrom
sundram-bruno:feat/oc-docs-playground-variable-resolution

Conversation

@sundram-bruno

@sundram-bruno sundram-bruno commented Jul 22, 2026

Copy link
Copy Markdown
Contributor

Issue : Previously the example and playground request URLs rendered {{baseUrl}} etc. as plain, uncoloured text with no way to see the resolved value, while the docs request URL bar already resolved and tooltipped them. This brings both surfaces to parity.

JIRA : BRU-3753

Resolve {{variables}} in the playground's example view URL and request (QueryBar) URL, matching the docs behaviour.

  • Example view URL: rendered through VariableText, so {{var}} tokens show the docs-style highlighted pill and a hover tooltip (variable name, scope badge, resolved value, copy).
  • Playground request URL: the plain editable <input> is replaced with HighlightedInput, wired to useResolvedVariables(). The editable URL now paints {{var}} tokens in the same colour scheme, shows the variable info card on hover, and offers {{variable}} autocomplete.

Render the example view URL through VariableText so {{variables}} show
the docs-style highlighted pill and hover tooltip (name, scope, resolved
value). Replace the playground request URL <input> with HighlightedInput
wired to the variable resolver, so the editable URL paints variable
tokens in the same colour scheme, shows the variable info card on hover,
and offers {{variable}} autocomplete. Add an optional onEnter prop to
HighlightedInput to preserve Enter-to-send, guarded against IME
composition.
Cover the example view URL variable hover card (name, scope, resolved
value) and the request URL bar's variable rendering plus {{variable}}
autocomplete. Adds a QueryBar component object and wires the variable
card and playground environment switcher onto PlaygroundComponent.
@sundram-bruno
sundram-bruno marked this pull request as draft July 23, 2026 06:47
…d vars

Drop the brand-tinted pill override on the playground request URL bar so
its {{variable}} tokens use the same valid (green) / invalid (red)
colours as the params and headers cells, instead of a flat brand colour
that hid whether a variable resolves.

Add e2e covering that request-scoped and folder-scoped variables
referenced in the playground resolve as valid (not painted red as
undefined), guarding the scope the ItemVariableResolverProvider must
include.
@sundram-bruno

Copy link
Copy Markdown
Contributor Author

to be taken as a separate task with a larger scope.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant