import React from 'react';
import { Modal, ModalBody, ModalHeader } from 'reactstrap';
import { useTranslations } from 'next-intl';
import ChangeEmailForm from './form/change-email-form';

type PropsType = {
    isOpen: boolean;
    toggle: any;
    className?: any;
    onSubmit: any;
    backdrop?: any;
}

const ChangeEmailModal = (props: PropsType) => {
    const {
        isOpen,
        toggle,
        className,
        onSubmit,
        backdrop
    } = props;
    const t = useTranslations("");

    return (
        <Modal isOpen={isOpen} toggle={toggle} className={className} backdrop={backdrop}>
            <ModalHeader toggle={toggle}>
                {t('title.changeEmail')}
            </ModalHeader>
            <ModalBody>
                <ChangeEmailForm onSubmit={onSubmit}/>
            </ModalBody>
        </Modal>
    );
};

export default ChangeEmailModal;