Fix attendees on a booking with seats and payments, navigate to the payment page. (#5788)

* Payment booking logic to seats

* Pass email to success page from payment page

* Fix type error

Co-authored-by: Alan <alannnc@gmail.com>

apps/web/pages/booking/[uid].tsx

@@ -881,22 +881,25 @@ const handleSeatsEventTypeOnBooking = (
     seatsShowAttendees: boolean | null;
     [x: string | number | symbol]: unknown;
   },
-  booking: Partial<
+  bookingInfo: Partial<
     Prisma.BookingGetPayload<{ include: { attendees: { select: { name: true; email: true } } } }>
   >,
   email: string
 ) => {
   if (eventType?.seatsPerTimeSlot !== null) {
     // @TODO: right now bookings with seats doesn't save every description that its entered by every user
-    delete booking.description;
+    delete bookingInfo.description;
   } else {
     return;
   }
   if (!eventType.seatsShowAttendees) {
-    const attendee = booking?.attendees?.find((a) => a.email === email);
-    booking["attendees"] = attendee ? [attendee] : [];
+    const attendee = bookingInfo?.attendees?.find((a) => {
+      return a.email === email;
+    });
+
+    bookingInfo["attendees"] = attendee ? [attendee] : [];
   }
-  return;
+  return bookingInfo;
 };
 
 export async function getServerSideProps(context: GetServerSidePropsContext) {
@@ -1007,7 +1010,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
     slug: eventType.team?.slug || eventType.users[0]?.username || null,
   };
 
-  if (bookingInfo !== null && email) {
+  if (bookingInfo !== null && email && eventType.seatsPerTimeSlot) {
     handleSeatsEventTypeOnBooking(eventType, bookingInfo, email);
   }
 

packages/features/bookings/lib/handleNewBooking.ts

@@ -519,16 +519,9 @@ async function handler(req: NextApiRequest & { userId?: number | undefined }) {
         id: true,
         attendees: true,
         userId: true,
-        references: {
-          select: {
-            type: true,
-            uid: true,
-            meetingId: true,
-            meetingPassword: true,
-            meetingUrl: true,
-            externalCalendarId: true,
-          },
-        },
+        references: true,
+        startTime: true,
+        user: true,
       },
     });
     if (!booking) {
@@ -579,6 +572,20 @@ async function handler(req: NextApiRequest & { userId?: number | undefined }) {
     const eventManager = new EventManager({ ...organizerUser, credentials });
     await eventManager.updateCalendarAttendees(evt, booking);
 
+    if (!Number.isNaN(stripeAppData.price) && stripeAppData.price > 0 && !!booking) {
+      const [firstStripeCredential] = organizerUser.credentials.filter(
+        (cred) => cred.type == "stripe_payment"
+      );
+
+      if (!firstStripeCredential)
+        throw new HttpError({ statusCode: 400, message: "Missing payment credentials" });
+
+      const payment = await handlePayment(evt, eventType, firstStripeCredential, booking);
+
+      req.statusCode = 201;
+      return { ...booking, message: "Payment required", paymentUid: payment.uid };
+    }
+
     req.statusCode = 201;
     return booking;
   }

packages/features/ee/payments/components/Payment.tsx

@@ -66,7 +66,7 @@ export default function PaymentComponent(props: Props) {
   const handleSubmit = async (ev: SyntheticEvent) => {
     ev.preventDefault();
 
-    if (!stripe || !elements) return;
+    if (!stripe || !elements || !router.isReady) return;
     const card = elements.getElement(CardElement);
     if (!card) return;
     setState({ status: "processing" });
@@ -81,7 +81,10 @@ export default function PaymentComponent(props: Props) {
         error: new Error(`Payment failed: ${payload.error.message}`),
       });
     } else {
-      const params: { [k: string]: any } = {};
+      const params: { [k: string]: any } = {
+        uid: props.bookingUid,
+        email: router.query.email,
+      };
 
       if (props.location) {
         if (props.location.includes("integration")) {