feat: add a confirm dialog before stopping the backup
Some checks failed
Release Workflow / determine-release-type (push) Has been cancelled
Release Workflow / checks (push) Has been cancelled
Release Workflow / e2e-tests (push) Has been cancelled
Release Workflow / build-images (push) Has been cancelled
Release Workflow / publish-release (push) Has been cancelled
Some checks failed
Release Workflow / determine-release-type (push) Has been cancelled
Release Workflow / checks (push) Has been cancelled
Release Workflow / e2e-tests (push) Has been cancelled
Release Workflow / build-images (push) Has been cancelled
Release Workflow / publish-release (push) Has been cancelled
This commit is contained in:
parent
1166fcb3e7
commit
4c0e2f520f
1 changed files with 33 additions and 1 deletions
|
|
@ -35,6 +35,7 @@ export const ScheduleSummary = (props: Props) => {
|
|||
props;
|
||||
const [showDeleteConfirm, setShowDeleteConfirm] = useState(false);
|
||||
const [showForgetConfirm, setShowForgetConfirm] = useState(false);
|
||||
const [showStopConfirm, setShowStopConfirm] = useState(false);
|
||||
|
||||
const runForget = useMutation({
|
||||
...runForgetMutation(),
|
||||
|
|
@ -78,6 +79,12 @@ export const ScheduleSummary = (props: Props) => {
|
|||
runForget.mutate({ path: { scheduleId: schedule.id.toString() } });
|
||||
};
|
||||
|
||||
const handleConfirmStop = () => {
|
||||
setShowStopConfirm(false);
|
||||
if (schedule.lastBackupStatus !== "in_progress") return;
|
||||
handleStopBackup();
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="space-y-4">
|
||||
<Card>
|
||||
|
|
@ -108,7 +115,12 @@ export const ScheduleSummary = (props: Props) => {
|
|||
</div>
|
||||
<div className="flex flex-col @lg:flex-row gap-2">
|
||||
{schedule.lastBackupStatus === "in_progress" ? (
|
||||
<Button variant="destructive" size="sm" onClick={handleStopBackup} className="w-full @md:w-auto">
|
||||
<Button
|
||||
variant="destructive"
|
||||
size="sm"
|
||||
onClick={() => setShowStopConfirm(true)}
|
||||
className="w-full @md:w-auto"
|
||||
>
|
||||
<Square className="h-4 w-4 mr-2" />
|
||||
<span>Stop backup</span>
|
||||
</Button>
|
||||
|
|
@ -239,6 +251,26 @@ export const ScheduleSummary = (props: Props) => {
|
|||
</div>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
|
||||
<AlertDialog open={showStopConfirm} onOpenChange={setShowStopConfirm}>
|
||||
<AlertDialogContent>
|
||||
<AlertDialogHeader>
|
||||
<AlertDialogTitle>Stop running backup?</AlertDialogTitle>
|
||||
<AlertDialogDescription>
|
||||
Are you sure you want to stop the current backup for <strong>{schedule.name}</strong>?
|
||||
</AlertDialogDescription>
|
||||
</AlertDialogHeader>
|
||||
<div className="flex gap-3 justify-end">
|
||||
<AlertDialogCancel>Cancel</AlertDialogCancel>
|
||||
<AlertDialogAction
|
||||
onClick={handleConfirmStop}
|
||||
className="bg-destructive text-destructive-foreground hover:bg-destructive/90"
|
||||
>
|
||||
Stop backup
|
||||
</AlertDialogAction>
|
||||
</div>
|
||||
</AlertDialogContent>
|
||||
</AlertDialog>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
|
|
|||
Loading…
Reference in a new issue