Как закрыть MenuItem при открытом диалоге

Question

Я открываю \ вызываю диалог из MenuItem.

Проблема в том, что меню останется открытым. Как я могу убедиться, что меню будет закрыто одновременно при нажатии на меню «О программе».

return (
    <div onMouseLeave={handlePopperClose}>
        <MuiThemeProvider theme={theme}>
            <MaterialLink
                underline="none"
                component="button"
                aria-owns={anchorEl ? 'help-over-popper' : undefined}
                onMouseEnter={handlePopperOpen}
                color="inherit">
                <Typography variant="h6" color="inherit" >Help</Typography>
            </MaterialLink>
        </MuiThemeProvider>
        <Popper
            id="help-over-popper"
            open={Boolean(anchorEl)}
            anchorEl={anchorEl}
            keepMounted={false}
            placement="bottom-start">
            <Zoom in={true}>
                <Paper>
                    <MenuList id="simple-menu">
                        <Divider />
                        <MenuItem onClick={handleClickOpen}>
                            <Typography variant="subtitle1" >About</Typography>
                        </MenuItem>
                    </MenuList>
                </Paper>
            </Zoom>
        </Popper>
        <Dialog
            id="mouse-over-dialog"
            open={open}
            TransitionComponent={Transition}
            onClose={handleClose}>
            <DialogTitle id="alert-dialog-slide-title">{"Application"}</DialogTitle>
            <DialogContent dividers>
                <Typography gutterBottom>
                    The system provides data visibility to the on-site team members in order to assist with daily tasks
                </Typography>
            </DialogContent>
            <DialogActions>
                <Button onClick={handleClose} autoFocus color="primary">Ok</Button>
            </DialogActions>
        </Dialog>
    </div >

Спасибо