Migrate to new schema for users

gatsby-config.js

@@ -239,7 +239,7 @@ module.exports = {
     `gatsby-plugin-sitemap`
   ],
   mapping: {
-    "MarkdownRemark.frontmatter.author": `AuthorsJson`,
-    "AuthorsJson.pronouns": `PronounsJson`,
+    "MarkdownRemark.frontmatter.author": `UsersJson`,
+    "UsersJson.pronouns": `PronounsJson`,
   },
 }

gatsby-node.js

@@ -26,7 +26,7 @@ exports.createPages = ({ graphql, actions }) => {
           }
         }
       }
-      allAuthorsJson(limit: 100) {
+      allUsersJson(limit: 100) {
         edges {
           node {
             id
@@ -42,7 +42,7 @@ exports.createPages = ({ graphql, actions }) => {
 
     // Create blog posts pages.
     const posts = result.data.allMarkdownRemark.edges
-    const authors = result.data.allAuthorsJson.edges
+    const authors = result.data.allUsersJson.edges
 
     posts.forEach((post, index, arr) => {
       const previous = index === arr.length - 1 ? null : arr[index + 1].node

src/components/layout/layout.js

@@ -29,7 +29,7 @@ export const Layout = ({ location, children }) => {
 }
 
 export const authorFragmentQuery = graphql`
-  fragment AuthorInfo on AuthorsJson {
+  fragment UserInfo on UsersJson {
     name
     blurbet
     id
@@ -73,7 +73,7 @@ export const postFragmentQuery = graphql`
       tags
       description
       author {
-        ...AuthorInfo
+        ...UserInfo
       }
     }
     fields {

src/components/pic-title-header/pic-title-header.js

@@ -23,7 +23,7 @@ const SocialBtn = ({icon, text, url, name}) => {
 /**
  *
  * @param image
- * @param socials - Match the object of the authorsJson socials
+ * @param socials - Match the object of the usersJson socials
  * @param title
  * @param description
  * @param author - Is an author pic?

src/components/post-card-list/post-card-list.js

@@ -3,11 +3,7 @@ import listStyle from "./post-card-list.module.scss"
 import { PostCard } from "../post-card"
 import { FilterSearchBar } from "../filter-search-bar"
 
-/**
- * overwriteAuthorInfo is a needed evil for now:
- * @see https://github.com/gatsbyjs/gatsby/issues/14827
- */
-export const PostList = ({ posts = [], showWordCount = false, overwriteAuthorInfo, numberOfArticles, wordCount, tags }) => {
+export const PostList = ({ posts = [], showWordCount = false, numberOfArticles, wordCount, tags }) => {
   // FIXME: This will not suffice with pagination added
   const [filtered, setFiltered] = useState(null)
   const [searched, setSearched] = useState(null)
@@ -38,7 +34,7 @@ export const PostList = ({ posts = [], showWordCount = false, overwriteAuthorInf
               key={node.fields.slug}
               excerpt={node.excerpt}
               title={title}
-              author={overwriteAuthorInfo || node.frontmatter.author}
+              author={node.frontmatter.author}
               published={node.frontmatter.published}
               tags={node.frontmatter.tags}
               description={node.frontmatter.description}

src/pages/about.js

@@ -8,7 +8,7 @@ import style from "./about.module.scss"
 const AboutUs = (props) => {
   const { data: { markdownRemark } } = props
 
-  const { file, markdownRemark: post, site } = useStaticQuery(graphql`
+  const { file, markdownRemark: post, site, allUsersJson: authors } = useStaticQuery(graphql`
       query AboutUsQuery {
         site {
           siteMetadata {
@@ -31,13 +31,19 @@ const AboutUs = (props) => {
             }
           }
         }
+        allUsersJson {
+          nodes {
+            ...UserInfo
+          }
+        }
       }
     `)
 
   const { siteMetadata: { title: siteTitle } } = site
+  const { nodes: authorArr } = authors
   const { childImageSharp: { fixed: imageFixed } } = file
 
-  console.log(post)
+  console.log(authorArr)
 
   return (
     <Layout location={props.location} title={siteTitle}>
@@ -53,8 +59,16 @@ const AboutUs = (props) => {
         </div>
         <div
           className={`${style.aboutBody} post-body`}
-          dangerouslySetInnerHTML={{ __html: markdownRemark.html }}
-        />
+        >
+          <div dangerouslySetInnerHTML={{ __html: markdownRemark.html }}/>
+          {
+            authorArr.map(authorInfo => (
+              <div key={authorInfo.id}>
+                <p>{authorInfo.name}</p>
+              </div>
+            ))
+          }
+        </div>
       </div>
     </Layout>
   )

src/pages/about.module.scss

@@ -16,6 +16,7 @@
 }
 
 .headerTitle {
+  flex-wrap: wrap;
   display: flex;
   justify-content: center;
   align-items: center;

src/templates/blog-author.js

@@ -8,7 +8,7 @@ import { PicTitleHeader } from "../components/pic-title-header"
 const BlogAuthor = (props) => {
   const siteTitle = props.data.site.siteMetadata.title
   const slugData = props.data
-  const authorData = slugData.authorsJson
+  const authorData = slugData.usersJson
   const posts = slugData.allMarkdownRemark.edges
 
   // FIXME: This logic will break with pagination
@@ -44,7 +44,6 @@ const BlogAuthor = (props) => {
         wordCount={wordCount}
         posts={posts}
         tags={postTags}
-        overwriteAuthorInfo={authorData}
         showWordCount={true}
       />
     </Layout>
@@ -60,8 +59,8 @@ export const pageQuery = graphql`
         title
       }
     }
-    authorsJson(id: { eq: $slug }) {
-      ...AuthorInfo
+    usersJson(id: { eq: $slug }) {
+      ...UserInfo
     }
     allMarkdownRemark(
       filter: {