Skip to content

feat(workflow): key/value editor for headers & query params#2611

Open
simlarsen wants to merge 1 commit into
feat/workflow-outlinefrom
feat/workflow-keyvalue-headers
Open

feat(workflow): key/value editor for headers & query params#2611
simlarsen wants to merge 1 commit into
feat/workflow-outlinefrom
feat/workflow-keyvalue-headers

Conversation

@simlarsen

Copy link
Copy Markdown
Contributor

Kills the biggest remaining raw-JSON footgun: HTTP headers / query params. Stacked on #2610.

What

StringDictionary arguments (headers and query params on the API & Webhook components) were hand-written JSON — a {"Authorization": "Bearer x"} blob that's easy to get wrong. They're now edited as key/value rows: add, remove, type a name and a value.

  • Pure KeyValueUtils (parseKeyValue / serializeKeyValue): the value stays a JSON string on disk, so the server parses it to the same object and execution is unchanged. Values keep any {{ tokens }} verbatim.
  • KeyValueInput renders the rows, with an "Edit as JSON" escape — and it starts in JSON mode automatically when the value is nested/invalid, so nothing strands the user.
  • ArgumentsForm routes StringDictionary to it (removed from the JSON-editor set) and suppresses the data-reference footer for it, since editing is inline.

Verification

  • KeyValueUtils.test.ts: flat object → rows; token-in-value preserved; scalar coercion; array / nested / invalid → null (→ JSON fallback); empty → []; serialize drops empty-key rows, empty → "", and round-trips to the same parsed object.
  • KeyValueInput.test.tsx (RTL): renders a row per pair, serializes edits back to a JSON object, add/remove rows, and starts in JSON mode for nested values.
  • 82 workflow tests pass; tsc ✓, eslint ✓.

🤖 Generated with Claude Code

…JSON

HTTP headers and query params (StringDictionary args on the API and Webhook
components) were hand-written JSON — a `{"Authorization": "Bearer x"}` blob
that's easy to get wrong. This edits them as simple key/value rows: add,
remove, type a name and a value.

- Pure KeyValueUtils (parseKeyValue / serializeKeyValue): the value stays a
  JSON string on disk, so the server parses it to the same object and nothing
  about execution changes. Values keep any {{ tokens }} verbatim.
- KeyValueInput renders the rows, with an "Edit as JSON" escape (and it starts
  in JSON mode automatically when the value is nested/invalid, so no data
  strands the user).
- ArgumentsForm routes StringDictionary to it (removed from the JSON-editor
  set) and suppresses the data-reference footer for it, since editing is
  inline.

Tests: KeyValueUtils (flat object, token-in-value, scalar coercion, array/
nested/invalid → null, empty; serialize drops empty keys, empty → "",
round-trip) + KeyValueInput RTL (renders rows, serializes edits, add/remove,
JSON-mode fallback). 82 workflow tests pass; tsc + eslint clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@simlarsen

Copy link
Copy Markdown
Contributor Author

Snyk checks have passed. No issues have been found so far.

Status Scan Engine Critical High Medium Low Total (0)
Open Source Security 0 0 0 0 0 issues

💻 Catch issues earlier using the plugins for VS Code, JetBrains IDEs, Visual Studio, and Eclipse.

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.

2 participants