import React from 'react';
import PropTypes from 'prop-types';
import { Alert, Button } from 'react-bootstrap';
import { Trans, withTranslation } from 'react-i18next';
import { T9n } from 'meteor-accounts-t9n';

const handleResendVerificationEmail = (emailAddress, t) => {
  Meteor.call('users.sendVerificationEmail', (error) => {
    if (error) {
      Bert.alert(T9n.get(`error.accounts.${error.reason}`), 'danger');
    } else {
      Bert.alert(t("checkVerificationEmail", {email: emailAddress}), 'success');
    }
  });
};

const ReSendEmail = ({ userId = '', emailAddress = '', emailVerified, t }) => (
  <div>
  {userId && !emailVerified ? <Alert className="verify-email text-center"><p><Trans i18nKey="verifyEmail" values={{ email: emailAddress }} /> <Button variant="link" onClick={() => handleResendVerificationEmail(emailAddress, t)} href="#"><Trans parent="span">Reenviar email de verificación</Trans></Button></p></Alert> : ''}
  </div>
);

ReSendEmail.propTypes = {
  loading: PropTypes.bool.isRequired,
  userId: PropTypes.string,
  emailAddress: PropTypes.string,
  emailVerified: PropTypes.bool.isRequired,
};

export default withTranslation()(ReSendEmail);