Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat(CodeBlock): Pass variables into graphqlPlayground url #362

Merged
merged 5 commits into from
Dec 8, 2021

Conversation

tadhglewis
Copy link
Member

No description provided.

graphqlPlayground,
size,
}: Props) => {
const playgroundUrl = new URL(graphqlPlayground);
playgroundUrl.searchParams.set('query', children);
playgroundUrl.searchParams.set('query', query);
playgroundUrl.searchParams.set('variables', variables ?? '{}');
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Yeah it does

Output: https://manage.developer.seek.com/graphql-explorer?query=mutation+%28%24input%3A+PostPositionInput%21%29+%7B%0A++++++++++++postPosition%28input%3A+%24input%29+%7B%0A++++++++++++++...+on+PostPositionPayload_Success+%7B%0A++++++++++++++++positionOpening+%7B%0A++++++++++++++++++documentId+%7B%0A++++++++++++++++++++value%0A++++++++++++++++++%7D%0A++++++++++++++++%7D%0A++++++++++++++++positionProfile+%7B%0A++++++++++++++++++profileId+%7B%0A++++++++++++++++++++value%0A++++++++++++++++++%7D%0A++++++++++++++++%7D%0A++++++++++++++%7D%0A++++++++++++++...+on+PostPositionPayload_Conflict+%7B%0A++++++++++++++++conflictingPositionOpening+%7B%0A++++++++++++++++++documentId+%7B%0A++++++++++++++++++++value%0A++++++++++++++++++%7D%0A++++++++++++++++%7D%0A++++++++++++++++conflictingPositionProfile+%7B%0A++++++++++++++++++profileId+%7B%0A++++++++++++++++++++value%0A++++++++++++++++++%7D%0A++++++++++++++++%7D%0A++++++++++++++%7D%0A++++++++++++%7D%0A++++++++++%7D&variables=%7B%0A++++++++++++%22input%22%3A+%7B%0A++++++++++++++%2F%2F+Details+of+the+position+opening+to+create+along+with+the+job+ad%0A++++++++++++++%22positionOpening%22%3A+%7B%0A++++++++++++++++%22postingRequester%22%3A+%7B%0A++++++++++++++++++%22roleCode%22%3A+%22Company%22%2C%0A++++++++++%0A++++++++++++++++++%2F%2F+Hirer+that+will+own+the+position+opening%0A++++++++++++++++++%22id%22%3A+%22seekAnzPublicTest%3Aorganization%3Aseek%3A93WyyF1h%22%2C%0A++++++++++%0A++++++++++++++++++%2F%2F+Mary+Manager+is+hiring+this+role+as+a+hiring+manager%0A++++++++++++++++++%22personContacts%22%3A+%5B%0A++++++++++++++++++++%7B%0A++++++++++++++++++++++%22name%22%3A+%7B+%22formattedName%22%3A+%22Mary+Manager%22+%7D%2C%0A++++++++++++++++++++++%22roleCode%22%3A+%22HiringManager%22%2C%0A++++++++++++++++++++++%22communication%22%3A+%7B%0A++++++++++++++++++++++++%22email%22%3A+%5B%7B+%22address%22%3A+%22mary.manager%40example.com%22+%7D%5D%2C%0A++++++++++++++++++++++++%22phone%22%3A+%5B%7B+%22formattedNumber%22%3A+%2203+8517+4100%22+%7D%5D%0A++++++++++++++++++++++%7D%0A++++++++++++++++++++%7D%0A++++++++++++++++++%5D%0A++++++++++++++++%7D%0A++++++++++++++%7D%2C%0A++++++++++%0A++++++++++++++%2F%2F+Details+of+the+job+ad+itself%0A++++++++++++++%22positionProfile%22%3A+%7B%0A++++++++++++++++%22positionTitle%22%3A+%22Associate+Developer%22%2C%0A++++++++++%0A++++++++++++++++%2F%2F+Hirer+we%27re+posting+the+job+ad+on+behalf+of%0A++++++++++++++++%22positionOrganizations%22%3A+%22seekAnzPublicTest%3Aorganization%3Aseek%3A93WyyF1h%22%2C%0A++++++++++%0A++++++++++++++++%22positionFormattedDescriptions%22%3A+%5B%0A++++++++++++++++++%2F%2F+Short+description+to+be+shown+in+search+results%0A++++++++++++++++++%7B%0A++++++++++++++++++++%22descriptionId%22%3A+%22SearchSummary%22%2C%0A++++++++++++++++++++%22content%22%3A+%22Start+your+software+development+career+with+a+dynamic+%26+growing+team%22%0A++++++++++++++++++%7D%2C%0A++++++++++%0A++++++++++++++++++%2F%2F+Detailed+description+that+appears+on+the+job+ad%0A++++++++++++++++++%7B%0A++++++++++++++++++++%22descriptionId%22%3A+%22AdvertisementDetails%22%2C%0A++++++++++++++++++++%22content%22%3A+%22A+newly+created+role+for+an+ambitious+%3Cb%3Ejunior%3C%2Fb%3E+or+%3Cb%3Egraduate%3C%2Fb%3E+developer.+Be+part+of+a+great+team+in+the+Bendigo+area.%22%0A++++++++++++++++++%7D%0A++++++++++++++++%5D%2C%0A++++++++++%0A++++++++++++++++%2F%2F+%2470+-+%2485+Australian+dollars+per+hour%0A++++++++++++++++%22offeredRemunerationPackage%22%3A+%7B%0A++++++++++++++++++%22basisCode%22%3A+%22Hourly%22%2C%0A++++++++++++++++++%22ranges%22%3A+%7B%0A++++++++++++++++++++%22minimumAmount%22%3A+%7B%0A++++++++++++++++++++++%22value%22%3A+70%2C%0A++++++++++++++++++++++%22currency%22%3A+%22AUD%22%0A++++++++++++++++++++%7D%2C%0A++++++++++++++++++++%22maximumAmount%22%3A+%7B%0A++++++++++++++++++++++%22value%22%3A+85%2C%0A++++++++++++++++++++++%22currency%22%3A+%22AUD%22%0A++++++++++++++++++++%7D%2C%0A++++++++++++++++++++%22intervalCode%22%3A+%22Hour%22%0A++++++++++++++++++%7D%2C%0A++++++++++++++++++%2F%2F+No+remuneration+description+will+be+displayed+to+the+candidate%0A++++++++++++++++++%22descriptions%22%3A+%5B%5D%0A++++++++++++++++%7D%2C%0A++++++++++%0A++++++++++++++++%22seekAnzWorkTypeCode%22%3A+%22PartTime%22%2C%0A++++++++++%0A++++++++++++++++%2F%2F+Information+%26+Communication+Technology+%3E+Developers%2FProgrammers%0A++++++++++++++++%22jobCategories%22%3A+%22seekAnzPublicTest%3AjobCategory%3Aseek%3A2EFstqFvP%22%2C%0A++++++++++%0A++++++++++++++++%2F%2F+Australia+%3E+Victoria+%3E+Bendigo%2C+Goldfields+%26+Macedon+Ranges+%3E+Argyle%0A++++++++++++++++%22positionLocation%22%3A+%22seekAnzPublicTest%3Alocation%3Aseek%3AQVS62e6K%22%2C%0A++++++++++%0A++++++++++++++++%2F%2F+Classic+Ad+with+the+default+end+date+in+30+calendar+days%0A++++++++++++++++%22postingInstructions%22%3A+%7B%0A++++++++++++++++++%22seekAnzAdvertisementType%22%3A+%22Classic%22%2C%0A++++++++++%0A++++++++++++++++++%2F%2F+See+Idempotency+section+above%0A++++++++++++++++++%22idempotencyId%22%3A+%226eaeb58c-cc38-4b0e-8353-daa3011f1ece%22%0A++++++++++++++++%7D%0A++++++++++++++%7D%0A++++++++++++%7D%0A++++++++++%7D

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

It doesn't run though:

Variables are invalid JSON: JSON Parse error: Unrecognized token '/'.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, yeah. We probably want to strip out comments?

Doesn't look like GraphiQL supports it - graphql/graphiql#780

Copy link
Contributor

@etaoins etaoins Dec 7, 2021

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

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.

? children[1].code
: undefined;

const variables = JSON.stringify(parse(rawVariables ?? '{}'), null, 2);
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This prettifies the variables

@tadhglewis tadhglewis marked this pull request as ready for review December 7, 2021 23:40
@tadhglewis tadhglewis requested a review from a team as a code owner December 7, 2021 23:40
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);
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

What about this to avoid parsing/stringifying empty objects for other code block types:

Suggested change
const variables = JSON.stringify(parse(jsoncVariables ?? '{}'), null, 2);
const variables = jsoncVariables && JSON.stringify(parse(jsoncVariables), null, 2);

@tadhglewis tadhglewis merged commit 00ed511 into master Dec 8, 2021
@tadhglewis tadhglewis deleted the implement-second-child-variables branch December 8, 2021 00:02
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