feat(troubleshoot): add event titles to the troubleshoot page (#3434) (#3437)

apps/web/pages/availability/troubleshoot.tsx

@@ -14,7 +14,7 @@ type User = inferQueryOutput<"viewer.me">;
 const AvailabilityView = ({ user }: { user: User }) => {
   const { t } = useLocale();
   const [loading, setLoading] = useState(true);
-  const [availability, setAvailability] = useState<{ end: string; start: string }[]>([]);
+  const [availability, setAvailability] = useState<{ end: string; start: string; title?: string }[]>([]);
   const [selectedDate, setSelectedDate] = useState(dayjs());
 
   function convertMinsToHrsMins(mins: number) {
@@ -83,6 +83,7 @@ const AvailabilityView = ({ user }: { user: User }) => {
                   </span>{" "}
                   {t("on")} {dayjs(slot.start).format("D")}{" "}
                   {t(dayjs(slot.start).format("MMMM").toLowerCase())} {dayjs(slot.start).format("YYYY")}
+                  {slot.title && ` - (${slot.title})`}
                 </div>
               </div>
             ))

packages/core/getBusyTimes.ts

@@ -5,7 +5,7 @@ import logger from "@calcom/lib/logger";
 // import { getBusyVideoTimes } from "@calcom/core/videoClient";
 // import notEmpty from "@calcom/lib/notEmpty";
 import prisma from "@calcom/prisma";
-import type { EventBusyDate } from "@calcom/types/Calendar";
+import type { EventBusyDetails } from "@calcom/types/Calendar";
 
 export async function getBusyTimes(params: {
   credentials: Credential[];
@@ -24,7 +24,7 @@ export async function getBusyTimes(params: {
     })}`
   );
   const startPrismaBookingGet = performance.now();
-  const busyTimes: EventBusyDate[] = await prisma.booking
+  const busyTimes: EventBusyDetails[] = await prisma.booking
     .findMany({
       where: {
         userId,
@@ -39,9 +39,10 @@ export async function getBusyTimes(params: {
         id: true,
         startTime: true,
         endTime: true,
+        title: true,
       },
     })
-    .then((bookings) => bookings.map(({ startTime, endTime }) => ({ end: endTime, start: startTime })));
+    .then((bookings) => bookings.map(({ startTime, endTime, title }) => ({ end: endTime, start: startTime, title })));
   logger.silly(`Busy Time from Cal Bookings ${JSON.stringify(busyTimes)}`);
   const endPrismaBookingGet = performance.now();
   logger.debug(`prisma booking get took ${endPrismaBookingGet - startPrismaBookingGet}ms`);

packages/core/getUserAvailability.ts

@@ -132,6 +132,7 @@ export async function getUserAvailability(
     end: dayjs(a.end)
       .add(currentUser.bufferTime + (afterEventBuffer || 0), "minute")
       .toISOString(),
+    title: a.title,
   }));
 
   const schedule = eventType?.schedule

packages/types/Calendar.d.ts

@@ -26,6 +26,10 @@ export type Person = {
 
 export type EventBusyDate = Record<"start" | "end", Date | string>;
 
+export type EventBusyDetails = EventBusyDate & {
+  title?: string;
+};
+
 export type CalendarServiceType = typeof Calendar;
 
 export type NewCalendarEventType = {