message: use NavItem component instead of NavLink
diff: import React from 'react';
  -import { List, ListSubheader } from 'material-ui';
  +import PropTypes from 'prop-types';
  +import { List } from 'material-ui';
  import { withRouter } from 'react-router-dom';
  -import NavLink from './NavLink';
  +import NavItem from './NavItem';
  -const NavigationMenu = () => (
  - <List component="nav">
  - <ListSubheader component="div"> Getting Started </ListSubheader>
  - <NavLink to="/installation"> Installation </NavLink>
  - <NavLink to="/usage"> Usage </NavLink>
  -
  - <ListSubheader component="div"> Localization </ListSubheader>
  -
  - <NavLink to="/localization/date-fns"> Using date-fns </NavLink>
  - <NavLink to="/localization/moment"> Using moment </NavLink>
  - <NavLink to="/localization/persian"> Persian Calendar System </NavLink>
  -
  - <ListSubheader component="div"> Components </ListSubheader>
  -
  - <NavLink to="/demo/datepicker"> Date Picker </NavLink>
  - <NavLink to="/demo/timepicker"> Time Picker </NavLink>
  - <NavLink to="/demo/datetimepicker"> Date & Time Picker </NavLink>
  +const navItems = [
  + {
  + title: 'Getting Started',
  + children: [
  + { title: 'Installation', href: '/installation' },
  + { title: 'Usage', href: '/usage' },
  + ],
  + },
  + {
  + title: 'Localization',
  + children: [
  + { title: 'Using date-fns', href: '/localization/date-fns' },
  + { title: 'Using moment', href: '/localization/moment' },
  + { title: 'Persian Calendar System', href: '/localization/persian' },
  + ],
  + },
  + {
  + title: 'Components',
  + children: [
  + { title: 'Date Picker', href: '/demo/datepicker' },
  + { title: 'Time Picker', href: '/demo/timepicker' },
  + { title: 'Date & Time Picker', href: '/demo/datetimepicker' },
  + ],
  + },
  + {
  + title: 'Guides',
  + children: [
  + { title: 'CSS overrides', href: '/guides/css-overrides' },
  + { title: 'Global format customization', href: '/guides/formats' },
  + ],
  + },
  +];
  - <ListSubheader component="div"> Guides </ListSubheader>
  -
  - <NavLink to="/guides/css-overrides"> CSS overrides </NavLink>
  - <NavLink to="/guides/formats"> Global format customization </NavLink>
  +class NavigationMenu extends React.Component {
  + mapNavigation(depth) {
  + return ({ title, children, href }) => {
  + const { location } = this.props;
  + const open = children && children.length > 0
  + ? children.some(item => item.href === location.pathname)
  + : false;
  + return (
  + <NavItem
  + key={href || title}
  + title={title}
  + depth={depth}
  + href={href}
  + open={open}
  + >
  + {children && children.length > 0 && children.map(this.mapNavigation(depth + 1))}
  + </NavItem>
  + );
  + };
  + }
  + render() {
  + return (
  + <List component="nav">
  + {navItems.map(this.mapNavigation(0))}
  </List>
  );
  + }
  +}
  +
  +NavigationMenu.propTypes = {
  + location: PropTypes.object.isRequired,
  +};
  export default withRouter(NavigationMenu);
  