[cms-wordpress] Nest one-to-one relationships (vercel#15007)

There is a bug in the cms-wordpress example due to a Wordpress plugin dependency. After running `npm install`, then either `npm run dev` or `npm run build`, the following errors appear in the console:

```shell
> cms-wordpress@1.0.0 dev /Users/jplew/Sites/projects/next.js/examples/cms-wordpress
> next

ready - started server on http://localhost:3000
info  - Loaded env from /Users/jplew/Sites/projects/next.js/examples/cms-wordpress/.env.local
event - compiled successfully
event - build page: /
wait  - compiling...
event - build page: /next/dist/pages/_error
event - compiled successfully
[
  {
    message: 'Cannot query field "name" on type "NodeWithAuthorToUserConnectionEdge". Did you mean "node"?',
    extensions: { category: 'graphql' },
    locations: [ [Object] ]
  },
  {
    message: 'Cannot query field "firstName" on type "NodeWithAuthorToUserConnectionEdge".',
    extensions: { category: 'graphql' },
    locations: [ [Object] ]
  },
  {
    message: 'Cannot query field "lastName" on type "NodeWithAuthorToUserConnectionEdge".',
    extensions: { category: 'graphql' },
    locations: [ [Object] ]
  },
  {
    message: 'Cannot query field "avatar" on type "NodeWithAuthorToUserConnectionEdge".',
    extensions: { category: 'graphql' },
    locations: [ [Object] ]
  }
]
Error: Failed to fetch API
    at fetchAPI (webpack-internal:///./lib/api.js:31:11)
```

The reason for this is `wp-graphql` released version v0.10.0 ten days ago which introduced a number of breaking changes (https://github.com/wp-graphql/wp-graphql/releases/tag/v0.10.0). Specifically, this is the change that breaks the current example:

> - One to One relationships are now nested. For example post.author and post.featuredImage now return an edge/node instead of the node directly.

More info about this change can be found here: wp-graphql/wp-graphql#347 (comment)

After my changes, `npm run dev` and `npm run build` succeed without errors.

Author: JP Lew

examples/cms-wordpress/components/more-stories.js

@@ -11,9 +11,9 @@ export default function MoreStories({ posts }) {
           <PostPreview
             key={node.slug}
             title={node.title}
-            coverImage={node.featuredImage}
+            coverImage={node.featuredImage.node}
             date={node.date}
-            author={node.author}
+            author={node.author.node}
             slug={node.slug}
             excerpt={node.excerpt}
           />

examples/cms-wordpress/lib/api.js

@@ -70,14 +70,18 @@ export async function getAllPostsForHome(preview) {
             slug
             date
             featuredImage {
-              sourceUrl
+              node {
+                sourceUrl
+              }
             }
             author {
-              name
-              firstName
-              lastName
-              avatar {
-                url
+              node {
+                name
+                firstName
+                lastName
+                avatar {
+                  url
+                }
               }
             }
           }
@@ -121,10 +125,14 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
       slug
       date
       featuredImage {
-        sourceUrl
+        node {
+          sourceUrl
+        }
       }
       author {
-        ...AuthorFields
+        node {
+          ...AuthorFields
+        }
       }
       categories {
         edges {
@@ -156,7 +164,9 @@ export async function getPostAndMorePosts(slug, preview, previewData) {
               excerpt
               content
               author {
-                ...AuthorFields
+                node {
+                  ...AuthorFields
+                }
               }
             }
           }

examples/cms-wordpress/pages/index.js

@@ -22,9 +22,9 @@ export default function Index({ allPosts: { edges }, preview }) {
           {heroPost && (
             <HeroPost
               title={heroPost.title}
-              coverImage={heroPost.featuredImage}
+              coverImage={heroPost.featuredImage.node}
               date={heroPost.date}
-              author={heroPost.author}
+              author={heroPost.author.node}
               slug={heroPost.slug}
               excerpt={heroPost.excerpt}
             />

examples/cms-wordpress/pages/posts/[slug].js

@@ -36,14 +36,14 @@ export default function Post({ post, posts, preview }) {
                 </title>
                 <meta
                   property="og:image"
-                  content={post.featuredImage?.sourceUrl}
+                  content={post.featuredImage?.node?.sourceUrl}
                 />
               </Head>
               <PostHeader
                 title={post.title}
-                coverImage={post.featuredImage}
+                coverImage={post.featuredImage.node}
                 date={post.date}
-                author={post.author}
+                author={post.author.node}
                 categories={post.categories}
               />
               <PostBody content={post.content} />