diff --git a/gatsby-config.js b/gatsby-config.js
index 2923f5d..378c3b8 100644
--- a/gatsby-config.js
+++ b/gatsby-config.js
@@ -4,6 +4,7 @@ module.exports = {
title: 'Blog by John Doe',
subtitle: 'Pellentesque odio nisi, euismod in, pharetra a, ultricies in, diam. Sed arcu.',
copyright: '© All rights reserved.',
+ disqusShortname: '',
menu: [
{
label: 'Articles',
diff --git a/package.json b/package.json
index d93e051..13c04b2 100644
--- a/package.json
+++ b/package.json
@@ -27,15 +27,15 @@
"gatsby": "^1.8.12",
"gatsby-link": "^1.6.8",
"gatsby-plugin-catch-links": "^1.0.5",
+ "gatsby-plugin-feed": "^1.3.5",
"gatsby-plugin-google-analytics": "^1.0.4",
"gatsby-plugin-manifest": "^1.0.4",
- "gatsby-plugin-postcss-sass": "^1.0.3",
- "gatsby-plugin-feed": "^1.3.5",
- "gatsby-plugin-sitemap": "^1.2.2",
"gatsby-plugin-offline": "^1.0.4",
+ "gatsby-plugin-postcss-sass": "^1.0.3",
"gatsby-plugin-preact": "^1.0.0",
"gatsby-plugin-react-helmet": "^1.0.3",
"gatsby-plugin-sharp": "^1.6.2",
+ "gatsby-plugin-sitemap": "^1.2.2",
"gatsby-remark-copy-linked-files": "^1.5.2",
"gatsby-remark-images": "^1.5.4",
"gatsby-remark-prismjs": "^1.2.1",
@@ -44,8 +44,9 @@
"gatsby-source-filesystem": "^1.4.3",
"gatsby-transformer-remark": "^1.7.1",
"gatsby-transformer-sharp": "^1.6.1",
- "typeface-roboto": "latest",
- "lodash": "^4.17.2"
+ "lodash": "^4.17.2",
+ "react-disqus-comments": "^1.1.0",
+ "typeface-roboto": "latest"
},
"devDependencies": {
"postcss-pxtorem": "^4.0.1",
diff --git a/src/components/Disqus/Disqus.jsx b/src/components/Disqus/Disqus.jsx
new file mode 100644
index 0000000..632cc8d
--- /dev/null
+++ b/src/components/Disqus/Disqus.jsx
@@ -0,0 +1,49 @@
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import ReactDisqusComments from 'react-disqus-comments';
+import config from '../../../gatsby-config';
+
+class Disqus extends Component {
+ constructor(props) {
+ super(props);
+ this.state = {
+ toasts: []
+ };
+ this.notifyAboutComment = this.notifyAboutComment.bind(this);
+ this.onSnackbarDismiss = this.onSnackbarDismiss.bind(this);
+ }
+
+ onSnackbarDismiss() {
+ const [, ...toasts] = this.state.toasts;
+ this.setState({ toasts });
+ }
+ notifyAboutComment() {
+ const toasts = this.state.toasts.slice();
+ toasts.push({ text: 'New comment available!!' });
+ this.setState({ toasts });
+ }
+ render() {
+ const { postNode } = this.props;
+ if (!config.siteMetadata.disqusShortname) {
+ return null;
+ }
+ const post = postNode.frontmatter;
+ const url = config.siteMetadata.url + postNode.fields.slug;
+ return (
+