33 lines
949 B
TypeScript
33 lines
949 B
TypeScript
|
import React from 'react';
|
||
|
|
import Modal from '@/components/elements/Modal';
|
||
|
|
|
||
|
|
interface Props {
|
||
|
|
title: string;
|
||
|
|
buttonText: string;
|
||
|
|
children: string;
|
||
|
|
visible: boolean;
|
||
|
|
onConfirmed: () => void;
|
||
|
|
onCanceled: () => void;
|
||
|
|
}
|
||
|
|
|
||
|
|
const ConfirmationModal = ({ title, children, visible, buttonText, onConfirmed, onCanceled }: Props) => (
|
||
|
|
<Modal
|
||
|
|
appear={true}
|
||
|
|
visible={visible}
|
||
|
|
onDismissed={() => onCanceled()}
|
||
|
|
>
|
||
|
|
<h3 className={'mb-6'}>{title}</h3>
|
||
|
|
<p className={'text-sm'}>{children}</p>
|
||
|
|
<div className={'flex items-center justify-end mt-8'}>
|
||
|
|
<button className={'btn btn-secondary btn-sm'} onClick={() => onCanceled()}>
|
||
|
|
Cancel
|
||
|
|
</button>
|
||
|
|
<button className={'btn btn-red btn-sm ml-4'} onClick={() => onConfirmed()}>
|
||
|
|
{buttonText}
|
||
|
|
</button>
|
||
|
|
</div>
|
||
|
|
</Modal>
|
||
|
|
);
|
||
|
|
|
||
|
|
export default ConfirmationModal;
|