Merge pull request #43 from WebDevStudios/feature/33-basic-post-page-queries-refactor

Feature/33 basic post page queries refactor

Author: gregrickaby

api/wordpress/_global/getPostTypeById.js

@@ -10,7 +10,7 @@ import {isHierarchicalPostType} from './postTypes'
  * @param  {string}        postType WP post type.
  * @param  {Number|string} id       Post identifier.
  * @param  {string}        idType   Type of ID.
- * @return {Object}                 Post data or error object.
+ * @return {Object}                 Object containing Apollo client instance and post data or error object.
  */
 export default async function getPostTypeById(postType, id, idType = 'SLUG') {
   // Define single post query based on post type.
@@ -57,5 +57,8 @@ export default async function getPostTypeById(postType, id, idType = 'SLUG') {
     }
   }
 
-  return post
+  return {
+    apolloClient,
+    post
+  }
 }

api/wordpress/_global/getPostTypeStaticPaths.js

@@ -44,11 +44,8 @@ export default async function getPostTypeStaticPaths(postType) {
   const paths = !posts?.data?.[pluralName]?.nodes
     ? []
     : posts.data[pluralName].nodes.map((post) => {
-        // Use path field as-is for non-hierarchical post types.
-        // Trim leading and trailing slashes then split into array on inner slashes for hierarchical post types.
-        const slug = !isHierarchical
-          ? post[pathField]
-          : post[pathField].replace(/^\/|\/$/g, '').split('/')
+        // Trim leading and trailing slashes then split into array on inner slashes.
+        const slug = post[pathField].replace(/^\/|\/$/g, '').split('/')
 
         return {
           params: {

api/wordpress/_global/getPostTypeStaticProps.js

@@ -0,0 +1,32 @@
+import getPostTypeById from './getPostTypeById'
+import {addApolloState} from '../connector'
+
+/**
+ * Retrieve static props by post type.
+ *
+ * @param  {string}  params      Post params (e.g., slug).
+ * @param  {string}  postType    Post Type.
+ * @param  {boolean} preview     Whether requesting preview of post.
+ * @param  {?Object} previewData Post preview data.
+ * @return {Object}              Object containing post props and revalidate setting.
+ */
+export default async function getPostTypeStaticProps(
+  params,
+  postType
+  // preview = false, // TODO - add preview handling.
+  // previewData = null
+) {
+  // Handle catch-all routes.
+  const slug = Array.isArray(params.slug) ? params.slug.join('/') : params.slug
+
+  // Retrieve post data.
+  const {apolloClient, post} = await getPostTypeById(postType, slug)
+
+  // Merge in query results as Apollo state.
+  return addApolloState(apolloClient, {
+    props: {
+      post
+    },
+    revalidate: 60 * 5
+  })
+}

api/wordpress/_partials/authorPostFields.js

@@ -0,0 +1,10 @@
+// Query partial: retrieve author post fields.
+const authorPostFields = `
+  author {
+    node {
+      slug
+      nickname
+    }
+  }
+`
+export default authorPostFields

api/wordpress/_partials/categoriesPostFields.js

@@ -0,0 +1,12 @@
+// Query partial: retrieve categories post fields.
+const categoriesPostFields = `
+  categories {
+    edges {
+      node {
+        slug
+        name
+      }
+    }
+  }
+`
+export default categoriesPostFields

api/wordpress/_partials/featuredImagePostFields.js

@@ -0,0 +1,11 @@
+// Query partial: retrieve featured image post fields.
+const featuredImagePostFields = `
+  featuredImage {
+    node {
+      altText
+      sourceUrl(size: $imageSize)
+    }
+  }
+`
+
+export default featuredImagePostFields

api/wordpress/_partials/globalPostFields.js

@@ -0,0 +1,8 @@
+// Query partial: retrieve global post fields.
+const globalPostFields = `
+  databaseId
+  date
+  slug
+  title
+`
+export default globalPostFields

api/wordpress/_partials/seoPostFields.js

@@ -0,0 +1,15 @@
+// Query partial: retrieve SEO post fields.
+const seoPostFields = `
+  seo {
+    canonical
+    title
+    metaDesc
+    metaRobotsNofollow
+    metaRobotsNoindex
+    opengraphImage {
+      sourceUrl
+    }
+  }
+`
+
+export default seoPostFields

api/wordpress/_partials/tagsPostFields.js

@@ -0,0 +1,12 @@
+// Query partial: retrieve tags post fields.
+const tagsPostFields = `
+  tags {
+    edges {
+      node {
+        name
+        slug
+      }
+    }
+  }
+`
+export default tagsPostFields

api/wordpress/pages/queryPageById.js

@@ -1,39 +1,34 @@
+import globalPostFields from '../_partials/globalPostFields'
+import seoPostFields from '../_partials/seoPostFields'
+import authorPostFields from '../_partials/authorPostFields'
+import featuredImagePostFields from '../_partials/featuredImagePostFields'
+
 const {gql} = require('@apollo/client')
 
+// Fragment: retrieve single page fields.
+const singlePageFragment = gql`
+  fragment SinglePageFields on Page {
+    ${globalPostFields}
+    blocksJSON
+    excerpt
+    ${seoPostFields}
+    ${authorPostFields}
+    ${featuredImagePostFields}
+  }
+`
+
 // Query: retrieve page by specified identifier.
 const queryPageById = gql`
-  query GET_PAGE_BY_SLUG($id: ID!, $idType: PageIdType = URI) {
+  query GET_PAGE_BY_SLUG(
+    $id: ID!
+    $idType: PageIdType = URI
+    $imageSize: MediaItemSizeEnum = LARGE
+  ) {
     page(id: $id, idType: $idType) {
-      blocksJSON
-      databaseId
-      date
-      slug
-      title
-      excerpt
-      seo {
-        canonical
-        title
-        metaDesc
-        metaRobotsNofollow
-        metaRobotsNoindex
-        opengraphImage {
-          sourceUrl
-        }
-      }
-      author {
-        node {
-          slug
-          nickname
-        }
-      }
-      featuredImage {
-        node {
-          altText
-          sourceUrl(size: LARGE)
-        }
-      }
+      ...SinglePageFields
     }
   }
+  ${singlePageFragment}
 `
 
 export default queryPageById