From 27aeb08f5d9bc055245b07247838308e1e404e26 Mon Sep 17 00:00:00 2001
From: Nat Alison <tesseralis@gmail.com>
Date: Wed, 19 Feb 2020 02:51:09 -0800
Subject: [PATCH] refactor(www): consolidate getting the excerpt from blog
 posts (#21386)

---
 www/gatsby-config.js                             |  5 ++---
 www/src/components/blog-post-preview-item.js     |  7 ++-----
 .../components/homepage/homepage-blog-post.js    |  6 +-----
 www/src/templates/template-blog-post.js          | 16 ++++------------
 www/src/utils/node/docs.js                       |  7 +++++++
 5 files changed, 16 insertions(+), 25 deletions(-)

diff --git a/www/gatsby-config.js b/www/gatsby-config.js
index b5279d57eed47..5a878aa6e9ebb 100644
--- a/www/gatsby-config.js
+++ b/www/gatsby-config.js
@@ -278,17 +278,16 @@ module.exports = {
                 ) {
                   edges {
                     node {
-                      excerpt
                       html
                       frontmatter {
                         title
                         date
-                        excerpt
                         author {
                           id
                         }
                       }
                       fields {
+                        excerpt
                         slug
                       }
                     }
@@ -314,7 +313,7 @@ module.exports = {
               allMdx.edges.map(({ node }) => {
                 return {
                   title: node.frontmatter.title,
-                  description: node.frontmatter.excerpt || node.excerpt,
+                  description: node.fields.excerpt,
                   url: site.siteMetadata.siteUrl + node.fields.slug,
                   guid: site.siteMetadata.siteUrl + node.fields.slug,
                   custom_elements: [{ "content:encoded": node.html }],
diff --git a/www/src/components/blog-post-preview-item.js b/www/src/components/blog-post-preview-item.js
index eab7a3b215bf2..7c9a7d79cf184 100644
--- a/www/src/components/blog-post-preview-item.js
+++ b/www/src/components/blog-post-preview-item.js
@@ -16,9 +16,7 @@ const BlogPostPreviewItem = ({ post, className }) => (
   <article css={{ position: `relative` }} className={className}>
     <Link to={post.fields.slug} sx={{ "&&": { color: `card.color` } }}>
       <h2 sx={{ color: `card.header`, mt: 0 }}>{post.frontmatter.title}</h2>
-      <p>
-        {post.frontmatter.excerpt ? post.frontmatter.excerpt : post.excerpt}
-      </p>
+      <p>{post.fields.excerpt}</p>
     </Link>
     <div
       css={{
@@ -86,12 +84,11 @@ const BlogPostPreviewItem = ({ post, className }) => (
 
 export const blogPostPreviewFragment = graphql`
   fragment BlogPostPreview_item on Mdx {
-    excerpt
     fields {
       slug
+      excerpt
     }
     frontmatter {
-      excerpt
       title
       date
       author {
diff --git a/www/src/components/homepage/homepage-blog-post.js b/www/src/components/homepage/homepage-blog-post.js
index 1eba1f0882854..78566f30d37e3 100644
--- a/www/src/components/homepage/homepage-blog-post.js
+++ b/www/src/components/homepage/homepage-blog-post.js
@@ -188,10 +188,8 @@ const HomepageBlogPost = ({
   desktopViewport = false,
 }) => {
   const {
-    excerpt: automaticExcerpt,
-    fields: { slug },
+    fields: { slug, excerpt },
     frontmatter: {
-      excerpt: handwrittenExcerpt,
       author: {
         id: authorName,
         avatar: {
@@ -205,8 +203,6 @@ const HomepageBlogPost = ({
     },
   } = post
 
-  const excerpt = handwrittenExcerpt ? handwrittenExcerpt : automaticExcerpt
-
   return (
     <HomepageBlogPostRoot fullWidth={fullWidth}>
       {desktopViewport && cover && (
diff --git a/www/src/templates/template-blog-post.js b/www/src/templates/template-blog-post.js
index cbec0e4ba8070..b683002cdaaca 100644
--- a/www/src/templates/template-blog-post.js
+++ b/www/src/templates/template-blog-post.js
@@ -62,17 +62,10 @@ class BlogPostTemplate extends React.Component {
                 rel="author"
                 href={`https://gatsbyjs.org${post.frontmatter.author.fields.slug}`}
               />
-              <meta
-                name="description"
-                content={
-                  post.frontmatter.excerpt
-                    ? post.frontmatter.excerpt
-                    : post.excerpt
-                }
-              />
+              <meta name="description" content={post.fields.excerpt} />
 
-              <meta property="og:description" content={post.excerpt} />
-              <meta name="twitter:description" content={post.excerpt} />
+              <meta property="og:description" content={post.fields.excerpt} />
+              <meta name="twitter:description" content={post.fields.excerpt} />
               <meta property="og:title" content={post.frontmatter.title} />
               <meta property="og:url" content={href} />
               {post.frontmatter.image && (
@@ -241,15 +234,14 @@ export const pageQuery = graphql`
   query($slug: String!) {
     mdx(fields: { slug: { eq: $slug } }) {
       body
-      excerpt
       timeToRead
       fields {
         slug
+        excerpt
         publishedAt
       }
       frontmatter {
         title
-        excerpt
         date(formatString: "MMMM Do YYYY")
         rawDate: date
         canonicalLink
diff --git a/www/src/utils/node/docs.js b/www/src/utils/node/docs.js
index 4d0bba4a55b41..43702c1f681e8 100644
--- a/www/src/utils/node/docs.js
+++ b/www/src/utils/node/docs.js
@@ -259,6 +259,13 @@ exports.onCreateNode = ({ node, actions, getNode }) => {
             ? publishedAt || url.parse(canonicalLink).hostname
             : null,
         })
+
+        // If an excerpt is defined, use it, otherwise default to autogenerated excerpt
+        createNodeField({
+          node,
+          name: `excerpt`,
+          value: node.frontmatter.excerpt || node.excerpt,
+        })
       }
     }