@reevit/react 0.3.0 → 0.3.2

package/dist/index.mjs

@@ -188,7 +188,13 @@ var ReevitAPIClient = class {
     return this.request("GET", `/v1/payments/${paymentId}`);
   }
   /**
-   * Confirms a payment after PSP callback
+   * Confirms a payment intent after PSP callback (public endpoint)
+   */
+  async confirmPaymentIntent(paymentId, clientSecret) {
+    return this.request("POST", `/v1/payments/${paymentId}/confirm-intent?client_secret=${clientSecret}`);
+  }
+  /**
+   * Confirms a payment after PSP callback (authenticated endpoint)
    */
   async confirmPayment(paymentId) {
     return this.request("POST", `/v1/payments/${paymentId}/confirm`);
@@ -236,7 +242,7 @@ function reevitReducer(state, action) {
         ...state,
         status: "ready",
         paymentIntent: action.payload,
-        selectedMethod: action.payload.availableMethods?.length === 1 ? action.payload.availableMethods[0] : state.selectedMethod
+        selectedMethod: action.payload.availableMethods?.length === 1 ? action.payload.availableMethods[0] : null
       };
     case "INIT_ERROR":
       return { ...state, status: "failed", error: action.payload };
@@ -273,6 +279,8 @@ function mapToPaymentIntent(response, config) {
     status: response.status,
     recommendedPsp: mapProviderToPsp(response.provider),
     availableMethods: config.paymentMethods || ["card", "mobile_money"],
+    reference: response.reference || response.id,
+    // Use backend reference or fallback to ID
     connectionId: response.connection_id,
     provider: response.provider,
     feeAmount: response.fee_amount,
@@ -375,8 +383,10 @@ function useReevit(options) {
         if (!apiClient) {
           throw new Error("API client not initialized");
         }
-        const { data, error } = await apiClient.confirmPayment(state.paymentIntent.id);
+        const clientSecret = state.paymentIntent.clientSecret;
+        const { data, error } = clientSecret ? await apiClient.confirmPaymentIntent(state.paymentIntent.id, clientSecret) : await apiClient.confirmPayment(state.paymentIntent.id);
         if (error) {
+          console.error("[useReevit] Confirmation error:", error);
           dispatch({ type: "PROCESS_ERROR", payload: error });
           onError?.(error);
           return;
@@ -390,8 +400,9 @@ function useReevit(options) {
           psp: state.paymentIntent.recommendedPsp,
           pspReference: paymentData.pspReference || data?.provider_ref_id || "",
           status: data?.status === "succeeded" ? "success" : "pending",
-          metadata: paymentData
+          metadata: { ...paymentData, backend_status: data?.status }
         };
+        console.log("[useReevit] Process result:", result);
         if (result.status === "success") {
           dispatch({ type: "PROCESS_SUCCESS", payload: result });
           onSuccess?.(result);
@@ -692,6 +703,7 @@ function PaystackBridge({
   amount,
   currency = "GHS",
   reference,
+  accessCode,
   metadata,
   channels = ["card", "mobile_money"],
   onSuccess,
@@ -702,30 +714,38 @@ function PaystackBridge({
   const initialized = useRef(false);
   const startPayment = useCallback(async () => {
     try {
+      console.log("[PaystackBridge] Starting payment", {
+        hasPublicKey: !!publicKey,
+        email,
+        amount,
+        reference,
+        hasAccessCode: !!accessCode
+      });
       if (!publicKey) {
         throw new Error("Paystack public key is required but was empty");
       }
-      if (!email) {
-        throw new Error("Email is required for Paystack payments");
+      if (!email && !accessCode) {
+        throw new Error("Email is required for Paystack payments when no access code is provided");
       }
-      if (!amount || amount <= 0) {
-        throw new Error("Valid amount is required for Paystack payments");
+      if (!amount && !accessCode) {
+        throw new Error("Valid amount is required for Paystack payments when no access code is provided");
       }
       await loadPaystackScript();
       if (!window.PaystackPop) {
         throw new Error("Paystack script loaded but PaystackPop not available");
       }
-      const handler = window.PaystackPop.setup({
+      const setupConfig = {
         key: publicKey,
         email,
         phone,
         amount,
-        // Paystack expects amount in kobo/pesewas (smallest unit)
         currency,
         ref: reference,
+        access_code: accessCode,
         metadata,
         channels,
         callback: (response) => {
+          console.log("[PaystackBridge] Callback received", response);
           let usedMethod = "card";
           if (channels && channels.length === 1) {
             usedMethod = channels[0];
@@ -733,22 +753,31 @@ function PaystackBridge({
             usedMethod = "mobile_money";
           }
           const result = {
-            paymentId: response.transaction,
+            paymentId: response.reference,
+            // Use the reference as paymentId because we set it to Reevit's UUID
             reference: response.reference,
             amount,
             currency,
             paymentMethod: usedMethod,
             psp: "paystack",
-            pspReference: response.trans,
+            pspReference: response.transaction,
+            // Paystack's internal transaction ID
             status: response.status === "success" ? "success" : "pending",
-            metadata: { trxref: response.trxref }
+            metadata: {
+              ...response,
+              trxref: response.trxref,
+              paystack_transaction_id: response.transaction,
+              paystack_trans: response.trans
+            }
           };
           onSuccess(result);
         },
         onClose: () => {
+          console.log("[PaystackBridge] Modal closed");
           onClose();
         }
-      });
+      };
+      const handler = window.PaystackPop.setup(setupConfig);
       handler.openIframe();
     } catch (err) {
       const errorMessage = err instanceof Error ? err.message : "Failed to initialize Paystack";
@@ -760,7 +789,7 @@ function PaystackBridge({
       };
       onError(error);
     }
-  }, [publicKey, email, amount, currency, reference, metadata, channels, onSuccess, onError, onClose]);
+  }, [publicKey, email, amount, currency, reference, accessCode, metadata, channels, onSuccess, onError, onClose]);
   useEffect(() => {
     if (autoStart && !initialized.current) {
       initialized.current = true;
@@ -863,10 +892,10 @@ function ReevitCheckout({
     }
   }, [isOpen, status, initialize, initialPaymentIntent]);
   useEffect(() => {
-    if (isOpen && (selectedMethod === "card" || selectedMethod === "mobile_money") && !showPSPBridge) {
-      if (selectedMethod === "card" && paymentIntent) {
+    if (isOpen && selectedMethod && paymentIntent && !showPSPBridge) {
+      if (selectedMethod === "card") {
         setShowPSPBridge(true);
-      } else if (selectedMethod === "mobile_money" && paymentIntent && (momoData?.phone || phone)) {
+      } else if (selectedMethod === "mobile_money" && (momoData?.phone || phone)) {
         setShowPSPBridge(true);
       }
     }
@@ -930,10 +959,10 @@ function ReevitCheckout({
     formatAmount(amount, currency)
   ] }) : null;
   const renderContent = () => {
-    if (status === "loading") {
+    if (status === "loading" || status === "processing") {
       return /* @__PURE__ */ jsxs("div", { className: "reevit-loading", children: [
         /* @__PURE__ */ jsx("div", { className: "reevit-spinner" }),
-        /* @__PURE__ */ jsx("p", { children: "Preparing checkout..." })
+        /* @__PURE__ */ jsx("p", { children: status === "loading" ? "Preparing checkout..." : "Processing payment..." })
       ] });
     }
     if (status === "success" && result) {
@@ -965,6 +994,7 @@ function ReevitCheckout({
           amount: paymentIntent?.amount ?? amount,
           currency: paymentIntent?.currency ?? currency,
           reference,
+          accessCode: paymentIntent?.clientSecret,
           metadata: {
             ...metadata,
             // Override with correct payment intent ID for webhook routing