feat(blog-post): add reading time

Darioflorez · Dec 1, 2018 · 4a7d3aa · 4a7d3aa
1 parent bf37551
commit 4a7d3aa
Show file tree

Hide file tree

Showing 2 changed files with 4 additions and 0 deletions.
diff --git a/package.json b/package.json
@@ -30,6 +30,7 @@
     "react-dom": "^16.5.1",
     "react-helmet": "^5.2.0",
     "react-typography": "^0.16.13",
+    "reading-time": "^1.1.3",
     "typeface-merriweather": "0.0.43",
     "typeface-montserrat": "0.0.43",
     "typography": "^0.16.17",

diff --git a/src/templates/blog-post.js b/src/templates/blog-post.js
@@ -2,6 +2,7 @@ import React from 'react'
 import Helmet from 'react-helmet'
 import { Link, graphql } from 'gatsby'
 import get from 'lodash/get'
+import readingTime from 'reading-time'
 
 import Bio from '../components/Bio'
 import Layout from '../components/Layout'
@@ -13,6 +14,7 @@ class BlogPostTemplate extends React.Component {
     const siteTitle = get(this.props, 'data.site.siteMetadata.title')
     const siteDescription = post.excerpt
     const { previous, next } = this.props.pageContext
+    const timeToRead = readingTime(post.html)
 
     return (
       <Layout location={this.props.location} title={siteTitle}>
@@ -31,6 +33,7 @@ class BlogPostTemplate extends React.Component {
           }}
         >
           {post.frontmatter.date}
+          {` - ${timeToRead.text}`}
         </p>
         <div dangerouslySetInnerHTML={{ __html: post.html }} />
         <hr