Fixes issues with video location links from apps (#3760)

* fix issue with video apps link not saved as location

* use link as location for ping.gg

* fix around link in availability page + allow breaking line for locations

* use find instead of filter to get the first item

Co-authored-by: Omar López <zomars@me.com>

Co-authored-by: CarinaWolli <wollencarina@gmail.com>
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
Co-authored-by: Omar López <zomars@me.com>

apps/web/components/booking/BookingListItem.tsx

@@ -187,7 +187,11 @@ function BookingListItem(booking: BookingItemProps) {
     if (
       newLocationType === LocationType.InPerson ||
       newLocationType === LocationType.Link ||
-      newLocationType === LocationType.UserPhone
+      newLocationType === LocationType.UserPhone ||
+      newLocationType === LocationType.Riverside ||
+      newLocationType === LocationType.Around ||
+      newLocationType === LocationType.Whereby ||
+      newLocationType === LocationType.Ping
     ) {
       newLocation = details[Object.keys(details)[0]];
     }

apps/web/components/booking/pages/AvailabilityPage.tsx

@@ -55,6 +55,7 @@ export const locationKeyToString = (location: LocationObject, t: TFunction) => {
     case LocationType.Link:
     case LocationType.Ping:
     case LocationType.Riverside:
+    case LocationType.Around:
     case LocationType.Whereby:
       return location.link || "Link"; // If disabled link won't exist on the object
     case LocationType.Phone:
@@ -606,7 +607,7 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
                     </div>
                   )}
                   {eventType.locations.length === 1 && (
-                    <p className="text-sm text-gray-600 dark:text-white">
+                    <p className="mr-6 w-10 break-words text-sm text-gray-600 dark:text-white">
                       {Object.values(AppStoreLocationType).includes(
                         eventType.locations[0].type as unknown as AppStoreLocationType
                       ) ? (
@@ -619,11 +620,11 @@ const AvailabilityPage = ({ profile, eventType }: Props) => {
                     </p>
                   )}
                   {eventType.locations.length > 1 && (
-                    <div className="flex-warp flex font-medium text-gray-600 dark:text-white">
+                    <div className="flex-warp mr-6 flex break-words font-medium text-gray-600 dark:text-white">
                       <div className="mr-[10px] ml-[2px] -mt-1 ">
                         <Icon.FiMapPin className="inline-block h-4 w-4 text-gray-500" />
                       </div>
-                      <p>
+                      <p className="w-full">
                         {eventType.locations.map((el, i, arr) => {
                           return (
                             <span key={el.type}>

packages/core/EventManager.ts

@@ -172,7 +172,10 @@ export default class EventManager {
     }
 
     // Update the calendar event with the proper video call data
-    results.push(...(await this.updateAllCalendarEvents(evt, booking)));
+    const calendarReference = booking.references.find((reference) => reference.type.includes("_calendar"));
+    if (calendarReference) {
+      results.push(...(await this.updateAllCalendarEvents(evt, booking)));
+    }
 
     const referencesToCreate = results.map((result) => {
       return {
@@ -430,7 +433,6 @@ export default class EventManager {
     try {
       // Bookings should only have one calendar reference
       calendarReference = booking.references.filter((reference) => reference.type.includes("_calendar"))[0];
-
       if (!calendarReference) throw new Error("bookingRef");
 
       const { uid: bookingRefUid, externalCalendarId: bookingExternalCalendarId } = calendarReference;