Pass location to SidebarLink through Sidebar component

Author: kulgavy

src/components/Sidebar/SidebarContainer.js

@@ -1,12 +1,14 @@
 import { withTheme } from '@material-ui/core/styles';
 import { compose, withState, withHandlers, lifecycle }  from 'recompose';
 import { connect } from 'react-redux';
+import { withRouter } from "react-router-dom";
 
 import { toggleSidebar } from '../Layout/LayoutState';
 
 import SidebarView from './SidebarView';
 
 export default compose(
+  withRouter,
   withTheme(),
   connect(
     state => ({

src/components/Sidebar/SidebarView.js

@@ -48,7 +48,7 @@ const structure = [
   { id: 14, label: 'Background', link: '', icon: <Dot size="large" color="secondary" /> },
 ];
 
-const SidebarView = ({ classes, theme, toggleSidebar, isSidebarOpened, isPermanent }) => {
+const SidebarView = ({ classes, theme, toggleSidebar, isSidebarOpened, isPermanent, location }) => {
   return (
     <Drawer
       variant={isPermanent ? 'permanent' : 'temporary'}
@@ -73,7 +73,7 @@ const SidebarView = ({ classes, theme, toggleSidebar, isSidebarOpened, isPermane
         </IconButton>
       </div>
       <List className={classes.sidebarList}>
-        {structure.map(link => <SidebarLink key={link.id} isSidebarOpened={isSidebarOpened} {...link} />)}
+        {structure.map(link => <SidebarLink key={link.id} location={location} isSidebarOpened={isSidebarOpened} {...link} />)}
       </List>
     </Drawer>
   );

src/components/Sidebar/components/SidebarLink/SidebarLinkView.js

@@ -12,7 +12,6 @@ import {
 import { Link } from "react-router-dom";
 import classnames from "classnames";
 import { Inbox as InboxIcon } from "@material-ui/icons";
-import { withRouter } from "react-router-dom";
 
 import Dot from "../Dot";
 
@@ -29,6 +28,7 @@ const SidebarLink = ({
   isOpen,
   toggleCollapse
 }) => {
+
   const isLinkActive =
     link &&
     (location.pathname === link || location.pathname.indexOf(link) !== -1);
@@ -192,4 +192,4 @@ const styles = theme => ({
   }
 });
 
-export default withRouter(withStyles(styles, { withTheme: true })(SidebarLink));
+export default withStyles(styles, { withTheme: true })(SidebarLink);