import  './Modal.css';

const Modal = ({onCancel, onDelete}: any) => {
  return (
    <div className="modal-overlay">
        <div className='modal-content'>
                 <h3>Delete Todo?</h3>
                 <p className='content'>Are you sure you want to delete this task? This action cannot be undone.</p>
                 <div className='action-btn'>
                        <button className='action-btn__cancel' onClick={onCancel}>Cancel</button>
                        <button className='action-btn__delete' onClick={onDelete}>Delete</button>
                 </div>
        </div>
    </div>
  )
}

export default Modal