Function UpdateClientDialog

ui/src/client/UpdateClientDialog.tsx:17–62

({fClose, fOnSubmit, initialName = ''}: IProps)

}

const UpdateClientDialog = ({fClose, fOnSubmit, initialName = ''}: IProps) => {
    const [name, setName] = useState(initialName);

    const submitEnabled = name.length !== 0;
    const submitAndClose = async () => {
        await fOnSubmit(name);
        fClose();
    };

    return (
        <Dialog open={true} onClose={fClose} aria-labelledby="form-dialog-title" id="client-dialog">
            <DialogTitle id="form-dialog-title">Update a Client</DialogTitle>
            <DialogContent>
                <DialogContentText>
                    A client manages messages, clients, applications and users (with admin
                    permissions).
                </DialogContentText>
                <TextField
                    autoFocus
                    margin="dense"
                    className="name"
                    label="Name *"
                    type="text"
                    value={name}
                    onChange={(e) => setName(e.target.value)}
                    fullWidth
                />
            </DialogContent>
            <DialogActions>
                <Button onClick={fClose}>Cancel</Button>
                <Tooltip title={submitEnabled ? '' : 'name is required'}>
                    <div>
                        <Button
                            className="update"
                            disabled={!submitEnabled}
                            onClick={submitAndClose}
                            color="primary"
                            variant="contained">
                            Update
                        </Button>
                    </div>
                </Tooltip>
            </DialogActions>
        </Dialog>
    );
};

export default UpdateClientDialog;