diff --git a/apps/web/components/booking/AvailableEventLocations.tsx b/apps/web/components/booking/AvailableEventLocations.tsx index 4b9363718f..d4266d90f8 100644 --- a/apps/web/components/booking/AvailableEventLocations.tsx +++ b/apps/web/components/booking/AvailableEventLocations.tsx @@ -1,3 +1,5 @@ +import { z } from "zod"; + import { getEventLocationType, locationKeyToString } from "@calcom/app-store/locations"; import { classNames } from "@calcom/lib"; import { useLocale } from "@calcom/lib/hooks/useLocale"; @@ -17,6 +19,23 @@ export function AvailableEventLocations({ locations }: { locations: Props["event // It's possible that the location app got uninstalled return null; } + + const translateAbleKeys = [ + "attendee_in_person", + "in_person", + "attendee_phone_number", + "link_meeting", + "organizer_phone_number", + ]; + + const locationKey = z.string().default("").parse(locationKeyToString(location)); + + const translatedLocation = location.type.startsWith("integrations:") + ? eventLocationType.label + : translateAbleKeys.includes(locationKey) + ? t(locationKey) + : locationKey; + return (
{eventLocationType.iconUrl === "/link.svg" ? ( @@ -31,14 +50,12 @@ export function AvailableEventLocations({ locations }: { locations: Props["event alt={`${eventLocationType.label} icon`} /> )} - -

{t(locationKeyToString(location) ?? "")}

+ +

{translatedLocation}

); })} - ) : ( - <> - ); + ) : null; } diff --git a/apps/web/components/dialog/EditLocationDialog.tsx b/apps/web/components/dialog/EditLocationDialog.tsx index 1aedc4cc08..2f662f3df6 100644 --- a/apps/web/components/dialog/EditLocationDialog.tsx +++ b/apps/web/components/dialog/EditLocationDialog.tsx @@ -288,16 +288,13 @@ export const EditLocationDialog = (props: ISetLocationDialog) => { }}> { - if (!locationOptions.length) return null; + success={({ data }) => { + if (!data.length) return null; + const locationOptions = [...data]; if (booking) { - locationOptions.forEach((location) => { - if (location.label === "phone") { - location.options.filter((l) => l.value !== "phone"); - } else if (location.label === "in person") { - location.options.filter((l) => l.value !== "attendeeInPerson"); - } - }); + locationOptions.map((location) => + location.options.filter((l) => !["phone", "attendeeInPerson"].includes(l.value)) + ); } return ( ({ + const tmp = { + label: t(category), + options: apps[category].map((l) => ({ ...l, label: t(l.label), - })); - } else { - tmp.options.map((l) => ({ - ...l, - label: t(l.label.toLowerCase().split(" ").join("_")), - })); - } - - tmp.label = t(tmp.label); + })), + }; locations.push(tmp); } + return locations; }