From 4963e590f2e56b177ec6fe718237a072dc6287ac Mon Sep 17 00:00:00 2001
From: paula_rodriguezslash <paula.rodriguez@slashmobility.com>
Date: Tue, 23 Apr 2024 19:55:18 +0100
Subject: [PATCH] more stuff
---
.../BookingList/BookingCard/BookingCard.tsx | 4 ++--
.../components/PaymentForm/PaymentForm.tsx | 22 ++++++++++++-------
.../src/services/BookingList/BookingOrder.ts | 1 +
3 files changed, 17 insertions(+), 10 deletions(-)
diff --git a/client/src/components/BookingList/BookingCard/BookingCard.tsx b/client/src/components/BookingList/BookingCard/BookingCard.tsx
index d9ff850..4b14a61 100644
--- a/client/src/components/BookingList/BookingCard/BookingCard.tsx
+++ b/client/src/components/BookingList/BookingCard/BookingCard.tsx
@@ -21,10 +21,10 @@ function BookingCard({ flight }: IBookingCard) {
const bookingInfo: BookingOrder = {
flightId: flight.id,
bookingClass: isEconomy ? 1 : 2,
+ price: isEconomy ? flight.economyPrice : flight.businessPrice
};
try {
- await bookFlight(bookingInfo);
- console.log("Flight ID:", flight.id); // Log the flight ID to the console
+ //await bookFlight(bookingInfo);
alert("Flight booked successfully, navigating to payments page...");
navigate('/booking/payment-form', { state: { bookingInfo } });
} catch (error) {
diff --git a/client/src/components/PaymentForm/PaymentForm.tsx b/client/src/components/PaymentForm/PaymentForm.tsx
index ddcad44..0c4eb50 100644
--- a/client/src/components/PaymentForm/PaymentForm.tsx
+++ b/client/src/components/PaymentForm/PaymentForm.tsx
@@ -1,5 +1,6 @@
import React, { useState, useEffect } from 'react';
import { useLocation } from 'react-router-dom';
+import Api from "../../helpers/Api";
import { CardElement, useStripe, useElements, Elements } from '@stripe/react-stripe-js';
import { loadStripe } from '@stripe/stripe-js';
import axios from 'axios';
@@ -23,19 +24,24 @@ const PaymentForm = () => {
}, [location]);
useEffect(() => {
+ if (!bookingInfo || clientSecret) return;
+
const fetchClientSecret = async () => {
try {
- const response = await axios.post('http://localhost:4242/create-checkout-session');
+ let price = bookingInfo.price;
+ let priceInCents = price * 100;
+ const form = { items: [{ price: priceInCents }] };
+ const response = await Api.post("Booking/create-payment-intent", form);
setClientSecret(response.data.clientSecret);
- setLoading(false); // Set loading to false after client secret is fetched
+ setLoading(false);
} catch (error) {
console.error('Failed to retrieve client secret:', error);
- setLoading(false); // Set loading to false in case of error
+ setLoading(false);
}
};
-
+
fetchClientSecret();
- }, []);
+ }, [bookingInfo, clientSecret]);
const handleSubmit = async (event) => {
event.preventDefault();
@@ -45,11 +51,11 @@ const PaymentForm = () => {
return;
}
- setLoading(true); // Set loading to true when payment processing starts
+ setLoading(true);
- // Your payment processing logic goes here
+
- setLoading(false); // Set loading to false when payment processing is completed
+ setLoading(false);
};
return (
diff --git a/client/src/services/BookingList/BookingOrder.ts b/client/src/services/BookingList/BookingOrder.ts
index a46318c..10b040a 100644
--- a/client/src/services/BookingList/BookingOrder.ts
+++ b/client/src/services/BookingList/BookingOrder.ts
@@ -6,6 +6,7 @@ export interface BookingOrder {
flightId: number;
bookingClass: number;
seatId?: number;
+ price: number;
}
export async function bookFlight(
--
GitLab