ciao!

io ho questo componente:
codice:
export default function DialogBook() {
    const [open, setOpen] = React.useState(false);

    function handleClickOpen() {
        setOpen(true);
    }

    function handleClose() {
        setOpen(false);
    }

    return (
        <div>
            <Dialog open={open} onClose={handleClose} aria-labelledby="form-dialog-title">
                <DialogTitle id="form-dialog-title">Subscribe</DialogTitle>
                <DialogContent>
                    <DialogContentText>
                        Aggiungi
                    </DialogContentText>
                    <TextField
autoFocus
                        margin="dense"
id="name"
label="Email Address"
type="email"
fullWidth
/>
                </DialogContent>
                <DialogActions>
                    <Button onClick={handleClose} color="primary">
                        Cancel
                    </Button>
                    <Button onClick={handleClose} color="primary">
                        Subscribe
                    </Button>
                </DialogActions>
            </Dialog>
        </div>
    );
}
come so può evincere rappresenta una finestra di dialogo modale.
ora, dal componente principale devo richiamare questo componente e visualizzarlo.
in pratica dovrei richiamare handleClickOpen:
codice:
import DialogBook from "./dialog_book";

onClick: (event) => ......
una dritta???