@evervault/evervault-react-native 1.1.0 → 1.2.1

package/src/components/3DS/threeDSSession.ts

@@ -0,0 +1,132 @@
+import {
+  ThreeDSecureCallbacks,
+  ThreeDSecureSessionsParams,
+  ThreeDSecureSession,
+  ThreeDSecureSessionResponse,
+} from "./types";
+import { EV_API_DOMAIN } from "./config";
+
+const stopPolling = (
+  intervalRef: React.MutableRefObject<NodeJS.Timeout | null>,
+  setIsVisible: (show: boolean) => void,
+) => {
+  setIsVisible(false);
+  clearInterval(intervalRef.current!);
+  intervalRef.current = null;
+}
+
+export const startSession = async (
+  session: ThreeDSecureSession,
+  callbacks: ThreeDSecureCallbacks,
+  intervalRef: React.MutableRefObject<NodeJS.Timeout | null>,
+  setIsVisible: (show: boolean) => void
+) => {
+  try {
+    const sessionState = await session.get();
+
+    switch (sessionState.status) {
+      case "success":
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onSuccess();
+        break;
+      case "failure":
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onFailure(new Error("3DS session failed"));
+        break;
+      case "action-required":
+        setIsVisible(true);
+        pollSession(session, callbacks, intervalRef, setIsVisible);
+        break;
+      default:
+        break;
+    }
+  } catch (error) {
+    console.error("Error checking session state", error);
+    callbacks.onError(new Error("Failed to check 3DS session state"));
+  }
+};
+
+export const pollSession = (
+  session: ThreeDSecureSession,
+  callbacks: ThreeDSecureCallbacks,
+  intervalRef: React.MutableRefObject<NodeJS.Timeout | null>,
+  setIsVisible: (show: boolean) => void,
+  interval: number = 3000
+) => {
+  intervalRef.current = setInterval(async () => {
+    try {
+      const pollResponse: ThreeDSecureSessionResponse = await session.get();
+      if (pollResponse.status === "success") {
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onSuccess();
+      } else if (pollResponse.status === "failure") {
+        stopPolling(intervalRef, setIsVisible);
+        callbacks.onFailure(new Error("3DS session failed"));
+      } else {
+        setIsVisible(true);
+      }
+    } catch (error) {
+      stopPolling(intervalRef, setIsVisible);
+      console.error("Error polling session", error);
+      callbacks.onError(new Error("Error polling 3DS session"));
+    }
+  }, interval);
+};
+
+export function threeDSecureSession({
+  sessionId,
+  appId,
+  callbacks,
+  intervalRef,
+  setIsVisible,
+}: ThreeDSecureSessionsParams): ThreeDSecureSession {
+  const get = async (): Promise<ThreeDSecureSessionResponse> => {
+    try {
+      const response = await fetch(
+        `https://${EV_API_DOMAIN}/frontend/3ds/browser-sessions/${sessionId}`,
+        {
+          headers: {
+            "x-evervault-app-id": appId,
+          },
+        }
+      );
+
+      const result = (await response.json()) as ThreeDSecureSessionResponse;
+      return result;
+    } catch (error) {
+      console.error("Error fetching 3DS session status", error);
+      throw error;
+    }
+  };
+
+  const cancel = async (): Promise<void> => {
+    try {
+      await fetch(
+        `https://${EV_API_DOMAIN}/frontend/3ds/browser-sessions/${sessionId}`,
+        {
+          method: "PATCH",
+          headers: {
+            "Content-Type": "application/json",
+            "x-evervault-app-id": appId,
+          },
+          body: JSON.stringify({ outcome: "cancelled" }),
+        }
+      );
+
+      callbacks.onFailure(new Error("3DS session cancelled by user"));
+      setIsVisible(false);
+      if (intervalRef.current) {
+        clearInterval(intervalRef.current);
+      }
+    } catch (error) {
+      console.error("Error cancelling 3DS session", error);
+      throw error;
+    }
+  };
+
+  return {
+    sessionId,
+    get,
+    cancel,
+  } as ThreeDSecureSession;
+}

package/src/components/3DS/types.ts

@@ -0,0 +1,46 @@
+
+export interface ThreeDSecureCallbacks {
+  onError: (error: Error) => void;
+  onFailure: (error: Error) => void;
+  onSuccess: () => void;
+}
+
+export interface ThreeDSecureInitialState {
+  session: ThreeDSecureSession | null;
+  isVisible: boolean;
+}
+
+export interface ThreeDSecureProviderProps {
+  children: React.ReactNode;
+  state: ThreeDSecureState;
+}
+
+export interface ThreeDSecureSession {
+  cancel: () => Promise<void>;
+  get: () => Promise<ThreeDSecureSessionResponse>;
+  sessionId: string;
+}
+
+export interface ThreeDSecureSessionResponse {
+  nextAction: {
+    creq?: string;
+    type: string;
+    url?: string;
+  };
+  status: SessionStatus;
+}
+
+export interface ThreeDSecureSessionsParams {
+  appId: string;
+  callbacks: ThreeDSecureCallbacks;
+  intervalRef: React.MutableRefObject<NodeJS.Timeout | null>;
+  sessionId: string;
+  setIsVisible: (show: boolean) => void;
+}
+
+export interface ThreeDSecureState extends ThreeDSecureInitialState {
+  cancel: () => Promise<void>;
+  start: (sessionId: string, callbacks: ThreeDSecureCallbacks) => void;
+}
+
+type SessionStatus = "action-required" | "failure" | "success";

package/src/components/3DS/useThreeDSecure.tsx

@@ -0,0 +1,51 @@
+import { useState } from "react";
+import { useRef } from "react";
+import { useEvervault } from "../EvervaultProvider";
+import { startSession, threeDSecureSession } from "./threeDSSession";
+import {
+  ThreeDSecureCallbacks,
+  ThreeDSecureSession,
+  ThreeDSecureState
+} from "./types";
+
+export const useThreeDSecure = (): ThreeDSecureState => {
+  const { appUuid } = useEvervault();
+  const intervalRef = useRef<NodeJS.Timeout | null>(null);
+  const [session, setSession] = useState<ThreeDSecureSession | null>(null)  
+  const [isVisible, setIsVisible] = useState(false); 
+
+  if (!appUuid) {
+    throw new Error(
+      "useThreeDSecure must be used within an Evervault Provider"
+    );
+  }
+
+  const start = (sessionId: string, callbacks: ThreeDSecureCallbacks) => {
+    const session = threeDSecureSession({
+      sessionId,
+      appId: appUuid,
+      callbacks,
+      intervalRef,
+      setIsVisible,
+    });
+
+    setSession(session);
+
+    startSession(session, callbacks, intervalRef, setIsVisible);
+  };
+
+  const cancel = async () => {
+    if (session) {
+      await session.cancel();
+    } else {
+      console.warn("No 3DS session to cancel");
+    }
+  };
+
+  return {
+    start,
+    cancel,
+    session,
+    isVisible: isVisible,
+  };
+};

package/src/components/Card/types.ts

@@ -11,7 +11,8 @@ export type CardBrandName =
   | "elo"
   | "hipercard"
   | "hiper"
-  | "szep";
+  | "szep"
+  | "uatp";
 
 export interface CardConfig {
   acceptedBrands?: CardBrandName[];

package/src/index.tsx

@@ -1,4 +1,5 @@
 export { type CardProps, Card } from "./components/Card";
+export { ThreeDSecure, useThreeDSecure } from "./components/3DS";
 export { init, encrypt } from "./sdk";
 export type {
   CardPayload,