Automatically set active sidebar menu item based on path

Planeshifter · Planeshifter · commit a93b9babaaee · 2019-11-17T22:09:50.000-05:00
diff --git a/tools/docs/www/src/side_menu.jsx b/tools/docs/www/src/side_menu.jsx
@@ -20,7 +20,7 @@
 
 import React, { Component, Fragment } from 'react';
 import { debounce } from 'throttle-debounce';
-import { Link } from 'react-router-dom';
+import { Link, withRouter } from 'react-router-dom';
 import List from '@material-ui/core/List';
 import ListItem from '@material-ui/core/ListItem';
 import Collapse from '@material-ui/core/Collapse';
@@ -46,6 +46,16 @@ class MenuBar extends Component {
 		};
 	}
 
+	componentDidUpdate() {
+		const history = this.props.history;
+		const pathname = history.location.pathname;
+		if ( !pathname.endsWith( this.state.activePkg ) ) {
+			this.setState({
+				activePkg: pathname.substring( pathname.indexOf( '@stdlib' ) )
+			});
+		}
+	}
+
 	handleDrawerOpen = () => {
 		this.props.onDrawerChange( true );
 	}
@@ -281,4 +291,4 @@ class MenuBar extends Component {
 
 // EXPORTS //
 
-export default MenuBar;
+export default withRouter( MenuBar );
