import { Alert as c } from "./accelbyte-widgets123.mjs";
import { Button as i, ButtonStyle as y } from "./accelbyte-widgets107.mjs";
import { Dialog as f, DialogBody as g, DialogFooter as b } from "./accelbyte-widgets235.mjs";
import { LoadingBarIcon as E } from "./accelbyte-widgets342.mjs";
import { t as w } from "./accelbyte-widgets58.mjs";
import { AlertType as d } from "./accelbyte-widgets128.mjs";
import C from "classnames";
import { format as m } from "date-fns";
import "./accelbyte-widgets626.mjs";
import e from "react";
import { Trans as r } from "react-i18next";
import { ErrorGenerateCode as h } from "./accelbyte-widgets627.mjs";
import { exports as k } from "./accelbyte-widgets628.mjs";
class _ extends e.Component {
  constructor(l) {
    super(l), this.downloadCodes = async () => {
      const { backupCode: t, setAlert: o } = this.props;
      if (!t)
        return;
      this.setState({ isDownloading: !0 });
      const s = new Blob([t.validCodes], { type: "text/plain;charset=utf-8" });
      k(s, `backup_codes_${t && m(new Date(t.generatedAt * 1e3), "M/dd/yyyy, hh:mm a")}.txt`), o({
        type: d.success,
        element: /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordsecurity.2fa.backupcode.success.download" }, "Backup codes downloaded")
      }), this.setState({ isDownloading: !1 });
    }, this.closeBackupCodeModal = () => {
      const { onClose: t, setAlert: o } = this.props;
      o(null), t();
    }, this.renderLoading = () => {
      const { isFetching: t, isGenerating: o } = this.props;
      return /* @__PURE__ */ e.createElement("div", { className: "flex justify-center" }, /* @__PURE__ */ e.createElement(E, null), /* @__PURE__ */ e.createElement("div", { className: "ml-3 leading-3" }, o && /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.generating" }, "Generating new codes..."), t && /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.loading" }, "Loading backup codes...")));
    }, this.renderBackupCodes = () => {
      const { backupCode: t, isFetching: o, isGenerating: s } = this.props;
      if (o || s)
        return this.renderLoading();
      if (!t)
        return null;
      let n = [];
      return t.validCodes && (n = t.validCodes.map((a) => ({ code: a, isValid: !0 }))), t.invalidCodes && (n = n.concat(
        t.invalidCodes.map((a) => ({
          code: a,
          isValid: !1
        }))
      )), /* @__PURE__ */ e.createElement("div", { className: "border-gray-80 mx-6 flex flex-wrap border-b border-t pt-6 pb-3" }, n.map((a) => /* @__PURE__ */ e.createElement(
        "div",
        {
          key: a.code,
          className: C("mb-4 w-1/2 text-center sm:w-1/5", !a.isValid && "text-gray-70 line-through")
        },
        a.code
      )));
    }, this.state = {
      isDownloading: !1
    };
  }
  render() {
    const { isOpen: l, backupCode: t, isFetching: o, isGenerating: s, alert: n, backupCodeError: a, setAlert: u, generateCodes: p } = this.props;
    return /* @__PURE__ */ e.createElement(
      f,
      {
        isOpen: l,
        title: w("AccountPasswordSecurity.2fa.backupCode.title"),
        className: "sm:w-680 w-5/6",
        onClose: this.closeBackupCodeModal
      },
      /* @__PURE__ */ e.createElement(g, null, n && /* @__PURE__ */ e.createElement(c, { type: n.type, onDismiss: () => u(null), className: "mb-3" }, n.element), /* @__PURE__ */ e.createElement(c, { type: d.info }, /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountpasswordSecurity.2fa.backupCode.info" }, "Download your backup codes and keep them somewhere safe. Treat them the same way as you save your password.")), a ? /* @__PURE__ */ e.createElement(
        h,
        {
          onRetry: a.onRetry,
          message: a.message,
          retryLabel: a.retryLabel
        }
      ) : /* @__PURE__ */ e.createElement(e.Fragment, null, /* @__PURE__ */ e.createElement("div", { className: "justify-between p-6 pb-2 lg:flex" }, /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("div", null, /* @__PURE__ */ e.createElement("span", null, t && t.validCodes ? t.validCodes.length : 0), " ", /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.remaining" }, "backup codes remaining")), /* @__PURE__ */ e.createElement("div", { className: "pb-6 text-[color:rgb(var(--od-rgb-text),0.65)]" }, /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.info2" }, "you can only use each code once."))), /* @__PURE__ */ e.createElement("div", { className: "italic text-[color:rgb(var(--od-rgb-text),0.65)]" }, /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.generatedAt" }, "Generated at:"), " ", t && m(new Date(t.generatedAt * 1e3), "M/dd/yyyy, hh:mm a"))), this.renderBackupCodes())),
      !a && /* @__PURE__ */ e.createElement(b, null, /* @__PURE__ */ e.createElement("div", { className: "justify-end sm:flex" }, /* @__PURE__ */ e.createElement(
        i,
        {
          className: "btn btn-ghost mr-5 w-full text-sm font-normal sm:w-48",
          buttonStyle: y.NONE,
          onClick: p
        },
        /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.generateCode" }, "GENERATE NEW CODES")
      ), /* @__PURE__ */ e.createElement(
        i,
        {
          className: "btn btn-primary mt-3 w-full text-sm font-normal sm:mt-0 sm:w-40",
          onClick: this.downloadCodes,
          disabled: this.state.isDownloading || !(t != null && t.validCodes) || o || s
        },
        /* @__PURE__ */ e.createElement(r, { i18nKey: "AccountPasswordSecurity.2fa.backupCode.downloadCode" }, "DOWNLOAD CODES")
      )))
    );
  }
}
export {
  _ as BackupCodesModal
};
