_x000D_
import React from 'react';_x000D_
import {withRouter, Link} from "react-router-dom";_x000D_
_x000D_
const SidenavItems = (props) => {_x000D_
// create simple list of links_x000D_
const items = [_x000D_
{_x000D_
type: "navItem",_x000D_
icon: "home",_x000D_
text: "Home",_x000D_
link: "/",_x000D_
restricted: false_x000D_
},_x000D_
{_x000D_
type: "navItem",_x000D_
icon: "user-circle",_x000D_
text: "My Profile",_x000D_
link: "/user",_x000D_
restricted: false_x000D_
},_x000D_
{_x000D_
type: "navItem",_x000D_
icon: "sign-in",_x000D_
text: "Login",_x000D_
link: "/login",_x000D_
restricted: false_x000D_
},_x000D_
];_x000D_
_x000D_
const element = (item, i) => { // create elements (Links)_x000D_
// check if this is a current link on browser_x000D_
let active = "";_x000D_
_x000D_
if (props.location.pathname === item.link) {_x000D_
active = "active";_x000D_
}_x000D_
_x000D_
return (_x000D_
<div key={i} className={item.type}>_x000D_
<Link_x000D_
to={item.link}_x000D_
className={active} // className will be set to "active" _x000D_
> // or ""_x000D_
{item.text}_x000D_
</Link>_x000D_
</div>_x000D_
)_x000D_
};_x000D_
_x000D_
const showItems = () => { // print elements_x000D_
return items.map((item, i) => {_x000D_
return element(item, i)_x000D_
})_x000D_
};_x000D_
_x000D_
return (_x000D_
<div>_x000D_
{showItems()} // print all the links we created in list_x000D_
</div>_x000D_
)_x000D_
};_x000D_
export default withRouter(SidenavItems);
_x000D_