Skip to content

Commit 35f3b17

Browse files
committed
Fix integration
1 parent be9f8e5 commit 35f3b17

File tree

3 files changed

+28
-14
lines changed

3 files changed

+28
-14
lines changed

juniper/Makefile

Lines changed: 17 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -35,17 +35,29 @@ GRAPHQL_PLAYGROUND_VER ?= $(strip \
3535
# make graphiql
3636

3737
graphiql:
38+
$(eval graphiql-react-ver := $(strip \
39+
$(shell curl -fL https://raw.githubusercontent.com/graphql/graphiql/refs/tags/graphiql%40$(GRAPHIQL_VER)/packages/graphiql/package.json \
40+
| grep -m1 '"@graphiql/react": "' | cut -d '"' -f4 | cut -d '^' -f2)))
41+
$(eval graphiql-toolkit-ver := $(strip \
42+
$(shell curl -fL https://raw.githubusercontent.com/graphql/graphiql/refs/tags/graphiql%40$(GRAPHIQL_VER)/packages/graphiql/package.json \
43+
| grep -m1 '"@graphiql/toolkit": "' | cut -d '"' -f4 | cut -d '^' -f2)))
3844
curl -fL -o src/http/graphiql.html \
3945
https://raw.githubusercontent.com/graphql/graphiql/graphiql%40$(GRAPHIQL_VER)/examples/graphiql-cdn/index.html
40-
$(sed-i) 's|unpkg.com/graphiql/|unpkg.com/graphiql@$(GRAPHIQL_VER)/|g' \
46+
$(sed-i) 's|esm.sh/graphiql@4.0.0|esm.sh/graphiql@$(GRAPHIQL_VER)|g' \
4147
src/http/graphiql.html
42-
$(sed-i) "s|'https://swapi-graphql.netlify.app/.netlify/functions/index'|JUNIPER_URL|g" \
48+
$(sed-i) 's|esm.sh/@graphiql/[email protected]|esm.sh/@graphiql/plugin-explorer@$(GRAPHIQL_VER)|g' \
4349
src/http/graphiql.html
44-
$(sed-i) "s|url: JUNIPER_URL,|url: JUNIPER_URL,\n subscriptionUrl: normalizeSubscriptionEndpoint(JUNIPER_URL, JUNIPER_SUBSCRIPTIONS_URL)|" \
50+
$(sed-i) 's|esm.sh/@graphiql/[email protected]|esm.sh/@graphiql/react@$(graphiql-react-ver)|g' \
4551
src/http/graphiql.html
46-
$(sed-i) 's|<script>|<script>\n<!-- inject -->|' \
52+
$(sed-i) 's|esm.sh/@graphiql/[email protected]|esm.sh/@graphiql/toolkit@$(graphiql-toolkit-ver)|g' \
4753
src/http/graphiql.html
48-
$(sed-i) '/X-Example-Header/d' \
54+
$(sed-i) "s|'https://countries.trevorblades.com'|JUNIPER_URL|g" \
55+
src/http/graphiql.html
56+
$(sed-i) 's|url: JUNIPER_URL,|url: JUNIPER_URL,\n subscriptionUrl: normalizeSubscriptionEndpoint(JUNIPER_URL, JUNIPER_SUBSCRIPTIONS_URL)|' \
57+
src/http/graphiql.html
58+
$(sed-i) 's|<script type="module">|<script type="module">\n<!-- inject -->|' \
59+
src/http/graphiql.html
60+
$(sed-i) 's|GraphiQL 4 with React 19 and GraphiQL Explorer|GraphiQL|' \
4961
src/http/graphiql.html
5062

5163

juniper/src/http/graphiql.html

Lines changed: 9 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@
1010
<head>
1111
<meta charset="UTF-8" />
1212
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
13-
<title>GraphiQL 4 with React 19 and GraphiQL Explorer</title>
13+
<title>GraphiQL</title>
1414
<style>
1515
body {
1616
margin: 0;
@@ -31,11 +31,11 @@
3131
</style>
3232
<link
3333
rel="stylesheet"
34-
href="https://esm.sh/[email protected].0/dist/style.css"
34+
href="https://esm.sh/[email protected].2/dist/style.css"
3535
/>
3636
<link
3737
rel="stylesheet"
38-
href="https://esm.sh/@graphiql/[email protected].0/dist/style.css"
38+
href="https://esm.sh/@graphiql/[email protected].2/dist/style.css"
3939
/>
4040
<!-- Note: the ?standalone flag bundles the module along with all of its `dependencies`, excluding `peerDependencies`, into a single JavaScript file. -->
4141
<script type="importmap">
@@ -47,16 +47,17 @@
4747
"react-dom": "https://esm.sh/[email protected]",
4848
"react-dom/client": "https://esm.sh/[email protected]/client",
4949

50-
"graphiql": "https://esm.sh/[email protected].0?standalone&external=react,react/jsx-runtime,react-dom,@graphiql/react",
51-
"@graphiql/plugin-explorer": "https://esm.sh/@graphiql/[email protected].0?standalone&external=react,react/jsx-runtime,react-dom,@graphiql/react,graphql",
52-
"@graphiql/react": "https://esm.sh/@graphiql/react@0.30.0?standalone&external=react,react/jsx-runtime,react-dom,graphql,@graphiql/toolkit",
50+
"graphiql": "https://esm.sh/[email protected].2?standalone&external=react,react/jsx-runtime,react-dom,@graphiql/react",
51+
"@graphiql/plugin-explorer": "https://esm.sh/@graphiql/[email protected].2?standalone&external=react,react/jsx-runtime,react-dom,@graphiql/react,graphql",
52+
"@graphiql/react": "https://esm.sh/@graphiql/react@0.32.0?standalone&external=react,react/jsx-runtime,react-dom,graphql,@graphiql/toolkit",
5353

5454
"@graphiql/toolkit": "https://esm.sh/@graphiql/[email protected]?standalone&external=graphql",
5555
"graphql": "https://esm.sh/[email protected]"
5656
}
5757
}
5858
</script>
5959
<script type="module">
60+
<!-- inject -->
6061
// Import React and ReactDOM
6162
import React from 'react';
6263
import ReactDOM from 'react-dom/client';
@@ -66,7 +67,8 @@
6667
import { explorerPlugin } from '@graphiql/plugin-explorer';
6768

6869
const fetcher = createGraphiQLFetcher({
69-
url: 'https://countries.trevorblades.com',
70+
url: JUNIPER_URL,
71+
subscriptionUrl: normalizeSubscriptionEndpoint(JUNIPER_URL, JUNIPER_SUBSCRIPTIONS_URL)
7072
});
7173
const explorer = explorerPlugin();
7274

juniper/src/http/graphiql.rs

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -17,8 +17,8 @@ pub fn graphiql_source(
1717
&format!(
1818
// language=JavaScript
1919
"
20-
var JUNIPER_URL = '{juniper_url}';
21-
var JUNIPER_SUBSCRIPTIONS_URL = '{juniper_subscriptions_url}';
20+
const JUNIPER_URL = '{juniper_url}';
21+
const JUNIPER_SUBSCRIPTIONS_URL = '{juniper_subscriptions_url}';
2222
2323
{grahiql_js}
2424

0 commit comments

Comments
 (0)