Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | 1x 1x 1x 1x | import { useTranslation } from "i18n";
import React, { ReactElement, useState } from "react";
import Button from "./Button";
import {
Dialog,
DialogActions,
DialogContent,
DialogContentText,
DialogTitle,
} from "./Dialog";
interface ConfirmationDialogWrapperProps {
children: (setIsOpen: (value: boolean) => void) => ReactElement;
title: string;
message: string;
confirmButtonLabel?: string;
onConfirm: () => void;
}
export default function ConfirmationDialogWrapper({
children,
title,
message,
confirmButtonLabel,
onConfirm,
}: ConfirmationDialogWrapperProps) {
const { t } = useTranslation();
const [isOpen, setIsOpen] = useState(false);
const ariaLabel = `${title.replace(/\s+/g, "")}-confirmation-dialog`;
const handleConfirm = () => {
onConfirm();
setIsOpen(false);
};
return (
<>
{children(setIsOpen)}
<Dialog aria-labelledby={ariaLabel} open={isOpen}>
<DialogTitle id={ariaLabel}>{title}</DialogTitle>
<DialogContent>
<DialogContentText>{message}</DialogContentText>
</DialogContent>
<DialogActions>
<Button onClick={handleConfirm}>
{confirmButtonLabel ? confirmButtonLabel : t("confirm")}
</Button>
<Button onClick={() => setIsOpen(false)}>{t("cancel")}</Button>
</DialogActions>
</Dialog>
</>
);
}
|