"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

exports.__esModule = true;
exports.VerifyEmailModal = void 0;

var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));

var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));

var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));

var _react = _interopRequireDefault(require("react"));

var _styledComponents = _interopRequireDefault(require("styled-components"));

var _reactHookForm = require("react-hook-form");

var _lib = require("@sentecacommerce-theme/lib");

var _Common = require("../../../../../Common");

var _templateObject, _templateObject2;

var VerifyEmailModal = function VerifyEmailModal(_ref) {
  var handleClose = _ref.handleClose;

  var _useChangeEmail = (0, _lib.useChangeEmail)({
    onSuccess: handleClose
  }),
      mutate = _useChangeEmail[0];

  var _usersApi$useGet = _lib.usersApi.useGet(),
      data = _usersApi$useGet.data,
      isLoading = _usersApi$useGet.isLoading;

  var _useGlobalLabels = (0, _lib.useGlobalLabels)(),
      forms = _useGlobalLabels.forms;

  var onSubmit = /*#__PURE__*/function () {
    var _ref3 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(_ref2) {
      var email;
      return _regenerator["default"].wrap(function _callee$(_context) {
        while (1) {
          switch (_context.prev = _context.next) {
            case 0:
              email = _ref2.email;
              mutate({
                email: email
              });

            case 2:
            case "end":
              return _context.stop();
          }
        }
      }, _callee);
    }));

    return function onSubmit(_x) {
      return _ref3.apply(this, arguments);
    };
  }();

  var _useForm = (0, _reactHookForm.useForm)({
    defaultValues: {
      email: ''
    },
    mode: 'onChange',
    reValidateMode: 'onChange'
  }),
      handleSubmit = _useForm.handleSubmit,
      errors = _useForm.errors,
      control = _useForm.control;

  var Inputs = /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(InputWrapper, null, /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
    control: control,
    name: "email",
    rules: {
      required: forms.requiredField,
      pattern: {
        value: /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i,
        message: forms.invalidEmail
      }
    },
    as: /*#__PURE__*/_react["default"].createElement(_Common.TextInput, {
      label: forms.emailLabel,
      id: "update-email-field",
      isRequired: true,
      errors: errors,
      name: "email"
    })
  })), /*#__PURE__*/_react["default"].createElement(ErrorContainer, null, /*#__PURE__*/_react["default"].createElement(_Common.FormError, {
    errors: errors,
    fieldName: "phone"
  })));

  return /*#__PURE__*/_react["default"].createElement(_Common.ModalForm, {
    handleClose: handleClose,
    title: forms.updateEmail,
    subtitle: forms.emailSecurityMsg,
    onSubmit: handleSubmit(onSubmit),
    Inputs: Inputs,
    buttonLabel: "Save",
    disableSubmit: isLoading
  });
};

exports.VerifyEmailModal = VerifyEmailModal;

var InputWrapper = _styledComponents["default"].div.attrs({
  className: 'mt-1 mb-2 pb-1'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])(["\n  position: relative;\n  display: flex;\n  align-items: center;\n"])));

var ErrorContainer = _styledComponents["default"].div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2["default"])(["\n  margin-top: -1.4rem;\n"])));
//# sourceMappingURL=index.js.map