feat: ✨ add disqus comments

Author: kitos

.env.production

@@ -1,3 +1,4 @@
 YOUTUBE_KEY=it's a secret
 CONTENTFUL_ACCESS_TOKEN=it is also secret
 GATSBY_CLOUD_FUNCTION_CREATE_GH_ISSUE=https://us-central1-personal-site-223608.cloudfunctions.net/create-blog-typo-issue
+GATSBY_DISQUS_SHORTNAME=nikita-kirsanov-blog

package-lock.json

@@ -14,6 +14,7 @@
     "@sindresorhus/slugify": "^0.8.0",
     "axios": "^0.18.0",
     "date-fns": "^2.0.0-alpha.26",
+    "disqus-react": "^1.0.5",
     "gatsby": "^2.0.73",
     "gatsby-image": "^2.0.25",
     "gatsby-plugin-feed": "^2.0.11",

package.json

@@ -3,8 +3,9 @@ import { graphql } from 'gatsby'
 import { differenceInWeeks, format } from 'date-fns/fp'
 import { Box } from '@rebass/grid'
 import { Like } from 'react-facebook'
+import { DiscussionEmbed } from 'disqus-react'
 
-import { BlogTags, BlogPostContent } from '../components/blog'
+import { BlogPostContent, BlogTags } from '../components/blog'
 import { SEO } from '../components'
 
 let formatDate = format('MMMM dd, yyyy')
@@ -57,6 +58,15 @@ let BlogPost = ({
       <Box mt={20}>
         <Like href={postUrl} colorScheme="dark" showFaces share />
       </Box>
+
+      <DiscussionEmbed
+        shortname={process.env.GATSBY_DISQUS_SHORTNAME}
+        config={{
+          url: postUrl,
+          identifier: slug,
+          title,
+        }}
+      />
     </>
   )
 }