Fixes locations options mistranslations (#2336)
This commit is contained in:
		
							parent
							
								
									f293f8b5c4
								
							
						
					
					
						commit
						f71c0ddfc3
					
				
					 2 changed files with 19 additions and 42 deletions
				
			
		| 
						 | 
					@ -30,6 +30,7 @@ import { JSONObject } from "superjson/dist/types";
 | 
				
			||||||
import { z } from "zod";
 | 
					import { z } from "zod";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import getApps, { getLocationOptions, hasIntegration } from "@calcom/app-store/utils";
 | 
					import getApps, { getLocationOptions, hasIntegration } from "@calcom/app-store/utils";
 | 
				
			||||||
 | 
					import { useLocale } from "@calcom/lib/hooks/useLocale";
 | 
				
			||||||
import showToast from "@calcom/lib/notification";
 | 
					import showToast from "@calcom/lib/notification";
 | 
				
			||||||
import { StripeData } from "@calcom/stripe/server";
 | 
					import { StripeData } from "@calcom/stripe/server";
 | 
				
			||||||
import Button from "@calcom/ui/Button";
 | 
					import Button from "@calcom/ui/Button";
 | 
				
			||||||
| 
						 | 
					@ -41,7 +42,6 @@ import { QueryCell } from "@lib/QueryCell";
 | 
				
			||||||
import { asStringOrThrow, asStringOrUndefined } from "@lib/asStringOrNull";
 | 
					import { asStringOrThrow, asStringOrUndefined } from "@lib/asStringOrNull";
 | 
				
			||||||
import { getSession } from "@lib/auth";
 | 
					import { getSession } from "@lib/auth";
 | 
				
			||||||
import { HttpError } from "@lib/core/http/error";
 | 
					import { HttpError } from "@lib/core/http/error";
 | 
				
			||||||
import { useLocale } from "@lib/hooks/useLocale";
 | 
					 | 
				
			||||||
import { LocationType } from "@lib/location";
 | 
					import { LocationType } from "@lib/location";
 | 
				
			||||||
import prisma from "@lib/prisma";
 | 
					import prisma from "@lib/prisma";
 | 
				
			||||||
import { slugify } from "@lib/slugify";
 | 
					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 * as RadioArea from "@components/ui/form/radio-area";
 | 
				
			||||||
import WebhookListContainer from "@components/webhook/WebhookListContainer";
 | 
					import WebhookListContainer from "@components/webhook/WebhookListContainer";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
 | 
					import { getTranslation } from "@server/lib/i18n";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import bloxyApi from "../../web3/dummyResps/bloxyApi";
 | 
					import bloxyApi from "../../web3/dummyResps/bloxyApi";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
dayjs.extend(utc);
 | 
					dayjs.extend(utc);
 | 
				
			||||||
| 
						 | 
					@ -84,19 +86,6 @@ type OptionTypeBase = {
 | 
				
			||||||
  disabled?: boolean;
 | 
					  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 AvailabilitySelect = ({ className, ...props }: SelectProps) => {
 | 
				
			||||||
  const query = trpc.useQuery(["viewer.availability.list"]);
 | 
					  const query = trpc.useQuery(["viewer.availability.list"]);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -148,19 +137,7 @@ const EventTypePage = (props: inferSSRProps<typeof getServerSideProps>) => {
 | 
				
			||||||
      prefix: t("indefinitely_into_future"),
 | 
					      prefix: t("indefinitely_into_future"),
 | 
				
			||||||
    },
 | 
					    },
 | 
				
			||||||
  ];
 | 
					  ];
 | 
				
			||||||
  const { eventType, locationOptions, availability, team, teamMembers, hasPaymentIntegration, currency } =
 | 
					  const { eventType, locationOptions, team, teamMembers, hasPaymentIntegration, currency } = props;
 | 
				
			||||||
    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 router = useRouter();
 | 
					  const router = useRouter();
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1840,6 +1817,7 @@ export const getServerSideProps = async (context: GetServerSidePropsContext) =>
 | 
				
			||||||
    id: true,
 | 
					    id: true,
 | 
				
			||||||
    avatar: true,
 | 
					    avatar: true,
 | 
				
			||||||
    email: true,
 | 
					    email: true,
 | 
				
			||||||
 | 
					    locale: true,
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const rawEventType = await prisma.eventType.findFirst({
 | 
					  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");
 | 
					    if (!fallbackUser) throw Error("The event type doesn't have user and no fallback user was found");
 | 
				
			||||||
    eventType.users.push(fallbackUser);
 | 
					    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 integrations = getApps(credentials);
 | 
				
			||||||
  const locationOptions = getLocationOptions(integrations);
 | 
					  const locationOptions = getLocationOptions(integrations, t);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const hasPaymentIntegration = hasIntegration(integrations, "stripe_payment");
 | 
					  const hasPaymentIntegration = hasIntegration(integrations, "stripe_payment");
 | 
				
			||||||
  if (hasIntegration(integrations, "google_calendar")) {
 | 
					 | 
				
			||||||
    locationOptions.push({
 | 
					 | 
				
			||||||
      value: LocationType.GoogleMeet,
 | 
					 | 
				
			||||||
      label: "Google Meet",
 | 
					 | 
				
			||||||
    });
 | 
					 | 
				
			||||||
  }
 | 
					 | 
				
			||||||
  const currency =
 | 
					  const currency =
 | 
				
			||||||
    (credentials.find((integration) => integration.type === "stripe_payment")?.key as unknown as StripeData)
 | 
					    (credentials.find((integration) => integration.type === "stripe_payment")?.key as unknown as StripeData)
 | 
				
			||||||
      ?.default_currency || "usd";
 | 
					      ?.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"];
 | 
					  type Availability = typeof eventType["availability"];
 | 
				
			||||||
  const getAvailability = (availability: Availability) =>
 | 
					  const getAvailability = (availability: Availability) =>
 | 
				
			||||||
    availability?.length
 | 
					    availability?.length
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
| 
						 | 
					@ -1,4 +1,5 @@
 | 
				
			||||||
import { Prisma } from "@prisma/client";
 | 
					import { Prisma } from "@prisma/client";
 | 
				
			||||||
 | 
					import { TFunction } from "next-i18next";
 | 
				
			||||||
 | 
					
 | 
				
			||||||
import { LocationType } from "@calcom/lib/location";
 | 
					import { LocationType } from "@calcom/lib/location";
 | 
				
			||||||
import type { App } from "@calcom/types/App";
 | 
					import type { App } from "@calcom/types/App";
 | 
				
			||||||
| 
						 | 
					@ -24,9 +25,17 @@ type OptionTypeBase = {
 | 
				
			||||||
  disabled?: boolean;
 | 
					  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[] = [
 | 
					  const defaultLocations: OptionTypeBase[] = [
 | 
				
			||||||
    { value: LocationType.InPerson, label: "in_person_meeting" },
 | 
					    { value: LocationType.InPerson, label: "in_person_meeting" },
 | 
				
			||||||
 | 
					    { value: LocationType.Link, label: "link_meeting" },
 | 
				
			||||||
    { value: LocationType.Phone, label: "phone_call" },
 | 
					    { value: LocationType.Phone, label: "phone_call" },
 | 
				
			||||||
  ];
 | 
					  ];
 | 
				
			||||||
 | 
					
 | 
				
			||||||
| 
						 | 
					@ -36,7 +45,7 @@ export function getLocationOptions(integrations: AppMeta) {
 | 
				
			||||||
    }
 | 
					    }
 | 
				
			||||||
  });
 | 
					  });
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return defaultLocations;
 | 
					  return translateLocations(defaultLocations, t);
 | 
				
			||||||
}
 | 
					}
 | 
				
			||||||
 | 
					
 | 
				
			||||||
/**
 | 
					/**
 | 
				
			||||||
| 
						 | 
					
 | 
				
			||||||
		Loading…
	
		Reference in a new issue