FInal little tweaks

Matt Seccafien · Matt Seccafien · commit 8bd01afacff4 · 2022-05-21T23:01:21.000+02:00
diff --git a/examples/graphql-server/index.html b/examples/graphql-server/index.html
@@ -6,7 +6,6 @@
     <link rel="icon" type="image/svg+xml" href="/favicon.ico" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>Hydrogen App</title>
-    <link rel="stylesheet" href="/src/index.css" />
   </head>
   <body>
     <div id="root"></div>
diff --git a/examples/graphql-server/package.json b/examples/graphql-server/package.json
@@ -16,9 +16,9 @@
   },
   "dependencies": {
     "@shopify/hydrogen": "latest",
+    "cross-env": "^7.0.3",
     "graphql": "^14.6.0",
     "react": "0.0.0-experimental-2bf7c02f0-20220314",
-    "react-dom": "0.0.0-experimental-2bf7c02f0-20220314",
-    "urql": "^2.2.0"
+    "react-dom": "0.0.0-experimental-2bf7c02f0-20220314"
   }
 }
diff --git a/examples/graphql-server/src/components/Examples.client.jsx b/examples/graphql-server/src/components/Examples.client.jsx
diff --git a/examples/graphql-server/src/components/Greeting.client.jsx b/examples/graphql-server/src/components/Greeting.client.jsx
@@ -0,0 +1,12 @@
+import {fetchSync} from '@shopify/hydrogen/client';
+
+function Greeting() {
+  const {data} = fetchSync('http://localhost:3000/api/graphql', {
+    method: 'POST',
+    body: JSON.stringify({query: `{hello}`}),
+  }).json();
+
+  return <div>{data.hello}</div>;
+}
+
+export default Greeting;
diff --git a/examples/graphql-server/src/index.css b/examples/graphql-server/src/index.css
diff --git a/examples/graphql-server/src/routes/index.server.jsx b/examples/graphql-server/src/routes/index.server.jsx
@@ -1,24 +1,11 @@
-import {useQuery} from '@shopify/hydrogen';
-import Examplesclient from '../components/Examples.client';
+import {Suspense} from 'react';
 
-export default function Page() {
-  const {
-    data: {data},
-  } = useQuery(['home', 'hello-world'], async () => {
-    const response = await fetch('http://localhost:3000/api/graphql', {
-      method: 'POST',
-      body: JSON.stringify({query: `{hello}`}),
-    });
-
-    return await response.json();
-  });
-
-  console.log(data);
+import Greeting from '../components/Greeting.client';
 
+export default function Page() {
   return (
-    <p>
-      {data.hello}
-      <Examplesclient />
-    </p>
+    <Suspense fallback="loading...">
+      <Greeting />
+    </Suspense>
   );
 }

Original file line number	Diff line number	Diff line change
`@@ -16,9 +16,9 @@`
`16`	`16`	`},`
`17`	`17`	`"dependencies": {`
`18`	`18`	`"@shopify/hydrogen": "latest",`
	`19`	`+ "cross-env": "^7.0.3",`
`19`	`20`	`"graphql": "^14.6.0",`
`20`	`21`	`"react": "0.0.0-experimental-2bf7c02f0-20220314",`
`21`		`- "react-dom": "0.0.0-experimental-2bf7c02f0-20220314",`
`22`		`- "urql": "^2.2.0"`
	`22`	`+ "react-dom": "0.0.0-experimental-2bf7c02f0-20220314"`
`23`	`23`	`}`
`24`	`24`	`}`