Adjust confirmation dialog logic so closed dialogs can reopen (#1259)

This commit is contained in:
Trevor Bayless 2021-10-28 20:48:33 -05:00 committed by GitHub
parent d3140a9d1b
commit 84f8f3c5bc
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 28 deletions

View file

@ -10,6 +10,7 @@ export function Confirm({ show, message, onConfirm, onCancel, queryConfirmationD
}, [show]);
const handleClose = () => {
onCancel();
setShow(false);
};
@ -18,18 +19,13 @@ export function Confirm({ show, message, onConfirm, onCancel, queryConfirmationD
handleClose();
};
const handleCancel = () => {
onCancel();
handleClose();
};
return (
<>
<Modal show={showModal} onHide={handleClose} size="sm" centered={true}>
<div className="modal-status bg-danger"></div>
<Modal.Body>{message}</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={handleCancel}>
<Button variant="secondary" onClick={handleClose}>
Cancel
</Button>
<Button variant="primary" onClick={handleConfirm}>

View file

@ -256,6 +256,14 @@ class HomePage extends React.Component {
return this.canUserPerform(this.state.currentUser, 'delete', app);
};
cancelDeleteAppDialog = () => {
this.setState({
isDeletingApp: false,
appToBeDeleted: null,
showAppDeletionConfirmation: false,
});
};
executeAppDeletion = () => {
this.setState({ isDeletingApp: true });
appService
@ -266,11 +274,6 @@ class HomePage extends React.Component {
hideProgressBar: true,
position: 'top-center',
});
this.setState({
isDeletingApp: false,
appToBeDeleted: null,
showAppDeletionConfirmation: false,
});
this.fetchApps(this.state.currentPage || 1, this.state.currentFolder.id);
this.fetchFolders();
})
@ -279,12 +282,10 @@ class HomePage extends React.Component {
hideProgressBar: true,
position: 'top-center',
});
this.setState({
isDeletingApp: false,
appToBeDeleted: null,
showAppDeletionConfirmation: false,
});
console.log(error);
})
.finally(() => {
this.cancelDeleteAppDialog();
});
};
@ -310,7 +311,7 @@ class HomePage extends React.Component {
message={'The app and the associated data will be permanently deleted, do you want to continue?'}
confirmButtonLoading={isDeletingApp}
onConfirm={() => this.executeAppDeletion()}
onCancel={() => {}}
onCancel={() => this.cancelDeleteAppDialog()}
/>
<Header switchDarkMode={this.props.switchDarkMode} darkMode={this.props.darkMode} />
@ -454,11 +455,10 @@ class HomePage extends React.Component {
>
{
<span
className={`${
app?.current_version_id
? 'badge bg-blue-lt mx-2 '
: 'badge bg-light-grey mx-2'
}`}
className={`${app?.current_version_id
? 'badge bg-blue-lt mx-2 '
: 'badge bg-light-grey mx-2'
}`}
>
launch{' '}
</span>

View file

@ -10,6 +10,7 @@ export function ConfirmDialog({ show, message, onConfirm, onCancel, confirmButto
}, [show]);
const handleClose = () => {
onCancel();
setShow(false);
};
@ -17,18 +18,13 @@ export function ConfirmDialog({ show, message, onConfirm, onCancel, confirmButto
onConfirm();
};
const handleCancel = () => {
onCancel();
handleClose();
};
return (
<>
<Modal show={showModal} onHide={handleClose} size="sm" centered={true}>
<div className="modal-status bg-danger"></div>
<Modal.Body>{message}</Modal.Body>
<Modal.Footer>
<Button variant="secondary" onClick={handleCancel}>
<Button variant="secondary" onClick={handleClose}>
Cancel
</Button>
<Button