51 lines
1.4 KiB
TypeScript
51 lines
1.4 KiB
TypeScript
import { useConfirm } from "@frontend-opensource/use-react-hooks";
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogFooter,
|
|
DialogClose,
|
|
Button,
|
|
type ButtonProps,
|
|
} from "@common/components";
|
|
|
|
type ConfirmDialogProps = {
|
|
isOpen?: boolean;
|
|
confirmButtonProps?: ButtonProps & { label?: string };
|
|
cancelButtonProps?: ButtonProps & { label?: string };
|
|
};
|
|
|
|
function ConfirmDialog({
|
|
isOpen,
|
|
confirmButtonProps,
|
|
cancelButtonProps,
|
|
}: ConfirmDialogProps) {
|
|
const { message, isOpen: isGlobalOpen, onConfirm, onCancel } = useConfirm();
|
|
return (
|
|
<Dialog open={isOpen ?? isGlobalOpen} onOpenChange={onCancel}>
|
|
<DialogContent aria-describedby={undefined}>
|
|
<div className="py-10">
|
|
<p className="whitespace-pre-line text-center text-[1.4rem] text-foreground">
|
|
{message}
|
|
</p>
|
|
</div>
|
|
<DialogFooter>
|
|
<div className="flex w-full justify-center gap-2">
|
|
<DialogClose asChild>
|
|
<Button onClick={onConfirm} {...confirmButtonProps}>
|
|
{confirmButtonProps?.label ?? "확인"}
|
|
</Button>
|
|
</DialogClose>
|
|
<DialogClose asChild>
|
|
<Button onClick={onCancel} color="white" {...cancelButtonProps}>
|
|
{cancelButtonProps?.label ?? "취소"}
|
|
</Button>
|
|
</DialogClose>
|
|
</div>
|
|
</DialogFooter>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|
|
|
|
export { ConfirmDialog };
|