"use strict";

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

exports.__esModule = true;
exports.UpdatePasswordModal = 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 _reactHookForm = require("react-hook-form");

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

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

var _ModalForm = require("../../../../../Common/ModalForm");

var _TextInput = require("../../../../../Common/TextInput");

var _templateObject;

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

  // TODO: error handling
  var _useGlobalLabels = (0, _lib.useGlobalLabels)(),
      forms = _useGlobalLabels.forms;

  var _profileApi$useChange = _lib.profileApi.useChangePassword({
    onSuccess: handleClose
  }),
      mutate = _profileApi$useChange[0],
      _profileApi$useChange2 = _profileApi$useChange[1],
      isLoading = _profileApi$useChange2.isLoading,
      isError = _profileApi$useChange2.isError;

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

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

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

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

  var currentPassword = (0, _reactHookForm.useWatch)({
    control: control,
    name: 'currentPassword',
    defaultValue: ''
  });
  var newPassword = (0, _reactHookForm.useWatch)({
    control: control,
    name: 'newPassword',
    defaultValue: ''
  });

  var validatePasswordMatch = function validatePasswordMatch(passwordConfirm) {
    return passwordConfirm === newPassword ? undefined : forms.passwordNotMatching;
  };

  var validateNewPassword = function validateNewPassword(newPassword) {
    return newPassword === currentPassword ? forms.newDiffererntPassword : undefined;
  };

  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: "currentPassword",
    rules: {
      required: forms.requiredField
    },
    as: /*#__PURE__*/_react["default"].createElement(_TextInput.TextInput, {
      label: forms.currentPassword,
      id: "update-password-current",
      type: "password",
      isRequired: true,
      errors: errors,
      name: "newPasswordConfirm"
    })
  }), /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
    control: control,
    name: "newPassword",
    rules: {
      required: forms.requiredField,
      minLength: {
        value: 8,
        message: forms.passwordLength
      },
      validate: validateNewPassword
    },
    as: /*#__PURE__*/_react["default"].createElement(_TextInput.TextInput, {
      label: forms.newDiffererntPassword,
      id: "update-password-new",
      type: "password",
      isRequired: true,
      errors: errors,
      name: "newPasswordConfirm"
    })
  }), /*#__PURE__*/_react["default"].createElement(_reactHookForm.Controller, {
    control: control,
    name: "newPasswordConfirm",
    rules: {
      required: forms.requiredField,
      minLength: {
        value: 8,
        message: forms.passwordLength
      },
      validate: validatePasswordMatch
    },
    as: /*#__PURE__*/_react["default"].createElement(_TextInput.TextInput, {
      label: forms.passwordConfirm,
      id: "update-password-confirm",
      type: "password",
      isRequired: true,
      errors: errors,
      name: "newPasswordConfirm"
    })
  })));

  return /*#__PURE__*/_react["default"].createElement(_ModalForm.ModalForm, {
    handleClose: handleClose,
    title: forms.editPassword,
    onSubmit: handleSubmit(onSubmit),
    Inputs: Inputs,
    error: isError ? forms.invalidPassword : undefined,
    disableSubmit: isLoading || isError
  });
};

exports.UpdatePasswordModal = UpdatePasswordModal;

var InputWrapper = _styledComponents["default"].div.attrs({
  className: 'mt-1 mb-2 pb-1'
})(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2["default"])([""])));
//# sourceMappingURL=index.js.map