From 18414e857a83d8a5ed6ca3dd6c706fcc0d35a2fd Mon Sep 17 00:00:00 2001 From: Lucas Date: Mon, 13 Mar 2023 13:49:48 -0300 Subject: [PATCH] Fix user time format not respected and booking dates not localized on emails (#7682) * Localized booking date * re add space * Add locale per format call due to lambda dayjs instance share between users --------- Co-authored-by: Peer Richelsen --- packages/emails/src/components/WhenInfo.tsx | 12 +++++++----- packages/features/bookings/lib/handleNewBooking.ts | 2 ++ packages/lib/defaultEvents.ts | 1 + packages/prisma/selects/user.ts | 1 + packages/types/Calendar.d.ts | 2 ++ 5 files changed, 13 insertions(+), 5 deletions(-) diff --git a/packages/emails/src/components/WhenInfo.tsx b/packages/emails/src/components/WhenInfo.tsx index 6e6bf54659..ed2eec49c2 100644 --- a/packages/emails/src/components/WhenInfo.tsx +++ b/packages/emails/src/components/WhenInfo.tsx @@ -1,8 +1,9 @@ -import { TFunction } from "next-i18next"; +import type { TFunction } from "next-i18next"; import { RRule } from "rrule"; import dayjs from "@calcom/dayjs"; import { getEveryFreqFor } from "@calcom/lib/recurringStrings"; +import { TimeFormat } from "@calcom/lib/timeFormat"; import type { CalendarEvent, Person } from "@calcom/types/Calendar"; import type { RecurringEvent } from "@calcom/types/Calendar"; @@ -30,13 +31,15 @@ export function getRecurringWhen({ export function WhenInfo(props: { calEvent: CalendarEvent; timeZone: string; t: TFunction }) { const { timeZone, t, calEvent: { recurringEvent } = {} } = props; + const timeFormat = props.calEvent.organizer.timeFormat || TimeFormat.TWELVE_HOUR; + const locale = props.calEvent.organizer.language.locale; function getRecipientStart(format: string) { - return dayjs(props.calEvent.startTime).tz(timeZone).format(format); + return dayjs(props.calEvent.startTime).tz(timeZone).locale(locale).format(format); } function getRecipientEnd(format: string) { - return dayjs(props.calEvent.endTime).tz(timeZone).format(format); + return dayjs(props.calEvent.endTime).tz(timeZone).locale(locale).format(format); } const recurringInfo = getRecurringWhen({ @@ -54,8 +57,7 @@ export function WhenInfo(props: { calEvent: CalendarEvent; timeZone: string; t: description={ <> {recurringEvent?.count ? `${t("starting")} ` : ""} - {t(getRecipientStart("dddd").toLowerCase())}, {t(getRecipientStart("MMMM").toLowerCase())}{" "} - {getRecipientStart("D, YYYY | h:mma")} - {getRecipientEnd("h:mma")}{" "} + {getRecipientStart(`dddd, LL | ${timeFormat}`)} - {getRecipientEnd(timeFormat)}{" "} ({timeZone}) } diff --git a/packages/features/bookings/lib/handleNewBooking.ts b/packages/features/bookings/lib/handleNewBooking.ts index 477322d04b..32ba96837a 100644 --- a/packages/features/bookings/lib/handleNewBooking.ts +++ b/packages/features/bookings/lib/handleNewBooking.ts @@ -47,6 +47,7 @@ import { checkBookingLimits, checkDurationLimits, getLuckyUser } from "@calcom/l import { getTranslation } from "@calcom/lib/server/i18n"; import { slugify } from "@calcom/lib/slugify"; import { updateWebUser as syncServicesUpdateWebUser } from "@calcom/lib/sync/SyncServiceManager"; +import { TimeFormat } from "@calcom/lib/timeFormat"; import prisma, { userSelect } from "@calcom/prisma"; import type { bookingCreateSchemaLegacyPropsForApi } from "@calcom/prisma/zod-utils"; import { @@ -741,6 +742,7 @@ async function handler( email: organizerUser.email || "Email-less", timeZone: organizerUser.timeZone, language: { translate: tOrganizer, locale: organizerUser.locale ?? "en" }, + timeFormat: organizerUser.timeFormat === 24 ? TimeFormat.TWENTY_FOUR_HOUR : TimeFormat.TWELVE_HOUR, }, responses: "calEventResponses" in reqBody ? reqBody.calEventResponses : null, userFieldsResponses: calEventUserFieldsResponses, diff --git a/packages/lib/defaultEvents.ts b/packages/lib/defaultEvents.ts index a5cfe5ec1b..1fcc4f9936 100644 --- a/packages/lib/defaultEvents.ts +++ b/packages/lib/defaultEvents.ts @@ -47,6 +47,7 @@ const user: User = { brandColor: "#797979", darkBrandColor: "#efefef", allowDynamicBooking: true, + timeFormat: 12, }; const customInputs: CustomInputSchema[] = []; diff --git a/packages/prisma/selects/user.ts b/packages/prisma/selects/user.ts index 0ad1b31227..dcea2c8b60 100644 --- a/packages/prisma/selects/user.ts +++ b/packages/prisma/selects/user.ts @@ -10,6 +10,7 @@ export const availabilityUserSelect = Prisma.validator()({ username: true, endTime: true, selectedCalendars: true, + timeFormat: true, schedules: { select: { availability: true, diff --git a/packages/types/Calendar.d.ts b/packages/types/Calendar.d.ts index b6f6f331a8..5e5e231a13 100644 --- a/packages/types/Calendar.d.ts +++ b/packages/types/Calendar.d.ts @@ -5,6 +5,7 @@ import type { Time } from "ical.js"; import type { TFunction } from "next-i18next"; import type { Calendar } from "@calcom/features/calendars/weeklyview"; +import type { TimeFormat } from "@calcom/lib/timeFormat"; import type { Frequency } from "@calcom/prisma/zod-utils"; import type { Ensure } from "./utils"; @@ -26,6 +27,7 @@ export type Person = { id?: number; bookingId?: number; locale?: string; + timeFormat?: TimeFormat; }; export type TeamMember = {