import { Alert as b } from "./accelbyte-widgets123.mjs";
import { Button as g } from "./accelbyte-widgets107.mjs";
import { FormGroupError as s, FormGroup as f } from "./accelbyte-widgets263.mjs";
import { InputGroup as v } from "./accelbyte-widgets229.mjs";
import { PasswordConstraint as L } from "./accelbyte-widgets265.mjs";
import { t as K } from "./accelbyte-widgets58.mjs";
import { InputValidationHelper as h, ValidateableInputField as y } from "@accelbyte/sdk-iam";
import e from "react";
import { Trans as i } from "react-i18next";
import w from "validator/lib/isEmpty.js";
import "./accelbyte-widgets338.mjs";
import { MAX_SHORT_TEXT_LENGTH as S } from "./accelbyte-widgets339.mjs";
import { ValidateEmailErrorType as d } from "./accelbyte-widgets340.mjs";
import { CommonValidationErrorType as T } from "./accelbyte-widgets341.mjs";
import { validateAlphanumeric as x, ValidateAlphaNumericErrorType as C } from "./accelbyte-widgets293.mjs";
import { Validation as A } from "./accelbyte-widgets269.mjs";
class J extends e.Component {
  constructor(n) {
    super(n), this.onVerificationCodeChange = (t) => {
      t.preventDefault();
      const { isPasteVerificationCode: o } = this.state, a = t.target.value.toString().toUpperCase(), l = o ? a.replace(/\s/g, "") : a;
      this.validation.set("verificationCode", x(l)), this.setState({ verificationCode: l, isPasteVerificationCode: !1 });
    }, this.onNewEmailChange = (t) => {
      const o = t.target.value.toString().toLocaleLowerCase(), { validations: a } = this.props.inputValidationManager.state;
      this.validation.set("newEmail", h.validateEmail(o, a)), this.setState({ inputEmail: t.target.value });
    }, this.onPasteVerificationCode = () => {
      this.setState({
        isPasteVerificationCode: !0
      });
    }, this.state = {
      verificationCode: "",
      inputEmail: "",
      isPasteVerificationCode: !1
    }, this.validation = new A(), this.validation.listen(() => this.setState({}));
  }
  renderVerificationCodeError(n) {
    if (!n)
      return null;
    const t = {
      [C.enum.empty]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.verifyCodeError.empty" }, "You must enter your verification code"),
      [C.enum.exceedLengthLimit]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.verifyCodeError.ExceedLimit" }, "The verification code must not exceed ", { MAX_SHORT_TEXT_LENGTH: S }, " characters"),
      [C.enum.invalidFormat]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.verifyCodeError.invalidFormat" }, "The verification code must be alphanumeric and cannot include spaces")
    };
    return /* @__PURE__ */ e.createElement(s, null, t[n]);
  }
  renderNewEmailError(n) {
    const { oldEmail: t, newEmail: o, emailVerified: a } = this.props, { inputEmail: l } = this.state, { validations: c } = this.props.inputValidationManager.state, r = h.getValidationByKey(y.enum.email, c);
    if (!a && l === o)
      return /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.sameAsEarlier" }, "You entered the email that you just set earlier. Please enter a different email."));
    if (l === t)
      return /* @__PURE__ */ e.createElement(s, null, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.sameAsOldPassword" }, "Your new email address cannot be the same as your old email address"));
    if (!n)
      return null;
    const E = {
      [d.enum.empty]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.empty" }, "Sorry, you must enter a new email address"),
      [d.enum.lessThanLengthLimit]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.lessThanLengthLimit" }, "Your email address must contain at least ", { MIN_EMAIL_LENGTH: r == null ? void 0 : r.minLength }, " characters"),
      [d.enum.exceedLengthLimit]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.ExceedLimit" }, "Your email address must not exceed ", { MAX_EMAIL_LENGTH: r == null ? void 0 : r.maxLength }, " characters"),
      [d.enum.invalidFormat]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.InvalidFormat" }, "Please enter a valid email address, e.g. someone@example.com"),
      [T.enum.containsForbiddenWords]: /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.newEmailForm.newEmailError.containsForbiddenWords" }, "Email contains prohibited word or use blocked domain")
    };
    return /* @__PURE__ */ e.createElement(s, null, E[n]);
  }
  render() {
    const {
      email: n,
      isRequestingCode: t,
      onResendCode: o,
      alert: a,
      onDismissAlert: l,
      onUpdateEmail: c,
      isUpdatingEmail: r,
      isFromEmailVerification: E,
      onCancel: p,
      oldEmail: P,
      newEmail: V
    } = this.props, { verificationCode: u, inputEmail: m } = this.state, F = !this.validation.isAllValid() || w(u) || w(m) || r || m === P || m === V, { validations: N } = this.props.inputValidationManager.state;
    return /* @__PURE__ */ e.createElement("div", { className: "verifyCodeForm" }, /* @__PURE__ */ e.createElement("h1", { className: "title" }, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.title" }, "Change email address")), !!a && /* @__PURE__ */ e.createElement(b, { type: a.type, onDismiss: l }, a.element), /* @__PURE__ */ e.createElement("div", { className: "description" }, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.description" }, "Please enter the verification code sent to ", { email: n })), /* @__PURE__ */ e.createElement(f, null, /* @__PURE__ */ e.createElement(
      v,
      {
        value: u,
        placeholder: K("ChangeEmailPage.verifyCodeForm.verificationCodePlaceholder"),
        onChange: this.onVerificationCodeChange,
        onPaste: this.onPasteVerificationCode
      }
    ), this.renderVerificationCodeError(this.validation.get("verificationCode"))), /* @__PURE__ */ e.createElement("div", { className: "description" }, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.sendVerificationCode.didntReceiveEmail" }, "Didn't receive the email?"), t && /* @__PURE__ */ e.createElement("span", null, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.sendVerificationCode.requesting" }, "Requesting...")), !t && /* @__PURE__ */ e.createElement("span", { onClick: () => o() }, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.sendVerificationCode.click" }, " Click here to resend"))), /* @__PURE__ */ e.createElement("div", { className: "description" }, /* @__PURE__ */ e.createElement(i, { i18nKey: "ChangeEmailPage.verifyCodeForm.newEmail.label" }, "Set a new email address")), /* @__PURE__ */ e.createElement(f, null, /* @__PURE__ */ e.createElement(
      v,
      {
        value: m,
        placeholder: "user@example.com",
        onChange: this.onNewEmailChange,
        popoverContent: /* @__PURE__ */ e.createElement(
          L,
          {
            descriptions: h.getValidationDescription(y.enum.email, N)
          }
        )
      }
    ), this.renderNewEmailError(this.validation.get("newEmail"))), /* @__PURE__ */ e.createElement("div", { className: "btnContainer" }, /* @__PURE__ */ e.createElement(
      g,
      {
        loadingIndicator: "SPINNER",
        disabled: F,
        className: "btn big btn-primary btnSubmit",
        onClick: () => {
          c(u, m);
        },
        isLoading: r
      },
      /* @__PURE__ */ e.createElement(i, { i18nKey: "EmailVerificationPage.continueButton" }, "CONTINUE")
    ), E && /* @__PURE__ */ e.createElement(g, { className: "btn big btnCancel", onClick: () => p && p() }, /* @__PURE__ */ e.createElement(i, { i18nKey: "NewEmailVerificationPage.cancelButton" }, "Cancel"))));
  }
}
export {
  J as VerifyCodeForm
};
