@glomopay/react-native-sdk 1.3.4 → 2.0.1

package/lib/use-lrs-checkout.d.ts

@@ -2,9 +2,16 @@
 import React from "react";
 import { type NativeSyntheticEvent } from "react-native";
 import { WebViewNavigation, WebViewMessageEvent, type WebView } from "react-native-webview";
+import { type GlomoLrsServer } from "./config/base";
 import { type SdkError } from "./utils/analytics";
 /** LRS checkout statuses */
 export type LrsCheckoutStatus = "ready" | "payment_in_progress" | "payment_successful" | "payment_failed" | "payment_cancelled";
+/**
+ * Tracks whether the education carousel WebView has signalled that it has content to show.
+ * - "pending": waiting for the carousel to report its state (default/reset value)
+ * - "hasContent": carousel sent lrs.has_education_steps and should be shown to the user
+ */
+export type EducationCarouselState = "pending" | "hasContent";
 /** The payload for a successful or failed payment */
 export interface GlomoLrsCheckoutPayload {
     orderId: string;
@@ -13,7 +20,7 @@ export interface GlomoLrsCheckoutPayload {
 }
 /** The options for the useLrsCheckout hook */
 export interface UseLrsCheckoutOptions {
-    server?: string;
+    server?: GlomoLrsServer;
     publicKey: string;
     orderId: string;
     onPaymentSuccess: (payload: GlomoLrsCheckoutPayload) => void;
@@ -30,11 +37,15 @@ export interface UseLrsCheckoutReturn {
     showCheckout: boolean;
     flowWebViewUrl: string;
     showFlowWebView: boolean;
+    educationCarouselUrl: string;
+    educationCarouselState: EducationCarouselState;
     checkoutUrl: string;
     mainWebViewRef: React.RefObject<WebView>;
     flowWebViewRef: React.RefObject<WebView>;
+    educationCarouselWebViewRef: React.RefObject<WebView>;
     handleMainWebViewMessage: (event: WebViewMessageEvent) => void;
     handleFlowWebViewMessage: (event: WebViewMessageEvent) => void;
+    handleEducationCarouselWebViewMessage: (event: WebViewMessageEvent) => void;
     handleError: (syntheticEvent: NativeSyntheticEvent<{
         code?: number;
         domain?: string;
@@ -46,8 +57,10 @@ export interface UseLrsCheckoutReturn {
     }>) => void;
     handleNavigationStateChange: (navState: WebViewNavigation) => void;
     handleModalBackButton: () => void;
+    handleFlowBack: () => void;
     injectedMain?: string;
     injectedFlow?: string;
+    injectedEducationCarousel?: string;
 }
 /** The main SDK hook for the GlomoPay LRS Checkout flow */
 export declare function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymentFailure, onConnectionError, onPaymentTerminate, onSdkError, devMode, }: UseLrsCheckoutOptions, mockMode: boolean): UseLrsCheckoutReturn;

package/lib/use-lrs-checkout.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"use-lrs-checkout.d.ts","sourceRoot":"","sources":["../src/use-lrs-checkout.tsx"],"names":[],"mappings":"AAAA,uDAAuD;AAEvD,OAAO,KAA4D,MAAM,OAAO,CAAC;AACjF,OAAO,EAAY,KAAK,oBAAoB,EAAE,MAAM,cAAc,CAAC;AAEnE,OAAO,EAAE,iBAAiB,EAAE,mBAAmB,EAAE,KAAK,OAAO,EAAE,MAAM,sBAAsB,CAAC;AAO5F,OAAO,EAYH,KAAK,QAAQ,EAChB,MAAM,mBAAmB,CAAC;AAE3B,4BAA4B;AAC5B,MAAM,MAAM,iBAAiB,GAEvB,OAAO,GAGP,qBAAqB,GAGrB,oBAAoB,GAGpB,gBAAgB,GAGhB,mBAAmB,CAAC;AAE1B,qDAAqD;AACrD,MAAM,WAAW,uBAAuB;IACpC,OAAO,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,EAAE,MAAM,CAAC;CACrB;AAED,8CAA8C;AAC9C,MAAM,WAAW,qBAAqB;IAClC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;IAChB,gBAAgB,EAAE,CAAC,OAAO,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC7D,gBAAgB,EAAE,CAAC,OAAO,EAAE,uBAAuB,KAAK,IAAI,CAAC;IAC7D,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,KAAK,IAAI,CAAC;IAC7C,kBAAkB,CAAC,EAAE,MAAM,IAAI,CAAC;IAChC,UAAU,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,QAAQ,CAAC,KAAK,IAAI,CAAC;IAC9C,OAAO,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,oDAAoD;AACpD,MAAM,WAAW,oBAAoB;IACjC,KAAK,EAAE,MAAM,OAAO,CAAC;IACrB,MAAM,EAAE,iBAAiB,CAAC;IAC1B,YAAY,EAAE,OAAO,CAAC;IACtB,cAAc,EAAE,MAAM,CAAC;IACvB,eAAe,EAAE,OAAO,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;IACpB,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IACzC,cAAc,EAAE,KAAK,CAAC,SAAS,CAAC,OAAO,CAAC,CAAC;IACzC,wBAAwB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC/D,wBAAwB,EAAE,CAAC,KAAK,EAAE,mBAAmB,KAAK,IAAI,CAAC;IAC/D,WAAW,EAAE,CACT,cAAc,EAAE,oBAAoB,CAAC;QAAE,IAAI,CAAC,EAAE,MAAM,CAAC;QAAC,MAAM,CAAC,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,KAC7F,IAAI,CAAC;IACV,eAAe,EAAE,CAAC,cAAc,EAAE,oBAAoB,CAAC;QAAE,UAAU,EAAE,MAAM,CAAC;QAAC,WAAW,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,KAAK,IAAI,CAAC;IAC9G,2BAA2B,EAAE,CAAC,QAAQ,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACnE,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAClC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,YAAY,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,2DAA2D;AAC3D,wBAAgB,cAAc,CAC1B,EACI,MAAM,EACN,SAAS,EACT,OAAO,EACP,gBAAgB,EAChB,gBAAgB,EAChB,iBAAiB,EACjB,kBAAkB,EAClB,UAAU,EACV,OAAe,GAClB,EAAE,qBAAqB,EACxB,QAAQ,EAAE,OAAO,GAClB,oBAAoB,CAmuBtB"}
+{"version":3,"file":"use-lrs-checkout.d.ts","sourceRoot":"","sources":["../src/use-lrs-checkout.tsx"],"names":[],"mappings":"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"}

package/lib/use-lrs-checkout.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.useLrsCheckout = useLrsCheckout;
 const react_1 = require("react");
 const react_native_1 = require("react-native");
-const injections_1 = require("./injections");
+const index_1 = require("./injections/index");
 const segment_1 = require("./config/segment");
 const base_1 = require("./config/base");
 const validation_1 = require("./utils/validation");
@@ -15,8 +15,10 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
     // Refs for the WebViews
     const mainWebViewRef = (0, react_1.useRef)(null);
     const flowWebViewRef = (0, react_1.useRef)(null);
-    // Using the server prop if provided, otherwise using the default production URL
-    const baseCheckoutUrl = (0, react_1.useMemo)(() => server !== null && server !== void 0 ? server : base_1.DEFAULT_BASE_CHECKOUT_URL, [server]);
+    const educationCarouselWebViewRef = (0, react_1.useRef)(null);
+    // Resolving checkout and carousel URLs from the selected SDK server
+    const serverConfig = (0, react_1.useMemo)(() => (0, base_1.resolveServerConfig)(server), [server]);
+    const baseCheckoutUrl = serverConfig.checkoutBaseUrl;
     /**
      * The main checkout URL for the LRS flow
      * In future, this needs to come from the LRS Checkout SDK.
@@ -66,12 +68,60 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
             return "";
         }
     }, [baseCheckoutUrl, orderId, publicKey, mockMode, devMode, onSdkError]);
+    /**
+     * The education carousel URL, built from the server config with the current orderId and publicKey.
+     * Loaded in a hidden WebView alongside the flow WebView; shown only once the carousel signals it has content.
+     */
+    const educationCarouselUrl = (0, react_1.useMemo)(() => {
+        try {
+            const baseEducationCarouselUrl = serverConfig.educationCarouselBaseUrl;
+            const separator = baseEducationCarouselUrl.includes("?") ? "&" : "?";
+            const finalUrl = `${baseEducationCarouselUrl}${separator}orderId=${encodeURIComponent(orderId)}` +
+                `&publicKey=${encodeURIComponent(publicKey)}`;
+            if (!(0, validation_1.isValidUrl)(finalUrl)) {
+                if (devMode) {
+                    console.error("[GlomoPay RN SDK] Generated invalid education carousel URL:", finalUrl);
+                }
+                const errors = [
+                    {
+                        type: "validation_error",
+                        message: "Generated invalid education carousel URL",
+                    },
+                ];
+                (0, analytics_1.trackSdkError)(errors, orderId, publicKey, devMode, mockMode, finalUrl ? finalUrl : finalUrl === null ? "null" : "undefined");
+                return "";
+            }
+            if (devMode) {
+                console.log("[GlomoPay RN SDK] Education Carousel URL:", finalUrl);
+            }
+            return finalUrl;
+        }
+        catch (error) {
+            if (devMode) {
+                console.error("[GlomoPay RN SDK] Error building education carousel URL:", error);
+            }
+            const errors = [
+                {
+                    type: "validation_error",
+                    message: `Error building education carousel URL: ${error instanceof Error ? error.message : "Unknown error"}`,
+                },
+            ];
+            (0, analytics_1.trackSdkError)(errors, orderId, publicKey, devMode, mockMode, "");
+            return "";
+        }
+    }, [serverConfig, orderId, publicKey, devMode, mockMode]);
     // Checkout status state
     const [status, setStatus] = (0, react_1.useState)("ready");
     // Visibility state for the main checkout modal
     const [showCheckout, setShowCheckout] = (0, react_1.useState)(false);
     const [showFlowWebView, setShowFlowWebView] = (0, react_1.useState)(false);
     const [flowWebViewUrl, setFlowWebViewUrl] = (0, react_1.useState)("");
+    const [educationCarouselState, setEducationCarouselState] = (0, react_1.useState)("pending");
+    (0, react_1.useEffect)(() => {
+        if (devMode) {
+            console.log(`[GlomoPay RN SDK] Carousel state snapshot: status=${status}, showCheckout=${showCheckout}, showFlowWebView=${showFlowWebView}, flowWebViewUrl=${flowWebViewUrl || "<empty>"}, educationCarouselState=${educationCarouselState}, educationCarouselUrl=${educationCarouselUrl || "<empty>"}`);
+        }
+    }, [devMode, status, showCheckout, showFlowWebView, flowWebViewUrl, educationCarouselState, educationCarouselUrl]);
     // Handler for the WebView errors
     const handleError = (0, react_1.useCallback)((syntheticEvent) => {
         try {
@@ -100,6 +150,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                 setShowCheckout(false);
                 setShowFlowWebView(false);
                 setFlowWebViewUrl("");
+                setEducationCarouselState("pending");
                 // Calling onConnectionError callback if provided
                 (0, validation_1.safeCallback)(onConnectionError, [nativeEvent], "onConnectionError", devMode);
                 // Tracking connection error
@@ -116,7 +167,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                 console.error("[GlomoPay RN SDK] Error in handleError:", error);
             }
         }
-    }, [devMode, onConnectionError, checkoutUrl]);
+    }, [devMode, onConnectionError, checkoutUrl, orderId, publicKey, mockMode]);
     // Handler for the WebView HTTP errors
     const handleHttpError = (0, react_1.useCallback)((syntheticEvent) => {
         try {
@@ -163,6 +214,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                     }
                     setFlowWebViewUrl(url);
                     setShowFlowWebView(true);
+                    setEducationCarouselState("pending");
                     // Tracking window.open interception
                     (0, analytics_1.trackWindowOpen)("main", url, orderId, publicKey, devMode, mockMode, checkoutUrl);
                 }
@@ -179,6 +231,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                 }
                 setShowFlowWebView(false);
                 setFlowWebViewUrl("");
+                setEducationCarouselState("pending");
                 // Tracking window.close interception
                 (0, analytics_1.trackWindowClose)("main", orderId, publicKey, devMode, mockMode, checkoutUrl);
                 return;
@@ -197,6 +250,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                         setShowCheckout(false);
                         setShowFlowWebView(false);
                         setFlowWebViewUrl("");
+                        setEducationCarouselState("pending");
                         setStatus("payment_successful");
                         (0, validation_1.safeCallback)(onPaymentSuccess, [payload], "onPaymentSuccess", devMode);
                         // Tracking payment success callback
@@ -219,6 +273,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                         setShowCheckout(false);
                         setShowFlowWebView(false);
                         setFlowWebViewUrl("");
+                        setEducationCarouselState("pending");
                         setStatus("payment_failed");
                         (0, validation_1.safeCallback)(onPaymentFailure, [payload], "onPaymentFailure", devMode);
                         // Tracking payment failure callback
@@ -239,6 +294,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                     setShowCheckout(false);
                     setShowFlowWebView(false);
                     setFlowWebViewUrl("");
+                    setEducationCarouselState("pending");
                     (0, validation_1.safeCallback)(onPaymentTerminate, [], "onPaymentTerminate", devMode);
                     // Tracking payment terminate callback
                     (0, analytics_1.trackPaymentTerminate)(orderId, "checkout_closed", publicKey, devMode, mockMode, checkoutUrl);
@@ -282,6 +338,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                         console.log(`[GlomoPay RN SDK] window.open called from FlowWebView: ${url}`);
                     }
                     setFlowWebViewUrl(url);
+                    setEducationCarouselState("pending");
                     // Tracking window.open interception
                     (0, analytics_1.trackWindowOpen)("flow", url, orderId, publicKey, devMode, mockMode, checkoutUrl);
                 }
@@ -298,6 +355,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                 }
                 setShowFlowWebView(false);
                 setFlowWebViewUrl("");
+                setEducationCarouselState("pending");
                 // Tracking window.close interception
                 (0, analytics_1.trackWindowClose)("flow", orderId, publicKey, devMode, mockMode, checkoutUrl);
                 return;
@@ -315,6 +373,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                         setShowFlowWebView(false);
                         setShowCheckout(false);
                         setFlowWebViewUrl("");
+                        setEducationCarouselState("pending");
                         setStatus("payment_successful");
                         (0, validation_1.safeCallback)(onPaymentSuccess, [payload], "onPaymentSuccess", devMode);
                         // Tracking payment success callback
@@ -337,6 +396,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                         setShowFlowWebView(false);
                         setShowCheckout(false);
                         setFlowWebViewUrl("");
+                        setEducationCarouselState("pending");
                         setStatus("payment_failed");
                         (0, validation_1.safeCallback)(onPaymentFailure, [payload], "onPaymentFailure", devMode);
                         // Tracking payment failure callback
@@ -357,6 +417,43 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
             }
         }
     }, [onPaymentSuccess, onPaymentFailure, devMode, mockMode, orderId, publicKey, flowWebViewUrl, checkoutUrl]);
+    // Handler for the education carousel WebView messages
+    const handleEducationCarouselWebViewMessage = (0, react_1.useCallback)((event) => {
+        var _a;
+        try {
+            const data = (_a = event.nativeEvent) === null || _a === void 0 ? void 0 : _a.data;
+            if (!data || typeof data !== "string") {
+                if (devMode) {
+                    console.warn("[GlomoPay RN SDK] Invalid message data from EducationCarouselWebView");
+                }
+                return;
+            }
+            const message = JSON.parse(data);
+            if (devMode) {
+                console.log("[GlomoPay RN SDK] EducationCarouselWebView Message received:", message.type, message);
+            }
+            if (message.type === "console") {
+                if (devMode) {
+                    console.log(`[GlomoPay RN SDK] [EducationCarousel] ${message.message}`);
+                }
+                return;
+            }
+            if (message.type === "lrs.has_education_steps") {
+                const nextState = "hasContent";
+                if (devMode) {
+                    console.log(`[GlomoPay RN SDK] Education carousel signal received: value=${String(message.value)} source=${message.source || "unknown"} payload=${JSON.stringify(message.payload || {})}`);
+                }
+                (0, analytics_1.trackEducationStepsShown)(orderId, publicKey, devMode, mockMode, checkoutUrl, message.source);
+                setEducationCarouselState(nextState);
+                return;
+            }
+        }
+        catch (error) {
+            if (devMode) {
+                console.error("[GlomoPay RN SDK] Error parsing EducationCarouselWebView message:", error);
+            }
+        }
+    }, [checkoutUrl, devMode, mockMode, orderId, publicKey]);
     // Handler for the navigation state changes
     const handleNavigationStateChange = (0, react_1.useCallback)((navState) => {
         if (devMode) {
@@ -372,6 +469,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
             if (showFlowWebView) {
                 setShowFlowWebView(false);
                 setFlowWebViewUrl("");
+                setEducationCarouselState("pending");
             }
             setShowCheckout(false);
             if (status === "payment_in_progress") {
@@ -395,7 +493,17 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
                 console.error("[GlomoPay RN SDK] Error in handleModalBackButton:", error);
             }
         }
-    }, [showFlowWebView, devMode, onPaymentTerminate, status, orderId, mockMode, checkoutUrl]);
+    }, [showFlowWebView, devMode, onPaymentTerminate, status, orderId, publicKey, mockMode, checkoutUrl]);
+    /** Closes the flow WebView and returns to the main checkout */
+    const handleFlowBack = (0, react_1.useCallback)(() => {
+        if (devMode) {
+            console.log("[GlomoPay RN SDK] Flow WebView back button pressed");
+        }
+        setShowFlowWebView(false);
+        setFlowWebViewUrl("");
+        setEducationCarouselState("pending");
+        (0, analytics_1.trackWindowClose)("flow", orderId, publicKey, devMode, mockMode, checkoutUrl);
+    }, [devMode, orderId, publicKey, mockMode, checkoutUrl]);
     /**
      * Initiator method for the LRS Checkout flow.
      * Using a ref, the LRS flow can be started by calling this method.
@@ -523,6 +631,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
         }
         setShowFlowWebView(false);
         setFlowWebViewUrl("");
+        setEducationCarouselState("pending");
         setStatus("payment_in_progress");
         // Tracking successful start
         (0, analytics_1.trackStartSuccess)(orderId, publicKey, devMode, mockMode, checkoutUrl, jailbreakDetectionInfo);
@@ -536,7 +645,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
     // Resetting checkout flow if orderId or publicKey are changed
     (0, react_1.useEffect)(() => {
         if (orderId && publicKey) {
-            // Only resetting the checkout flow if the current status is that ofa terminal state
+            // Only resetting the checkout flow if the current status is that of a terminal state
             if (status === "payment_successful" || status === "payment_failed" || status === "payment_cancelled") {
                 if (devMode) {
                     console.log(`[GlomoPay RN SDK] Resetting checkout status ${status} for new orderId ${orderId} and publicKey ${publicKey}`);
@@ -553,6 +662,7 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
             setShowCheckout(false);
             setShowFlowWebView(false);
             setFlowWebViewUrl("");
+            setEducationCarouselState("pending");
         };
     }, []);
     return {
@@ -561,16 +671,22 @@ function useLrsCheckout({ server, publicKey, orderId, onPaymentSuccess, onPaymen
         showCheckout,
         flowWebViewUrl,
         showFlowWebView,
+        educationCarouselUrl,
+        educationCarouselState,
         checkoutUrl,
         mainWebViewRef,
         flowWebViewRef,
+        educationCarouselWebViewRef,
         handleMainWebViewMessage,
         handleFlowWebViewMessage,
+        handleEducationCarouselWebViewMessage,
         handleError,
         handleHttpError,
         handleNavigationStateChange,
         handleModalBackButton,
-        injectedMain: injections_1.InjectionScripts.main,
-        injectedFlow: injections_1.InjectionScripts.flow,
+        handleFlowBack,
+        injectedMain: index_1.InjectionScripts.main,
+        injectedFlow: index_1.InjectionScripts.flow,
+        injectedEducationCarousel: index_1.InjectionScripts.educationCarousel,
     };
 }

package/lib/utils/analytics.d.ts

@@ -152,6 +152,17 @@ export declare function trackPaymentTerminate(orderId: string, source: "user_dis
  * @param lrsUrl - The LRS checkout URL
  */
 export declare function trackConnectionError(orderId: string, errorCode: number | undefined, publicKey: string, devMode?: boolean, mockMode?: boolean, lrsUrl?: string): void;
+/**
+ * Tracks when the education carousel reports that it has visible education steps
+ *
+ * @param orderId - The order ID
+ * @param publicKey - The public key of the merchant
+ * @param devMode - Whether dev mode is enabled
+ * @param mockMode - Whether mock mode is enabled
+ * @param lrsUrl - The LRS checkout URL
+ * @param source - Where the carousel event originated
+ */
+export declare function trackEducationStepsShown(orderId: string, publicKey: string, devMode?: boolean, mockMode?: boolean, lrsUrl?: string, source?: string): void;
 /**
  * Tracks when onSdkError callback is invoked
  *

package/lib/utils/analytics.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"analytics.d.ts","sourceRoot":"","sources":["../../src/utils/analytics.ts"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AAIH;;GAEG;AACH,MAAM,WAAW,qBAAqB;IAClC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B;AAED,4BAA4B;AAC5B,MAAM,WAAW,QAAQ;IACrB,IAAI,EAAE,kBAAkB,GAAG,kBAAkB,CAAC;IAC9C,OAAO,EAAE,MAAM,CAAC;IAChB,KAAK,CAAC,EAAE,WAAW,GAAG,SAAS,GAAG,iBAAiB,GAAG,sBAAsB,CAAC;CAChF;AAuHD;;;;;;;;;GASG;AACH,wBAAgB,iBAAiB,CAC7B,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,EACf,sBAAsB,CAAC,EAAE;IACrB,kCAAkC,EAAE,OAAO,CAAC;IAC5C,iBAAiB,EAAE,OAAO,GAAG,IAAI,CAAC;CACrC,GACF,IAAI,CAcN;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAC7B,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,EACf,sBAAsB,CAAC,EAAE;IACrB,kCAAkC,EAAE,OAAO,CAAC;IAC5C,iBAAiB,EAAE,OAAO,GAAG,IAAI,CAAC;CACrC,GACF,IAAI,CAeN;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAC7B,MAAM,EAAE,kBAAkB,GAAG,kBAAkB,GAAG,oBAAoB,GAAG,gBAAgB,GAAG,aAAa,EACzG,OAAO,CAAC,EAAE,MAAM,EAChB,SAAS,CAAC,EAAE,MAAM,EAClB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,EACf,sBAAsB,CAAC,EAAE;IACrB,kCAAkC,EAAE,OAAO,CAAC;IAC5C,iBAAiB,EAAE,OAAO,GAAG,IAAI,CAAC;CACrC,GACF,IAAI,CAeN;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,eAAe,CAC3B,MAAM,EAAE,MAAM,GAAG,MAAM,EACvB,GAAG,EAAE,MAAM,EACX,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAYN;AAED;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAC5B,MAAM,EAAE,MAAM,GAAG,MAAM,EACvB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAWN;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,2BAA2B,CACvC,WAAW,EAAE,MAAM,GAAG,MAAM,EAC5B,IAAI,EAAE,OAAO,EACb,GAAG,EAAE,MAAM,GAAG,SAAS,EACvB,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAgCN;AAED;;;;;;;;;GASG;AACH,wBAAgB,mBAAmB,CAC/B,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAWN;AAED;;;;;;;;;GASG;AACH,wBAAgB,mBAAmB,CAC/B,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,EACjB,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAWN;AAED;;;;;;;;;GASG;AACH,wBAAgB,qBAAqB,CACjC,OAAO,EAAE,MAAM,EACf,MAAM,EAAE,cAAc,GAAG,aAAa,GAAG,iBAAiB,EAC1D,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAWN;AAED;;;;;;;;;GASG;AACH,wBAAgB,oBAAoB,CAChC,OAAO,EAAE,MAAM,EACf,SAAS,EAAE,MAAM,GAAG,SAAS,EAC7B,SAAS,EAAE,MAAM,EACjB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAWN;AAED;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CACzB,MAAM,EAAE,KAAK,CAAC,QAAQ,CAAC,EACvB,OAAO,CAAC,EAAE,MAAM,EAChB,SAAS,CAAC,EAAE,MAAM,EAClB,OAAO,GAAE,OAAe,EACxB,QAAQ,GAAE,OAAe,EACzB,MAAM,CAAC,EAAE,MAAM,GAChB,IAAI,CAYN;AAED;;;;;;GAMG;AACH,wBAAgB,oBAAoB,CAAC,OAAO,GAAE,OAAe,GAAG,OAAO,CAYtE"}
+{"version":3,"file":"analytics.d.ts","sourceRoot":"","sources":["../../src/utils/analytics.ts"],"names":[],"mappings":"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"}

package/lib/utils/analytics.js

@@ -21,6 +21,7 @@ exports.trackPaymentSuccess = trackPaymentSuccess;
 exports.trackPaymentFailure = trackPaymentFailure;
 exports.trackPaymentTerminate = trackPaymentTerminate;
 exports.trackConnectionError = trackConnectionError;
+exports.trackEducationStepsShown = trackEducationStepsShown;
 exports.trackSdkError = trackSdkError;
 exports.checkAnalyticsStatus = checkAnalyticsStatus;
 const segment_1 = require("../config/segment");
@@ -386,6 +387,27 @@ function trackConnectionError(orderId, errorCode, publicKey, devMode = false, mo
         }
     });
 }
+/**
+ * Tracks when the education carousel reports that it has visible education steps
+ *
+ * @param orderId - The order ID
+ * @param publicKey - The public key of the merchant
+ * @param devMode - Whether dev mode is enabled
+ * @param mockMode - Whether mock mode is enabled
+ * @param lrsUrl - The LRS checkout URL
+ * @param source - Where the carousel event originated
+ */
+function trackEducationStepsShown(orderId, publicKey, devMode = false, mockMode = false, lrsUrl, source) {
+    const properties = {
+        ...buildCommonProperties(orderId, publicKey, devMode, mockMode, lrsUrl),
+        ...(source && { source }),
+    };
+    trackEvent("LRS Has Education Steps", properties, devMode).catch((error) => {
+        if (devMode) {
+            console.error(`[GlomoPay RN SDK] Event tracking error on education steps shown event:`, error);
+        }
+    });
+}
 /**
  * Tracks when onSdkError callback is invoked
  *

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@glomopay/react-native-sdk",
-    "version": "1.3.4",
+    "version": "2.0.1",
     "description": "The React Native SDK for GlomoPay",
     "license": "Apache-2.0",
     "main": "lib/index.js",

package/src/config/base.ts

@@ -3,8 +3,38 @@
  * This file contains the default base configuration variables for the GlomoPay RN SDK.
  */
 
-/**
- * The default URL points to the production environment.
- * - DEFAULT_BASE_CHECKOUT_URL: The default base checkout URL for the LRS checkout flow.
- */
-export const DEFAULT_BASE_CHECKOUT_URL = "https://lrs-checkout.glomopay.com/";
+/** The publicly documented server environments for the SDK */
+export type GlomoLrsServer = "prod" | "staging";
+
+/** Internal extension that adds "local" for development use — not exported */
+type InternalGlomoLrsServer = GlomoLrsServer | "local";
+
+/** Base URLs for a given server environment */
+export interface GlomoLrsServerConfig {
+    checkoutBaseUrl: string;
+    educationCarouselBaseUrl: string;
+}
+
+export const DEFAULT_SERVER: InternalGlomoLrsServer = "prod";
+
+export const SERVER_CONFIGS: Record<InternalGlomoLrsServer, GlomoLrsServerConfig> = {
+    prod: {
+        checkoutBaseUrl: "https://lrs-checkout.glomopay.com/",
+        educationCarouselBaseUrl: "https://glomopay-utilities.web.app/lrs-education-carousel/",
+    },
+    staging: {
+        checkoutBaseUrl: "https://lrs-checkout-page-staging.web.app/",
+        educationCarouselBaseUrl: "https://glomopay-utilities-staging.web.app/lrs-education-carousel/",
+    },
+    local: {
+        checkoutBaseUrl: "http://localhost:6870/",
+        educationCarouselBaseUrl: "http://localhost:6871/lrs-education-carousel/",
+    },
+};
+
+/** Returns the server config for the given environment, falling back to the default (prod) server */
+export function resolveServerConfig(server?: InternalGlomoLrsServer): GlomoLrsServerConfig {
+    const resolvedServer = server && server in SERVER_CONFIGS ? server : DEFAULT_SERVER;
+
+    return SERVER_CONFIGS[resolvedServer];
+}