fix: cancelled booking doesn't show the booker (#8203)

* fix: remove attendee deletion

* chore: add test id

* test: add e2e

* Fix data-testid placeholder

* Fix prettier error

---------

Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: alannnc <alannnc@gmail.com>

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

@@ -443,8 +443,10 @@ export default function Success(props: SuccessProps) {
                           )}
                           {bookingInfo?.attendees.map((attendee) => (
                             <div key={attendee.name + attendee.email} className="mb-3 last:mb-0">
-                              {attendee.name && <p>{attendee.name}</p>}
-                              <p data-testid={`attendee-${attendee.email}`}>{attendee.email}</p>
+                              {attendee.name && (
+                                <p data-testid={`attendee-name-${attendee.name}`}>{attendee.name}</p>
+                              )}
+                              <p data-testid={`attendee-email-${attendee.email}`}>{attendee.email}</p>
                             </div>
                           ))}
                         </div>

apps/web/playwright/booking-pages.e2e.ts

@@ -8,6 +8,8 @@ import {
   bookTimeSlot,
   selectFirstAvailableTimeSlotNextMonth,
   selectSecondAvailableTimeSlotNextMonth,
+  testEmail,
+  testName,
 } from "./lib/testUtils";
 
 test.describe.configure({ mode: "parallel" });
@@ -101,6 +103,8 @@ testBothBookers.describe("pro user", () => {
     // Because it tests the entire booking flow + the cancellation + rebooking
     test.setTimeout(testInfo.timeout * 3);
     await bookFirstEvent(page);
+    await expect(page.locator(`[data-testid="attendee-email-${testEmail}"]`)).toHaveText(testEmail);
+    await expect(page.locator(`[data-testid="attendee-name-${testName}"]`)).toHaveText(testName);
 
     const [pro] = users.get();
     await pro.login();
@@ -114,7 +118,10 @@ testBothBookers.describe("pro user", () => {
 
     const cancelledHeadline = await page.locator('[data-testid="cancelled-headline"]').innerText();
 
-    await expect(cancelledHeadline).toBe("This event is cancelled");
+    expect(cancelledHeadline).toBe("This event is cancelled");
+
+    await expect(page.locator(`[data-testid="attendee-email-${testEmail}"]`)).toHaveText(testEmail);
+    await expect(page.locator(`[data-testid="attendee-name-${testName}"]`)).toHaveText(testName);
 
     await page.goto(`/${pro.username}`);
     await bookFirstEvent(page);
@@ -155,7 +162,7 @@ testBothBookers.describe("pro user", () => {
     await expect(page.locator("[data-testid=success-page]")).toBeVisible();
 
     additionalGuests.forEach(async (email) => {
-      await expect(page.locator(`[data-testid="attendee-${email}"]`)).toHaveText(email);
+      await expect(page.locator(`[data-testid="attendee-email-${email}"]`)).toHaveText(email);
     });
   });
 });

apps/web/playwright/booking-seats.e2e.ts

@@ -419,9 +419,13 @@ testBothBookers.describe("Booking with Seats", (bookerVariant) => {
       // Go to cancel page and see that attendees are listed and myself as I'm owner of the booking
       await page.goto(`/booking/${booking.uid}?cancel=true&allRemainingBookings=false`);
 
-      const foundFirstAttendeeAsOwner = await page.locator('p[data-testid="attendee-first+seats@cal.com"]');
+      const foundFirstAttendeeAsOwner = await page.locator(
+        'p[data-testid="attendee-email-first+seats@cal.com"]'
+      );
       await expect(foundFirstAttendeeAsOwner).toHaveCount(1);
-      const foundSecondAttendeeAsOwner = await page.locator('p[data-testid="attendee-second+seats@cal.com"]');
+      const foundSecondAttendeeAsOwner = await page.locator(
+        'p[data-testid="attendee-email-second+seats@cal.com"]'
+      );
       await expect(foundSecondAttendeeAsOwner).toHaveCount(1);
       await page.pause();
       await page.goto("auth/logout");
@@ -433,10 +437,12 @@ testBothBookers.describe("Booking with Seats", (bookerVariant) => {
       );
 
       // No attendees should be displayed only the one that it's cancelling
-      const notFoundSecondAttendee = await page.locator('p[data-testid="attendee-second+seats@cal.com"]');
+      const notFoundSecondAttendee = await page.locator(
+        'p[data-testid="attendee-email-second+seats@cal.com"]'
+      );
 
       await expect(notFoundSecondAttendee).toHaveCount(0);
-      const foundFirstAttendee = await page.locator('p[data-testid="attendee-first+seats@cal.com"]');
+      const foundFirstAttendee = await page.locator('p[data-testid="attendee-email-first+seats@cal.com"]');
       await expect(foundFirstAttendee).toHaveCount(1);
 
       await prisma.eventType.update({
@@ -453,11 +459,11 @@ testBothBookers.describe("Booking with Seats", (bookerVariant) => {
       );
 
       // Now attendees should be displayed
-      const foundSecondAttendee = await page.locator('p[data-testid="attendee-second+seats@cal.com"]');
+      const foundSecondAttendee = await page.locator('p[data-testid="attendee-email-second+seats@cal.com"]');
 
       await expect(foundSecondAttendee).toHaveCount(1);
       const foundFirstAttendeeAgain = await page
-        .locator('p[data-testid="attendee-first+seats@cal.com"]')
+        .locator('p[data-testid="attendee-email-first+seats@cal.com"]')
         .first();
       await expect(foundFirstAttendeeAgain).toHaveCount(1);
     });

apps/web/playwright/lib/testUtils.ts

@@ -15,6 +15,9 @@ type Request = IncomingMessage & { body?: unknown };
 type RequestHandlerOptions = { req: Request; res: ServerResponse };
 type RequestHandler = (opts: RequestHandlerOptions) => void;
 
+export const testEmail = "test@example.com";
+export const testName = "Test Testson";
+
 export function createHttpServer(opts: { requestHandler?: RequestHandler } = {}) {
   const {
     requestHandler = ({ res }) => {
@@ -133,8 +136,8 @@ export async function bookFirstEvent(page: Page) {
 
 export const bookTimeSlot = async (page: Page, opts?: { name?: string; email?: string }) => {
   // --- fill form
-  await page.fill('[name="name"]', opts?.name ?? "Test Testson");
-  await page.fill('[name="email"]', opts?.email ?? "test@example.com");
+  await page.fill('[name="name"]', opts?.name ?? testName);
+  await page.fill('[name="email"]', opts?.email ?? testEmail);
   await page.press('[name="email"]', "Enter");
 };
 // Provide an standalone localize utility not managed by next-i18n

packages/features/bookings/lib/handleCancelBooking.ts

@@ -629,12 +629,6 @@ async function handler(req: CustomRequest) {
     return { message: "Booking successfully cancelled." };
   }
 
-  const attendeeDeletes = prisma.attendee.deleteMany({
-    where: {
-      bookingId: bookingToDelete.id,
-    },
-  });
-
   const bookingReferenceDeletes = prisma.bookingReference.deleteMany({
     where: {
       bookingId: bookingToDelete.id,
@@ -657,7 +651,7 @@ async function handler(req: CustomRequest) {
     });
   });
 
-  const prismaPromises: Promise<unknown>[] = [attendeeDeletes, bookingReferenceDeletes];
+  const prismaPromises: Promise<unknown>[] = [bookingReferenceDeletes];
 
   await Promise.all(prismaPromises.concat(apiDeletes));