Add author pages. fix #21

gatsby-node.js

@@ -121,6 +121,38 @@ exports.createPages = ({ actions, graphql }) => {
         })
       })
     })
+    .then(() => {
+      return graphql(`
+        {
+          allWordpressWpUsers {
+            edges {
+              node {
+                id
+                slug
+              }
+            }
+          }
+        }
+      `)
+    })
+    .then(result => {
+      if (result.errors) {
+        result.errors.forEach(e => console.error(e.toString()))
+        return Promise.reject(result.errors)
+      }
+
+      const authorTemplate = path.resolve(`./src/templates/author.js`)
+
+      _.each(result.data.allWordpressWpUsers.edges, edge => {
+        createPage({
+          path: `/author/${edge.node.slug}`,
+          component: authorTemplate,
+          context: {
+            id: edge.node.id,
+          },
+        })
+      })
+    })
 }
 
 exports.onCreateNode = ({ node, actions, getNode }) => {

src/components/PostList.js

@@ -23,7 +23,12 @@ export default class IndexPage extends React.Component {
                   {post.title}
                 </Link>
                 <span> &bull; </span>
-                <small>{post.date}</small>
+                <small>
+                  {post.date} - posted by{' '}
+                  <Link to={`/author/${post.author.slug}`}>
+                    {post.author.name}
+                  </Link>
+                </small>
               </p>
               <div>
                 <div
@@ -55,6 +60,7 @@ export const pageQuery = graphql`
     excerpt
     author {
       name
+      slug
       avatar_urls {
         wordpress_48
       }

src/templates/author.js

@@ -0,0 +1,45 @@
+import React from 'react'
+import Helmet from 'react-helmet'
+import { graphql } from 'gatsby'
+import Layout from '../components/Layout'
+import PostList from '../components/PostList'
+
+const Author = props => {
+  const { data } = props
+  const { authored_wordpress__POST, name } = data.wordpressWpUsers
+  const totalCount =
+    (authored_wordpress__POST && authored_wordpress__POST.length) || 0
+  const { title: siteTitle } = data.site.siteMetadata
+  const title = `${totalCount} post${totalCount === 1 ? '' : 's'} by ${name}`
+
+  // The `authored_wordpress__POST` returns a simple array instead of an array
+  // of edges / nodes. We therefore need to convert the array here.
+  const posts = authored_wordpress__POST.map(post => ({
+    node: post,
+  }))
+
+  return (
+    <Layout>
+      <Helmet title={`${name} | ${siteTitle}`} />
+      <PostList posts={posts} title={title} />
+    </Layout>
+  )
+}
+
+export default Author
+
+export const pageQuery = graphql`
+  query AuthorPage($id: String!) {
+    site {
+      siteMetadata {
+        title
+      }
+    }
+    wordpressWpUsers(id: { eq: $id }) {
+      name
+      authored_wordpress__POST {
+        ...PostListFields
+      }
+    }
+  }
+`