53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
|
import { t } from "../i18n";
|
||
|
|
import { Dialog, DialogProps } from "./Dialog";
|
||
|
|
import { ToolButton } from "./ToolButton";
|
||
|
|
|
||
|
|
import "./ConfirmDialog.scss";
|
||
|
|
|
||
|
|
interface Props extends Omit<DialogProps, "onCloseRequest"> {
|
||
|
|
onConfirm: () => void;
|
||
|
|
onCancel: () => void;
|
||
|
|
confirmText?: string;
|
||
|
|
cancelText?: string;
|
||
|
|
}
|
||
|
|
const ConfirmDialog = (props: Props) => {
|
||
|
|
const {
|
||
|
|
onConfirm,
|
||
|
|
onCancel,
|
||
|
|
children,
|
||
|
|
confirmText = t("buttons.confirm"),
|
||
|
|
cancelText = t("buttons.cancel"),
|
||
|
|
className = "",
|
||
|
|
...rest
|
||
|
|
} = props;
|
||
|
|
return (
|
||
|
|
<Dialog
|
||
|
|
onCloseRequest={onCancel}
|
||
|
|
small={true}
|
||
|
|
{...rest}
|
||
|
|
className={`confirm-dialog ${className}`}
|
||
|
|
>
|
||
|
|
{children}
|
||
|
|
<div className="confirm-dialog-buttons">
|
||
|
|
<ToolButton
|
||
|
|
type="button"
|
||
|
|
title={cancelText}
|
||
|
|
aria-label={cancelText}
|
||
|
|
label={cancelText}
|
||
|
|
onClick={onCancel}
|
||
|
|
className="confirm-dialog--cancel"
|
||
|
|
/>
|
||
|
|
<ToolButton
|
||
|
|
type="button"
|
||
|
|
title={confirmText}
|
||
|
|
aria-label={confirmText}
|
||
|
|
label={confirmText}
|
||
|
|
onClick={onConfirm}
|
||
|
|
className="confirm-dialog--confirm"
|
||
|
|
/>
|
||
|
|
</div>
|
||
|
|
</Dialog>
|
||
|
|
);
|
||
|
|
};
|
||
|
|
export default ConfirmDialog;
|