@reevit/react 0.4.0 → 0.4.1

package/dist/index.mjs

@@ -206,6 +206,17 @@ var ReevitAPIClient = class {
   async cancelPaymentIntent(paymentId) {
     return this.request("POST", `/v1/payments/${paymentId}/cancel`);
   }
+  /**
+   * Creates a Hubtel session token for secure checkout.
+   * This endpoint generates a short-lived token that maps to Hubtel credentials server-side,
+   * avoiding exposure of sensitive credentials to the client.
+   *
+   * @param paymentId - The payment intent ID for Hubtel checkout
+   * @returns Hubtel session with token, merchant account, and expiry information
+   */
+  async createHubtelSession(paymentId) {
+    return this.request("POST", `/v1/payments/hubtel/sessions/${paymentId}`);
+  }
   /**
    * Maps SDK payment method to backend format
    */
@@ -831,12 +842,15 @@ function PaystackBridge({
   ] }) });
 }
 function HubtelBridge({
+  paymentId,
+  publicKey,
   merchantAccount,
   amount,
   reference,
   phone,
   description = "Payment",
   callbackUrl,
+  hubtelSessionToken,
   basicAuth,
   onSuccess,
   onError,
@@ -845,7 +859,46 @@ function HubtelBridge({
 }) {
   const initialized = useRef(false);
   const checkoutRef = useRef(null);
+  const [authValue, setAuthValue] = useState("");
+  const [isLoading, setIsLoading] = useState(false);
+  useEffect(() => {
+    const fetchAuth = async () => {
+      if (hubtelSessionToken) {
+        setIsLoading(true);
+        try {
+          const client = createReevitClient({ publicKey });
+          const { data, error } = await client.createHubtelSession(paymentId);
+          if (error) {
+            onError({
+              code: "SESSION_ERROR",
+              message: error.message || "Failed to create Hubtel session",
+              recoverable: true
+            });
+            return;
+          }
+          if (data) {
+            setAuthValue(data.token);
+          }
+        } catch (err) {
+          onError({
+            code: "SESSION_ERROR",
+            message: "Failed to create Hubtel session",
+            recoverable: true,
+            originalError: err
+          });
+        } finally {
+          setIsLoading(false);
+        }
+      } else if (basicAuth) {
+        setAuthValue(basicAuth);
+      }
+    };
+    fetchAuth();
+  }, [paymentId, publicKey, hubtelSessionToken, basicAuth, onError]);
   const startPayment = useCallback(async () => {
+    if (isLoading || !authValue) {
+      return;
+    }
     try {
       const checkout = new CheckoutSdk();
       checkoutRef.current = checkout;
@@ -860,7 +913,9 @@ function HubtelBridge({
         branding: "enabled",
         callbackUrl: callbackUrl || window.location.href,
         merchantAccount: typeof merchantAccount === "string" ? parseInt(merchantAccount, 10) : merchantAccount,
-        basicAuth: basicAuth || ""
+        // Use session token or basicAuth for authentication
+        // Session tokens are base64-encoded credentials fetched securely from the server
+        basicAuth: authValue || ""
       };
       checkout.openModal({
         purchaseInfo,
@@ -904,13 +959,13 @@ function HubtelBridge({
       };
       onError(error);
     }
-  }, [merchantAccount, amount, reference, phone, description, callbackUrl, basicAuth, onSuccess, onError, onClose]);
+  }, [merchantAccount, amount, reference, phone, description, callbackUrl, authValue, isLoading, onSuccess, onError, onClose]);
   useEffect(() => {
-    if (autoStart && !initialized.current) {
+    if (autoStart && !initialized.current && !isLoading && authValue) {
       initialized.current = true;
       startPayment();
     }
-  }, [autoStart, startPayment]);
+  }, [autoStart, startPayment, isLoading, authValue]);
   return /* @__PURE__ */ jsx("div", { className: "reevit-psp-bridge reevit-psp-bridge--hubtel", children: /* @__PURE__ */ jsxs("div", { className: "reevit-psp-bridge__loading", children: [
     /* @__PURE__ */ jsx("div", { className: "reevit-spinner" }),
     /* @__PURE__ */ jsx("p", { children: "Connecting to Hubtel..." })
@@ -1829,14 +1884,16 @@ function ReevitCheckout({
           return /* @__PURE__ */ jsx(
             HubtelBridge,
             {
-              merchantAccount: paymentIntent?.pspCredentials?.merchantAccount || pspKey,
+              paymentId: paymentIntent?.id || "",
+              publicKey,
+              merchantAccount: pspKey,
               amount: paymentIntent?.amount ?? amount,
               currency: paymentIntent?.currency ?? currency,
               reference: paymentIntent?.reference || reference,
               email,
               phone: momoData?.phone || phone,
               description: `Payment ${paymentIntent?.reference || reference || ""}`,
-              basicAuth: paymentIntent?.pspCredentials?.basicAuth,
+              hubtelSessionToken: paymentIntent?.id ? paymentIntent.id : void 0,
               onSuccess: handlePSPSuccess,
               onError: (err) => handlePSPError(err),
               onClose: handlePSPClose