"use strict";
Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const jsxRuntime = require("react/jsx-runtime");
const react = require("react");
const DisableOtpForm = require("./DisableOtpForm.cjs");
const ui = require("@contember/ui");
const PrepareOtpForm = require("./PrepareOtpForm.cjs");
const ConfirmOtpForm = require("./ConfirmOtpForm.cjs");
const qrcode = require("qrcode-generator");
const useIdentity = require("../../../components/Identity/useIdentity.cjs");
const OtpManagement = () => {
  const identity = useIdentity.useIdentity();
  const [initializingOtp, setInitializingOtp] = react.useState(false);
  const [otpUri, setOtpUri] = react.useState();
  const person = identity.person;
  if (!person) {
    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: "Cannot setup OTP for API key." });
  }
  if (initializingOtp) {
    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsx(
      PrepareOtpForm.PrepareOtpForm,
      {
        onPrepared: ({ otpUri: otpUri2 }) => {
          setInitializingOtp(false);
          setOtpUri(otpUri2);
        },
        isReSetup: person.otpEnabled,
        onCancel: () => setInitializingOtp(false)
      }
    ) });
  }
  if (otpUri) {
    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Now scan the following QR code in you application:" }),
      /* @__PURE__ */ jsxRuntime.jsx(QrCode, { data: otpUri }),
      /* @__PURE__ */ jsxRuntime.jsx("p", { children: "After registering to you application, write down a code from the application." }),
      /* @__PURE__ */ jsxRuntime.jsx(ConfirmOtpForm.ConfirmOtpForm, { onSuccess: () => {
        setOtpUri(void 0);
      } })
    ] });
  }
  if (person.otpEnabled) {
    return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      /* @__PURE__ */ jsxRuntime.jsx("p", { children: "Two factor authentication is ENABLED." }),
      /* @__PURE__ */ jsxRuntime.jsx(DisableOtpForm.DisableOtpForm, {}),
      /* @__PURE__ */ jsxRuntime.jsx("p", { children: "You already have two-factor authentication active. By enabling a new code, the old one will no longer work." }),
      /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: () => setInitializingOtp(true), children: "Setup again" })
    ] });
  }
  return /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
    /* @__PURE__ */ jsxRuntime.jsx("p", { children: "2-Step Verification provides stronger security for your account by requiring a second step of verification when you sign in. In addition to your password, you’ll also need a code generated by an application on your phone." }),
    /* @__PURE__ */ jsxRuntime.jsx(ui.Button, { onClick: () => setInitializingOtp(true), children: "Setup two-factor authentication" })
  ] });
};
const QrCode = ({ data }) => {
  const code = react.useMemo(() => {
    const qr = qrcode(0, "L");
    qr.addData(data);
    qr.make();
    return qr.createDataURL(4);
  }, [data]);
  return /* @__PURE__ */ jsxRuntime.jsx("img", { src: code });
};
exports.OtpManagement = OtpManagement;
//# sourceMappingURL=OtpManagement.cjs.map
