refactor: v2 and atoms booking fields (#16685)

* refactor: define inputs and outputs by separating default and custom fields

* refactor: event type api <-> internal transformers

* refactor: v2 use refactored libraries to transform input and output booking fields

* refactor: dont allow custom slugs with default reserved slugs

* refactor: input service store only specific default system fields

* refactor: atoms display only specific default system fields

* refactor: delete unused system field constants

* fix: tests

* fix: old event types

* fix: imports

* fix: import

* chore: release libraries and use v2 with them

* fix: unit tests

* refactor: push email in case of missing phone

* refactor: satisfies check for event-type locations

Author: supalarry

apps/api/v2/package.json

@@ -28,7 +28,7 @@
   "dependencies": {
     "@calcom/platform-constants": "*",
     "@calcom/platform-enums": "*",
-    "@calcom/platform-libraries": "npm:@calcom/platform-libraries@0.0.34",
+    "@calcom/platform-libraries": "npm:@calcom/platform-libraries@0.0.36",
     "@calcom/platform-libraries-0.0.2": "npm:@calcom/platform-libraries@0.0.2",
     "@calcom/platform-types": "*",
     "@calcom/platform-utils": "*",

apps/api/v2/src/ee/event-types/event-types_2024_04_15/services/event-types.service.ts

@@ -15,6 +15,7 @@ import {
   updateEventType,
   EventTypesPublic,
   getEventTypesPublic,
+  systemBeforeFieldEmail,
 } from "@calcom/platform-libraries";
 import { EventType } from "@calcom/prisma/client";
 
@@ -127,8 +128,17 @@ export class EventTypesService_2024_04_15 {
   async updateEventType(eventTypeId: number, body: UpdateEventTypeInput_2024_04_15, user: UserWithProfile) {
     this.checkCanUpdateEventType(user.id, eventTypeId);
     const eventTypeUser = await this.getUserToUpdateEvent(user);
+    const bookingFields = [...(body.bookingFields || [])];
+
+    if (
+      !bookingFields.find((field) => field.type === "email") &&
+      !bookingFields.find((field) => field.type === "phone")
+    ) {
+      bookingFields.push(systemBeforeFieldEmail);
+    }
+
     await updateEventType({
-      input: { id: eventTypeId, ...body },
+      input: { id: eventTypeId, ...body, bookingFields },
       ctx: {
         user: eventTypeUser,
         // eslint-disable-next-line @typescript-eslint/ban-ts-comment

apps/api/v2/src/ee/event-types/event-types_2024_06_14/controllers/event-types.controller.e2e-spec.ts

@@ -250,7 +250,6 @@ describe("Event types Endpoints", () => {
           expect(createdEventType.description).toEqual(body.description);
           expect(createdEventType.lengthInMinutes).toEqual(body.lengthInMinutes);
           expect(createdEventType.locations).toEqual(body.locations);
-          expect(createdEventType.bookingFields).toEqual(body.bookingFields);
           expect(createdEventType.ownerId).toEqual(user.id);
           expect(createdEventType.scheduleId).toEqual(firstSchedule.id);
           expect(createdEventType.bookingLimitsCount).toEqual(body.bookingLimitsCount);
@@ -259,6 +258,16 @@ describe("Event types Endpoints", () => {
           expect(createdEventType.offsetStart).toEqual(body.offsetStart);
           expect(createdEventType.bookingWindow).toEqual(body.bookingWindow);
           expect(createdEventType.recurrence).toEqual(body.recurrence);
+
+          const responseBookingFields = body.bookingFields || [];
+          const expectedBookingFields = [
+            { isDefault: true, required: true, slug: "name", type: "name" },
+            { isDefault: true, required: true, slug: "email", type: "email" },
+            { isDefault: true, required: false, slug: "rescheduleReason", type: "textarea" },
+            ...responseBookingFields.map((field) => ({ isDefault: false, ...field })),
+          ];
+
+          expect(createdEventType.bookingFields).toEqual(expectedBookingFields);
           eventType = responseBody.data;
         });
     });
@@ -476,6 +485,16 @@ describe("Event types Endpoints", () => {
     let legacyEventTypeId1: number;
     let legacyEventTypeId2: number;
 
+    const expectedReturnSystemFields = [
+      { isDefault: true, required: true, slug: "name", type: "name" },
+      { isDefault: true, required: true, slug: "email", type: "email" },
+      { isDefault: true, type: "radioInput", slug: "location", required: false },
+      { isDefault: true, required: true, slug: "title", type: "text" },
+      { isDefault: true, required: false, slug: "notes", type: "textarea" },
+      { isDefault: true, required: false, slug: "guests", type: "multiemail" },
+      { isDefault: true, required: false, slug: "rescheduleReason", type: "textarea" },
+    ];
+
     beforeAll(async () => {
       const moduleRef = await withApiAuth(
         userEmail,
@@ -545,7 +564,7 @@ describe("Event types Endpoints", () => {
         .expect(400);
     });
 
-    it("should return empty bookingFields if system fields are the only one in database", async () => {
+    it("should return system bookingFields stored in database", async () => {
       const legacyEventTypeInput = {
         title: "legacy event type",
         description: "legacy event type description",
@@ -638,11 +657,11 @@ describe("Event types Endpoints", () => {
         .then(async (response) => {
           const responseBody: ApiSuccessResponse<EventTypeOutput_2024_06_14> = response.body;
           const fetchedEventType = responseBody.data;
-          expect(fetchedEventType.bookingFields).toEqual([]);
+          expect(fetchedEventType.bookingFields).toEqual(expectedReturnSystemFields);
         });
     });
 
-    it("should return user created bookingFields among system fields in the database", async () => {
+    it("should return user created bookingFields with system fields", async () => {
       const userDefinedBookingField = {
         name: "team",
         type: "textarea",
@@ -755,7 +774,9 @@ describe("Event types Endpoints", () => {
           const fetchedEventType = responseBody.data;
 
           expect(fetchedEventType.bookingFields).toEqual([
+            ...expectedReturnSystemFields,
             {
+              isDefault: false,
               type: userDefinedBookingField.type,
               slug: userDefinedBookingField.name,
               label: userDefinedBookingField.label,

apps/api/v2/src/ee/event-types/event-types_2024_06_14/event-types.repository.ts

@@ -6,8 +6,8 @@ import { Injectable } from "@nestjs/common";
 
 import {
   getEventTypeById,
-  transformApiEventTypeBookingFields,
-  transformApiEventTypeLocations,
+  transformBookingFieldsApiToInternal,
+  transformLocationsApiToInternal,
 } from "@calcom/platform-libraries";
 import { CreateEventTypeInput_2024_06_14 } from "@calcom/platform-types";
 import type { PrismaClient } from "@calcom/prisma";
@@ -30,8 +30,8 @@ type InputEventTransformed = Omit<
 > & {
   length: number;
   slug: string;
-  locations?: ReturnType<typeof transformApiEventTypeLocations>;
-  bookingFields?: ReturnType<typeof transformApiEventTypeBookingFields>;
+  locations?: ReturnType<typeof transformLocationsApiToInternal>;
+  bookingFields?: ReturnType<typeof transformBookingFieldsApiToInternal>;
 };
 
 @Injectable()

apps/api/v2/src/ee/event-types/event-types_2024_06_14/services/input-event-types.service.ts

@@ -1,12 +1,16 @@
 import { Injectable } from "@nestjs/common";
 
 import {
-  transformApiEventTypeBookingFields,
-  transformApiEventTypeLocations,
-  transformApiEventTypeIntervalLimits,
-  transformApiEventTypeFutureBookingLimits,
-  transformApiEventTypeRecurrence,
+  transformBookingFieldsApiToInternal,
+  transformLocationsApiToInternal,
+  transformIntervalLimitsApiToInternal,
+  transformFutureBookingLimitsApiToInternal,
+  transformRecurrenceApiToInternal,
+  systemBeforeFieldName,
+  systemBeforeFieldEmail,
+  systemAfterFieldRescheduleReason,
 } from "@calcom/platform-libraries";
+import { systemBeforeFieldLocation } from "@calcom/platform-libraries";
 import { CreateEventTypeInput_2024_06_14, UpdateEventTypeInput_2024_06_14 } from "@calcom/platform-types";
 
 @Injectable()
@@ -30,11 +34,12 @@ export class InputEventTypesService_2024_06_14 {
       ...rest
     } = inputEventType;
 
+    const hasMultipleLocations = (locations || defaultLocations).length > 1;
     const eventType = {
       ...rest,
       length: lengthInMinutes,
       locations: this.transformInputLocations(locations || defaultLocations),
-      bookingFields: this.transformInputBookingFields(bookingFields),
+      bookingFields: this.transformInputBookingFields(bookingFields, hasMultipleLocations),
       bookingLimits: bookingLimitsCount ? this.transformInputIntervalLimits(bookingLimitsCount) : undefined,
       durationLimits: bookingLimitsDuration
         ? this.transformInputIntervalLimits(bookingLimitsDuration)
@@ -59,11 +64,15 @@ export class InputEventTypesService_2024_06_14 {
       ...rest
     } = inputEventType;
 
+    const hasMultipleLocations = !!(locations && locations?.length > 1);
+
     const eventType = {
       ...rest,
       length: lengthInMinutes,
       locations: locations ? this.transformInputLocations(locations) : undefined,
-      bookingFields: bookingFields ? this.transformInputBookingFields(bookingFields) : undefined,
+      bookingFields: bookingFields
+        ? this.transformInputBookingFields(bookingFields, hasMultipleLocations)
+        : undefined,
       schedule: scheduleId,
       bookingLimits: bookingLimitsCount ? this.transformInputIntervalLimits(bookingLimitsCount) : undefined,
       durationLimits: bookingLimitsDuration
@@ -77,23 +86,35 @@ export class InputEventTypesService_2024_06_14 {
   }
 
   transformInputLocations(inputLocations: CreateEventTypeInput_2024_06_14["locations"]) {
-    return transformApiEventTypeLocations(inputLocations);
+    return transformLocationsApiToInternal(inputLocations);
   }
 
-  transformInputBookingFields(inputBookingFields: CreateEventTypeInput_2024_06_14["bookingFields"]) {
-    return transformApiEventTypeBookingFields(inputBookingFields);
+  transformInputBookingFields(
+    inputBookingFields: CreateEventTypeInput_2024_06_14["bookingFields"],
+    hasMultipleLocations: boolean
+  ) {
+    const defaultFieldsBefore = [systemBeforeFieldName, systemBeforeFieldEmail];
+    // note(Lauris): if event type has multiple locations then a radio button booking field has to be displayed to allow booker to pick location
+    if (hasMultipleLocations) {
+      defaultFieldsBefore.push(systemBeforeFieldLocation);
+    }
+
+    const customFields = transformBookingFieldsApiToInternal(inputBookingFields);
+    const defaultFieldsAfter = [systemAfterFieldRescheduleReason];
+
+    return [...defaultFieldsBefore, ...customFields, ...defaultFieldsAfter];
   }
 
   transformInputIntervalLimits(inputBookingFields: CreateEventTypeInput_2024_06_14["bookingLimitsCount"]) {
-    return transformApiEventTypeIntervalLimits(inputBookingFields);
+    return transformIntervalLimitsApiToInternal(inputBookingFields);
   }
 
   transformInputBookingWindow(inputBookingWindow: CreateEventTypeInput_2024_06_14["bookingWindow"]) {
-    const res = transformApiEventTypeFutureBookingLimits(inputBookingWindow);
+    const res = transformFutureBookingLimitsApiToInternal(inputBookingWindow);
     return !!res ? res : {};
   }
 
   transformInputRecurrignEvent(recurrence: CreateEventTypeInput_2024_06_14["recurrence"]) {
-    return transformApiEventTypeRecurrence(recurrence);
+    return transformRecurrenceApiToInternal(recurrence);
   }
 }

apps/api/v2/src/ee/event-types/event-types_2024_06_14/services/output-event-types.service.ts

@@ -4,17 +4,17 @@ import type { EventType, User, Schedule } from "@prisma/client";
 import {
   EventTypeMetaDataSchema,
   userMetadata,
-  getResponseEventTypeLocations,
-  getResponseEventTypeBookingFields,
+  transformLocationsInternalToApi,
+  transformBookingFieldsInternalToApi,
   parseRecurringEvent,
   TransformedLocationsSchema,
   BookingFieldsSchema,
   SystemField,
-  UserField,
+  CustomField,
   parseBookingLimit,
-  getResponseEventTypeIntervalLimits,
-  getResponseEventTypeFutureBookingLimits,
-  getResponseEventTypeRecurrence,
+  transformIntervalLimitsInternalToApi,
+  transformFutureBookingLimitsInternalToApi,
+  transformRecurrenceInternalToApi,
 } from "@calcom/platform-libraries";
 import { TransformFutureBookingsLimitSchema_2024_06_14 } from "@calcom/platform-types";
 
@@ -144,19 +144,20 @@ export class OutputEventTypesService_2024_06_14 {
 
   transformLocations(locations: any) {
     if (!locations) return [];
-    return getResponseEventTypeLocations(TransformedLocationsSchema.parse(locations));
+    return transformLocationsInternalToApi(TransformedLocationsSchema.parse(locations));
   }
 
-  transformBookingFields(inputBookingFields: (SystemField | UserField)[] | null) {
-    if (!inputBookingFields) return [];
-    const userFields = inputBookingFields.filter((field) => field.editable === "user") as UserField[];
-    return getResponseEventTypeBookingFields(userFields);
+  transformBookingFields(bookingFields: (SystemField | CustomField)[] | null) {
+    if (!bookingFields) return [];
+
+    return transformBookingFieldsInternalToApi(bookingFields);
   }
 
   transformRecurringEvent(recurringEvent: any) {
     if (!recurringEvent) return null;
     const recurringEventParsed = parseRecurringEvent(recurringEvent);
-    return getResponseEventTypeRecurrence(recurringEventParsed);
+    if (!recurringEventParsed) return null;
+    return transformRecurrenceInternalToApi(recurringEventParsed);
   }
 
   transformMetadata(metadata: any) {
@@ -182,10 +183,10 @@ export class OutputEventTypesService_2024_06_14 {
 
   transformIntervalLimits(bookingLimits: any) {
     const bookingLimitsParsed = parseBookingLimit(bookingLimits);
-    return getResponseEventTypeIntervalLimits(bookingLimitsParsed);
+    return transformIntervalLimitsInternalToApi(bookingLimitsParsed);
   }
 
   transformBookingWindow(bookingLimits: TransformFutureBookingsLimitSchema_2024_06_14) {
-    return getResponseEventTypeFutureBookingLimits(bookingLimits);
+    return transformFutureBookingLimitsInternalToApi(bookingLimits);
   }
 }

apps/api/v2/test/setEnvVars.ts

@@ -22,4 +22,7 @@ const env: Partial<Omit<Environment, "NODE_ENV">> = {
 process.env = {
   ...env,
   ...process.env,
+  NEXT_PUBLIC_VAPID_PUBLIC_KEY:
+    "BIds0AQJ96xGBjTSMHTOqLBLutQE7Lu32KKdgSdy7A2cS4mKI2cgb3iGkhDJa5Siy-stezyuPm8qpbhmNxdNHMw",
+  VAPID_PRIVATE_KEY: "6cJtkASCar5sZWguIAW7OjvyixpBw9p8zL8WDDwk9Jk",
 };