import React from 'react';
import { Divider, Drawer, List, Icon } from '@material-ui/core';
import { NavLink } from 'react-router-dom';
import classnames from 'classnames';
import PropTypes from 'prop-types';
import styles from './drawer.module.scss';
import { baseRoutes as routes } from './routes';
const filterByFlags = flags => r => {
if (r.flag && !flags[r.flag]) {
return false;
}
return true;
};
function getIcon(name) {
if (name === 'c_github') {
return ;
} else {
return {name};
}
}
function renderLink(link, toggleDrawer) {
if (link.path) {
return (
toggleDrawer()}
key={link.path}
to={link.path}
className={classnames(styles.navigationLink)}
activeClassName={classnames(styles.navigationLinkActive)}
>
{getIcon(link.icon)} {link.value}
);
} else {
return (
{getIcon(link.icon)} {link.value}
);
}
}
export const DrawerMenu = ({ links = [], title = 'Unleash', flags = {}, open = false, toggleDrawer }) => (
toggleDrawer()}>
{title}
{routes.filter(filterByFlags(flags)).map(item => (
toggleDrawer()}
key={item.path}
to={item.path}
className={classnames(styles.navigationLink)}
activeClassName={classnames(styles.navigationLinkActive)}
>
{getIcon(item.icon)}
{item.title}
))}
{links.map(l => renderLink(l, toggleDrawer))}
);
DrawerMenu.propTypes = {
links: PropTypes.array,
title: PropTypes.string,
flags: PropTypes.object,
open: PropTypes.bool,
toggleDrawer: PropTypes.func,
};