feat: expose Query

Author: gregberge

examples/wordpress/docker-compose.yml

@@ -22,7 +22,7 @@ services:
     ports:
       - '8000:80'
     environment:
-      WP_HOME: http://localhost:3001
+      WP_HOME: http://localhost:3000
       WP_DEFAULT_THEME: smooth-js
       WORDPRESS_DB_HOST: mysql:3306
       WORDPRESS_DB_USER: wordpress

examples/wordpress/package.json

@@ -1,7 +1,7 @@
 {
   "private": true,
   "scripts": {
-    "dev": "WP_HOME=http://localhost:3001 smooth dev"
+    "dev": "WP_HOME=http://localhost:3000 smooth dev"
   },
   "dependencies": {
     "graphql-tag": "^2.10.1",
@@ -10,5 +10,8 @@
     "smooth-backend-wordpress": "latest",
     "smooth-plugin-head-meta": "latest",
     "smooth": "latest"
+  },
+  "resolutions": {
+    "apollo-link-dedup": "1.0.15"
   }
 }

examples/wordpress/src/_app.js

@@ -0,0 +1,26 @@
+import React from 'react'
+import gql from 'graphql-tag'
+import { Query } from 'smooth/query'
+
+const PAGE = gql`
+  query Page {
+    page(slug: "test") {
+      title
+    }
+  }
+`
+
+export default function Page({ Component, ...props }) {
+  return (
+    <Query prefetch={false} query={PAGE}>
+      {({ data }) =>
+        data && (
+          <>
+            <h1>{data.page.title}</h1>
+            <Component {...props} />
+          </>
+        )
+      }
+    </Query>
+  )
+}

examples/wordpress/src/pages/foo$.js

@@ -1 +1,25 @@
-export default () => 'hello'
+import React from 'react'
+import gql from 'graphql-tag'
+import { Query } from 'smooth/query'
+import { useLang } from 'smooth/page'
+
+const PAGE = gql`
+  query Page($foo: String) {
+    page(slug: "test") {
+      title
+    }
+  }
+`
+
+export default function Page() {
+  const lang = useLang()
+  throw new Error('kk')
+  return (
+    <>
+      <div>Lang: {lang}</div>
+      <Query query={PAGE}>
+        {({ data }) => (data ? data.page.title : null)}
+      </Query>
+    </>
+  )
+}

examples/wordpress/src/pages/index.js

@@ -28,6 +28,10 @@ export const contentFragment = gql`
     blocks {
       ...BlockFragment
     }
+    metadata {
+      id
+      slug
+    }
   }
 
   ${BlockFragment}

package.json

@@ -19,26 +19,26 @@
     "@babel/plugin-proposal-class-properties": "^7.3.4",
     "@babel/preset-env": "^7.3.4",
     "@babel/preset-react": "^7.0.0",
-    "@loadable/babel-plugin": "^5.6.0",
+    "@loadable/babel-plugin": "^5.7.0",
     "babel-core": "^7.0.0-bridge.0",
     "babel-eslint": "^10.0.1",
-    "babel-jest": "^24.1.0",
+    "babel-jest": "^24.5.0",
     "conventional-github-releaser": "^3.1.2",
     "cross-env": "^5.2.0",
     "doctoc": "^1.4.0",
-    "eslint": "^5.15.0",
+    "eslint": "^5.15.1",
     "eslint-config-airbnb": "^17.1.0",
     "eslint-config-prettier": "^4.1.0",
     "eslint-config-smooth": "^2.0.0",
     "eslint-plugin-import": "^2.16.0",
     "eslint-plugin-jsx-a11y": "^6.2.1",
     "eslint-plugin-react": "^7.12.4",
-    "eslint-plugin-react-hooks": "^1.4.0",
-    "jest": "^24.1.0",
+    "eslint-plugin-react-hooks": "^1.5.0",
+    "jest": "^24.5.0",
     "lerna": "^3.13.1",
     "prettier": "^1.16.4",
-    "react": "^16.8.3",
-    "react-dom": "^16.8.3",
+    "react": "^16.8.4",
+    "react-dom": "^16.8.4",
     "shx": "^0.3.2"
   }
 }

packages/smooth-backend-wordpress/src/acf/resolvers/createDefaultResolvers.js

@@ -91,7 +91,7 @@ function getQueryFieldResolver(node, helpers, state) {
   }
   const type = t.getContentSlug(typeDef)
   return {
-    async [name](object, { slug, lang, id, preview }) {
+    async [name](object, { slug }, { lang, id, preview }) {
       if (preview) {
         return state.apiClient.getContentPreview({
           type,
@@ -100,7 +100,9 @@ function getQueryFieldResolver(node, helpers, state) {
         })
       }
 
-      return state.apiClient.getContent({ type, lang, slug })
+      const res = await state.apiClient.getContent({ type, lang, slug })
+
+      return res
     },
   }
 }

packages/smooth-dev-cli/package.json

@@ -38,6 +38,6 @@
     "fs-extra": "^7.0.1",
     "is-absolute": "^1.0.0",
     "lodash": "^4.17.10",
-    "yargs": "^13.2.1"
+    "yargs": "^13.2.2"
   }
 }

packages/smooth/apollo.js

@@ -0,0 +1,2 @@
+/* eslint-disable import/no-unresolved */
+module.exports = require('./lib/apollo')

packages/smooth/package.json

@@ -41,20 +41,20 @@
     "@babel/preset-react": "^7.0.0",
     "@babel/register": "^7.0.0",
     "@babel/runtime": "^7.3.4",
-    "@emotion/core": "^10.0.7",
-    "@loadable/babel-plugin": "^5.6.0",
-    "@loadable/component": "^5.6.1",
-    "@loadable/server": "^5.6.1",
-    "@loadable/webpack-plugin": "^5.5.0",
+    "@emotion/core": "^10.0.9",
+    "@loadable/babel-plugin": "^5.7.0",
+    "@loadable/component": "^5.7.0",
+    "@loadable/server": "^5.7.0",
+    "@loadable/webpack-plugin": "^5.7.0",
     "apollo-cache-inmemory": "^1.5.1",
     "apollo-client": "^2.5.1",
-    "apollo-link": "^1.2.8",
-    "apollo-link-http": "^1.5.11",
-    "apollo-link-schema": "^1.1.6",
+    "apollo-link": "^1.2.10",
+    "apollo-link-http": "^1.5.13",
+    "apollo-link-schema": "^1.2.1",
     "apollo-server-express": "^2.4.8",
     "axios": "^0.18.0",
     "babel-loader": "^8.0.5",
-    "camelcase": "^5.1.0",
+    "camelcase": "^5.2.0",
     "commander": "^2.19.0",
     "cors": "^2.8.5",
     "cwd": "^0.10.0",
@@ -66,18 +66,18 @@
     "graphql-tag": "^2.10.1",
     "graphql-tools": "^4.0.4",
     "history": "^4.7.2",
-    "humanize-string": "^1.0.2",
+    "humanize-string": "^2.0.0",
     "merge-deep": "^3.0.2",
     "pluralize": "^7.0.0",
     "progress-estimator": "^0.2.2",
     "query-string": "^6.3.0",
-    "react-apollo": "^2.5.1",
+    "react-apollo": "^2.5.2",
     "react-helmet": "^5.2.0",
     "react-router-dom": "^4.3.1",
     "slugify": "^1.3.4",
     "tiny-glob": "^0.2.6",
     "webpack": "^4.29.6",
-    "webpack-dev-middleware": "^3.6.0",
+    "webpack-dev-middleware": "^3.6.1",
     "webpack-hot-middleware": "^2.24.3",
     "webpack-node-externals": "^1.7.2"
   }