import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
import React, { Fragment, useState, useEffect } from "react";
import { Typography, TextField, Button } from "@material-ui/core";
import { makeStyles } from "@material-ui/core/styles";
import { useAuth } from "../../utils/auth-handlers/use-auth.js";
import { useTranslation } from "react-i18next";
var useStyles = makeStyles(function (theme) {
  return {
    form: {
      width: "100%",
      marginTop: theme.spacing(1)
    },
    submit: {
      margin: theme.spacing(3, 0, 2)
    }
  };
});
export default (function () {
  var _useAuth = useAuth(),
      user = _useAuth.user,
      completeSignUp = _useAuth.completeSignUp,
      error = _useAuth.error,
      handlerErrorVersion = _useAuth.handlerErrorVersion,
      passwordValidator = _useAuth.passwordValidator;

  var requiredAttributesDict = {};
  var requiredAttributesErrorDict = {};
  user.challengeParam.requiredAttributes.forEach(function (requiredAttribute) {
    requiredAttributesDict[requiredAttribute] = "";
    requiredAttributesErrorDict[requiredAttribute] = false;
  });

  var _useState = useState({
    newPassword: "",
    newPasswordNotValid: false,
    newPasswordConfirmation: "",
    newPasswordNotEqualsConfirmation: false,
    requiredAttributesDict: requiredAttributesDict,
    requiredAttributesErrorDict: requiredAttributesErrorDict
  }),
      _useState2 = _slicedToArray(_useState, 2),
      state = _useState2[0],
      setState = _useState2[1];

  var _useState3 = useState(null),
      _useState4 = _slicedToArray(_useState3, 2),
      passwordValidation = _useState4[0],
      setPasswordValidation = _useState4[1];

  var classes = useStyles();
  useEffect(function () {
    if (error === "InvalidPasswordException") {
      setState(function (prevState) {
        return _objectSpread(_objectSpread({}, prevState), {}, {
          newPasswordNotValid: true,
          newPasswordError: "Password does not conform to policy"
        });
      });
    }
  }, [handlerErrorVersion, error, setState]);

  var capitalizeFirstLetter = function capitalizeFirstLetter(string) {
    return string.charAt(0).toUpperCase() + string.slice(1);
  };

  var handleCompleteSignUpClick = function handleCompleteSignUpClick() {
    if (checkIfPasswordEqualsConfirmationPassword() && _handleCantBeNull("checkAll")) {
      completeSignUp(state.newPassword, state.requiredAttributesDict);
    }
  };

  var _handleAttributesTextFieldChange = function _handleAttributesTextFieldChange(event) {
    setState(_objectSpread(_objectSpread({}, state), {}, {
      requiredAttributesDict: _objectSpread(_objectSpread({}, state.requiredAttributesDict), {}, _defineProperty({}, event.target.name, event.target.value))
    }));
  };

  var _handleTextFieldChange = function _handleTextFieldChange(event) {
    setState(_objectSpread(_objectSpread({}, state), {}, _defineProperty({
      newPasswordError: null,
      newPasswordNotValid: false,
      newPasswordNotEqualsConfirmation: false
    }, event.target.name, event.target.value)));

    if (event.target.name === "newPassword") {
      setPasswordValidation(passwordValidator(event.target.value));
    }
  };

  var checkIfPasswordEqualsConfirmationPassword = function checkIfPasswordEqualsConfirmationPassword() {
    if (state.newPassword === state.newPasswordConfirmation) {
      setState(_objectSpread(_objectSpread({}, state), {}, {
        newPasswordNotEqualsConfirmation: false
      }));
      return true;
    } else {
      setState(_objectSpread(_objectSpread({}, state), {}, {
        newPasswordNotEqualsConfirmation: true
      }));
      return false;
    }
  };

  var _handleCantBeNull = function _handleCantBeNull(e) {
    var allGood = true;

    if (e === "checkAll") {
      user.challengeParam.requiredAttributes.forEach(function (requiredAttribute) {
        if (state.requiredAttributesDict[requiredAttribute] === "") {
          setState(_objectSpread(_objectSpread({}, state), {}, {
            requiredAttributesErrorDict: _objectSpread(_objectSpread({}, state.requiredAttributesErrorDict), {}, _defineProperty({}, requiredAttribute, true))
          }));
          allGood = false;
        }
      });
    } else {
      if (e.target.value === "") {
        setState(_objectSpread(_objectSpread({}, state), {}, {
          requiredAttributesErrorDict: _objectSpread(_objectSpread({}, state.requiredAttributesErrorDict), {}, _defineProperty({}, e.target.name, true))
        }));
      } else {
        setState(_objectSpread(_objectSpread({}, state), {}, {
          requiredAttributesErrorDict: _objectSpread(_objectSpread({}, state.requiredAttributesErrorDict), {}, _defineProperty({}, e.target.name, false))
        }));
      }
    }

    return allGood;
  };

  var _useTranslation = useTranslation(),
      t = _useTranslation.t;

  return /*#__PURE__*/React.createElement(Fragment, null, /*#__PURE__*/React.createElement(Typography, {
    component: "h1",
    variant: "h5"
  }, t("complete-your-sign-up")), /*#__PURE__*/React.createElement("form", {
    className: classes.form,
    noValidate: true
  }, /*#__PURE__*/React.createElement(TextField, {
    error: state.newPasswordNotValid,
    variant: "outlined",
    margin: "normal",
    required: true,
    fullWidth: true,
    name: "newPassword",
    label: "New password",
    type: "password",
    id: "password",
    value: state.newPassword,
    onChange: _handleTextFieldChange,
    helperText: state.newPasswordError || ""
  }), Boolean(passwordValidation) && passwordValidation.validationsMessages.map(function (message) {
    if (message.isValid) {
      return /*#__PURE__*/React.createElement("div", {
        style: {
          color: "#19BF00"
        },
        key: message.key
      }, "\u2713 ", message.message);
    } else {
      return /*#__PURE__*/React.createElement("div", {
        style: {
          color: "#DF3312"
        },
        key: message.key
      }, "\u2716 ", message.message);
    }
  }), /*#__PURE__*/React.createElement(TextField, {
    error: state.newPasswordNotEqualsConfirmation,
    variant: "outlined",
    margin: "normal",
    required: true,
    fullWidth: true,
    name: "newPasswordConfirmation",
    label: "Confirm new password",
    type: "password",
    id: "confirm-password",
    onChange: _handleTextFieldChange,
    value: state.newPasswordConfirmation,
    onBlur: checkIfPasswordEqualsConfirmationPassword,
    helperText: state.newPasswordNotEqualsConfirmation ? "New password and confirmation password must be the same" : ""
  }), user.challengeParam.requiredAttributes.map(function (requiredAttribute) {
    return /*#__PURE__*/React.createElement(TextField, {
      error: state.requiredAttributesErrorDict[requiredAttribute],
      variant: "outlined",
      margin: "normal",
      required: true,
      fullWidth: true,
      name: requiredAttribute.toString(),
      key: requiredAttribute.toString(),
      label: capitalizeFirstLetter(requiredAttribute.toString()),
      type: "text",
      id: requiredAttribute.toString(),
      onChange: _handleAttributesTextFieldChange,
      value: state.requiredAttributesDict.requiredAttribute,
      onBlur: _handleCantBeNull,
      helperText: state.requiredAttributesErrorDict[requiredAttribute] ? "".concat(capitalizeFirstLetter(requiredAttribute.toString()), " can't be empty") : ""
    });
  }), /*#__PURE__*/React.createElement(Button, {
    onClick: handleCompleteSignUpClick,
    fullWidth: true,
    variant: "contained",
    color: "primary",
    className: classes.submit
  }, t("complete-sign-up"))));
});