WIP: SIU: Maximum call stack size exceeded fix? (#6740)

* Maximum call stack size exceeded fix?

# Conflicts:
#	packages/prisma/index.ts

* Prisma client extensions is too much for our TS

* Removed unused Icons

* Type fixes

apps/web/components/booking/pages/BookingPage.tsx

@@ -38,6 +38,7 @@ import { useLocale } from "@calcom/lib/hooks/useLocale";
 import useTheme from "@calcom/lib/hooks/useTheme";
 import { HttpError } from "@calcom/lib/http-error";
 import { getEveryFreqFor } from "@calcom/lib/recurringStrings";
+import slugify from "@calcom/lib/slugify";
 import { collectPageParameters, telemetryEventTypes, useTelemetry } from "@calcom/lib/telemetry";
 import { AddressInput, Button, EmailInput, Form, PhoneInput, Tooltip, Group, RadioField } from "@calcom/ui";
 import {
@@ -57,7 +58,6 @@ import useRouterQuery from "@lib/hooks/useRouterQuery";
 import createBooking from "@lib/mutations/bookings/create-booking";
 import createRecurringBooking from "@lib/mutations/bookings/create-recurring-booking";
 import { parseDate, parseRecurringDates } from "@lib/parseDate";
-import slugify from "@lib/slugify";
 
 import Gates, { Gate, GateState } from "@components/Gates";
 import BookingDescription from "@components/booking/BookingDescription";

apps/web/components/eventtype/EventSetupTab.tsx

@@ -12,11 +12,10 @@ import { z } from "zod";
 import { EventLocationType, getEventLocationType, MeetLocationType } from "@calcom/app-store/locations";
 import { CAL_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
+import { slugify } from "@calcom/lib/slugify";
 import { Button, Label, Select, SettingsToggle, Skeleton, TextField } from "@calcom/ui";
 import { FiEdit2, FiCheck, FiX, FiPlus } from "@calcom/ui/components/icon";
 
-import { slugify } from "@lib/slugify";
-
 import { EditLocationDialog } from "@components/dialog/EditLocationDialog";
 import LocationSelect, {
   SingleValueLocationOption,

apps/web/lib/availability.ts

@@ -1 +0,0 @@
-export * from "@calcom/lib/availability";

apps/web/lib/config/constants.ts

@@ -1,2 +0,0 @@
-// TODO: Remove this file once everything is imported from `@calcom/lib`
-export * from "@calcom/lib/constants";

apps/web/lib/core/i18n/weekday.ts

@@ -1 +0,0 @@
-export * from "@calcom/lib/weekday";

apps/web/lib/isOutOfBounds.tsx

@@ -1,3 +0,0 @@
-/* Prefer import from `@calcom/lib/isOutOfBounds` */
-export * from "@calcom/lib/isOutOfBounds";
-export { default } from "@calcom/lib/isOutOfBounds";

apps/web/lib/location.ts

@@ -1 +0,0 @@
-export * from "@calcom/core/location";

apps/web/lib/prisma.ts

@@ -1 +0,0 @@
-export { default } from "@calcom/prisma";

apps/web/lib/random.ts

@@ -1,2 +0,0 @@
-// TODO: Remove this file once everything is imported from `@calcom/lib`
-export * from "@calcom/lib/random";

apps/web/lib/slots.ts

@@ -1,3 +0,0 @@
-/** Prefer import from `@calcom/lib/slots` */
-export * from "@calcom/lib/slots";
-export { default } from "@calcom/lib/slots";

apps/web/lib/slugify.ts

@@ -1,3 +0,0 @@
-// TODO: Remove this file once every `classNames` is imported from `@calcom/lib`
-export * from "@calcom/lib/slugify";
-export { default } from "@calcom/lib/slugify";

apps/web/pages/api/auth/[...nextauth].tsx

@@ -17,14 +17,14 @@ import { ErrorCode, isPasswordValid, verifyPassword } from "@calcom/lib/auth";
 import { APP_NAME, IS_TEAM_BILLING_ENABLED, WEBAPP_URL } from "@calcom/lib/constants";
 import { symmetricDecrypt } from "@calcom/lib/crypto";
 import { defaultCookies } from "@calcom/lib/default-cookies";
+import { randomString } from "@calcom/lib/random";
 import rateLimit from "@calcom/lib/rateLimit";
 import { serverConfig } from "@calcom/lib/serverConfig";
+import slugify from "@calcom/lib/slugify";
 import prisma from "@calcom/prisma";
 import { teamMetadataSchema } from "@calcom/prisma/zod-utils";
 
 import CalComAdapter from "@lib/auth/next-auth-custom-adapter";
-import { randomString } from "@lib/random";
-import slugify from "@lib/slugify";
 
 import { GOOGLE_CLIENT_ID, GOOGLE_CLIENT_SECRET, IS_GOOGLE_LOGIN_ENABLED } from "@server/lib/constants";
 

apps/web/pages/api/auth/forgot-password.ts

@@ -4,10 +4,9 @@ import { NextApiRequest, NextApiResponse } from "next";
 import dayjs from "@calcom/dayjs";
 import { sendPasswordResetEmail } from "@calcom/emails";
 import { PASSWORD_RESET_EXPIRY_HOURS } from "@calcom/emails/templates/forgot-password-email";
+import { getTranslation } from "@calcom/lib/server/i18n";
 import prisma from "@calcom/prisma";
 
-import { getTranslation } from "@server/lib/i18n";
-
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
   const t = await getTranslation(req.body.language ?? "en", "common");
 

apps/web/pages/api/auth/signup.ts

@@ -2,11 +2,10 @@ import { IdentityProvider } from "@prisma/client";
 import { NextApiRequest, NextApiResponse } from "next";
 
 import { hashPassword } from "@calcom/lib/auth";
+import slugify from "@calcom/lib/slugify";
 import { closeComUpsertTeamUser } from "@calcom/lib/sync/SyncServiceManager";
 import prisma from "@calcom/prisma";
 
-import slugify from "@lib/slugify";
-
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
   if (req.method !== "POST") {
     return;

apps/web/pages/api/cron/bookingReminder.ts

@@ -4,11 +4,10 @@ import type { NextApiRequest, NextApiResponse } from "next";
 import dayjs from "@calcom/dayjs";
 import { sendOrganizerRequestReminderEmail } from "@calcom/emails";
 import { isPrismaObjOrUndefined, parseRecurringEvent } from "@calcom/lib";
+import { getTranslation } from "@calcom/lib/server/i18n";
 import prisma, { bookingMinimalSelect } from "@calcom/prisma";
 import type { CalendarEvent } from "@calcom/types/Calendar";
 
-import { getTranslation } from "@server/lib/i18n";
-
 export default async function handler(req: NextApiRequest, res: NextApiResponse) {
   const apiKey = req.headers.authorization || req.query.apiKey;
   if (process.env.CRON_API_KEY !== apiKey) {

apps/web/pages/auth/login.tsx

@@ -9,6 +9,7 @@ import { FaGoogle } from "react-icons/fa";
 
 import { SAMLLogin } from "@calcom/features/auth/SAMLLogin";
 import { isSAMLLoginEnabled, samlProductID, samlTenantID } from "@calcom/features/ee/sso/lib/saml";
+import { WEBAPP_URL, WEBSITE_URL } from "@calcom/lib/constants";
 import { getSafeRedirectUrl } from "@calcom/lib/getSafeRedirectUrl";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { collectPageParameters, telemetryEventTypes, useTelemetry } from "@calcom/lib/telemetry";
@@ -17,7 +18,6 @@ import { Alert, Button, EmailField, PasswordField } from "@calcom/ui";
 import { FiArrowLeft } from "@calcom/ui/components/icon";
 
 import { ErrorCode, getSession } from "@lib/auth";
-import { WEBAPP_URL, WEBSITE_URL } from "@lib/config/constants";
 import { inferSSRProps } from "@lib/types/inferSSRProps";
 
 import AddToHomescreen from "@components/AddToHomescreen";

apps/web/pages/d/[link]/[slug].tsx

@@ -3,11 +3,11 @@ import { z } from "zod";
 
 import { privacyFilteredLocations, LocationObject } from "@calcom/core/location";
 import { parseRecurringEvent } from "@calcom/lib";
+import { getWorkingHours } from "@calcom/lib/availability";
 import { availiblityPageEventTypeSelect } from "@calcom/prisma";
 import prisma from "@calcom/prisma";
 import { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils";
 
-import { getWorkingHours } from "@lib/availability";
 import { GetBookingType } from "@lib/getBooking";
 import { inferSSRProps } from "@lib/types/inferSSRProps";
 import { EmbedProps } from "@lib/withEmbedSsr";

apps/web/pages/getting-started/[[...step]].tsx

@@ -7,10 +7,9 @@ import { z } from "zod";
 import { getSession } from "@calcom/lib/auth";
 import { APP_NAME } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { User } from "@calcom/prisma/client";
+import prisma from "@calcom/prisma";
 import { Button, StepCard, Steps } from "@calcom/ui";
 
-import prisma from "@lib/prisma";
 import { inferSSRProps } from "@lib/types/inferSSRProps";
 
 import { ConnectedCalendars } from "@components/getting-started/steps-views/ConnectCalendars";

apps/web/pages/settings/my-account/general.tsx

@@ -5,6 +5,7 @@ import { Controller, useForm } from "react-hook-form";
 
 import { getLayout } from "@calcom/features/settings/layouts/SettingsLayout";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
+import { nameOfDay } from "@calcom/lib/weekday";
 import { RouterOutputs, trpc } from "@calcom/trpc/react";
 import {
   Button,
@@ -20,7 +21,6 @@ import {
 } from "@calcom/ui";
 
 import { withQuery } from "@lib/QueryCell";
-import { nameOfDay } from "@lib/core/i18n/weekday";
 
 import { ssrInit } from "@server/lib/ssr";
 

apps/web/pages/signup.tsx

@@ -5,15 +5,16 @@ import { FormProvider, SubmitHandler, useForm } from "react-hook-form";
 
 import LicenseRequired from "@calcom/features/ee/common/components/v2/LicenseRequired";
 import { isSAMLLoginEnabled } from "@calcom/features/ee/sso/lib/saml";
+import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { collectPageParameters, telemetryEventTypes, useTelemetry } from "@calcom/lib/telemetry";
+import prisma from "@calcom/prisma";
 import { inferSSRProps } from "@calcom/types/inferSSRProps";
-import { Alert, Button, EmailField, PasswordField, TextField, HeadSeo } from "@calcom/ui";
-import { asStringOrNull } from "@calcom/web/lib/asStringOrNull";
-import { WEBAPP_URL } from "@calcom/web/lib/config/constants";
-import prisma from "@calcom/web/lib/prisma";
-import { IS_GOOGLE_LOGIN_ENABLED } from "@calcom/web/server/lib/constants";
-import { ssrInit } from "@calcom/web/server/lib/ssr";
+import { Alert, Button, EmailField, HeadSeo, PasswordField, TextField } from "@calcom/ui";
+
+import { asStringOrNull } from "../lib/asStringOrNull";
+import { IS_GOOGLE_LOGIN_ENABLED } from "../server/lib/constants";
+import { ssrInit } from "../server/lib/ssr";
 
 type FormValues = {
   username: string;

apps/web/pages/team/[slug]/[type].tsx

@@ -2,11 +2,11 @@ import { GetServerSidePropsContext } from "next";
 
 import { privacyFilteredLocations, LocationObject } from "@calcom/core/location";
 import { parseRecurringEvent } from "@calcom/lib";
+import { getWorkingHours } from "@calcom/lib/availability";
 import prisma from "@calcom/prisma";
 import { EventTypeMetaDataSchema } from "@calcom/prisma/zod-utils";
 
 import { asStringOrNull } from "@lib/asStringOrNull";
-import { getWorkingHours } from "@lib/availability";
 import getBooking, { GetBookingType } from "@lib/getBooking";
 import { inferSSRProps } from "@lib/types/inferSSRProps";
 import { EmbedProps } from "@lib/withEmbedSsr";

apps/web/playwright/event-types.e2e.ts

@@ -1,8 +1,8 @@
 import { expect } from "@playwright/test";
 
 import { WEBAPP_URL } from "@calcom/lib/constants";
+import { randomString } from "@calcom/lib/random";
 
-import { randomString } from "../lib/random";
 import { test } from "./lib/fixtures";
 
 test.describe.configure({ mode: "parallel" });

apps/web/server/lib/i18n.ts

@@ -1 +0,0 @@
-export * from "@calcom/lib/server/i18n";

apps/web/test/lib/getAvailabilityFromSchedule.test.ts

@@ -3,8 +3,7 @@ import { Availability } from "@prisma/client";
 import MockDate from "mockdate";
 
 import dayjs from "@calcom/dayjs";
-
-import { getAvailabilityFromSchedule } from "@lib/availability";
+import { getAvailabilityFromSchedule } from "@calcom/lib/availability";
 
 MockDate.set("2021-06-20T11:59:59Z");
 

apps/web/test/lib/slots.test.ts

@@ -2,10 +2,9 @@ import { expect, it } from "@jest/globals";
 import MockDate from "mockdate";
 
 import dayjs from "@calcom/dayjs";
+import { MINUTES_DAY_END, MINUTES_DAY_START } from "@calcom/lib/availability";
 import getSlots from "@calcom/lib/slots";
 
-import { MINUTES_DAY_END, MINUTES_DAY_START } from "@lib/availability";
-
 MockDate.set("2021-06-20T11:59:59Z");
 
 describe("Tests the slot logic", () => {

packages/prisma/schema.prisma

@@ -8,7 +8,7 @@ datasource db {
 
 generator client {
   provider        = "prisma-client-js"
-  previewFeatures = ["clientExtensions"]
+  previewFeatures = []
 }
 
 generator zod {

packages/ui/components/alert/alert.stories.mdx

@@ -1,7 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
-import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
-import {Alert} from './Alert';
+import { Examples, Example, Note, Title, CustomArgsTable, VariantsTable,VariantRow } from '@calcom/storybook/components'
+import { Alert } from './Alert';
 
 <Meta title="UI/Alert" component={Alert} />
 

packages/ui/components/apps/AllApps.tsx

@@ -6,9 +6,9 @@ import { classNames } from "@calcom/lib";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import type { AppFrontendPayload as App } from "@calcom/types/App";
 import type { CredentialFrontendPayload as Credential } from "@calcom/types/Credential";
-import { FiChevronLeft, FiChevronRight, FiSearch } from "@calcom/ui/components/icon";
 
 import { EmptyScreen } from "../empty-screen";
+import { FiChevronLeft, FiChevronRight, FiSearch } from "../icon";
 import { AppCard } from "./AppCard";
 
 export function useShouldShowArrows() {

packages/ui/components/apps/AppCard.tsx

@@ -6,8 +6,10 @@ import { InstallAppButton } from "@calcom/app-store/components";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { AppFrontendPayload as App } from "@calcom/types/App";
 import type { CredentialFrontendPayload as Credential } from "@calcom/types/Credential";
-import { Button, showToast } from "@calcom/ui";
-import { FiPlus } from "@calcom/ui/components/icon";
+
+import { Button } from "../button";
+import { FiPlus } from "../icon";
+import { showToast } from "../toast";
 
 interface AppCardProps {
   app: App;

packages/ui/components/apps/Categories.stories.mdx

@@ -1,18 +1,7 @@
-import { Canvas, Meta, Story, ArgsTable } from "@storybook/addon-docs";
-
-import {
-  Examples,
-  Example,
-  Note,
-  Title,
-  CustomArgsTable,
-  VariantsTable,
-  VariantRow,
-} from "@calcom/storybook/components";
-import { Icon } from "@calcom/ui";
-
-import { AppStoreCategories as Categories } from "./Categories";
-import { _SBAppCategoryList } from "./_storybookData";
+import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
+import { Examples, Example, Note, Title, CustomArgsTable, VariantsTable, VariantRow } from '@calcom/storybook/components';
+import { AppStoreCategories as Categories } from './Categories';
+import { _SBAppCategoryList } from './_storybookData';
 
 <Meta title="UI/apps/Categories" component={Categories} />
 
@@ -24,8 +13,8 @@ Categories that is used in our appstore.
 
 <CustomArgsTable of={Categories} />
 
-
 ## Examples
+
 We don't currently mock translations in storybook so the stories will display placeholder text.
 
 <Categories categories={_SBAppCategoryList} />

packages/ui/components/apps/Categories.tsx

@@ -1,9 +1,9 @@
 import Link from "next/link";
 
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { SkeletonText } from "@calcom/ui";
-import { FiArrowRight } from "@calcom/ui/components/icon";
 
+import { FiArrowRight } from "../icon";
+import { SkeletonText } from "../skeleton";
 import { Slider } from "./Slider";
 
 export function AppStoreCategories({

packages/ui/components/apps/Slider.tsx

@@ -4,8 +4,8 @@ import "@glidejs/glide/dist/css/glide.theme.min.css";
 import { ComponentProps, FC, useEffect, useRef } from "react";
 
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { FiArrowLeft, FiArrowRight } from "@calcom/ui/components/icon";
 
+import { FiArrowLeft, FiArrowRight } from "../icon";
 import { SkeletonText } from "../skeleton";
 
 const SliderButton: FC<ComponentProps<"button">> = (props) => {

packages/ui/components/avatar/Avatar.tsx

@@ -4,10 +4,11 @@ import Link from "next/link";
 
 import classNames from "@calcom/lib/classNames";
 import { defaultAvatarSrc } from "@calcom/lib/defaultAvatarImage";
-import { FiCheck } from "@calcom/ui/components/icon";
 
 import { Maybe } from "@trpc/server";
 
+import { FiCheck } from "../icon";
+
 export type AvatarProps = {
   className?: string;
   size: "xs" | "sm" | "md" | "mdLg" | "lg" | "xl";

packages/ui/components/avatar/avatar.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 import {Avatar} from './Avatar';
 import {AvatarGroup} from './AvatarGroup';
 

packages/ui/components/badge/badge.stories.mdx

@@ -1,6 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable, VariantRow } from '@calcom/storybook/components'
-import { FiPlus } from '@calcom/ui/components/icon';
+import { FiPlus } from '../icon';
 import { Badge } from './Badge';
 
 <Meta title="UI/Badge" component={Badge} />

packages/ui/components/breadcrumb/breadcrumb.stories.mdx

@@ -1,7 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
-
 import { Breadcrumb } from './Breadcrumb';
 
 <Meta title="UI/Breadcrumbs" component={Breadcrumb} />

packages/ui/components/button/Button.tsx

@@ -5,8 +5,9 @@ import React, { forwardRef } from "react";
 import classNames from "@calcom/lib/classNames";
 import { applyStyleToMultipleVariants } from "@calcom/lib/cva";
 import { SVGComponent } from "@calcom/types/SVGComponent";
-import { Tooltip } from "@calcom/ui";
-import { FiPlus } from "@calcom/ui/components/icon";
+
+import { FiPlus } from "../icon";
+import { Tooltip } from "../tooltip";
 
 type InferredVariantProps = VariantProps<typeof buttonClasses>;
 

packages/ui/components/button/button.stories.mdx

@@ -1,7 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title, VariantsTable, VariantColumn, RowTitles, CustomArgsTable} from '@calcom/storybook/components'
-import { FiPlus, FiX } from "@calcom/ui/components/icon";
-
+import { FiPlus, FiX } from '../icon';
 import { Button } from './Button';
 
 <Meta title="UI/Button" component={Button} />

packages/ui/components/buttonGroup/buttongroup.stories.mdx

@@ -1,7 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { FiTrash, FiNavigation, FiClipboard } from "@calcom/ui/components/icon";
-
+import { FiTrash, FiNavigation, FiClipboard } from '../icon';
 import { ButtonGroup} from './ButtonGroup';
 import { Button} from '../button/Button';
 

packages/ui/components/card/FormCard.tsx

@@ -1,10 +1,10 @@
 import Link from "next/link";
 
 import { classNames } from "@calcom/lib";
-import { FiArrowDown, FiArrowUp, FiTrash } from "@calcom/ui/components/icon";
 
 import { Badge, BadgeProps } from "../..";
 import { Divider } from "../divider";
+import { FiArrowDown, FiArrowUp, FiTrash } from "../icon";
 
 type Action = { check: () => boolean; fn: () => void };
 export default function FormCard({

packages/ui/components/credits/credits.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 import Credits from './Credits';
 
 <Meta title="UI/Credits" component={Credits} />

packages/ui/components/dialog/ConfirmationDialogContent.tsx

@@ -2,8 +2,8 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
 import React, { PropsWithChildren, ReactNode } from "react";
 
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { FiAlertCircle, FiCheck } from "@calcom/ui/components/icon";
 
+import { FiAlertCircle, FiCheck } from "../icon";
 import { DialogClose, DialogContent } from "./Dialog";
 
 export type ConfirmationDialogContentProps = {

packages/ui/components/divider/divider.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 import {Divider, VerticalDivider} from './Divider';
 
 <Meta title="UI/Divider" component={Divider} />

packages/ui/components/editor/plugins/AddVariablesDropdown.tsx

@@ -1,6 +1,7 @@
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { Dropdown, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "@calcom/ui";
-import { FiChevronDown } from "@calcom/ui/components/icon";
+
+import { Dropdown, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../../form/dropdown";
+import { FiChevronDown } from "../../icon";
 
 interface IAddVariablesDropdown {
   addVariable: (variable: string) => void;

packages/ui/components/editor/plugins/ToolbarPlugin.tsx

@@ -1,37 +1,37 @@
 import { $generateHtmlFromNodes, $generateNodesFromDOM } from "@lexical/html";
 import { $isLinkNode, TOGGLE_LINK_COMMAND } from "@lexical/link";
 import {
+  $isListNode,
   INSERT_ORDERED_LIST_COMMAND,
   INSERT_UNORDERED_LIST_COMMAND,
-  REMOVE_LIST_COMMAND,
-  $isListNode,
   ListNode,
+  REMOVE_LIST_COMMAND,
 } from "@lexical/list";
 import { useLexicalComposerContext } from "@lexical/react/LexicalComposerContext";
 import { $createHeadingNode, $isHeadingNode } from "@lexical/rich-text";
-import { $wrapNodes, $isAtNodeEnd } from "@lexical/selection";
+import { $isAtNodeEnd, $wrapNodes } from "@lexical/selection";
 import { $getNearestNodeOfType, mergeRegister } from "@lexical/utils";
 import classNames from "classnames";
 import {
-  SELECTION_CHANGE_COMMAND,
-  FORMAT_TEXT_COMMAND,
-  $getSelection,
-  $isRangeSelection,
   $createParagraphNode,
-  RangeSelection,
-  NodeSelection,
-  GridSelection,
   $getRoot,
+  $getSelection,
   $insertNodes,
-  LexicalEditor,
+  $isRangeSelection,
   EditorState,
+  FORMAT_TEXT_COMMAND,
+  GridSelection,
+  LexicalEditor,
+  NodeSelection,
+  RangeSelection,
+  SELECTION_CHANGE_COMMAND,
 } from "lexical";
 import { useCallback, useEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 
-import { Dropdown, DropdownMenuTrigger, DropdownMenuItem, DropdownMenuContent, Button } from "@calcom/ui";
-import { FiChevronDown } from "@calcom/ui/components/icon";
-
+import { Button } from "../../button";
+import { Dropdown, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from "../../form/dropdown";
+import { FiChevronDown } from "../../icon";
 import { TextEditorProps } from "../Editor";
 import { AddVariablesDropdown } from "./AddVariablesDropdown";
 

packages/ui/components/empty-screen/empty-screen.stories.mdx

@@ -1,6 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { FiCalendar } from "@calcom/ui/components/icon";
+import { FiCalendar } from "../icon";
 import { EmptyScreen } from './EmptyScreen';
 
 <Meta title="UI/EmptyScreen" component={EmptyScreen} />

packages/ui/components/form/checkbox/checkbox.stories.mdx

@@ -1,7 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
-
 import Checkbox from './Checkbox';
 
 

packages/ui/components/form/date-range-picker/DateRangePicker.tsx

@@ -2,8 +2,7 @@
 import "@wojtekmaj/react-daterange-picker/dist/DateRangePicker.css";
 import PrimitiveDateRangePicker from "@wojtekmaj/react-daterange-picker/dist/entry.nostyle";
 
-import { FiArrowRight, FiCalendar, FiChevronLeft, FiChevronRight } from "@calcom/ui/components/icon";
-
+import { FiArrowRight, FiCalendar, FiChevronLeft, FiChevronRight } from "../../icon";
 import "./styles.css";
 
 type Props = {

packages/ui/components/form/datepicker/DatePicker.tsx

@@ -3,7 +3,8 @@ import "react-date-picker/dist/DatePicker.css";
 import PrimitiveDatePicker from "react-date-picker/dist/entry.nostyle";
 
 import classNames from "@calcom/lib/classNames";
-import { FiCalendar } from "@calcom/ui/components/icon";
+
+import { FiCalendar } from "../../icon";
 
 type Props = {
   date: Date;

packages/ui/components/form/dropdown/Dropdown.tsx

@@ -5,7 +5,8 @@ import { ComponentProps, forwardRef } from "react";
 
 import { classNames } from "@calcom/lib";
 import { SVGComponent } from "@calcom/types/SVGComponent";
-import { ButtonColor } from "@calcom/ui";
+
+import { ButtonColor } from "../../button/Button";
 
 export const Dropdown = DropdownMenuPrimitive.Root;
 

packages/ui/components/form/inputs/HintOrErrors.tsx

@@ -1,6 +1,6 @@
 import { FieldValues, useFormContext } from "react-hook-form";
 
-import { FiCheck, FiCircle, FiInfo, FiX } from "@calcom/ui/components/icon";
+import { FiCheck, FiCircle, FiInfo, FiX } from "../../icon";
 
 export function HintsOrErrors<T extends FieldValues = FieldValues>(props: {
   hintErrors?: string[];

packages/ui/components/form/inputs/Input.tsx

@@ -4,9 +4,9 @@ import { FieldValues, FormProvider, SubmitHandler, useFormContext, UseFormReturn
 import classNames from "@calcom/lib/classNames";
 import { getErrorFromUnknown } from "@calcom/lib/errors";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
-import { FiEye, FiEyeOff, FiX } from "@calcom/ui/components/icon";
 
 import { Alert, showToast, Skeleton, Tooltip, UnstyledSelect } from "../../..";
+import { FiEye, FiEyeOff, FiX } from "../../icon";
 import { HintsOrErrors } from "./HintOrErrors";
 import { Label } from "./Label";
 

packages/ui/components/form/inputs/inputs.stories.mdx

@@ -1,6 +1,7 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable, VariantRow,VariantsTable} from '@calcom/storybook/components'
-import { Icon,Select,UnstyledSelect,InputFieldWithSelect } from "@calcom/ui";
+import { Select, UnstyledSelect } from "../select";
+import { InputFieldWithSelect } from './Input';
 
 import {InputField} from "./Input"
 

packages/ui/components/form/select/components.tsx

@@ -12,9 +12,9 @@ import {
 } from "react-select";
 
 import { classNames } from "@calcom/lib";
-import { FiCheck } from "@calcom/ui/components/icon";
 
 import { UpgradeTeamsBadge } from "../../badge";
+import { FiCheck } from "../../icon";
 
 export const InputComponent = <
   Option,

packages/ui/components/form/select/select.stories.mdx

@@ -1,6 +1,6 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable, VariantRow,VariantsTable} from '@calcom/storybook/components'
-import { FiPlus } from "@calcom/ui/components/icon";
+import { FiPlus } from "../icon";
 
 import {SelectField} from "./Select"
 

packages/ui/components/list/list.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable,VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 import { List, ListItem } from './List';
 
 <Meta title="UI/List" component={List} />

packages/ui/components/navigation/tabs/VerticalTabItem.tsx

@@ -5,8 +5,8 @@ import { ComponentProps, Fragment } from "react";
 import classNames from "@calcom/lib/classNames";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { SVGComponent } from "@calcom/types/SVGComponent";
-import { FiChevronRight, FiExternalLink } from "@calcom/ui/components/icon";
 
+import { FiChevronRight, FiExternalLink } from "../../icon";
 import { Skeleton } from "../../skeleton";
 
 export type VerticalTabItemProps = {

packages/ui/components/popover/AnimatedPopover.tsx

@@ -2,7 +2,8 @@ import * as Popover from "@radix-ui/react-popover";
 import React from "react";
 
 import { classNames } from "@calcom/lib";
-import { FiChevronDown } from "@calcom/ui/components/icon";
+
+import { FiChevronDown } from "../icon";
 
 export const AnimatedPopover = ({
   text,

packages/ui/components/popover/MeetingTimeInTimezones.tsx

@@ -6,9 +6,17 @@ import {
   isPreviousDayInTimezone,
   sortByTimezone,
 } from "@calcom/lib/date-fns";
-import { FiGlobe } from "@calcom/ui/components/icon";
 
-import { Attendee } from ".prisma/client";
+import { FiGlobe } from "../icon";
+
+type Attendee = {
+  id: number;
+  email: string;
+  name: string;
+  timeZone: string;
+  locale: string | null;
+  bookingId: number | null;
+};
 
 interface MeetingTimeInTimezonesProps {
   attendees: Attendee[];

packages/ui/components/skeleton/skeleton.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title, VariantsTable, VariantColumn, RowTitles, CustomArgsTable} from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 
 import {  Skeleton, SkeletonAvatar, SkeletonText, SkeletonButton, SkeletonContainer } from './';
 

packages/ui/components/table/TableActions.tsx

@@ -1,17 +1,16 @@
 import React, { FC } from "react";
 import { IconType } from "react-icons/lib";
 
+import { Button, ButtonBaseProps } from "../button";
 import {
-  Button,
   Dropdown,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownItem,
   DropdownMenuPortal,
   DropdownMenuTrigger,
-  ButtonBaseProps,
-} from "@calcom/ui";
-import { FiChevronDown, FiMoreHorizontal } from "@calcom/ui/components/icon";
+} from "../form/dropdown";
+import { FiChevronDown, FiMoreHorizontal } from "../icon";
 
 export type ActionType = {
   id: string;

packages/ui/components/toast/showToast.tsx

@@ -1,7 +1,7 @@
 import classNames from "classnames";
 import toast from "react-hot-toast";
 
-import { FiCheck, FiInfo } from "@calcom/ui/components/icon";
+import { FiCheck, FiInfo } from "../icon";
 
 type IToast = {
   message: string;

packages/ui/components/toast/toast.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title, VariantsTable, VariantColumn, RowTitles, CustomArgsTable} from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 
 import { SuccessToast,ErrorToast,WarningToast,DefaultToast } from './';
 

packages/ui/components/top-banner/TopBanner.tsx

@@ -3,7 +3,7 @@ import classNames from "classnames";
 import noop from "lodash/noop";
 import { ReactNode } from "react";
 
-import { FiAlertTriangle, FiInfo } from "@calcom/ui/components/icon";
+import { FiAlertTriangle, FiInfo } from "../icon";
 
 export type TopBannerProps = {
   text: string;

packages/ui/components/top-banner/topbanner.stories.mdx

@@ -1,6 +1,5 @@
 import { Canvas, Meta, Story, ArgsTable } from '@storybook/addon-docs';
 import { Examples, Example, Note, Title,CustomArgsTable,VariantsTable, VariantRow } from '@calcom/storybook/components'
-import { Icon } from "@calcom/ui";
 import { TopBanner } from './TopBanner'
 
 <Meta title="UI/TopBanner" component={TopBanner} />

packages/ui/form/AddressInput.tsx

@@ -2,7 +2,8 @@ import { UseFormReturn } from "react-hook-form";
 import { Props } from "react-phone-number-input/react-hook-form";
 
 import { EventLocationType } from "@calcom/app-store/locations";
-import { FiMapPin } from "@calcom/ui/components/icon";
+
+import { FiMapPin } from "../components/icon";
 
 type BookingFormValues = {
   name: string;