import { jsx, Fragment, jsxs } from "react/jsx-runtime";
import { useState, useMemo } from "react";
import { DisableOtpForm } from "./DisableOtpForm.js";
import { Button } from "@contember/ui";
import { PrepareOtpForm } from "./PrepareOtpForm.js";
import { ConfirmOtpForm } from "./ConfirmOtpForm.js";
import qrcode from "qrcode-generator";
import { useIdentity } from "../../../components/Identity/useIdentity.js";
const OtpManagement = () => {
  const identity = useIdentity();
  const [initializingOtp, setInitializingOtp] = useState(false);
  const [otpUri, setOtpUri] = useState();
  const person = identity.person;
  if (!person) {
    return /* @__PURE__ */ jsx(Fragment, { children: "Cannot setup OTP for API key." });
  }
  if (initializingOtp) {
    return /* @__PURE__ */ jsx(Fragment, { children: /* @__PURE__ */ jsx(
      PrepareOtpForm,
      {
        onPrepared: ({ otpUri: otpUri2 }) => {
          setInitializingOtp(false);
          setOtpUri(otpUri2);
        },
        isReSetup: person.otpEnabled,
        onCancel: () => setInitializingOtp(false)
      }
    ) });
  }
  if (otpUri) {
    return /* @__PURE__ */ jsxs(Fragment, { children: [
      /* @__PURE__ */ jsx("p", { children: "Now scan the following QR code in you application:" }),
      /* @__PURE__ */ jsx(QrCode, { data: otpUri }),
      /* @__PURE__ */ jsx("p", { children: "After registering to you application, write down a code from the application." }),
      /* @__PURE__ */ jsx(ConfirmOtpForm, { onSuccess: () => {
        setOtpUri(void 0);
      } })
    ] });
  }
  if (person.otpEnabled) {
    return /* @__PURE__ */ jsxs(Fragment, { children: [
      /* @__PURE__ */ jsx("p", { children: "Two factor authentication is ENABLED." }),
      /* @__PURE__ */ jsx(DisableOtpForm, {}),
      /* @__PURE__ */ jsx("p", { children: "You already have two-factor authentication active. By enabling a new code, the old one will no longer work." }),
      /* @__PURE__ */ jsx(Button, { onClick: () => setInitializingOtp(true), children: "Setup again" })
    ] });
  }
  return /* @__PURE__ */ jsxs(Fragment, { children: [
    /* @__PURE__ */ 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__ */ jsx(Button, { onClick: () => setInitializingOtp(true), children: "Setup two-factor authentication" })
  ] });
};
const QrCode = ({ data }) => {
  const code = useMemo(() => {
    const qr = qrcode(0, "L");
    qr.addData(data);
    qr.make();
    return qr.createDataURL(4);
  }, [data]);
  return /* @__PURE__ */ jsx("img", { src: code });
};
export {
  OtpManagement
};
//# sourceMappingURL=OtpManagement.js.map
