src/Redux/services/cards.service.ts

@@ -43,7 +43,7 @@ export const cardsApi = createApi({
         }),
 
         payForCard: builder.mutation({
-            query: (id) => ({ 
+            query: (id) => ({
                 url: `/website/passes/${id}/pay`,
                 method: "POST",
                 body: {},
@@ -51,10 +51,10 @@ export const cardsApi = createApi({
         }),
 
         confirmCardPayment: builder.mutation({
-            query: (id) => ({ 
-                url: `/website/passes/${id}/confirm-payment`,
+            query: (payload: { id: string; checkoutSessionId: string }) => ({
+                url: `/website/passes/${payload.id}/confirm-payment`,
                 method: "POST",
-                // body: id,
+                body: { checkoutSessionId: payload.checkoutSessionId },
             }),
         }),
 

src/pages/PaymentSuccessPage.tsx

@@ -39,18 +39,22 @@ export function PaymentSuccessPage({
 
   useEffect(() => {
     const confirm = async () => {
-      // Try all possible sources
+      // 1. Retrieve bookingId from storage (cookie, localStorage, sessionStorage, or query param)
       let bookingId = getCookie('pendingBookingId');
       if (!bookingId) bookingId = localStorage.getItem('pendingBookingId');
       if (!bookingId) bookingId = sessionStorage.getItem('pendingBookingId');
       if (!bookingId) bookingId = searchParams.get('bookingId');
 
-      console.log('Retrieved bookingId from sources:', {
+      // 2. Get checkoutSessionId from URL query parameter
+      const checkoutSessionId = searchParams.get('session_id');
+
+      console.log('Retrieved data:', {
+        bookingId: bookingId,
+        checkoutSessionId: checkoutSessionId,
         cookie: getCookie('pendingBookingId'),
         localStorage: localStorage.getItem('pendingBookingId'),
         sessionStorage: sessionStorage.getItem('pendingBookingId'),
-        queryParam: searchParams.get('bookingId'),
-        final: bookingId,
+        queryBookingId: searchParams.get('bookingId'),
       });
 
       if (!bookingId) {
@@ -62,10 +66,20 @@ export function PaymentSuccessPage({
         return;
       }
 
+      if (!checkoutSessionId) {
+        setStatus('error');
+        setErrorMsg(
+          'Missing session ID. Please contact support with your order details.'
+        );
+        return;
+      }
+
       try {
-        await confirmPayment(bookingId).unwrap();
+        // Call API with both id and checkoutSessionId
+        await confirmPayment({ id: bookingId, checkoutSessionId }).unwrap();
         setStatus('success');
         toast.success('Payment confirmed! Your order is complete.');
+
         // Clean up all storage
         document.cookie = 'pendingBookingId=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';
         localStorage.removeItem('pendingBookingId');