Skip to content

Commit 8facf18

Browse files
dadishdadish
committed
Remove the old hack with the GraphiQL. Load assets like in traditional Process module.
1 parent b40b6d0 commit 8facf18

File tree

9 files changed

+48
-73
lines changed

9 files changed

+48
-73
lines changed

‎GraphiQL/build/asset-manifest.json‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"main.css": "static/css/main.a7124171.css",
33
"main.css.map": "static/css/main.a7124171.css.map",
4-
"main.js": "static/js/main.059c7daf.js",
5-
"main.js.map": "static/js/main.059c7daf.js.map"
4+
"main.js": "static/js/main.a8a92523.js",
5+
"main.js.map": "static/js/main.a8a92523.js.map"
66
}

‎GraphiQL/build/index.html‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1 +1 @@
1-
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="shortcut icon" href="/favicon.ico"><title>React App</title><link href="/static/css/main.a7124171.css" rel="stylesheet"></head><style>body{height:100%;margin:0;width:100%;overflow:hidden}#graphiql{height:100vh}</style><body><script>var GraphQLServerUrl="http://www.skyscrapers.dev/graphql/"</script><div id="graphiql"></div><script type="text/javascript" src="/static/js/main.059c7daf.js"></script></body></html>
1+
<!DOCTYPE html><html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><link rel="shortcut icon" href="/favicon.ico"><title>React App</title><link href="/static/css/main.a7124171.css" rel="stylesheet"></head><style>body{height:100%;margin:0;width:100%;overflow:hidden}#graphiql{height:100vh}</style><body><script>var GraphQLServerUrl="http://www.skyscrapers.dev/graphql/"</script><div id="graphiql"></div><script type="text/javascript" src="/static/js/main.a8a92523.js"></script></body></html>

‎GraphiQL/build/static/js/main.059c7daf.js.map‎

Lines changed: 0 additions & 1 deletion
This file was deleted.

GraphiQL/build/static/js/main.059c7daf.js renamed to GraphiQL/build/static/js/main.a8a92523.js

Lines changed: 10 additions & 10 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎GraphiQL/build/static/js/main.a8a92523.js.map‎

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎GraphiQL/full.php‎

Lines changed: 6 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -4,14 +4,9 @@
44
<meta charset="utf-8">
55
<meta name="viewport" content="width=device-width, initial-scale=1">
66
<link rel="shortcut icon" href="/favicon.ico">
7-
<!--
8-
Notice the use of %PUBLIC_URL% in the tag above.
9-
It will be replaced with the URL of the `public` folder during the build.
10-
Only files inside the `public` folder can be referenced from the HTML.
11-
Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
12-
work correctly both with client-side routing and a non-root public URL.
13-
Learn how to configure a non-root public URL by running `npm run build`.
14-
-->
7+
8+
<?php foreach($config->styles as $file) echo "\n\t<link type='text/css' href='$file' rel='stylesheet' />"; ?>
9+
<?php foreach($config->scripts as $file) echo "\n\t<script type='text/javascript' src='$file'></script>"; ?>
1510
<title>GraphiQL</title>
1611
<style>
1712
body {
@@ -21,26 +16,16 @@
2116
overflow: hidden;
2217
}
2318
</style>
19+
<script>
20+
var config = <?= json_encode($config->js()) ?>;
21+
</script>
2422
</head>
2523
<body>
2624
<style>
2725
#graphiql {
2826
height: 100vh;
2927
}
30-
<?= $CSS ?>
3128
</style>
3229
<div id="graphiql">Loading...</div>
33-
<script>
34-
var GraphQLServerUrl = "<?= $GraphQLServerUrl ?>";
35-
<?= $JavaScript ?>
36-
</script>
37-
<!--
38-
This HTML file is a template.
39-
If you open it directly in the browser, you will see an empty page.
40-
You can add webfonts, meta tags, or analytics to this file.
41-
The build step will place the bundled scripts into the <body> tag.
42-
To begin the development, run `npm start`.
43-
To create a production bundle, use `npm run build`.
44-
-->
4530
</body>
4631
</html>

‎GraphiQL/partial.php‎

Lines changed: 1 addition & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -41,10 +41,5 @@
4141
width: 94%;
4242
background: none;
4343
}
44-
<?= $CSS ?>
4544
</style>
46-
<div id="graphiql">Loading...</div>
47-
<script>
48-
var GraphQLServerUrl = "<?= $GraphQLServerUrl ?>";
49-
<?= $JavaScript ?>
50-
</script>
45+
<div id="graphiql">Loading...</div>

‎GraphiQL/src/index.js‎

Lines changed: 15 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,7 @@ function updateURL() {
6363
function graphQLFetcher(graphQLParams) {
6464
// This example expects a GraphQL server at the path /graphql.
6565
// Change this to point wherever you host your GraphQL server.
66-
return request.post(GraphQLServerUrl) // eslint-disable-line no-undef
66+
return request.post(config.ProcessGraphQL.GraphQLServerUrl) // eslint-disable-line no-undef
6767
.send(JSON.stringify(graphQLParams))
6868
.set('Accept', 'application/json')
6969
.set('Content-Type', 'application/json')
@@ -75,15 +75,17 @@ function graphQLFetcher(graphQLParams) {
7575
// See the README in the top level of this module to learn more about
7676
// how you can customize GraphiQL by providing different values or
7777
// additional child elements.
78-
ReactDOM.render(
79-
<GraphiQL
80-
fetcher={graphQLFetcher}
81-
query={parameters.query}
82-
variables={parameters.variables}
83-
operationName={parameters.operationName}
84-
onEditQuery={onEditQuery}
85-
onEditVariables={onEditVariables}
86-
onEditOperationName={onEditOperationName}
87-
/>,
88-
document.getElementById('graphiql')
89-
);
78+
window.onload = () => {
79+
ReactDOM.render(
80+
<GraphiQL
81+
fetcher={graphQLFetcher}
82+
query={parameters.query}
83+
variables={parameters.variables}
84+
operationName={parameters.operationName}
85+
onEditQuery={onEditQuery}
86+
onEditVariables={onEditVariables}
87+
onEditOperationName={onEditOperationName}
88+
/>,
89+
document.getElementById('graphiql')
90+
);
91+
};

‎ProcessGraphQL.module‎

Lines changed: 12 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -27,13 +27,17 @@ class ProcessGraphQL extends Process implements Module {
2727
*/
2828
public function init()
2929
{
30-
$this->addHookAfter('Template::changed', $this, 'hookTemplateNameChange');
3130
require_once $this->config->paths->site . 'modules/ProcessGraphQL/vendor/autoload.php';
31+
$this->addHookAfter('Template::changed', $this, 'hookTemplateNameChange');
32+
$this->config->scripts->add($this->config->urls->ProcessGraphQL . 'GraphiQL/build/static/js/main.a8a92523.js');
33+
$this->config->styles->add($this->config->urls->ProcessGraphQL . 'GraphiQL/build/static/css/main.a7124171.css');
34+
$this->config->js($this->className, [
35+
'GraphQLServerUrl' => $this->getGraphQLServerUrl(),
36+
]);
3237
}
3338

3439
public function hookTemplateNameChange(HookEvent $event)
3540
{
36-
// require_once $this->config->paths->site . 'modules/ProcessGraphQL/ProcessGraphQLConfig.php';
3741
$whatChanged = $event->arguments[0];
3842
$oldName = $event->arguments[1];
3943
$newName = $event->arguments[2];
@@ -69,33 +73,22 @@ class ProcessGraphQL extends Process implements Module {
6973
public function executeGraphiQL()
7074
{
7175
$fullFilename = $this->config->paths->site . 'modules/ProcessGraphQL/GraphiQL/full.php';
72-
return wireRenderFile($fullFilename, $this->getGraphiQLVariables());
76+
return wireRenderFile($fullFilename);
7377
}
7478

7579
public function executeGraphiQLPartial()
7680
{
7781
$partialFilename = $this->config->paths->site . 'modules/ProcessGraphQL/GraphiQL/partial.php';
78-
return wireRenderFile($partialFilename, $this->getGraphiQLVariables());
82+
return wireRenderFile($partialFilename, [
83+
'fullWidth' => $this->fullWidthGraphiQL,
84+
]);
7985
}
8086

81-
public function getGraphiQLVariables()
87+
public function getGraphQLServerUrl()
8288
{
83-
$js = $this->getGraphiQLAsset('js/main.059c7daf.js');
84-
$css = $this->getGraphiQLAsset('css/main.a7124171.css');
8589
$url = $this->GraphQLServerUrl;
8690
if (!$url) $url = $this->pages->get('template=admin, name=' . self::pageName)->url;
87-
return [
88-
'JavaScript' => $js,
89-
'CSS' => $css,
90-
'GraphQLServerUrl' => $url,
91-
'fullWidth' => $this->fullWidthGraphiQL,
92-
];
93-
}
94-
95-
public function getGraphiQLAsset($path)
96-
{
97-
$assetFilename = $this->config->paths->site . 'modules/ProcessGraphQL/GraphiQL/build/static/' . $path;
98-
return wireRenderFile($assetFilename);
91+
return $url;
9992
}
10093

10194
public function executeGraphQL()

0 commit comments

Comments
 (0)