sales-frontend-components 0.0.81 → 0.0.83

package/dist/index.cjs.js

@@ -16,6 +16,7 @@ var styles$6 = require('./modal/pre-standard/employee-search-modal/employee-sear
 var styles$7 = require('./modal/pre-standard/job-vehicle-search-modal/job-vehicle-search-modal.module.scss');
 var styles$8 = require('./modal/pre-standard/vehicle-search-modal/vehicle-search-modal.module.scss');
 var styles$9 = require('./modal/standard/customer-search/customer-search.module.scss');
+var salesFrontendUtils = require('sales-frontend-utils');
 
 const FormCheckboxButton = ({
   name,
@@ -2579,6 +2580,204 @@ const CustomerSearch = ({ onSelect }) => {
   ] });
 };
 
+const VERIFICATION_CODES = {
+  SUCCESS: "0000",
+  USER_CANCEL: "9000",
+  TOKEN_ERROR: "9001",
+  CAMERA_PERMISSION: "9002",
+  ATTEMPT_EXCEEDED: "9003",
+  SERVER_ERROR: "9999"
+};
+const useRemoteIdentityVerification = ({
+  rivEnv,
+  rivOrigin,
+  tokenRequestParams,
+  apiConfig,
+  onCancel,
+  onError,
+  onSuccess,
+  rivSearchParams
+}) => {
+  const rivHost = rivOrigin ?? `https://${rivEnv === "prd" ? "" : rivEnv === "stg" ? "qa" : "dev"}riv.hanwhalife.com`;
+  const createRemoteIdentityVerificationUrl = async () => {
+    const response = await method.getRemoteIdentityVerificationSystemToken(tokenRequestParams, apiConfig);
+    const { accessToken, remoteIdentityVerificationSystemRequestId } = response.data;
+    const urlParams = new URLSearchParams({
+      authorization: accessToken,
+      rivsRqstId: remoteIdentityVerificationSystemRequestId,
+      ...rivSearchParams
+    });
+    return { fullUrl: `${rivHost}/?${urlParams.toString()}`, rivsRqstId: remoteIdentityVerificationSystemRequestId };
+  };
+  const createMessageHandler = ({ rivsRqstId }, cleanup) => {
+    return (event) => {
+      try {
+        const response = typeof event.data === "string" ? JSON.parse(decodeURIComponent(event.data)) : event.data;
+        if (response.command !== "webClose") {
+          return;
+        }
+        const { result, code } = response.args;
+        switch (code) {
+          case VERIFICATION_CODES.USER_CANCEL:
+            console.log("=====\uC0AC\uC6A9\uC790 \uC885\uB8CC!=====", { result, code });
+            onCancel?.({ result, code });
+            cleanup?.();
+            break;
+          case VERIFICATION_CODES.TOKEN_ERROR:
+          case VERIFICATION_CODES.CAMERA_PERMISSION:
+          case VERIFICATION_CODES.ATTEMPT_EXCEEDED:
+          case VERIFICATION_CODES.SERVER_ERROR:
+            console.log("=====\uBE44\uB300\uBA74\uC778\uC99D \uC2E4\uD328!=====", { result, code });
+            onError?.({ result, code });
+            cleanup?.();
+            break;
+          case VERIFICATION_CODES.SUCCESS:
+            console.log("=====\uBE44\uB300\uBA74\uC778\uC99D \uC131\uACF5!=====", { result, code });
+            onSuccess?.({ result, code }, { rivsRqstId });
+            cleanup?.();
+            break;
+          default:
+            console.warn("Unknown verification code:", code);
+        }
+      } catch (error) {
+        console.error("Failed to parse postMessage:", error);
+      }
+    };
+  };
+  return {
+    createRemoteIdentityVerificationUrl,
+    createMessageHandler
+  };
+};
+const useRemoteIdentityVerificationIframe = (config) => {
+  const { createMessageHandler, createRemoteIdentityVerificationUrl } = useRemoteIdentityVerification(config);
+  const { isOpen, openModal, closeModal } = salesFrontendDesignSystem.useModalState();
+  const [remoteIdentityVerificationUrl, setRemoteIdentityVerificationUrl] = React.useState("");
+  const [rivsRqstId, setRivsRqstId] = React.useState("");
+  const [isCreatingUrl, setIsCreatingUrl] = React.useState(false);
+  const [isIframeLoaded, setIsIframeLoaded] = React.useState(false);
+  const createIframeUrl = async () => {
+    if (remoteIdentityVerificationUrl || isCreatingUrl) {
+      return;
+    }
+    setIsCreatingUrl(true);
+    setIsIframeLoaded(false);
+    try {
+      const { fullUrl, rivsRqstId: rivsRqstId2 } = await createRemoteIdentityVerificationUrl();
+      setRemoteIdentityVerificationUrl(fullUrl);
+      setRivsRqstId(rivsRqstId2);
+    } catch (error) {
+      console.error("Failed to create URL:", error);
+      throw error;
+    } finally {
+      setIsCreatingUrl(false);
+    }
+  };
+  const openRivIframe = async () => {
+    try {
+      await createIframeUrl();
+      openModal();
+    } catch (error) {
+      console.error("openRivIframe error::", error);
+      await salesFrontendDesignSystem.ModalUtils.alert("\uBE44\uB300\uBA74 \uC778\uC99D URL \uC0DD\uC131\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.");
+    }
+  };
+  const closeRivIframe = () => {
+    setRemoteIdentityVerificationUrl("");
+    setRivsRqstId("");
+    setIsIframeLoaded(false);
+    closeModal();
+  };
+  React.useEffect(() => {
+    if (!remoteIdentityVerificationUrl) {
+      return;
+    }
+    const messageHandler = createMessageHandler({ rivsRqstId }, closeRivIframe);
+    salesFrontendUtils.MessageEventManager.getInstance().registerHandler("riv-iframe-handler", messageHandler);
+    return () => salesFrontendUtils.MessageEventManager.getInstance().unregisterHandler("riv-iframe-handler");
+  }, [remoteIdentityVerificationUrl, rivsRqstId]);
+  const RivIframe = ({
+    width = "100%",
+    height = "100%",
+    ...iframeProps
+  }) => {
+    if (!remoteIdentityVerificationUrl) {
+      return null;
+    }
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "iframe",
+      {
+        src: remoteIdentityVerificationUrl,
+        width,
+        height,
+        allow: "camera *;",
+        onLoad: () => setIsIframeLoaded(true),
+        ...iframeProps
+      }
+    );
+  };
+  const RivModalIframe = ({
+    width = "100%",
+    height = "100%",
+    loadingComponent,
+    ...iframeProps
+  }) => {
+    const isLoading = isCreatingUrl || !!remoteIdentityVerificationUrl && !isIframeLoaded;
+    return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: /* @__PURE__ */ jsxRuntime.jsxs(salesFrontendDesignSystem.Modal.Root, { isOpen, children: [
+      isLoading && (loadingComponent || /* @__PURE__ */ jsxRuntime.jsx(salesFrontendDesignSystem.Loading.Wait, { bodyText: "\uBD88\uB7EC\uC624\uB294 \uC911" })),
+      /* @__PURE__ */ jsxRuntime.jsx(RivIframe, { width, height, allow: "camera *;", ...iframeProps })
+    ] }) });
+  };
+  return {
+    RivModalIframe,
+    RivIframe,
+    openRivIframe,
+    closeRivIframe,
+    remoteIdentityVerificationUrl,
+    isCreatingUrl,
+    isFullyLoaded: isIframeLoaded
+  };
+};
+const useRemoteIdentityVerificationPopup = (config) => {
+  const { createRemoteIdentityVerificationUrl, createMessageHandler } = useRemoteIdentityVerification(config);
+  const [isCreatingUrl, setIsCreatingUrl] = React.useState(false);
+  const [rivsRqstId, setRivsRqstId] = React.useState("");
+  const popupRef = React.useRef(null);
+  const openPopup = async (target = "_blank", features) => {
+    if (popupRef.current && !popupRef.current.closed) {
+      popupRef.current.close();
+    }
+    setIsCreatingUrl(true);
+    try {
+      const { fullUrl, rivsRqstId: rivsRqstId2 } = await createRemoteIdentityVerificationUrl();
+      const popup = window.open(fullUrl, target, features);
+      if (!popup) {
+        await salesFrontendDesignSystem.ModalUtils.alert("\uD31D\uC5C5\uC774 \uCC28\uB2E8\uB418\uC5C8\uC2B5\uB2C8\uB2E4. \uD31D\uC5C5\uC744 \uD5C8\uC6A9\uD574\uC8FC\uC138\uC694.");
+        return;
+      }
+      setRivsRqstId(rivsRqstId2);
+      popupRef.current = popup;
+    } catch (error) {
+      console.error("openPopup error::", error);
+      await salesFrontendDesignSystem.ModalUtils.alert("\uBE44\uB300\uBA74 \uC778\uC99D URL \uC0DD\uC131\uC5D0 \uC2E4\uD328\uD588\uC2B5\uB2C8\uB2E4. \uB2E4\uC2DC \uC2DC\uB3C4\uD574\uC8FC\uC138\uC694.");
+    } finally {
+      setIsCreatingUrl(false);
+    }
+  };
+  const cleanPopup = () => {
+    popupRef.current = null;
+  };
+  React.useEffect(() => {
+    const messageHandler = createMessageHandler({ rivsRqstId }, cleanPopup);
+    salesFrontendUtils.MessageEventManager.getInstance().registerHandler("riv-popup-handler", messageHandler);
+    return () => salesFrontendUtils.MessageEventManager.getInstance().unregisterHandler("riv-popup-handler");
+  }, [rivsRqstId]);
+  return {
+    openPopup,
+    isCreatingUrl
+  };
+};
+
 exports.Attachment = Attachment;
 exports.BankStockSearchModal = BankStockSearchModal;
 exports.CustomerSearch = CustomerSearch;
@@ -2601,5 +2800,8 @@ exports.useBankStockSearch = useBankStockSearch;
 exports.useCamera = useCamera;
 exports.useCanvasPaint = useCanvasPaint;
 exports.useJobVehicleSearchModal = useJobVehicleSearchModal;
+exports.useRemoteIdentityVerification = useRemoteIdentityVerification;
+exports.useRemoteIdentityVerificationIframe = useRemoteIdentityVerificationIframe;
+exports.useRemoteIdentityVerificationPopup = useRemoteIdentityVerificationPopup;
 exports.useSearchAddress = useSearchAddress;
 //# sourceMappingURL=index.cjs.js.map