From 46f0b55a456c439ff66402f479ce856a34b6090c Mon Sep 17 00:00:00 2001 From: Alex van Andel Date: Thu, 23 Mar 2023 19:49:28 +0100 Subject: [PATCH] Techdebt/bundle size experiments (#7894) * Checking package size effects when we remove zod from middleware * Remove 'crypto' from client code * Revert "Checking package size effects when we remove zod from middleware" This reverts commit ecc2038411c73fc562d57712d5c83d66925e7e13. * Adding lodash to dynamicImports + consistent imports * Remove the locales from the global Dayjs object --- apps/web/components/NavTabs.tsx | 2 +- .../components/booking/BookingListItem.tsx | 2 ++ apps/web/next.config.js | 3 +++ apps/web/pages/auth/forgot-password/[id].tsx | 2 +- apps/web/pages/auth/forgot-password/index.tsx | 2 +- .../web/pages/settings/my-account/profile.tsx | 8 +----- apps/web/playwright/lib/testUtils.ts | 2 +- packages/core/CalendarManager.ts | 12 ++++----- packages/core/EventManager.ts | 3 +-- packages/dayjs/index.ts | 25 ------------------- packages/dayjs/locales.ts | 25 +++++++++++++++++++ packages/emails/src/components/WhenInfo.tsx | 2 ++ .../ee/support/lib/intercom/useIntercom.ts | 2 +- packages/trpc/server/routers/viewer.tsx | 4 +-- .../trpc/server/routers/viewer/eventTypes.ts | 5 ++-- packages/ui/components/head-seo/HeadSeo.tsx | 2 +- .../ui/components/top-banner/TopBanner.tsx | 2 +- 17 files changed, 51 insertions(+), 52 deletions(-) create mode 100644 packages/dayjs/locales.ts diff --git a/apps/web/components/NavTabs.tsx b/apps/web/components/NavTabs.tsx index 06e4c30b47..c3edf0d8f2 100644 --- a/apps/web/components/NavTabs.tsx +++ b/apps/web/components/NavTabs.tsx @@ -1,5 +1,5 @@ import { AdminRequired } from "components/ui/AdminRequired"; -import noop from "lodash/noop"; +import { noop } from "lodash"; import type { LinkProps } from "next/link"; import Link from "next/link"; import { useRouter } from "next/router"; diff --git a/apps/web/components/booking/BookingListItem.tsx b/apps/web/components/booking/BookingListItem.tsx index b597347628..cde2b280c5 100644 --- a/apps/web/components/booking/BookingListItem.tsx +++ b/apps/web/components/booking/BookingListItem.tsx @@ -5,6 +5,8 @@ import { useState } from "react"; import type { EventLocationType } from "@calcom/app-store/locations"; import { getEventLocationType } from "@calcom/app-store/locations"; import dayjs from "@calcom/dayjs"; +// TODO: Use browser locale, implement Intl in Dayjs maybe? +import "@calcom/dayjs/locales"; import ViewRecordingsDialog from "@calcom/features/ee/video/ViewRecordingsDialog"; import classNames from "@calcom/lib/classNames"; import { formatTime } from "@calcom/lib/date-fns"; diff --git a/apps/web/next.config.js b/apps/web/next.config.js index 80079fe424..b7f670d9c4 100644 --- a/apps/web/next.config.js +++ b/apps/web/next.config.js @@ -99,6 +99,9 @@ const nextConfig = { skipDefaultConversion: true, preventFullImport: true, }, + lodash: { + transform: "lodash/{{member}}", + }, // TODO: We need to have all components in `@calcom/ui/components` in order to use this // "@calcom/ui": { // transform: "@calcom/ui/components/{{member}}", diff --git a/apps/web/pages/auth/forgot-password/[id].tsx b/apps/web/pages/auth/forgot-password/[id].tsx index a1e04abcd4..2a66e3589c 100644 --- a/apps/web/pages/auth/forgot-password/[id].tsx +++ b/apps/web/pages/auth/forgot-password/[id].tsx @@ -1,5 +1,5 @@ import type { ResetPasswordRequest } from "@prisma/client"; -import debounce from "lodash/debounce"; +import { debounce } from "lodash"; import type { GetServerSidePropsContext } from "next"; import { getCsrfToken } from "next-auth/react"; import { serverSideTranslations } from "next-i18next/serverSideTranslations"; diff --git a/apps/web/pages/auth/forgot-password/index.tsx b/apps/web/pages/auth/forgot-password/index.tsx index 99e1bfdcee..93d775f5cd 100644 --- a/apps/web/pages/auth/forgot-password/index.tsx +++ b/apps/web/pages/auth/forgot-password/index.tsx @@ -1,4 +1,4 @@ -import debounce from "lodash/debounce"; +import { debounce } from "lodash"; import type { GetServerSidePropsContext } from "next"; import { getCsrfToken } from "next-auth/react"; import { serverSideTranslations } from "next-i18next/serverSideTranslations"; diff --git a/apps/web/pages/settings/my-account/profile.tsx b/apps/web/pages/settings/my-account/profile.tsx index 09015c0d0a..cc850c72c9 100644 --- a/apps/web/pages/settings/my-account/profile.tsx +++ b/apps/web/pages/settings/my-account/profile.tsx @@ -1,6 +1,5 @@ import { zodResolver } from "@hookform/resolvers/zod"; import { IdentityProvider } from "@prisma/client"; -import crypto from "crypto"; import { signOut } from "next-auth/react"; import type { BaseSyntheticEvent } from "react"; import { useRef, useState } from "react"; @@ -332,11 +331,6 @@ const ProfileForm = ({ bio: z.string(), }); - const emailMd5 = crypto - .createHash("md5") - .update(defaultValues.email || "example@example.com") - .digest("hex"); - const formMethods = useForm({ defaultValues, resolver: zodResolver(profileFormSchema), @@ -356,7 +350,7 @@ const ProfileForm = ({ name="avatar" render={({ field: { value } }) => ( <> - +
{ + const calendars = sortBy( + cals.map((cal) => { if (cal.externalId === destinationCalendarExternalId) destinationCalendar = cal; return { ...cal, @@ -64,9 +64,9 @@ export const getConnectedCalendars = async ( isSelected: selectedCalendars.some((selected) => selected.externalId === cal.externalId), credentialId, }; - }) - .sortBy(["primary"]) - .value(); + }), + ["primary"] + ); const primary = calendars.find((item) => item.primary) ?? calendars.find((cal) => cal !== undefined); if (!primary) { return { diff --git a/packages/core/EventManager.ts b/packages/core/EventManager.ts index 29e4cae4c3..34345884a5 100644 --- a/packages/core/EventManager.ts +++ b/packages/core/EventManager.ts @@ -1,6 +1,5 @@ import type { DestinationCalendar, Booking } from "@prisma/client"; -import { cloneDeep } from "lodash"; -import merge from "lodash/merge"; +import { cloneDeep, merge } from "lodash"; import { v5 as uuidv5 } from "uuid"; import type { z } from "zod"; diff --git a/packages/dayjs/index.ts b/packages/dayjs/index.ts index 77907ffa61..12fc0e949a 100644 --- a/packages/dayjs/index.ts +++ b/packages/dayjs/index.ts @@ -1,31 +1,6 @@ /* eslint-disable @calcom/eslint/deprecated-imports */ import dayjs from "dayjs"; import dayjsBusinessTime from "dayjs-business-days2"; -import "dayjs/locale/ar"; -import "dayjs/locale/bg"; -import "dayjs/locale/cs"; -import "dayjs/locale/de"; -import "dayjs/locale/es"; -import "dayjs/locale/es-mx"; -import "dayjs/locale/fr"; -import "dayjs/locale/he"; -import "dayjs/locale/hu"; -import "dayjs/locale/it"; -import "dayjs/locale/ja"; -import "dayjs/locale/ko"; -import "dayjs/locale/nl"; -import "dayjs/locale/pl"; -import "dayjs/locale/pt"; -import "dayjs/locale/pt-br"; -import "dayjs/locale/ro"; -import "dayjs/locale/ru"; -import "dayjs/locale/sr"; -import "dayjs/locale/sv"; -import "dayjs/locale/tr"; -import "dayjs/locale/uk"; -import "dayjs/locale/vi"; -import "dayjs/locale/zh-cn"; -import "dayjs/locale/zh-tw"; import customParseFormat from "dayjs/plugin/customParseFormat"; import isBetween from "dayjs/plugin/isBetween"; import isToday from "dayjs/plugin/isToday"; diff --git a/packages/dayjs/locales.ts b/packages/dayjs/locales.ts new file mode 100644 index 0000000000..37a3c55e9e --- /dev/null +++ b/packages/dayjs/locales.ts @@ -0,0 +1,25 @@ +import "dayjs/locale/ar"; +import "dayjs/locale/bg"; +import "dayjs/locale/cs"; +import "dayjs/locale/de"; +import "dayjs/locale/es"; +import "dayjs/locale/es-mx"; +import "dayjs/locale/fr"; +import "dayjs/locale/he"; +import "dayjs/locale/hu"; +import "dayjs/locale/it"; +import "dayjs/locale/ja"; +import "dayjs/locale/ko"; +import "dayjs/locale/nl"; +import "dayjs/locale/pl"; +import "dayjs/locale/pt"; +import "dayjs/locale/pt-br"; +import "dayjs/locale/ro"; +import "dayjs/locale/ru"; +import "dayjs/locale/sr"; +import "dayjs/locale/sv"; +import "dayjs/locale/tr"; +import "dayjs/locale/uk"; +import "dayjs/locale/vi"; +import "dayjs/locale/zh-cn"; +import "dayjs/locale/zh-tw"; diff --git a/packages/emails/src/components/WhenInfo.tsx b/packages/emails/src/components/WhenInfo.tsx index ed2eec49c2..6effa922fb 100644 --- a/packages/emails/src/components/WhenInfo.tsx +++ b/packages/emails/src/components/WhenInfo.tsx @@ -2,6 +2,8 @@ import type { TFunction } from "next-i18next"; import { RRule } from "rrule"; import dayjs from "@calcom/dayjs"; +// TODO: Use browser locale, implement Intl in Dayjs maybe? +import "@calcom/dayjs/locales"; import { getEveryFreqFor } from "@calcom/lib/recurringStrings"; import { TimeFormat } from "@calcom/lib/timeFormat"; import type { CalendarEvent, Person } from "@calcom/types/Calendar"; diff --git a/packages/features/ee/support/lib/intercom/useIntercom.ts b/packages/features/ee/support/lib/intercom/useIntercom.ts index cde4a0c253..87d8e3b84c 100644 --- a/packages/features/ee/support/lib/intercom/useIntercom.ts +++ b/packages/features/ee/support/lib/intercom/useIntercom.ts @@ -1,4 +1,4 @@ -import noop from "lodash/noop"; +import { noop } from "lodash"; import { useIntercom as useIntercomLib } from "react-use-intercom"; import { z } from "zod"; diff --git a/packages/trpc/server/routers/viewer.tsx b/packages/trpc/server/routers/viewer.tsx index eecdee8282..bf3457ea3c 100644 --- a/packages/trpc/server/routers/viewer.tsx +++ b/packages/trpc/server/routers/viewer.tsx @@ -1,7 +1,7 @@ import type { DestinationCalendar, Prisma } from "@prisma/client"; import { AppCategories, BookingStatus, IdentityProvider } from "@prisma/client"; import { cityMapping } from "city-timezones"; -import _ from "lodash"; +import { reverse } from "lodash"; import { authenticator } from "otplib"; import z from "zod"; @@ -755,7 +755,7 @@ const loggedInViewerRouter = router({ }); } await Promise.all( - _.reverse(input.ids).map((id, position) => { + reverse(input.ids).map((id, position) => { return prisma.eventType.update({ where: { id, diff --git a/packages/trpc/server/routers/viewer/eventTypes.ts b/packages/trpc/server/routers/viewer/eventTypes.ts index 2eeecb75b8..2cd6f7be00 100644 --- a/packages/trpc/server/routers/viewer/eventTypes.ts +++ b/packages/trpc/server/routers/viewer/eventTypes.ts @@ -1,7 +1,6 @@ import { MembershipRole, PeriodType, Prisma, SchedulingType } from "@prisma/client"; import { PrismaClientKnownRequestError } from "@prisma/client/runtime/library"; -// REVIEW: From lint error -import _ from "lodash"; +import { orderBy } from "lodash"; import type { NextApiResponse } from "next"; import { z } from "zod"; @@ -336,7 +335,7 @@ export const eventTypesRouter = router({ name: user.name, image: user.avatar || undefined, }, - eventTypes: _.orderBy(mergedEventTypes, ["position", "id"], ["desc", "asc"]), + eventTypes: orderBy(mergedEventTypes, ["position", "id"], ["desc", "asc"]), metadata: { membershipCount: 1, readOnly: false, diff --git a/packages/ui/components/head-seo/HeadSeo.tsx b/packages/ui/components/head-seo/HeadSeo.tsx index 1cdb89da87..e3b30d6dc1 100644 --- a/packages/ui/components/head-seo/HeadSeo.tsx +++ b/packages/ui/components/head-seo/HeadSeo.tsx @@ -1,4 +1,4 @@ -import merge from "lodash/merge"; +import { merge } from "lodash"; import type { NextSeoProps } from "next-seo"; import { NextSeo } from "next-seo"; import { useRouter } from "next/router"; diff --git a/packages/ui/components/top-banner/TopBanner.tsx b/packages/ui/components/top-banner/TopBanner.tsx index a1e8bf2215..c47eb85af2 100644 --- a/packages/ui/components/top-banner/TopBanner.tsx +++ b/packages/ui/components/top-banner/TopBanner.tsx @@ -1,6 +1,6 @@ import { XIcon } from "@heroicons/react/solid"; import classNames from "classnames"; -import noop from "lodash/noop"; +import { noop } from "lodash"; import type { ReactNode } from "react"; import { FiAlertTriangle, FiInfo } from "../icon";