fix: use new header structure but fix reading time data #229

ajfisher · Sep 28, 2024 · 2ba1fc9 · 2ba1fc9
1 parent 60a7992
commit 2ba1fc9
Showing 1 changed file with 9 additions and 22 deletions.
diff --git a/site/src/templates/post.js b/site/src/templates/post.js
@@ -2,7 +2,6 @@ import React from 'react';
 import { graphql } from 'gatsby';
 import Layout from '../components/post-layout';
 import PageHead from '../components/page-head';
-import { getFeaturedImageSources } from '../lib/utils';
 
 export const Head = ({data}) => {
   const { markdownRemark} = data;
@@ -11,7 +10,7 @@ export const Head = ({data}) => {
   const excerpt = frontmatter.excerpt || markdownRemark.excerpt || '';
   const twitter_excerpt = frontmatter.twitter_excerpt || excerpt;
 
-  const featuredImageSrc = getFeaturedImageSources(frontmatter?.featureimage?.childImageSharp);
+  const featuredImage = frontmatter?.featureimage || '';
 
   return (
     <>
@@ -20,7 +19,7 @@ export const Head = ({data}) => {
         description={excerpt}
         type="article"
         tweet={twitter_excerpt}
-        image={featuredImageSrc}
+        image={featuredImage}
         readingTime={timeToRead}
         words={wordCount.words}
       />
@@ -30,14 +29,15 @@ export const Head = ({data}) => {
 
 export default function Template({ data, location }) {
   const { markdownRemark} = data;
-  const { fields, frontmatter, html, related} = markdownRemark;
+  const { fields, frontmatter, html, related, timeToRead, wordCount} = markdownRemark;
   const { taglist } = fields;
 
-  const featuredImageSrc = getFeaturedImageSources(frontmatter?.featureimage?.childImageSharp);
+  const featuredImage = frontmatter?.featureimage;
 
   return (
-    <Layout frontmatter={frontmatter} featuredimage={featuredImageSrc}
-      readingTime={fields.readingTime} path={location.pathname}
+    <Layout frontmatter={frontmatter} featuredimage={featuredImage}
+      readingTime={timeToRead} wordCount={wordCount}
+      path={location.pathname}
       tags={taglist} relatedposts={related?.post_similarity}
     >
       <section
@@ -62,22 +62,9 @@ export const pageQuery = graphql`
         large_title
         featureimage {
           childImageSharp {
-            base: gatsbyImageData(width: 400, quality: 100
-              transformOptions: {duotone: {highlight:"FF5E9A", shadow:"000000", opacity: 80}}
+            gatsbyImageData(
+              layout: FULL_WIDTH
             )
-            small: gatsbyImageData(width: 500, quality: 100
-              transformOptions: {duotone: {highlight:"FF5E9A", shadow:"000000", opacity: 80}}
-            )
-            medium: gatsbyImageData(width: 750, quality: 90
-              transformOptions: {duotone: {highlight:"FF5E9A", shadow:"000000", opacity: 80}}
-            )
-            large: gatsbyImageData(width: 1050, quality: 100
-              transformOptions: {duotone: {highlight:"FF5E9A", shadow:"000000", opacity: 80}}
-            )
-            wide: gatsbyImageData(width: 1600, quality: 100
-              transformOptions: {duotone: {highlight:"FF5E9A", shadow:"000000", opacity: 80}}
-            )
-            share: gatsbyImageData(width: 1200, quality: 90)
           }
         }
         imageby