Merge branch 'staging' into feature/33-previews

Author: ravewebdev

api/wordpress/_partials/commentsFields.js

@@ -0,0 +1,16 @@
+// Query partial: retrieve comment fields.
+const commentsFields = `
+edges {
+  node {
+    databaseId
+    content(format: RENDERED)
+    parentDatabaseId
+    approved
+    id
+    date
+    parentId
+    type
+  }
+}
+`
+export default commentsFields

api/wordpress/_partials/commentsPostFields.js

@@ -0,0 +1,9 @@
+import commentsFields from './commentsFields'
+
+// Query partial: retrieve comment post fields.
+const commentsPostFields = `
+  comments(first: 10) {
+    ${commentsFields}
+  }
+`
+export default commentsPostFields

api/wordpress/comments/queryCommentsByPostId.js

@@ -0,0 +1,29 @@
+import {gql} from '@apollo/client'
+import archivePageInfo from '../_partials/archivePageInfo'
+import commentsFields from '../_partials/commentsFields'
+
+// Query: retrieve comments by post databaseId.
+const queryCommentsByPostId = gql`
+  query GET_COMMENTS_BY_POST_ID(
+    $id: ID!
+    $first: Int
+    $last: Int
+    $after: String
+    $before: String
+    $order: OrderEnum = ASC
+    $orderby: CommentsConnectionOrderbyEnum = COMMENT_DATE
+  ) {
+    comments(
+      first: $first
+      last: $last
+      after: $after
+      before: $before
+      where: {contentId: $id, order: $order, orderby: $orderby}
+    ) {
+      ${archivePageInfo}
+      ${commentsFields}
+    }
+  }
+`
+
+export default queryCommentsByPostId

api/wordpress/posts/queryPostById.js

@@ -6,6 +6,7 @@ import tagsPostFields from '../_partials/tagsPostFields'
 import categoriesPostFields from '../_partials/categoriesPostFields'
 import {gql} from '@apollo/client'
 import defaultPageData from '../_partials/defaultPageData'
+import commentsPostFields from '../_partials/commentsPostFields'
 
 // Fragment: retrieve single post fields.
 const singlePostFragment = gql`
@@ -18,6 +19,7 @@ const singlePostFragment = gql`
     ${featuredImagePostFields}
     ${tagsPostFields}
     ${categoriesPostFields}
+    ${commentsPostFields}
   }
 `
 // Query: retrieve post by specified identifier.

components/blocks/BlockHeadings/BlockHeadings.js

@@ -9,7 +9,9 @@ import React from 'react'
  * The core Headings block from Gutenberg.
  *
  * @author WebDevStudios
- * @param {object} props The component attributes as props.
+ * @param {object} props       The component attributes as props.
+ * @param {object} props.props The block attributes props from WordPress.
+ * @return {Element}           RichText component with heading content.
  */
 export default function BlockHeadings({props}) {
   const {anchor, align, className, content, level} = props

components/blocks/BlockParagraph/BlockParagraph.js

@@ -8,7 +8,9 @@ import PropTypes from 'prop-types'
  * The core Paragraph block from Gutenberg.
  *
  * @author WebDevStudios
- * @param {object} props The component attributes as props.
+ * @param {object} props       The component attributes as props.
+ * @param {object} props.props The block attributes props from WordPress.
+ * @return {Element}           RichText component with paragraph content.
  */
 export default function BlockParagraph({props}) {
   const {className, align, anchor, content} = props

components/molecules/Blocks/Blocks.js

@@ -7,7 +7,7 @@ import displayBlock from '@/functions/displayBlock'
  *
  * @author WebDevStudios
  * @param {object} props        The component attributes as props.
- * @param {array}  props.blocks The array of blocks.
+ * @param {Array}  props.blocks The array of blocks.
  * @return {Element}            The Blocks component.
  */
 export default function Blocks({blocks}) {

pages/blog/[[...slug]].js

@@ -64,6 +64,11 @@ export default function BlogPost({post, archive, posts, pagination}) {
     <Layout seo={{...post?.seo}} hasJsonLd={true}>
       <article className="container">
         <Blocks blocks={post?.blocks} />
+        <div
+          dangerouslySetInnerHTML={{
+            __html: JSON.stringify(post?.comments ?? [])
+          }}
+        />
       </article>
     </Layout>
   )