@glomopay/react-native-sdk 2.0.2 → 3.1.0

package/src/injections/webview-standard.injection.ts

@@ -0,0 +1,211 @@
+/** Injection JavaScript for the Standard Checkout WebView */
+export const injectedScript: string = `
+    (function() {
+      // Log prefix for all messages originating from the standard checkout WebView
+      const LOG_PREFIX = 'STANDARD_WEBVIEW: ';
+
+      /**
+       * Formats an array of arguments into a single prefixed string for posting back to React Native.
+       * Objects are JSON-stringified; primitives are coerced to strings.
+       */
+      function formatMessage(args) {
+        return args.map(function(arg) {
+          if (typeof arg === 'object') {
+            try {
+              return LOG_PREFIX + JSON.stringify(arg, null, 2);
+            } catch (error) {
+              return LOG_PREFIX + '[unserializable object]';
+            }
+          }
+          return LOG_PREFIX + String(arg);
+        }).join(' ');
+      }
+
+      // Saving original console methods before overriding (must be declared before safePostMessage references them)
+      const originalLog = console.log;
+      const originalWarn = console.warn;
+      const originalError = console.error;
+      const originalInfo = console.info;
+
+      /**
+       * Safely posts a message to ReactNativeWebView with a guard check.
+       * Prevents crashes if the WebView bridge is not yet ready or has been torn down.
+       */
+      function safePostMessage(payload) {
+        try {
+          if (window.ReactNativeWebView && typeof window.ReactNativeWebView.postMessage === 'function') {
+            window.ReactNativeWebView.postMessage(JSON.stringify(payload));
+          }
+        } catch (error) {
+          originalError && originalError.call(console, LOG_PREFIX + 'Failed to post message to ReactNativeWebView', error);
+        }
+      }
+
+      // Overriding console methods to forward logs back to React Native
+
+      console.log = function(...args) {
+        originalLog.apply(console, args);
+        safePostMessage({
+          type: 'console',
+          level: 'log',
+          message: formatMessage(args)
+        });
+      };
+
+      console.warn = function(...args) {
+        originalWarn.apply(console, args);
+        safePostMessage({
+          type: 'console',
+          level: 'warn',
+          message: formatMessage(args)
+        });
+      };
+
+      console.error = function(...args) {
+        originalError.apply(console, args);
+        safePostMessage({
+          type: 'console',
+          level: 'error',
+          message: formatMessage(args)
+        });
+      };
+
+      console.info = function(...args) {
+        originalInfo.apply(console, args);
+        safePostMessage({
+          type: 'console',
+          level: 'info',
+          message: formatMessage(args)
+        });
+      };
+
+      // Intercepting fetch requests to log network activity
+      const originalFetch = window.fetch;
+      window.fetch = function(...args) {
+        const url = typeof args[0] === 'string' ? args[0] : args[0]?.url || 'Unknown URL';
+        safePostMessage({
+          type: 'console',
+          level: 'network',
+          message: LOG_PREFIX + 'FETCH REQUEST: ' + url
+        });
+
+        return originalFetch.apply(this, args)
+          .then(response => {
+            safePostMessage({
+              type: 'console',
+              level: 'network',
+              message: LOG_PREFIX + 'FETCH RESPONSE: ' + url + ' - Status: ' + response.status
+            });
+            return response;
+          })
+          .catch(error => {
+            safePostMessage({
+              type: 'console',
+              level: 'error',
+              message: LOG_PREFIX + 'FETCH ERROR: ' + url + ' - ' + error.message
+            });
+            throw error;
+          });
+      };
+
+      // Intercepting XMLHttpRequest to log network activity
+      const originalOpen = XMLHttpRequest.prototype.open;
+      const originalSend = XMLHttpRequest.prototype.send;
+
+      XMLHttpRequest.prototype.open = function(method, url) {
+        this._url = url;
+        this._method = method;
+        return originalOpen.apply(this, arguments);
+      };
+
+      XMLHttpRequest.prototype.send = function() {
+        safePostMessage({
+          type: 'console',
+          level: 'network',
+          message: LOG_PREFIX + 'XHR REQUEST: ' + this._method + ' ' + this._url
+        });
+
+        this.addEventListener('load', function() {
+          safePostMessage({
+            type: 'console',
+            level: 'network',
+            message: LOG_PREFIX + 'XHR RESPONSE: ' + this._url + ' - Status: ' + this.status
+          });
+        });
+
+        this.addEventListener('error', function() {
+          safePostMessage({
+            type: 'console',
+            level: 'error',
+            message: LOG_PREFIX + 'XHR ERROR: ' + this._url
+          });
+        });
+
+        return originalSend.apply(this, arguments);
+      };
+
+      // Intercepting programmatic form.submit() - force target="_blank" to "_self"
+      const originalSubmit = HTMLFormElement.prototype.submit;
+      HTMLFormElement.prototype.submit = function() {
+        if (this.target === '_blank') {
+          this.target = '_self';
+        }
+        return originalSubmit.call(this);
+      };
+
+      // Intercepting window.open (for 3DS redirects, bank pages, etc.)
+      const originalWindowOpen = window.open;
+      window.open = function(url, target, features) {
+        safePostMessage({
+          type: 'window.open',
+          url: url,
+          target: target,
+          features: features
+        });
+
+        // Returning a mock window object so the caller does not crash on .close()/.focus() calls
+        return {
+          closed: false,
+          close: function() {
+            safePostMessage({
+              type: 'window.close'
+            });
+          },
+          focus: function() {},
+          blur: function() {}
+        };
+      };
+
+      // Listening for unhandled errors
+      window.addEventListener('error', function(event) {
+        safePostMessage({
+          type: 'console',
+          level: 'error',
+          message: LOG_PREFIX + 'Unhandled Error: ' + event.message + ' at ' + event.filename + ':' + event.lineno
+        });
+      });
+
+      // Listening for unhandled promise rejections
+      window.addEventListener('unhandledrejection', function(event) {
+        safePostMessage({
+          type: 'console',
+          level: 'error',
+          message: LOG_PREFIX + 'Unhandled Promise Rejection: ' + (event.reason?.toString() || 'Unknown')
+        });
+      });
+
+      // Listening for messages from the checkout page (payment events, lifecycle events)
+      window.addEventListener('message', function(event) {
+        console.log(LOG_PREFIX + 'Message received: ' + event.data);
+        safePostMessage({
+          type: 'message',
+          message: event.data
+        });
+      });
+
+      // Logging that injection is complete
+      console.log(LOG_PREFIX + 'GlomoPay WebView JavaScript injection complete');
+
+      true; // Required for injected JavaScript
+    })();
+`;

package/src/services/order-type-fetcher.ts

@@ -0,0 +1,86 @@
+/**
+ * Order type fetcher service.
+ * Calls the order API to determine whether a given orderId is an LRS or Standard checkout flow.
+ * Used by the unified GlomoCheckout component to delegate to the correct inner component.
+ */
+
+import axios, { isAxiosError } from "axios";
+import { resolveServerConfig, type GlomoServer } from "../config/base";
+
+/** The two supported checkout flow types */
+export type OrderType = "standard" | "lrs";
+
+/** Discriminated union result - either a resolved order type or an error message */
+export type OrderTypeResult = { success: true; orderType: OrderType } | { success: false; error: string };
+
+/**
+ * Fetches the order type for the given orderId from the public API.
+ * Returns a discriminated union so the caller can handle success/failure without try-catch.
+ */
+export async function fetchOrderType(options: {
+    orderId: string;
+    publicKey: string;
+    server?: GlomoServer;
+    timeoutMs?: number;
+    devMode?: boolean;
+}): Promise<OrderTypeResult> {
+    try {
+        // Resolving the API base URL from the server config
+        const config = resolveServerConfig(options.server);
+        const apiUrl = `${config.baseUrl.api}/api/public/v1/order/${options.orderId}`;
+
+        if (options.devMode) {
+            console.log(`[Glomo-RN-SDK] Order type API URL: ${apiUrl}`);
+        }
+
+        /**
+         * Calling the order API with the publicKey as Bearer token.
+         * Cache-busting headers prevent okhttp (Android) from sending If-None-Match on repeat calls,
+         * which would cause the server to return a 304 with an empty body and break order type detection.
+         */
+        const response = await axios.get(apiUrl, {
+            headers: {
+                Authorization: `Bearer ${options.publicKey}`,
+                "Cache-Control": "no-cache, no-store, must-revalidate",
+                Pragma: "no-cache",
+            },
+            timeout: options.timeoutMs ?? 30000,
+        });
+        const data = response.data;
+
+        // Validating that the returned order type is one of the expected values
+        if (data.orderType === "lrs" || data.orderType === "standard") {
+            if (options.devMode) {
+                console.log(
+                    `[Glomo-RN-SDK] Order type for orderId: ${options.orderId} successfully determined to be ${data.orderType}`
+                );
+            }
+            return { success: true, orderType: data.orderType };
+        }
+
+        if (options.devMode) {
+            console.log(`[Glomo-RN-SDK] Unexpected orderType ${data.orderType} provided for ${options.orderId}`);
+        }
+
+        return { success: false, error: `Unexpected order type from ${apiUrl}: ${data.orderType}` };
+    } catch (error) {
+        // Extracting the error message for logging and returning
+        const message = error instanceof Error ? error.message : String(error);
+        const config = resolveServerConfig(options.server);
+        const apiUrl = `${config.baseUrl.api}/api/public/v1/order/${options.orderId}`;
+        if (options.devMode) {
+            // Logging additional response details for Axios errors (status code, response body)
+            if (isAxiosError(error) && error.response) {
+                console.log(
+                    `[Glomo-RN-SDK] orderType determination failed for ${options.orderId} from ${apiUrl}: ${message} (${error.response.status}) and data:`,
+                    JSON.stringify(error.response.data)
+                );
+            } else {
+                console.log(
+                    `[Glomo-RN-SDK] orderType determination failed for ${options.orderId} from ${apiUrl}: ${message}`
+                );
+            }
+        }
+        return { success: false, error: `Failed to determine order type for ${apiUrl}: ${message}` };
+    }
+}

package/src/types/checkout.ts

@@ -0,0 +1,72 @@
+/** Unified v3 type definitions for GlomoCheckout */
+
+import { type GlomoServer } from "../config/base";
+import { type SdkError } from "../utils/analytics";
+
+/** The payload for a successful or failed payment (unified across LRS and standard) */
+export interface GlomoCheckoutPayload {
+    orderId: string;
+    paymentId: string;
+    signature: string;
+}
+
+/** The payload for a bank transfer submission */
+export interface GlomoBankTransferPayload {
+    orderId: string;
+    senderAccountNumber: string;
+    transactionReference: string;
+}
+
+/** The payload for a pay via bank - bank connection successful event */
+export interface GlomoPayViaBankConnectionPayload {
+    bankIdentifier: string;
+    cooldownPeriodInMinutes: number;
+    bankName: string;
+    bankImageSrc: string;
+    bankImageAlt: string;
+}
+
+/** Unified checkout statuses - superset of LRS + standard statuses */
+export type CheckoutStatus =
+    | "ready"
+    | "detecting_order_type"
+    | "payment_in_progress"
+    | "payment_successful"
+    | "payment_failed"
+    | "payment_cancelled"
+    | "bank_transfer_submitted"
+    | "pay_via_bank_completed";
+
+/**
+ * Ref handle for the unified checkout component.
+ * start() is async (returns Promise<boolean>) because the unified flow first detects order type
+ * via an API call before delegating to either the LRS or Standard inner component.
+ */
+export interface GlomoCheckoutRef {
+    start: () => Promise<boolean>;
+    getStatus: () => CheckoutStatus;
+}
+
+/** Shared callback and configuration props for the unified checkout component */
+interface GlomoCheckoutBaseProps {
+    server?: GlomoServer;
+    publicKey: string;
+    onPaymentSuccess: (payload: GlomoCheckoutPayload) => void;
+    onPaymentFailure: (payload: GlomoCheckoutPayload) => void;
+    onConnectionError?: (error: unknown) => void;
+    onPaymentTerminate?: () => void;
+    onSdkError?: (error: Array<SdkError>) => void;
+    onBankTransferSubmitted?: (payload: GlomoBankTransferPayload | null | undefined) => void;
+    onPayViaBankCompleted?: (payload: { status: string }) => void;
+    onPayViaBankBankConnectionSuccessful?: (payload: GlomoPayViaBankConnectionPayload | null | undefined) => void;
+    onUserRefusedCameraPermissions?: () => void;
+    devMode?: boolean;
+}
+
+/**
+ * Props for the unified checkout component.
+ * Exactly one of orderId or subscriptionId must be provided.
+ * TypeScript enforces this at compile time; a runtime guard in useGlomoCheckout catches JS consumers.
+ */
+export type GlomoCheckoutProps = GlomoCheckoutBaseProps &
+    ({ orderId: string; subscriptionId?: never } | { subscriptionId: string; orderId?: never });

package/src/types/standard-checkout.ts

@@ -0,0 +1,49 @@
+/** Type definitions for the Standard Checkout flow */
+
+import { type GlomoServer } from "../config/base";
+import { type SdkError } from "../utils/analytics";
+import { type GlomoBankTransferPayload, type GlomoPayViaBankConnectionPayload } from "./checkout";
+
+/** Standard checkout statuses */
+export type StandardCheckoutStatus =
+    | "ready"
+    | "payment_in_progress"
+    | "payment_successful"
+    | "payment_failed"
+    | "payment_cancelled"
+    | "bank_transfer_submitted"
+    | "pay_via_bank_completed";
+
+/** The payload for a successful or failed standard payment */
+export interface GlomoStandardCheckoutPayload {
+    orderId: string;
+    paymentId: string;
+    signature: string;
+}
+
+/**
+ * Ref handle for the standard checkout component.
+ * start() is synchronous (returns boolean) because the standard flow does not need to detect
+ * order type - unlike the unified GlomoCheckoutRef whose start() is async (returns Promise<boolean>).
+ */
+export interface GlomoStandardCheckoutRef {
+    start: () => boolean;
+    getStatus: () => StandardCheckoutStatus;
+}
+
+/** Props for the standard checkout component */
+export interface GlomoStandardCheckoutProps {
+    server?: GlomoServer;
+    publicKey: string;
+    orderId: string;
+    onPaymentSuccess: (payload: GlomoStandardCheckoutPayload) => void;
+    onPaymentFailure: (payload: GlomoStandardCheckoutPayload) => void;
+    onConnectionError?: (error: unknown) => void;
+    onPaymentTerminate?: () => void;
+    onSdkError?: (error: Array<SdkError>) => void;
+    onBankTransferSubmitted?: (payload: GlomoBankTransferPayload | null | undefined) => void;
+    onPayViaBankCompleted?: (payload: { status: string }) => void;
+    onPayViaBankBankConnectionSuccessful?: (payload: GlomoPayViaBankConnectionPayload | null | undefined) => void;
+    onUserRefusedCameraPermissions?: () => void;
+    devMode?: boolean;
+}

package/src/types/subscriptions-checkout.ts

@@ -0,0 +1,31 @@
+/** Type definitions for the Subscriptions Checkout flow */
+
+import { type GlomoServer } from "../config/base";
+import { type SdkError } from "../utils/analytics";
+import { type GlomoCheckoutPayload, type GlomoPayViaBankConnectionPayload } from "./checkout";
+import { type StandardCheckoutStatus } from "./standard-checkout";
+
+/** Props for the subscriptions checkout component */
+export interface GlomoSubscriptionsCheckoutProps {
+    server?: GlomoServer;
+    publicKey: string;
+    subscriptionId: string;
+    onPaymentSuccess: (payload: GlomoCheckoutPayload) => void;
+    onPaymentFailure: (payload: GlomoCheckoutPayload) => void;
+    onConnectionError?: (error: unknown) => void;
+    onPaymentTerminate?: () => void;
+    onSdkError?: (error: Array<SdkError>) => void;
+    onPayViaBankBankConnectionSuccessful?: (payload: GlomoPayViaBankConnectionPayload | null | undefined) => void;
+    onUserRefusedCameraPermissions?: () => void;
+    devMode?: boolean;
+}
+
+/**
+ * Ref handle for the subscriptions checkout component.
+ * Same type as GlomoStandardCheckoutRef - start() is async at the unified level
+ * but delegates to the synchronous standard checkout start() internally.
+ */
+export interface GlomoSubscriptionsCheckoutRef {
+    start: () => boolean;
+    getStatus: () => StandardCheckoutStatus;
+}