feat(CodeBlock): Pass variables into graphqlPlayground url #362
Conversation
| graphqlPlayground, | ||
| size, | ||
| }: Props) => { | ||
| const playgroundUrl = new URL(graphqlPlayground); | ||
| playgroundUrl.searchParams.set('query', children); | ||
| playgroundUrl.searchParams.set('query', query); | ||
| playgroundUrl.searchParams.set('variables', variables ?? '{}'); |
There was a problem hiding this comment.
Will this work for JSONC variables? They're used in e.g. position posting:
https://developer.seek.com/use-cases/job-posting/managing-job-ads/posting-a-job-ad#postposition
There was a problem hiding this comment.
It doesn't run though:
Variables are invalid JSON: JSON Parse error: Unrecognized token '/'.
There was a problem hiding this comment.
Ah, yeah. We probably want to strip out comments?
Doesn't look like GraphiQL supports it - graphql/graphiql#780
There was a problem hiding this comment.
Yeah, we should be able to use jsonc-parser to parse as a JavaScript object and then re-encode with JSON.stringify. We could do that either in Scoobie or ADELE, but doing it in Scoobie would make the encoded URLs less hefty.
src/components/CodeBlock.tsx
Outdated
| ? children[1].code | ||
| : undefined; | ||
|
|
||
| const variables = JSON.stringify(parse(rawVariables ?? '{}'), null, 2); |
There was a problem hiding this comment.
This prettifies the variables
src/components/CodeBlock.tsx
Outdated
| children[0].language === 'graphql' && children[1]?.label === 'Variables' | ||
| ? children[1].code | ||
| : undefined; | ||
|
|
||
| const variables = JSON.stringify(parse(rawVariables ?? '{}'), null, 2); | ||
| const variables = JSON.stringify(parse(jsoncVariables ?? '{}'), null, 2); |
There was a problem hiding this comment.
What about this to avoid parsing/stringifying empty objects for other code block types:
| const variables = JSON.stringify(parse(jsoncVariables ?? '{}'), null, 2); | |
| const variables = jsoncVariables && JSON.stringify(parse(jsoncVariables), null, 2); |
No description provided.