The visibility of the dialog and the snackbar are controlled by Boolean state values, dialogOpen and snackbarOpen, respectively. The values of the fields within the dialog component are also stored in the state of the CollectingFormInput component. Let's take a closer look at the dialog markup:
<Dialog open={dialogOpen} onClose={onDialogClose}> <DialogTitle>New User</DialogTitle> <DialogContent> <TextField autoFocus margin="normal" label="First Name" InputProps={{ name: 'first' }} onChange={e => setFirst(e.target.value)} value={first} fullWidth /> <TextField margin="normal" label="Last Name" InputProps={{ name: 'last' }} onChange={e => setLast(e.target.value)} value={last} fullWidth /> <TextField margin="normal" label="Email ...
