From f71c0ddfc30ef663e2bc044553935a082fb5bc7b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Omar=20L=C3=B3pez?= <zomars@me.com>
Date: Thu, 31 Mar 2022 14:29:03 -0700
Subject: [PATCH] Fixes locations options mistranslations (#2336)

---
 apps/web/pages/event-types/[type].tsx | 48 +++++----------------------
 packages/app-store/utils.ts           | 13 ++++++--
 2 files changed, 19 insertions(+), 42 deletions(-)

diff --git a/apps/web/pages/event-types/[type].tsx b/apps/web/pages/event-types/[type].tsx
index 825bc720..202c48fe 100644
--- a/apps/web/pages/event-types/[type].tsx
+++ b/apps/web/pages/event-types/[type].tsx
@@ -30,6 +30,7 @@ import { JSONObject } from "superjson/dist/types";
 import { z } from "zod";
 
 import getApps, { getLocationOptions, hasIntegration } from "@calcom/app-store/utils";
+import { useLocale } from "@calcom/lib/hooks/useLocale";
 import showToast from "@calcom/lib/notification";
 import { StripeData } from "@calcom/stripe/server";
 import Button from "@calcom/ui/Button";
@@ -41,7 +42,6 @@ import { QueryCell } from "@lib/QueryCell";
 import { asStringOrThrow, asStringOrUndefined } from "@lib/asStringOrNull";
 import { getSession } from "@lib/auth";
 import { HttpError } from "@lib/core/http/error";
-import { useLocale } from "@lib/hooks/useLocale";
 import { LocationType } from "@lib/location";
 import prisma from "@lib/prisma";
 import { slugify } from "@lib/slugify";
@@ -62,6 +62,8 @@ import MinutesField from "@components/ui/form/MinutesField";
 import * as RadioArea from "@components/ui/form/radio-area";
 import WebhookListContainer from "@components/webhook/WebhookListContainer";
 
+import { getTranslation } from "@server/lib/i18n";
+
 import bloxyApi from "../../web3/dummyResps/bloxyApi";
 
 dayjs.extend(utc);
@@ -84,19 +86,6 @@ type OptionTypeBase = {
   disabled?: boolean;
 };
 
-const addDefaultLocationOptions = (
-  defaultLocations: OptionTypeBase[],
-  locationOptions: OptionTypeBase[]
-): void => {
-  const existingLocationOptions = locationOptions.flatMap((locationOptionItem) => [locationOptionItem.value]);
-
-  defaultLocations.map((item) => {
-    if (!existingLocationOptions.includes(item.value)) {
-      locationOptions.push(item);
-    }
-  });
-};
-
 const AvailabilitySelect = ({ className, ...props }: SelectProps) => {
   const query = trpc.useQuery(["viewer.availability.list"]);
 
@@ -148,19 +137,7 @@ const EventTypePage = (props: inferSSRProps<typeof getServerSideProps>) => {
       prefix: t("indefinitely_into_future"),
     },
   ];
-  const { eventType, locationOptions, availability, team, teamMembers, hasPaymentIntegration, currency } =
-    props;
-
-  /** Appending default locations */
-
-  const defaultLocations = [
-    { value: LocationType.InPerson, label: t("in_person_meeting") },
-    { value: LocationType.Link, label: t("link_meeting") },
-    { value: LocationType.Jitsi, label: "Jitsi Meet" },
-    { value: LocationType.Phone, label: t("phone_call") },
-  ];
-
-  addDefaultLocationOptions(defaultLocations, locationOptions);
+  const { eventType, locationOptions, team, teamMembers, hasPaymentIntegration, currency } = props;
 
   const router = useRouter();
 
@@ -1840,6 +1817,7 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
     id: true,
     avatar: true,
     email: true,
+    locale: true,
   });
 
   const rawEventType = await prisma.eventType.findFirst({
@@ -1972,26 +1950,16 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
     if (!fallbackUser) throw Error("The event type doesn't have user and no fallback user was found");
     eventType.users.push(fallbackUser);
   }
-
+  const currentUser = eventType.users.find((u) => u.id === session.user.id);
+  const t = await getTranslation(currentUser?.locale ?? "en", "common");
   const integrations = getApps(credentials);
-  const locationOptions = getLocationOptions(integrations);
+  const locationOptions = getLocationOptions(integrations, t);
 
   const hasPaymentIntegration = hasIntegration(integrations, "stripe_payment");
-  if (hasIntegration(integrations, "google_calendar")) {
-    locationOptions.push({
-      value: LocationType.GoogleMeet,
-      label: "Google Meet",
-    });
-  }
   const currency =
     (credentials.find((integration) => integration.type === "stripe_payment")?.key as unknown as StripeData)
       ?.default_currency || "usd";
 
-  if (hasIntegration(integrations, "office365_calendar")) {
-    // TODO: Add default meeting option of the office integration.
-    // Assuming it's Microsoft Teams.
-  }
-
   type Availability = typeof eventType["availability"];
   const getAvailability = (availability: Availability) =>
     availability?.length
diff --git a/packages/app-store/utils.ts b/packages/app-store/utils.ts
index 293e000b..56fba2f3 100644
--- a/packages/app-store/utils.ts
+++ b/packages/app-store/utils.ts
@@ -1,4 +1,5 @@
 import { Prisma } from "@prisma/client";
+import { TFunction } from "next-i18next";
 
 import { LocationType } from "@calcom/lib/location";
 import type { App } from "@calcom/types/App";
@@ -24,9 +25,17 @@ type OptionTypeBase = {
   disabled?: boolean;
 };
 
-export function getLocationOptions(integrations: AppMeta) {
+function translateLocations(locations: OptionTypeBase[], t: TFunction) {
+  return locations.map((l) => ({
+    ...l,
+    label: t(l.label),
+  }));
+}
+
+export function getLocationOptions(integrations: AppMeta, t: TFunction) {
   const defaultLocations: OptionTypeBase[] = [
     { value: LocationType.InPerson, label: "in_person_meeting" },
+    { value: LocationType.Link, label: "link_meeting" },
     { value: LocationType.Phone, label: "phone_call" },
   ];
 
@@ -36,7 +45,7 @@ export function getLocationOptions(integrations: AppMeta) {
     }
   });
 
-  return defaultLocations;
+  return translateLocations(defaultLocations, t);
 }
 
 /**