React.js - Drawer covers page conent - reactjs

Question

I decided to implement Drawer component to my react project from material-ui library, like so:
class RightDrawer extends React.Component {
state = {
open: false,
};
handleDrawerOpen = () => {
this.setState({ open: true });
};
handleDrawerClose = () => {
this.setState({ open: false });
};
render() {
const { classes, children, theme } = this.props;
return (
<div className={classes.root}>
<AppBar
position="absolute"
className={classNames(classes.appBar, this.state.open && classes.appBarShift)}
>
<Toolbar disableGutters={!this.state.open}>
<IconButton
color="inherit"
aria-label="Open drawer"
onClick={this.handleDrawerOpen}
className={classNames(classes.menuButton, this.state.open && classes.hide)}
>
<MenuIcon />
</IconButton>
<Typography variant="title" color="inherit" noWrap>
Mini variant drawer
</Typography>
</Toolbar>
</AppBar>
<Drawer
variant="permanent"
classes={{
paper: classNames(classes.drawerPaper, !this.state.open && classes.drawerPaperClose),
}}
open={this.state.open}
>
<div className={classes.toolbar}>
<IconButton onClick={this.handleDrawerClose}>
{theme.direction === 'rtl' ? <ChevronRightIcon /> : <ChevronLeftIcon />}
</IconButton>
</div>
<Divider />
<List>{mailFolderListItems}</List>
</Drawer>
<main className={classes.content}>
<div className={classes.toolbar} />
{children}
</main>
</div>
);
}
}
RightDrawer.propTypes = {
classes: PropTypes.object.isRequired,
theme: PropTypes.object.isRequired,
};
export default withStyles(styles, { withTheme: true })(RightDrawer);
So I am wrapping all my components in RightDrawer component and simply inject them via {children}.
Final result is:
So it is cropped to like 1/3 of a page and when the table is filled:
Should I insert Drawer directly to App.js rather than wrapping every component inside? Maybe it is cause by className={classes.root} ?

Answer 1

The question description and code that you provide is not enough to answer this question.
As I found so far, If you want to have a full height drawer you might add height to your root class.
For example:
root: {
height: '100vh',
}