import { t as s, T as c, f as k, j as C, b7 as r, v as g, h as m, y as f, i as b, H as w, Q as v, a as F, k as P, l as S, b8 as D, b9 as _, ba as y, m as h } from "./index-162fd1aa.mjs";
import { A as L, B as M, E as N } from "./EmailIcon-753583e6.mjs";
import e from "react";
import { C as T } from "./Checkbox-5e314906.mjs";
import { O as x } from "./index-eaa2885c.mjs";
import "./dateFns-2367ee5b.mjs";
import "./validator-61879ab7.mjs";
import "./reactPlayer-2f69f369.mjs";
import "react-router-dom";
import "./reactSlick-cb4a2d39.mjs";
class I extends e.Component {
  constructor(n) {
    super(n), this.onCodeChange = (t) => {
      this.setState({ code: t });
    }, this.onRememberDeviceChange = () => {
      this.setState((t) => ({
        rememberDevice: !t.rememberDevice
      }));
    }, this.submit = () => {
      const { factor: t } = this.props, { code: a, rememberDevice: o } = this.state;
      this.props.onSubmit({ code: a, factor: t, rememberDevice: o });
    }, this.onKeyDown = (t) => {
      t.key !== "Enter" || this.state.code.length < this.props.codeLength || this.submit();
    }, this.state = {
      code: "",
      rememberDevice: !0
    };
  }
  componentDidMount() {
    window.addEventListener("keydown", this.onKeyDown);
  }
  componentWillUnmount() {
    window.removeEventListener("keydown", this.onKeyDown);
  }
  render() {
    const { codeLength: n, isSubmitting: t, onTryAnother: a, helperText: o } = this.props, { code: l, rememberDevice: p } = this.state;
    return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement(
      x,
      {
        value: l,
        onChange: this.onCodeChange,
        numInputs: n,
        className: "otpInput",
        containerStyle: "otpInputContainer",
        focusStyle: "otpInput__focus",
        shouldAutoFocus: !0,
        isDisabled: t
      }
    ), o, /* @__PURE__ */ e.createElement("div", { className: "rememberDeviceContainer" }, /* @__PURE__ */ e.createElement(T, { isChecked: p, onChange: this.onRememberDeviceChange, label: s("twoFAPage.checkbox.rememberDevice") }), !!a && /* @__PURE__ */ e.createElement("span", { className: "tryAnother", onClick: a }, /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.tryAnother" }, "Try another way"))), /* @__PURE__ */ e.createElement(
      k,
      {
        loadingIndicator: "SPINNER",
        className: "continueButton btn btn-primary",
        onClick: this.submit,
        disabled: l.length < n,
        isLoading: t
      },
      s("UpgradeHeadlessAccountPage.UpgradeHeadlessAccountPage.continue")
    ));
  }
}
const E = (i) => {
  const { icon: n, description: t, onClick: a } = i;
  return /* @__PURE__ */ e.createElement("div", { className: "methodOption", onClick: a }, n, /* @__PURE__ */ e.createElement("p", null, t));
}, u = (i) => {
  const { title: n, alert: t, withAlert: a, description: o, children: l, onDismissAlert: p } = i;
  return /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "titleWrapper" }, /* @__PURE__ */ e.createElement("p", { className: "title" }, n), !!t && a && /* @__PURE__ */ e.createElement(C, { type: t.type, onDismiss: p, className: "text-left" }, t.element), /* @__PURE__ */ e.createElement("p", { className: "description" }, o)), l);
}, A = "mfaPage", K = 6, O = 8, R = 6, d = h.enum(["invalid_code", "invalid_factor", "invalid_mfa_token", "code_expired"]), H = h.object({
  error: h.string(),
  error_description: h.string()
}), U = (i) => {
  var n;
  try {
    if (f.isAxiosError(i))
      switch (H.parse((n = i == null ? void 0 : i.response) == null ? void 0 : n.data).error) {
        case d.Enum.invalid_code:
          return /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.error.invalidCode" }, "Sorry, the code you entered is invalid. Please try again.");
        case d.Enum.code_expired:
          return /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.error.codeExpired" }, "Sorry, the code you entered is expired. Please try again.");
        case d.Enum.invalid_factor:
        case d.Enum.invalid_mfa_token:
          return /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.error.invalidFactor" }, "Failed to complete the request. Please click the back to login button below, and try logging in again.");
      }
    throw i;
  } catch {
    return /* @__PURE__ */ e.createElement(b, { error: i });
  }
};
class V extends e.Component {
  constructor(n) {
    super(n), this.changePage = (t) => {
      this.setState({ page: t }), sessionStorage.setItem(A, t);
    }, this.onTryAnother = () => {
      this.changePage(r.enum.options), this.setState({ alert: null });
    }, this.dismissAlert = () => {
      this.setState({ alert: null });
    }, this.submitCode = async (t) => {
      if (!this.state.isLoading)
        try {
          this.setState({ isLoading: !0 });
          const a = await this.userManager.verify2FA(t);
          a && (this.appState.refreshSession(a.access_token, a.refresh_token), await this.appState.refreshUser(), this.userManager.removeMFAData(), this.userManager.state.isLinkingAccount && (g.push({
            type: m.success,
            element: /* @__PURE__ */ e.createElement(c, { i18nKey: "LinkPlatformAccountPage.notification.accountLinked" }, "Account linked")
          }), this.userManager.setState({ isLinkingAccount: !1 })));
        } catch (a) {
          if (console.error(a), f.isAxiosNetworkError(a)) {
            g.push({
              type: m.danger,
              element: s("CommonError.networkError")
            });
            return;
          }
          const o = U(a);
          this.setState({ alert: { type: m.danger, element: o } });
        } finally {
          this.setState({ isLoading: !1 });
        }
    }, this.requestEmailCode = async (t) => {
      if (!this.state.isLoading)
        try {
          this.setState({ isLoading: !0 }), await this.userManager.request2FAEmailCode({ factor: "email" }), t && this.setState({ alert: { type: m.success, element: s("twoFAPage.email.resend.success") } }), this.changePage(r.enum.email);
        } catch (a) {
          if (f.isAxiosNetworkError(a)) {
            g.push({
              type: m.danger,
              element: s("CommonError.networkError")
            });
            return;
          }
          this.setState({ alert: { type: m.danger, element: /* @__PURE__ */ e.createElement(b, { error: a }) } });
        } finally {
          this.setState({ isLoading: !1 });
        }
    }, this.getCodeLength = (t) => {
      switch (t) {
        case r.enum.backupCode:
          return O;
        case r.enum.authenticator:
          return K;
        default:
          return R;
      }
    }, this.renderHelperTextEmail = () => /* @__PURE__ */ e.createElement("div", { className: "mt-3 text-[13px]" }, /* @__PURE__ */ e.createElement("span", null, s("AccountPasswordSecurity.2fa.emailModal.helperText")), /* @__PURE__ */ e.createElement("span", { className: "ml-1 cursor-pointer text-blue-50", onClick: () => this.requestEmailCode(!0) }, s("AccountPasswordSecurity.2fa.emailModal.resendBtn"))), this.renderCodeInput = (t, a) => {
      var l;
      const o = ((l = this.userManager.state.mfaData) == null ? void 0 : l.factors) || [];
      return /* @__PURE__ */ e.createElement(
        I,
        {
          onTryAnother: o.length > 1 ? this.onTryAnother : void 0,
          codeLength: this.getCodeLength(t),
          factor: t,
          onSubmit: this.submitCode,
          isSubmitting: this.state.isLoading,
          helperText: a
        }
      );
    }, this.resetMFADataAndLogout = () => {
      sessionStorage.removeItem(A), this.userManager.removeMFAData(), this.appState.logout(), w.isDesktopApp() || this.appState.state.appHistory.push(v.Login.link);
    }, this.state = {
      page: null,
      isLoading: !1,
      alert: null
    }, this.appState = F.getAppState(), this.userManager = this.appState.userAppManager;
  }
  componentDidMount() {
    var a;
    P.updateBackground(`url(${S})`);
    const n = (a = this.userManager.state.mfaData) == null ? void 0 : a.defaultFactor, t = sessionStorage.getItem(A);
    this.setState({ page: t || n || r.enum.options });
  }
  render() {
    var o;
    const n = ((o = this.userManager.state.mfaData) == null ? void 0 : o.factors) || [], { alert: t, page: a } = this.state;
    return /* @__PURE__ */ e.createElement("div", { className: "twoFAPage" }, /* @__PURE__ */ e.createElement(D, { className: "twoFAAlert" }), /* @__PURE__ */ e.createElement("div", { className: "twoFAContainer" }, /* @__PURE__ */ e.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ e.createElement("img", { src: _, loading: "lazy" })), /* @__PURE__ */ e.createElement("div", { className: "twoFAForm" }, a === r.enum.authenticator && /* @__PURE__ */ e.createElement(
      u,
      {
        title: s("twoFAPage.authenticator.title"),
        description: /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.authenticator.description" }, "Please enter the security code from your authenticator app.", /* @__PURE__ */ e.createElement("a", { href: y.DOCS_FAQ_URL, target: "_blank", rel: "noreferrer" }, "Learn more")),
        withAlert: !0,
        alert: t,
        onDismissAlert: this.dismissAlert
      },
      this.renderCodeInput(r.enum.authenticator)
    ), a === r.enum.backupCode && /* @__PURE__ */ e.createElement(
      u,
      {
        title: s("twoFAPage.backupCode.title"),
        description: /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.backupCode.description" }, "Please enter one of your backup codes to continue.", /* @__PURE__ */ e.createElement("a", { href: y.DOCS_FAQ_URL, target: "_blank", rel: "noreferrer" }, "Learn more")),
        withAlert: !0,
        alert: t,
        onDismissAlert: this.dismissAlert
      },
      this.renderCodeInput(r.enum.backupCode)
    ), a === r.enum.email && /* @__PURE__ */ e.createElement(
      u,
      {
        title: s("twoFAPage.email.title"),
        description: /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.email.description" }, "To continue, please enter the verification code we’ve sent to your email at", /* @__PURE__ */ e.createElement("strong", null, { email: this.userManager.getEmailUserFromMfaData() }), ".", /* @__PURE__ */ e.createElement("a", { href: "https://docs.accelbyte.io/faq/faq.html", target: "_blank", rel: "noreferrer" }, "Learn more")),
        withAlert: !0,
        alert: this.state.alert,
        onDismissAlert: this.dismissAlert
      },
      this.renderCodeInput(r.enum.email, this.renderHelperTextEmail())
    ), a === r.enum.options && /* @__PURE__ */ e.createElement(u, { title: s("twoFAPage.verify.title"), description: s("twoFAPage.verify.description") }, !!t && /* @__PURE__ */ e.createElement(C, { type: t.type, onDismiss: this.dismissAlert, className: "text-left" }, t.element), n.includes(r.enum.authenticator) && /* @__PURE__ */ e.createElement(
      E,
      {
        icon: /* @__PURE__ */ e.createElement(L, null),
        description: s("twoFAPage.verify.authApp.description"),
        onClick: () => this.changePage(r.enum.authenticator)
      }
    ), n.includes(r.enum.backupCode) && /* @__PURE__ */ e.createElement(
      E,
      {
        icon: /* @__PURE__ */ e.createElement(M, null),
        description: s("twoFAPage.verify.backupCode.description"),
        onClick: () => this.changePage(r.enum.backupCode)
      }
    ), n.includes(r.enum.email) && /* @__PURE__ */ e.createElement(
      E,
      {
        icon: /* @__PURE__ */ e.createElement(N, null),
        description: s("twoFAPage.verify.email.description"),
        onClick: () => this.requestEmailCode(!1)
      }
    ))), /* @__PURE__ */ e.createElement("div", { className: "backContainer" }, /* @__PURE__ */ e.createElement("button", { onClick: this.resetMFADataAndLogout }, /* @__PURE__ */ e.createElement(c, { i18nKey: "twoFAPage.backToLogin" }, "Back to Login")))));
  }
}
export {
  V as default
};
