astra-sdk-web 1.1.26 → 1.1.28

package/dist/components.cjs.js

@@ -280,6 +280,81 @@ function isMobileDevice() {
   const hasTouchScreen = "ontouchstart" in window || navigator.maxTouchPoints > 0;
   return mobileRegex.test(userAgent) || isSmallScreen && hasTouchScreen;
 }
+
+// src/utils/kycConfigStorage.ts
+var STORAGE_PREFIX = "kyc_config_";
+var STORAGE_EXPIRY_MS = 24 * 60 * 60 * 1e3;
+function storeKycConfig(sessionId, apiBaseUrl, serverKey) {
+  if (!sessionId || !apiBaseUrl || !serverKey) {
+    console.warn("Cannot store KYC config: missing required parameters");
+    return;
+  }
+  try {
+    const config = {
+      apiBaseUrl,
+      serverKey,
+      sessionId
+    };
+    const storageKey = `${STORAGE_PREFIX}${sessionId}`;
+    const data = {
+      config,
+      timestamp: Date.now()
+    };
+    localStorage.setItem(storageKey, JSON.stringify(data));
+  } catch (error) {
+    console.error("Failed to store KYC config:", error);
+  }
+}
+function getKycConfig(sessionId) {
+  if (!sessionId) {
+    return null;
+  }
+  try {
+    const storageKey = `${STORAGE_PREFIX}${sessionId}`;
+    const stored = localStorage.getItem(storageKey);
+    if (!stored) {
+      return null;
+    }
+    const data = JSON.parse(stored);
+    if (data.timestamp && Date.now() - data.timestamp > STORAGE_EXPIRY_MS) {
+      localStorage.removeItem(storageKey);
+      return null;
+    }
+    if (data.config && data.config.apiBaseUrl && data.config.serverKey) {
+      return {
+        apiBaseUrl: data.config.apiBaseUrl,
+        serverKey: data.config.serverKey
+      };
+    }
+    return null;
+  } catch (error) {
+    console.error("Failed to retrieve KYC config:", error);
+    return null;
+  }
+}
+function clearExpiredConfigs() {
+  try {
+    const keys = Object.keys(localStorage);
+    const now = Date.now();
+    keys.forEach((key) => {
+      if (key.startsWith(STORAGE_PREFIX)) {
+        try {
+          const stored = localStorage.getItem(key);
+          if (stored) {
+            const data = JSON.parse(stored);
+            if (data.timestamp && now - data.timestamp > STORAGE_EXPIRY_MS) {
+              localStorage.removeItem(key);
+            }
+          }
+        } catch (error) {
+          localStorage.removeItem(key);
+        }
+      }
+    });
+  } catch (error) {
+    console.error("Failed to clear expired configs:", error);
+  }
+}
 function useDocumentUpload(callbacks) {
   const [state, setState] = React.useState({
     docType: "CNIC",
@@ -1687,22 +1762,36 @@ function MobileRouteContent({ onClose, onComplete }) {
 function MobileRoute({ onClose, onNavigate } = {}) {
   const [config, setConfig] = React.useState(null);
   React.useEffect(() => {
+    clearExpiredConfigs();
     if (!isMobileDevice() && onNavigate) {
       onNavigate("qr");
       return;
     }
     const searchParams = new URLSearchParams(window.location.search);
     const sessionId = searchParams.get("sessionId");
-    const apiBaseUrl = searchParams.get("apiBaseUrl") || searchParams.get("apiUrl") || "";
-    const serverKey = searchParams.get("serverKey") || "";
-    if (sessionId && apiBaseUrl && serverKey) {
-      setConfig({
-        apiBaseUrl,
-        sessionId,
-        serverKey
-      });
-    } else if (sessionId) {
-      console.error("Missing required parameters: apiBaseUrl and serverKey must be in URL");
+    if (sessionId) {
+      const storedConfig = getKycConfig(sessionId);
+      if (storedConfig) {
+        setConfig({
+          apiBaseUrl: storedConfig.apiBaseUrl,
+          sessionId,
+          serverKey: storedConfig.serverKey
+        });
+      } else {
+        const apiBaseUrl = searchParams.get("apiBaseUrl") || searchParams.get("apiUrl") || "";
+        const serverKey = searchParams.get("serverKey") || "";
+        if (apiBaseUrl && serverKey) {
+          setConfig({
+            apiBaseUrl,
+            sessionId,
+            serverKey
+          });
+        } else {
+          console.error("Missing required parameters: apiBaseUrl and serverKey not found in localStorage or URL");
+        }
+      }
+    } else {
+      console.error("Missing required parameter: sessionId must be in URL");
     }
   }, [onNavigate]);
   const handleClose = () => {
@@ -1733,7 +1822,7 @@ function MobileRoute({ onClose, onNavigate } = {}) {
   }
   return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "fixed inset-0 flex items-center justify-center bg-black/50 z-[1000]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "bg-white p-6 rounded-lg text-center max-w-md mx-4", children: [
     /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-red-600 mb-2", children: "Missing Configuration" }),
-    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-600", children: "Please ensure the URL includes sessionId, apiBaseUrl, and serverKey parameters." })
+    /* @__PURE__ */ jsxRuntime.jsx("p", { className: "text-sm text-gray-600", children: "Please ensure the URL includes sessionId parameter. The configuration should be stored automatically when scanning the QR code." })
   ] }) });
 }
 var MobileRoute_default = MobileRoute;
@@ -1741,20 +1830,14 @@ function QRCodePage({ onClose, mobileBaseUrl = "https://kyc-sdk.astraprotocol.co
   const [qrUrl, setQrUrl] = React.useState("");
   const [copied, setCopied] = React.useState(false);
   React.useEffect(() => {
-    const searchParams = new URLSearchParams(window.location.search);
-    if (sessionId) {
-      searchParams.set("sessionId", sessionId);
-    }
-    if (apiBaseUrl) {
-      searchParams.set("apiBaseUrl", apiBaseUrl);
+    if (sessionId && apiBaseUrl && serverKey) {
+      storeKycConfig(sessionId, apiBaseUrl, serverKey);
     }
-    if (serverKey) {
-      searchParams.set("serverKey", serverKey);
+    if (sessionId) {
+      const mobileRoute = "/mobileroute";
+      const fullUrl = `${mobileBaseUrl}${mobileRoute}?sessionId=${sessionId}`;
+      setQrUrl(fullUrl);
     }
-    const mobileRoute = "/mobileroute";
-    const queryString = searchParams.toString();
-    const fullUrl = `${mobileBaseUrl}${mobileRoute}${queryString ? `?${queryString}` : ""}`;
-    setQrUrl(fullUrl);
   }, [mobileBaseUrl, sessionId, apiBaseUrl, serverKey]);
   const handleCopyUrl = async () => {
     if (qrUrl) {
@@ -1796,7 +1879,7 @@ function QRCodePage({ onClose, mobileBaseUrl = "https://kyc-sdk.astraprotocol.co
       backgroundImage: `radial-gradient(circle at 2px 2px, rgba(255,255,255,0.15) 1px, transparent 0)`,
       backgroundSize: "40px 40px"
     } }),
-    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative bg-[rgba(20,20,20,0.95)] backdrop-blur-sm rounded-2xl p-5 sm:p-6 md:p-7 max-w-[450px] w-full h-[80vh] flex flex-col text-center shadow-[0_8px_32px_rgba(0,0,0,0.5)] border border-white/10", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-3 sm:gap-4 flex-1 overflow-y-auto custom__scrollbar", children: [
+    /* @__PURE__ */ jsxRuntime.jsx("div", { className: "relative bg-[rgba(20,20,20,0.95)] backdrop-blur-sm rounded-2xl p-5 sm:p-6 md:p-7 max-w-[450px] w-full h-[80vh] flex flex-col text-center shadow-[0_8px_32px_rgba(0,0,0,0.5)]", children: /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col items-center gap-3 sm:gap-4 flex-1 overflow-y-auto custom__scrollbar", children: [
       /* @__PURE__ */ jsxRuntime.jsx("h1", { className: "m-0 text-white text-xl sm:text-2xl font-semibold leading-tight", children: "Continue on Mobile" }),
       /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 text-white text-sm sm:text-base opacity-90 leading-relaxed", children: "Scan this QR on your phone to capture your face and document" }),
       qrUrl && /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex justify-center items-center p-3 sm:p-4 bg-black rounded-xl border-2 border-white shadow-lg", children: /* @__PURE__ */ jsxRuntime.jsx(
@@ -1813,7 +1896,7 @@ function QRCodePage({ onClose, mobileBaseUrl = "https://kyc-sdk.astraprotocol.co
       /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full text-left mt-auto", children: [
         /* @__PURE__ */ jsxRuntime.jsx("p", { className: "m-0 mb-2 text-white text-xs sm:text-sm opacity-80", children: "Or open:" }),
         /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "flex flex-col sm:flex-row items-start sm:items-center gap-2 p-2 sm:p-3 bg-white/10 rounded-lg border border-white/20", children: [
-          /* @__PURE__ */ jsxRuntime.jsx("code", { className: "flex-1 text-white text-xs sm:text-sm break-all text-left m-0 font-mono line-clamp-1", children: qrUrl }),
+          /* @__PURE__ */ jsxRuntime.jsx("code", { className: "flex-1 text-white text-xs sm:text-sm break-all text-left m-0 font-mono line-clamp-1 ", children: qrUrl }),
           /* @__PURE__ */ jsxRuntime.jsx(
             "button",
             {