Merge pull request #19 from WebDevStudios/bugfix/wpgraphql-version-increase-17

Modify code to compensate for WPGraphQL breaking changes

Author: Greg Rickaby

components/avatar.js

@@ -2,14 +2,14 @@ import PropTypes from 'prop-types'
 
 export default function Avatar({author}) {
   const name =
-    author.firstName && author.lastName
-      ? `${author.firstName} ${author.lastName}`
-      : author.name
+    author.node.firstName && author.node.lastName
+      ? `${author.node.firstName} ${author.node.lastName}`
+      : author.node.name
 
   return (
     <div className="flex items-center">
       <img
-        src={author.avatar.url}
+        src={author.node.avatar.url}
         className="w-12 h-12 rounded-full mr-4"
         alt={name}
       />

components/cover-image.js

@@ -5,7 +5,7 @@ import Link from 'next/link'
 export default function CoverImage({title, coverImage, slug}) {
   const image = (
     <img
-      src={coverImage?.sourceUrl}
+      src={coverImage?.node?.sourceUrl}
       className={cn('shadow-small', {
         'hover:shadow-medium transition-shadow duration-200': slug
       })}

lib/api.js

@@ -71,14 +71,18 @@ export async function getAllPostsForHome(preview) {
             slug
             date
             featuredImage {
-              sourceUrl
+              node {
+                sourceUrl
+              }
             }
             author {
-              name
-              firstName
-              lastName
-              avatar {
-                url
+              node {
+                name
+                firstName
+                lastName
+                avatar {
+                  url
+                }
               }
             }
           }
@@ -122,10 +126,14 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
       slug
       date
       featuredImage {
-        sourceUrl
+        node {
+          sourceUrl
+        }
       }
       author {
-        ...AuthorFields
+        node {
+          ...AuthorFields
+        }
       }
       categories {
         edges {
@@ -157,7 +165,9 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
               excerpt
               content
               author {
-                ...AuthorFields
+                node {
+                  ...AuthorFields
+                }
               }
             }
           }

pages/posts/[slug].js

@@ -37,7 +37,7 @@ export default function Post({post, posts, preview}) {
                 </title>
                 <meta
                   property="og:image"
-                  content={post.featuredImage?.sourceUrl}
+                  content={post.featuredImage?.node?.sourceUrl}
                 />
               </Head>
               <PostHeader