From d0ef44d1074c12ed7f3c7734e4482bae805f6f47 Mon Sep 17 00:00:00 2001 From: Vincent Taverna Date: Wed, 23 Nov 2016 16:41:17 -0500 Subject: [PATCH 1/5] replace react-document-title with react-helmet --- components/SitePage/index.jsx | 3 +-- components/SitePost/index.jsx | 1 - html.js | 6 +++--- package.json | 12 ++++++------ pages/index.jsx | 23 +++++++++++------------ wrappers/md.jsx | 13 ++++++------- 6 files changed, 27 insertions(+), 31 deletions(-) diff --git a/components/SitePage/index.jsx b/components/SitePage/index.jsx index b7614cf..10f9152 100644 --- a/components/SitePage/index.jsx +++ b/components/SitePage/index.jsx @@ -2,7 +2,6 @@ import React from 'react' import moment from 'moment' import { RouteHandler, Link } from 'react-router' import { prefixLink } from 'gatsby-helpers' -import DocumentTitle from 'react-document-title' import access from 'safe-access' import { config } from 'config' import SiteSidebar from '../SiteSidebar' @@ -38,4 +37,4 @@ SitePage.propTypes = { pages: React.PropTypes.array, } -export default SitePage \ No newline at end of file +export default SitePage diff --git a/components/SitePost/index.jsx b/components/SitePost/index.jsx index 4285c55..942f4f4 100644 --- a/components/SitePost/index.jsx +++ b/components/SitePost/index.jsx @@ -1,7 +1,6 @@ import React from 'react' import moment from 'moment' import { RouteHandler, Link } from 'react-router' -import DocumentTitle from 'react-document-title' import { prefixLink } from 'gatsby-helpers' import access from 'safe-access' import { config } from 'config' diff --git a/html.js b/html.js index e4a42b7..e799780 100644 --- a/html.js +++ b/html.js @@ -1,5 +1,5 @@ import React from 'react' -import DocumentTitle from 'react-document-title' +import Helmet from 'react-helmet' import { prefixLink } from 'gatsby-helpers' const BUILD_TIME = new Date().getTime() @@ -11,7 +11,7 @@ module.exports = React.createClass({ }, render() { const {body, route} = this.props - const title = DocumentTitle.rewind() + const title = Helmet.rewind() const font = let css if (process.env.NODE_ENV === 'production') { @@ -37,4 +37,4 @@ module.exports = React.createClass({ ) }, -}) \ No newline at end of file +}) diff --git a/package.json b/package.json index 8319558..2bca588 100644 --- a/package.json +++ b/package.json @@ -34,14 +34,15 @@ "markdown-it": "^6.0.2", "moment": "^2.14.1", "react": "^15.3.0", - "react-document-title": "^2.0.2", "react-dom": "^15.3.0", "react-ga": "^2.1.2", + "react-helmet": "^3.2.2", "react-router": "^2.6.1", "safe-access": "^0.1.0", "underscore.string": "^3.2.3" }, "devDependencies": { + "autoprefixer": "^6.3.7", "babel-core": "^6.11.4", "babel-loader": "^6.2.4", "babel-preset-react-hmre": "^1.1.1", @@ -51,18 +52,17 @@ "eslint-plugin-import": "^1.12.0", "eslint-plugin-jsx-a11y": "^2.0.1", "eslint-plugin-react": "^6.0.0", + "file-loader": "^0.9.0", "gh-pages": "^0.11.0", "image-webpack-loader": "^2.0.0", + "lost": "^7.0.3", "null-loader": "^0.1.1", "postcss-loader": "^0.9.1", "react-transform-catch-errors": "^1.0.2", "react-transform-hmr": "^1.0.4", "redbox-react": "^1.2.10", - "style-loader": "^0.13.1", - "webpack": "^1.13.1", - "autoprefixer": "^6.3.7", - "file-loader": "^0.9.0", "rucksack-css": "^0.8.5", - "lost": "^7.0.3" + "style-loader": "^0.13.1", + "webpack": "^1.13.1" } } diff --git a/pages/index.jsx b/pages/index.jsx index c58d1b1..b1853e5 100644 --- a/pages/index.jsx +++ b/pages/index.jsx @@ -2,7 +2,7 @@ import React from 'react' import { Link } from 'react-router' import sortBy from 'lodash/sortBy' import moment from 'moment' -import DocumentTitle from 'react-document-title' +import Helmet from 'react-helmet' import { prefixLink } from 'gatsby-helpers' import access from 'safe-access' import { config } from 'config' @@ -39,19 +39,18 @@ class SiteIndex extends React.Component { }) return ( - -
- -
-
-
- { pageLinks } -
+
+ + +
+
+
+ { pageLinks }
- - ) +
+ ) } } @@ -59,4 +58,4 @@ SiteIndex.propTypes = { route: React.PropTypes.object, } -export default SiteIndex \ No newline at end of file +export default SiteIndex diff --git a/wrappers/md.jsx b/wrappers/md.jsx index b0040bb..6148851 100644 --- a/wrappers/md.jsx +++ b/wrappers/md.jsx @@ -1,5 +1,5 @@ import React from 'react' -import DocumentTitle from 'react-document-title' +import Helmet from 'react-helmet' import SitePost from '../components/SitePost' import SitePage from '../components/SitePage' import { config } from 'config' @@ -19,11 +19,10 @@ class MarkdownWrapper extends React.Component { } return ( - -
- { template } -
-
+
+ + { template } +
); } } @@ -32,4 +31,4 @@ MarkdownWrapper.propTypes = { route: React.PropTypes.object, } -export default MarkdownWrapper \ No newline at end of file +export default MarkdownWrapper From e477a106e6cfb951332fea46d00f707cd92144c7 Mon Sep 17 00:00:00 2001 From: Vincent Taverna Date: Wed, 23 Nov 2016 20:13:32 -0500 Subject: [PATCH 2/5] Fix head reference from helmet --- html.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/html.js b/html.js index e799780..d68260b 100644 --- a/html.js +++ b/html.js @@ -11,7 +11,7 @@ module.exports = React.createClass({ }, render() { const {body, route} = this.props - const title = Helmet.rewind() + const head = Helmet.rewind() const font = let css if (process.env.NODE_ENV === 'production') { @@ -25,7 +25,7 @@ module.exports = React.createClass({ - { title } + { head.title } { font } { css } From 67696ac08bf39662aa796ce44e556b73e96594a5 Mon Sep 17 00:00:00 2001 From: Vincent Taverna Date: Thu, 24 Nov 2016 00:10:23 -0500 Subject: [PATCH 3/5] Correct the usage of title as a component Documentation for this feature can be found [here](https://github.com/nfl/react-helmet#as-react-components) --- html.js | 6 ++---- 1 file changed, 2 insertions(+), 4 deletions(-) diff --git a/html.js b/html.js index d68260b..fbef134 100644 --- a/html.js +++ b/html.js @@ -11,7 +11,7 @@ module.exports = React.createClass({ }, render() { const {body, route} = this.props - const head = Helmet.rewind() + const {title} = Helmet.rewind() const font = let css if (process.env.NODE_ENV === 'production') { @@ -24,9 +24,7 @@ module.exports = React.createClass({ - - { head.title } - + { title.toComponent() } { font } { css } From e469b2f9b5bea12bccfa4c1d9f7b00ce399c07cd Mon Sep 17 00:00:00 2001 From: Ihor Orlovskyi Date: Fri, 9 Dec 2016 00:45:12 +0200 Subject: [PATCH 4/5] add activeClassName in SiteNav component --- components/SiteNav/index.jsx | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/components/SiteNav/index.jsx b/components/SiteNav/index.jsx index d5f04f5..e24ab30 100644 --- a/components/SiteNav/index.jsx +++ b/components/SiteNav/index.jsx @@ -10,15 +10,15 @@ class SiteNav extends React.Component {