@springmicro/auth 0.5.1 → 0.5.2

package/src/components/forms/AgreementModal.tsx

@@ -1,88 +1,88 @@
-import React from "react";
-import type { SignUpFormState } from "../SignUp";
-import type { Application } from "./util/provider";
-
-export type AgreementModalProps = {
-  application: Application;
-  state: SignUpFormState;
-  setState: React.Dispatch<React.SetStateAction<SignUpFormState>>;
-};
-
-export function AgreementModal({
-  application,
-  state,
-  setState,
-}: AgreementModalProps) {
-  const [visible, setVisible] = React.useState(false);
-  const dialogRef = React.useRef<HTMLDialogElement | null>(null);
-
-  React.useEffect(() => {
-    if (!dialogRef.current) {
-      dialogRef.current = document.getElementById(
-        "agreementDialog"
-      ) as HTMLDialogElement | null;
-    }
-  }, []);
-
-  React.useEffect(() => {
-    if (dialogRef.current) {
-      if (visible) {
-        dialogRef.current.showModal();
-      } else {
-        dialogRef.current.close();
-      }
-    }
-  }, [visible]);
-
-  const handleCancel = () => {
-    setState({ ...state, agreement: false });
-    setVisible(false);
-  };
-
-  const handleOk = () => {
-    setState({ ...state, agreement: true });
-    setVisible(false);
-  };
-
-  const handleOpen = () => {
-    setVisible(true);
-  };
-
-  return (
-    <>
-      <dialog id="agreementDialog" className="modal">
-        <div className="modal-box">
-          <div className="mt-4 mb-8">
-            <iframe
-              src={application.termsOfUse}
-              width="100%"
-              height="300px"
-              sandbox="allow-scripts"
-            />
-          </div>
-          <div className="modal-action">
-            <form method="dialog" className="modal-backdrop">
-              {/* if there is a button in form, it will close the modal */}
-              <button>Close</button>
-            </form>
-            <form method="dialog" className="flex gap-3">
-              <button className="btn" onClick={handleCancel} key="closebtn">
-                Cancel
-              </button>
-              <button
-                className="btn btn-primary"
-                // disabled={isOkDisabled}
-                onClick={handleOk}
-                key="okbtn"
-              >
-                OK
-              </button>
-            </form>
-          </div>
-        </div>
-      </dialog>
-      <input checked={!!state.agreement} type="checkbox" readOnly />
-      <button onClick={handleOpen}>Open Terms</button>
-    </>
-  );
-}
+import React from "react";
+import type { SignUpFormState } from "../SignUp";
+import type { Application } from "./util/provider";
+
+export type AgreementModalProps = {
+  application: Application;
+  state: SignUpFormState;
+  setState: React.Dispatch<React.SetStateAction<SignUpFormState>>;
+};
+
+export function AgreementModal({
+  application,
+  state,
+  setState,
+}: AgreementModalProps) {
+  const [visible, setVisible] = React.useState(false);
+  const dialogRef = React.useRef<HTMLDialogElement | null>(null);
+
+  React.useEffect(() => {
+    if (!dialogRef.current) {
+      dialogRef.current = document.getElementById(
+        "agreementDialog"
+      ) as HTMLDialogElement | null;
+    }
+  }, []);
+
+  React.useEffect(() => {
+    if (dialogRef.current) {
+      if (visible) {
+        dialogRef.current.showModal();
+      } else {
+        dialogRef.current.close();
+      }
+    }
+  }, [visible]);
+
+  const handleCancel = () => {
+    setState({ ...state, agreement: false });
+    setVisible(false);
+  };
+
+  const handleOk = () => {
+    setState({ ...state, agreement: true });
+    setVisible(false);
+  };
+
+  const handleOpen = () => {
+    setVisible(true);
+  };
+
+  return (
+    <>
+      <dialog id="agreementDialog" className="modal">
+        <div className="modal-box">
+          <div className="mt-4 mb-8">
+            <iframe
+              src={application.termsOfUse}
+              width="100%"
+              height="300px"
+              sandbox="allow-scripts"
+            />
+          </div>
+          <div className="modal-action">
+            <form method="dialog" className="modal-backdrop">
+              {/* if there is a button in form, it will close the modal */}
+              <button>Close</button>
+            </form>
+            <form method="dialog" className="flex gap-3">
+              <button className="btn" onClick={handleCancel} key="closebtn">
+                Cancel
+              </button>
+              <button
+                className="btn btn-primary"
+                // disabled={isOkDisabled}
+                onClick={handleOk}
+                key="okbtn"
+              >
+                OK
+              </button>
+            </form>
+          </div>
+        </div>
+      </dialog>
+      <input checked={!!state.agreement} type="checkbox" readOnly />
+      <button onClick={handleOpen}>Open Terms</button>
+    </>
+  );
+}

package/src/components/forms/CaptchaController.tsx

@@ -1,94 +1,94 @@
-import React from "react";
-import { CaptchaModal } from "./CaptchaModal";
-import * as AuthBackend from "./util/auth-api";
-
-type CaptchaState = {
-  values: any;
-  openCaptchaModal: boolean;
-};
-
-export default function CaptchaController() {
-  const [state, setState] = React.useState<CaptchaState>({
-    values: {},
-    openCaptchaModal: false,
-  });
-  const dialogRef = React.useRef<HTMLElement | null>(null);
-
-  const handleClick = () => {
-    if (dialogRef.current) {
-      if (!state.openCaptchaModal) {
-        // @ts-ignore
-        dialogRef.current.showModal();
-      } else {
-        // @ts-ignore
-        dialogRef.current.close();
-      }
-      setState({ ...state, openCaptchaModal: !state.openCaptchaModal });
-    }
-  };
-
-  const captchaCallback = (v: any) => {
-    console.log(v);
-  };
-
-  const onOk = (
-    captchaType: string,
-    captchaToken: string,
-    clientSecret: string
-  ) => {
-    if (dialogRef.current) {
-      // @ts-ignore
-      dialogRef.current.close();
-      const values = state.values;
-      values["captchaType"] = captchaType;
-      values["captchaToken"] = captchaToken;
-      values["clientSecret"] = clientSecret;
-      AuthBackend.getCaptchaStatus(values).then((res) => {
-        if (res.status === "ok") {
-          // errors
-          if (res.data) {
-            setState({
-              openCaptchaModal: true,
-              values: values,
-            });
-            return null;
-          }
-        }
-        captchaCallback(values);
-      });
-      setState({ ...state, openCaptchaModal: false });
-    }
-  };
-
-  const onCancel = () => {
-    if (dialogRef.current) {
-      // @ts-ignore
-      dialogRef.current.close();
-      setState({ ...state, openCaptchaModal: false });
-    }
-  };
-
-  React.useEffect(() => {
-    dialogRef.current = document.getElementById("captcha-modal");
-  }, []);
-
-  return (
-    <>
-      <CaptchaModal
-        visible={state.openCaptchaModal}
-        owner="admin"
-        name="provider_captcha_default"
-        isCurrentProvider={true}
-        onCancel={onCancel}
-        onOk={onOk}
-      />
-      <button
-        className="btn btn-primary"
-        // @ts-ignore
-        onClick={handleClick}
-      >
-        Captcha
-      </button>
-    </>
-  );
-}
+import React from "react";
+import { CaptchaModal } from "./CaptchaModal";
+import * as AuthBackend from "./util/auth-api";
+
+type CaptchaState = {
+  values: any;
+  openCaptchaModal: boolean;
+};
+
+export default function CaptchaController() {
+  const [state, setState] = React.useState<CaptchaState>({
+    values: {},
+    openCaptchaModal: false,
+  });
+  const dialogRef = React.useRef<HTMLElement | null>(null);
+
+  const handleClick = () => {
+    if (dialogRef.current) {
+      if (!state.openCaptchaModal) {
+        // @ts-ignore
+        dialogRef.current.showModal();
+      } else {
+        // @ts-ignore
+        dialogRef.current.close();
+      }
+      setState({ ...state, openCaptchaModal: !state.openCaptchaModal });
+    }
+  };
+
+  const captchaCallback = (v: any) => {
+    console.log(v);
+  };
+
+  const onOk = (
+    captchaType: string,
+    captchaToken: string,
+    clientSecret: string
+  ) => {
+    if (dialogRef.current) {
+      // @ts-ignore
+      dialogRef.current.close();
+      const values = state.values;
+      values["captchaType"] = captchaType;
+      values["captchaToken"] = captchaToken;
+      values["clientSecret"] = clientSecret;
+      AuthBackend.getCaptchaStatus(values).then((res) => {
+        if (res.status === "ok") {
+          // errors
+          if (res.data) {
+            setState({
+              openCaptchaModal: true,
+              values: values,
+            });
+            return null;
+          }
+        }
+        captchaCallback(values);
+      });
+      setState({ ...state, openCaptchaModal: false });
+    }
+  };
+
+  const onCancel = () => {
+    if (dialogRef.current) {
+      // @ts-ignore
+      dialogRef.current.close();
+      setState({ ...state, openCaptchaModal: false });
+    }
+  };
+
+  React.useEffect(() => {
+    dialogRef.current = document.getElementById("captcha-modal");
+  }, []);
+
+  return (
+    <>
+      <CaptchaModal
+        visible={state.openCaptchaModal}
+        owner="admin"
+        name="provider_captcha_default"
+        isCurrentProvider={true}
+        onCancel={onCancel}
+        onOk={onOk}
+      />
+      <button
+        className="btn btn-primary"
+        // @ts-ignore
+        onClick={handleClick}
+      >
+        Captcha
+      </button>
+    </>
+  );
+}