const useStyles = makeStyles(theme => ({
    menuLink: theme.styles.menuLinkStyle,
}));

function DrawerContents() {
    const classes = useStyles();

    // noinspection JSUnresolvedVariable
    return (
        <div>
            <div className={classes.toolbar}>
                <Link to='/' className={classes.menuLink}> {/*<==== This*/}
                    <Toolbar className={classes.toolbarContent}>
                        <Typography variant="h6" noWrap>
                            {appConfig.projectTitle}
                        </Typography>
                    </Toolbar>
                </Link>
            </div>
            <Divider/>
            <List>
                <Link to={'/users'} className={classes.menuLink}> {/*<==== This*/}
                    <ListItem button>
                        <ListItemIcon className={`${classes.icon} ${classes.userIcon}`}>
                            <FontAwesomeIcon icon="user"/>
                        </ListItemIcon>
                        <ListItemText primary='Users'/>
                    </ListItem>
                </Link>
            </List>
        </div>
    );
}

export default DrawerContents;

const useStyles = makeStyles(theme => ({
    Link: theme.styles.menuLinkStyle,
}));