[Site] Close navigation when changing page

LastCallMedia · Oct 4, 2017 · 70224d0 · 70224d0
1 parent 6b4d273
commit 70224d0
Show file tree

Hide file tree

Showing 2 changed files with 19 additions and 2 deletions.
diff --git a/site/src/components/PageTopBar.js b/site/src/components/PageTopBar.js
@@ -1,10 +1,11 @@
-import React from 'react'
+import React, {Component} from 'react'
 import Branding from './Branding'
 import Link from 'gatsby-link';
+import RouteChangeSubscriber from './RouteChangeSubscriber';
 import cx from 'classnames';
 import './PageTopBar.scss';
 
-export default class PageTopBar extends React.Component {
+export default class PageTopBar extends Component {
   constructor(props) {
     super(props)
     this.state = {open: false}
@@ -31,6 +32,7 @@ export default class PageTopBar extends React.Component {
             <MainMenu className="for-large" />
           </div>
           <MainMenu className={`for-small${open ? ' open' : ' closed'}`} />
+          {open && <RouteChangeSubscriber action={this.toggleMenu} />}
         </header>
     )
   }

diff --git a/site/src/components/RouteChangeSubscriber.js b/site/src/components/RouteChangeSubscriber.js
@@ -0,0 +1,15 @@
+import React, {Component} from 'react';
+import {withRouter} from 'react-router-dom';
+
+export default withRouter(
+    class extends Component{
+        componentDidUpdate(prevProps) {
+            if (prevProps.location !== this.props.location) {
+                this.props.action();
+            }
+        }
+        render() {
+            return this.props.children || null;
+        }
+    }
+)