refactor: Move trpc-dependent components from features to web [1] (#25859)

* refactor: migrate UnconfirmedBookingBadge from features to apps/web Move UnconfirmedBookingBadge.tsx from packages/features/bookings/ to apps/web/modules/bookings/components/ as part of the architectural refactor to remove trpc client imports from the features layer. Also removes unused preserveBookingsQueryParams function from Navigation.tsx. Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * refactor: move shell navigation and badges to apps/web Move shell navigation components and trpc-using badges from packages/features to apps/web/modules to fix circular dependency: - Move navigation folder to apps/web/modules/shell/navigation/ - Move TeamInviteBadge.tsx to apps/web/modules/shell/ - Create Shell wrapper in apps/web that provides MobileNavigationContainer - Update all Shell imports in apps/web to use the new wrapper - Remove MobileNavigationContainer default from features Shell.tsx - Fix pre-existing lint warnings in touched files This establishes the pattern for migrating React components that use trpc hooks from the features layer to the web app layer, ensuring proper dependency direction: apps/web imports from packages/features, never the reverse. Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: move SideBar.tsx to apps/web to fix build error SideBar.tsx was importing Navigation from the moved navigation folder, causing a build error. Moving SideBar.tsx to apps/web and updating the features Shell to not have a default SidebarContainer fixes this. The web Shell wrapper now provides both the default SidebarContainer and MobileNavigationContainer, maintaining the injection pattern. Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * revert * revert * revert * wip * wip * wip * wip * wip * wip * not used anywhere * wip * wip * wip * wip * fix * fix * wip * wip * wip * wip * wip * fix * fix * fix * fix * migrate * migrate admin-adpi * wip * feat: migrate organization settings components from packages/features to apps/web/modules - Migrate profile.tsx, appearance.tsx, general.tsx, privacy.tsx, guest-notifications.tsx, delegationCredential.tsx, other-team-members-view.tsx, other-team-profile-view.tsx - Migrate attributes directory (AttributesForm.tsx, DeleteAttributeModal.tsx, ListSkeleton.tsx, attributes-create-view.tsx, attributes-edit-view.tsx, attributes-list-view.tsx) - Migrate admin directory (AdminOrgEditPage.tsx, AdminOrgPage.tsx, WorkspacePlatformPage.tsx) - Update all page imports to use new paths from ~/settings/organizations/ - Update relative imports in migrated files to use @calcom/features paths - Fix lint warnings in migrated files Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: update test import path after migration Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: remove unnecessary test-setup import (already in vitest config) Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * wip * refactor: delete original files after migration to apps/web/modules Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * fix * fix * fix * fix * wip * refactor more * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * mv * update import paths * wip * wip * fix * fix * fix * fix * fix * fix * fix * mv * mv * mv * fix * wip * wip * fix * fix * fix * fix: make test mocks resilient to vi.resetAllMocks() Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: fix AttributeForm test failures Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix * fix * refactor: move ee files to apps/web/modules/ee/ folder - Move teams, workflows, and organizations folders to apps/web/modules/ee/ - Add LICENSE file to apps/web/modules/ee/ - Update all import paths from ~/teams/ to ~/ee/teams/ - Update all import paths from ~/settings/organizations/ to ~/ee/organizations/ - Remove duplicate MemberInvitationModal copy.tsx file Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: move useHasPaidPlan and dependent files to apps/web/modules - Move useHasPaidPlan.ts from packages/features/billing/hooks to apps/web/modules/billing/hooks - Move intercom files from packages/features/ee/support to apps/web/modules/ee/support - Move ContactMenuItem.tsx and dependencies (freshchat, helpscout, zendesk) to apps/web/modules/ee/support - Move ViewRecordingsDialog.tsx and RecordingListSkeleton to apps/web/modules/ee/video - Move CalVideoSettings.tsx to apps/web/modules/eventtypes/components/locations - Move CreateOrEditOutOfOfficeModal.tsx to apps/web/modules/settings/outOfOffice - Refactor UpgradeTeamsBadge to accept props and create wrapper in apps/web/modules/billing - Update all callers to use new file locations - Add eslint-disable comments for pre-existing lint warnings This fixes the tRPC server build failure caused by circular dependency where the server build was traversing into packages/features and pulling in React hooks that depend on @calcom/trpc/react types. Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: correct UpgradeTeamsBadge import path to use package export Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * wip * fix * fix * fix * fix * fix * fix * fix * fix: pass plan state through SelectProps to UpgradeTeamsBadge - Add upgradeTeamsBadgeProps field to ExtendedOption type in Select component - Update OptionComponent to spread upgradeTeamsBadgeProps to UpgradeTeamsBadge - Update getOptions.ts to accept PlanState object and include upgradeTeamsBadgeProps - Update WorkflowStepContainer.tsx to pass planState to getWorkflowTriggerOptions/getWorkflowTemplateOptions - Update WorkflowDetailsPage.tsx to pass upgradeTeamsBadgeProps in transformed action options - Update AddActionDialog.tsx interface and mapping to include upgradeTeamsBadgeProps - Add eslint-disable comments for pre-existing React Hook dependency warnings This fixes the UpgradeTeamsBadge refactoring issue where the badge was always showing 'upgrade' text instead of the correct text based on plan state (trial_mode, inactive_team_plan, etc.) Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: update import paths to use /ee/ folder for workflows and organizations Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: update workflow component imports to use /ee/ folder Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: add missing types.ts for LocationInput.tsx Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix: extract BookingRedirectForm type to shared location Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * fix * wip * wip * fix: update BookingRedirectForm import to use local types file Co-Authored-By: benny@cal.com <sldisek783@gmail.com> * wip * fix * fix --------- Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
2025-12-23 12:22:26 -03:00
parent 7847177e8b
commit 8afe87ff75
374 changed files with 1213 additions and 1417 deletions
@@ -1,7 +1,7 @@
 import { ShellMainAppDirBackButton } from "app/(use-page-wrapper)/(main-nav)/ShellMainAppDirBackButton";
 import classNames from "classnames";

-import type { LayoutProps } from "@calcom/features/shell/Shell";
+import type { LayoutProps } from "~/shell/Shell";

 // Copied from `ShellMain` but with a different `ShellMainAppDirBackButton` import
 // for client/server component separation
@@ -2,9 +2,10 @@

 import { useRouter } from "next/navigation";

-import type { LayoutProps } from "@calcom/features/shell/Shell";
 import { Button } from "@calcom/ui/components/button";

+import type { LayoutProps } from "~/shell/Shell";
+
 export const ShellMainAppDirBackButton = ({ backPath }: { backPath: LayoutProps["backPath"] }) => {
  const router = useRouter();
  return (
@@ -8,10 +8,10 @@ import { redirect } from "next/navigation";
 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import { getOrganizationRepository } from "@calcom/features/ee/organizations/di/OrganizationRepository.container";
 import { PermissionCheckService } from "@calcom/features/pbac/services/permission-check.service";
-import { AvailabilitySliderTable } from "@calcom/features/timezone-buddy/components/AvailabilitySliderTable";
 import { getScheduleListItemData } from "@calcom/lib/schedules/transformers/getScheduleListItemData";
 import { MembershipRole } from "@calcom/prisma/enums";
 import { availabilityRouter } from "@calcom/trpc/server/routers/viewer/availability/_router";
+import { AvailabilitySliderTable } from "@calcom/web/modules/timezone-buddy/components/AvailabilitySliderTable";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

@@ -64,8 +64,8 @@ const Page = async ({ searchParams: _searchParams }: PageProps) => {
  const organizationRepository = getOrganizationRepository();
  const isOrgPrivate = organizationId
    ? await organizationRepository.checkIfPrivate({
-      orgId: organizationId,
-    })
+        orgId: organizationId,
+      })
    : false;

  const permissionService = new PermissionCheckService();
@@ -80,9 +80,7 @@ const Page = async ({ searchParams: _searchParams }: PageProps) => {
    <ShellMainAppDir
      heading={t("availability")}
      subtitle={t("configure_availability")}
-      CTA={
-        <AvailabilityCTA canViewTeamAvailability={canViewTeamAvailability} />
-      }>
+      CTA={<AvailabilityCTA canViewTeamAvailability={canViewTeamAvailability} />}>
      {searchParams?.type === "team" && canViewTeamAvailability ? (
        <AvailabilitySliderTable isOrg={!!organizationId} />
      ) : (
@@ -3,10 +3,11 @@ import { cookies, headers } from "next/headers";
 import React from "react";

 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import Shell from "@calcom/features/shell/Shell";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

+import Shell from "~/shell/Shell";
+
 const Layout = async ({ children }: { children: React.ReactNode }) => {
  const session = await getServerSession({ req: buildLegacyRequest(await headers(), await cookies()) });
  if (session?.user?.id) SentrySetUser({ id: session.user.id });
@@ -2,7 +2,6 @@ import type { SearchParams } from "app/_types";
 import type { Session } from "next-auth";
 import { unstable_cache } from "next/cache";

-import { TeamsListing } from "@calcom/features/ee/teams/components/TeamsListing";
 import { TeamRepository } from "@calcom/features/ee/teams/repositories/TeamRepository";
 import { TeamService } from "@calcom/features/ee/teams/services/teamService";
 import { PermissionCheckService } from "@calcom/features/pbac/services/permission-check.service";
@@ -10,6 +9,8 @@ import { ErrorWithCode } from "@calcom/lib/errors";
 import prisma from "@calcom/prisma";
 import { MembershipRole } from "@calcom/prisma/enums";

+import { TeamsListing } from "~/ee/teams/components/TeamsListing";
+
 import { TeamsCTA } from "./CTA";

 const getCachedTeams = unstable_cache(
@@ -3,9 +3,10 @@
 import { ShellMainAppDir } from "app/(use-page-wrapper)/(main-nav)/ShellMainAppDir";
 import { TeamsCTA } from "app/(use-page-wrapper)/(main-nav)/teams/CTA";

-import SkeletonLoaderTeamList from "@calcom/features/ee/teams/components/SkeletonloaderTeamList";
 import { useLocale } from "@calcom/lib/hooks/useLocale";

+import SkeletonLoaderTeamList from "~/ee/teams/components/SkeletonloaderTeamList";
+
 export const TeamsListSkeleton = () => {
  const { t } = useLocale();
  return (
@@ -1,21 +1,16 @@
 "use client";

 import { useAutoAnimate } from "@formkit/auto-animate/react";
+import posthog from "posthog-js";
 import { useEffect, useState } from "react";
 import { useFormContext } from "react-hook-form";
-import posthog from "posthog-js";

 import { isFallbackRoute } from "@calcom/app-store/routing-forms/lib/isFallbackRoute";
 import type { RoutingFormWithResponseCount } from "@calcom/app-store/routing-forms/types/types";
-import { useHasPaidPlan } from "@calcom/features/billing/hooks/useHasPaidPlan";
 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import SkeletonLoaderTeamList from "@calcom/features/ee/teams/components/SkeletonloaderTeamList";
-import { CreateButtonWithTeamsList } from "@calcom/features/ee/teams/components/createButton/CreateButtonWithTeamsList";
 import { FilterResults } from "@calcom/features/filters/components/FilterResults";
 import { TeamsFilter } from "@calcom/features/filters/components/TeamsFilter";
 import { getTeamsFiltersFromQuery } from "@calcom/features/filters/lib/getTeamsFiltersFromQuery";
-import { ShellMain } from "@calcom/features/shell/Shell";
-import { UpgradeTip } from "@calcom/features/tips";
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { useRouterQuery } from "@calcom/lib/hooks/useRouterQuery";
@@ -39,6 +34,12 @@ import {
  FormActionsProvider,
 } from "@calcom/web/components/apps/routing-forms/FormActions";

+import { useHasPaidPlan } from "~/billing/hooks/useHasPaidPlan";
+import SkeletonLoaderTeamList from "~/ee/teams/components/SkeletonloaderTeamList";
+import { CreateButtonWithTeamsList } from "~/ee/teams/components/createButton/CreateButtonWithTeamsList";
+import { ShellMain } from "~/shell/Shell";
+import { UpgradeTip } from "~/shell/UpgradeTip";
+
 function NewFormButton({ setNewFormDialogState }: { setNewFormDialogState: SetNewFormDialogState }) {
  const { t } = useLocale();
  return (
@@ -3,10 +3,11 @@ import { redirect } from "next/navigation";
 import type { ReactNode } from "react";

 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import Shell from "@calcom/features/shell/Shell";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

+import Shell from "~/shell/Shell";
+
 import FormProvider from "../[...pages]/FormProvider";

 export default async function Layout({ children }: { children: ReactNode }) {
@@ -1,8 +1,9 @@
 "use client";

-import Shell from "@calcom/features/shell/Shell";
 import { SkeletonText, SkeletonContainer, SkeletonButton } from "@calcom/ui/components/skeleton";

+import Shell from "~/shell/Shell";
+
 export function AvailabilityScheduleSkeleton() {
  return (
    <Shell withoutMain={true}>
@@ -106,7 +107,7 @@ export function AvailabilityScheduleSkeleton() {
              </div>

              {/* Sidebar - only visible on desktop */}
-              <div className="min-w-40 col-span-3 hidden stack-y-2 md:block lg:col-span-1 xl:w-[25%]">
+              <div className="min-w-40 stack-y-2 col-span-3 hidden md:block lg:col-span-1 xl:w-[25%]">
                <div className="xl:max-w-80 w-full pr-4 sm:ml-0 sm:mr-36 sm:p-0">
                  <div>
                    <SkeletonText className="mb-1 h-4 w-24 text-sm" /> {/* Timezone */}
@@ -1,9 +1,10 @@
 "use client";

-import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Alert } from "@calcom/ui/components/alert";

+import Shell from "~/shell/Shell";
+
 export default function Error() {
  const { t } = useLocale();
  return (
@@ -1,6 +1,5 @@
 "use client";

-import Shell from "@calcom/features/shell/Shell";
 import {
  SkeletonButton,
  SkeletonContainer,
@@ -8,6 +7,8 @@ import {
  SkeletonAvatar,
 } from "@calcom/ui/components/skeleton";

+import Shell from "~/shell/Shell";
+
 export const EventTypeEditPageSkeleton = () => {
  const backButtonSkeleton = (
    <div className="bg-default sticky top-0 z-10 mb-0 flex items-center py-2 md:mb-9 md:mt-0">
@@ -33,7 +34,7 @@ export const EventTypeEditPageSkeleton = () => {
      <div className="flex flex-col xl:flex-row xl:space-x-6">
        <div className="hidden xl:block">
          <div className="primary-navigation w-64 shrink-0">
-            <div className="flex flex-col stack-y-1">
+            <div className="stack-y-1 flex flex-col">
              {/* Tab navigation items */}
              {Array.from({ length: 8 }).map((_, index) => (
                <div
@@ -58,14 +59,14 @@ export const EventTypeEditPageSkeleton = () => {
                <SkeletonText className="h-8 w-full max-w-md" />
              </div>

-              <div className="mb-6 stack-y-6">
+              <div className="stack-y-6 mb-6">
                {/* Form fields */}
-                <div className="flex flex-col stack-y-2">
+                <div className="stack-y-2 flex flex-col">
                  <SkeletonText className="h-4 w-32" />
                  <SkeletonText className="h-10 w-full" />
                </div>

-                <div className="flex flex-col stack-y-2">
+                <div className="stack-y-2 flex flex-col">
                  <SkeletonText className="h-4 w-40" />
                  <div className="flex items-center">
                    <SkeletonText className="h-10 w-full" />
@@ -73,12 +74,12 @@ export const EventTypeEditPageSkeleton = () => {
                  </div>
                </div>

-                <div className="flex flex-col stack-y-2">
+                <div className="stack-y-2 flex flex-col">
                  <SkeletonText className="h-4 w-36" />
                  <SkeletonText className="h-24 w-full" />
                </div>

-                <div className="flex flex-col stack-y-2">
+                <div className="stack-y-2 flex flex-col">
                  <SkeletonText className="h-4 w-28" />
                  <div className="flex items-center">
                    <SkeletonText className="h-10 w-full" />
@@ -86,7 +87,7 @@ export const EventTypeEditPageSkeleton = () => {
                  </div>
                </div>

-                <div className="flex flex-col stack-y-2">
+                <div className="stack-y-2 flex flex-col">
                  <SkeletonText className="h-4 w-32" />
                  <SkeletonText className="h-10 w-full" />
                </div>
@@ -2,13 +2,14 @@

 import { useSession } from "next-auth/react";

-import { UpgradeTip } from "@calcom/features/tips";
 import { WEBAPP_URL } from "@calcom/lib/constants";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Button } from "@calcom/ui/components/button";
 import { ButtonGroup } from "@calcom/ui/components/buttonGroup";
 import { Icon } from "@calcom/ui/components/icon";

+import { UpgradeTip } from "~/shell/UpgradeTip";
+
 export default function UpgradeTipWrapper({ children }: { children: React.ReactNode }) {
  const { t } = useLocale();
  const session = useSession();
@@ -2,7 +2,8 @@ import { ShellMainAppDir } from "app/(use-page-wrapper)/(main-nav)/ShellMainAppD
 import { getTranslate } from "app/_utils";

 import { CTA_CONTAINER_CLASS_NAME } from "@calcom/features/data-table/lib/utils";
-import Shell from "@calcom/features/shell/Shell";
+
+import Shell from "~/shell/Shell";

 import UpgradeTipWrapper from "./UpgradeTipWrapper";

@@ -1,9 +1,10 @@
 import { getTranslate } from "app/_utils";
 import type { Metadata } from "next";

-import Shell from "@calcom/features/shell/Shell";
 import { IS_DUB_REFERRALS_ENABLED } from "@calcom/lib/constants";

+import Shell from "~/shell/Shell";
+
 import { DubReferralsPage } from "./DubReferralsPage";

 export const metadata: Metadata = {
@@ -4,10 +4,11 @@ import { usePathname } from "next/navigation";
 import type { ComponentProps } from "react";
 import React from "react";

-import type Shell from "@calcom/features/shell/Shell";
 import type { UserPermissionRole } from "@calcom/prisma/enums";
 import { ErrorBoundary } from "@calcom/ui/components/errorBoundary";

+import type Shell from "~/shell/Shell";
+
 export type AdminLayoutProps = {
  children: React.ReactNode;
  userRole: UserPermissionRole | "INACTIVE_ADMIN" | undefined;
@@ -18,7 +19,7 @@ export default function AdminLayoutAppDirClient({ children }: AdminLayoutProps)
  const isAppsPage = pathname?.startsWith("/settings/admin/apps");
  return (
    <div className="divide-subtle bg-default mx-auto flex max-w-4xl flex-row divide-y">
-      <div className={isAppsPage ? "min-w-0" : "flex flex-1 *:flex-1"}>
+      <div className={isAppsPage ? "min-w-0" : "*:flex-1 flex flex-1"}>
        <ErrorBoundary>{children}</ErrorBoundary>
      </div>
    </div>
@@ -3,7 +3,7 @@ import { _generateMetadata, getTranslate } from "app/_utils";
 import { z } from "zod";

 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import { OrgForm } from "@calcom/features/ee/organizations/pages/settings/admin/AdminOrgEditPage";
+import { OrgForm } from "~/ee/organizations/admin/AdminOrgEditPage";
 import { getOrganizationRepository } from "@calcom/features/ee/organizations/di/OrganizationRepository.container";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

@@ -2,7 +2,7 @@ import { _generateMetadata } from "app/_utils";
 import { getTranslate } from "app/_utils";

 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import AdminOrgTable from "@calcom/features/ee/organizations/pages/settings/admin/AdminOrgPage";
+import AdminOrgTable from "~/ee/organizations/admin/AdminOrgPage";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

 export const generateMetadata = async () =>
@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import WorkspacePlatformsPage from "@calcom/features/ee/organizations/pages/settings/admin/WorkspacePlatformPage";
+import WorkspacePlatformsPage from "~/ee/organizations/admin/WorkspacePlatformPage";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

 export const generateMetadata = async () =>
@@ -13,7 +13,6 @@ import { useOrgBranding } from "@calcom/features/ee/organizations/context/provid
 import type { OrganizationBranding } from "@calcom/features/ee/organizations/context/provider";
 import type { TeamFeatures } from "@calcom/features/flags/config";
 import { useIsFeatureEnabledForTeam } from "@calcom/features/flags/hooks/useIsFeatureEnabledForTeam";
-import Shell from "@calcom/features/shell/Shell";
 import { HOSTED_CAL_FEATURES, IS_CALCOM, WEBAPP_URL } from "@calcom/lib/constants";
 import { getPlaceholderAvatar } from "@calcom/lib/defaultAvatarImage";
 import { getUserAvatarUrl } from "@calcom/lib/getAvatarUrl";
@@ -30,6 +29,8 @@ import type { VerticalTabItemProps } from "@calcom/ui/components/navigation";
 import { VerticalTabItem } from "@calcom/ui/components/navigation";
 import { Skeleton } from "@calcom/ui/components/skeleton";

+import Shell from "~/shell/Shell";
+
 const getTabs = (orgBranding: OrganizationBranding | null) => {
  const tabs: VerticalTabItemProps[] = [
    {
@@ -1,4 +1,4 @@
-import { SkeletonLoader } from "@calcom/features/webhooks/pages/webhooks-skeleton";
+import { SkeletonLoader } from "~/webhooks/views/webhooks-skeleton";

 export default function Loading() {
  return <SkeletonLoader />;
@@ -4,12 +4,13 @@ import { cookies, headers } from "next/headers";
 import { redirect } from "next/navigation";

 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
-import WebhooksView from "@calcom/features/webhooks/pages/webhooks-view";
 import { APP_NAME } from "@calcom/lib/constants";
 import { webhookRouter } from "@calcom/trpc/server/routers/viewer/webhook/_router";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

+import WebhooksView from "~/webhooks/views/webhooks-view";
+
 export const generateMetadata = async () =>
  await _generateMetadata(
    (t) => t("webhooks"),
@@ -2,9 +2,10 @@ import type { PageProps } from "app/_types";
 import { _generateMetadata } from "app/_utils";

 import { WebhookRepository } from "@calcom/features/webhooks/lib/repository/WebhookRepository";
-import { EditWebhookView } from "@calcom/features/webhooks/pages/webhook-edit-view";
 import { APP_NAME } from "@calcom/lib/constants";

+import { EditWebhookView } from "~/webhooks/views/webhook-edit-view";
+
 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
  await _generateMetadata(
    (t) => t("webhooks"),
@@ -1,4 +1,4 @@
-import { SkeletonLoader } from "@calcom/features/webhooks/pages/webhook-new-skeleton";
+import { SkeletonLoader } from "~/webhooks/views/webhook-new-skeleton";

 export default function Loading() {
  return <SkeletonLoader />;
@@ -1,11 +1,12 @@
 import { createRouterCaller } from "app/_trpc/context";
 import { _generateMetadata } from "app/_utils";

-import { NewWebhookView } from "@calcom/features/webhooks/pages/webhook-new-view";
 import { APP_NAME } from "@calcom/lib/constants";
 import { appsRouter } from "@calcom/trpc/server/routers/viewer/apps/_router";
 import { webhookRouter } from "@calcom/trpc/server/routers/viewer/webhook/_router";

+import { NewWebhookView } from "~/webhooks/views/webhook-new-view";
+
 export const generateMetadata = async () =>
  await _generateMetadata(
    (t) => t("webhooks"),
@@ -1,7 +1,7 @@
 import { _generateMetadata } from "app/_utils";

-import OrgAttributesEditPage from "@calcom/ee/organizations/pages/settings/attributes/attributes-edit-view";
 import { MembershipRole } from "@calcom/prisma/enums";
+import OrgAttributesEditPage from "@calcom/web/modules/ee/organizations/attributes/attributes-edit-view";

 import { validateUserHasOrgPerms } from "../../../../actions/validateUserHasOrgPerms";

@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import OrgAttributesCreatePage from "@calcom/ee/organizations/pages/settings/attributes/attributes-create-view";
+import OrgAttributesCreatePage from "@calcom/web/modules/ee/organizations/attributes/attributes-create-view";
 import { MembershipRole } from "@calcom/prisma/enums";

 import { validateUserHasOrgPerms } from "../../../actions/validateUserHasOrgPerms";
@@ -1,12 +1,13 @@
 import { _generateMetadata, getTranslate } from "app/_utils";
 import { redirect } from "next/navigation";

-import OrgSettingsAttributesPage from "@calcom/ee/organizations/pages/settings/attributes/attributes-list-view";
 import { Resource } from "@calcom/features/pbac/domain/types/permission-registry";
 import { getResourcePermissions } from "@calcom/features/pbac/lib/resource-permissions";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
 import { MembershipRole } from "@calcom/prisma/enums";

+import OrgSettingsAttributesPage from "~/ee/organizations/attributes/attributes-list-view";
+
 import { validateUserHasOrg } from "../../actions/validateUserHasOrg";

 export const generateMetadata = async () =>
@@ -1,6 +1,6 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import DelegationCredentialList from "@calcom/features/ee/organizations/pages/settings/delegationCredential";
+import DelegationCredentialList from "~/ee/organizations/delegationCredential";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
 import { MembershipRole } from "@calcom/prisma/enums";

@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";
 import { redirect } from "next/navigation";

-import GuestNotificationsView from "@calcom/features/ee/organizations/pages/settings/guest-notifications";
+import GuestNotificationsView from "~/ee/organizations/guest-notifications";
 import { Resource } from "@calcom/features/pbac/domain/types/permission-registry";
 import { getResourcePermissions } from "@calcom/features/pbac/lib/resource-permissions";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";
 import { redirect } from "next/navigation";

-import PrivacyView from "@calcom/features/ee/organizations/pages/settings/privacy";
+import PrivacyView from "~/ee/organizations/privacy";
 import { Resource } from "@calcom/features/pbac/domain/types/permission-registry";
 import { getResourcePermissions } from "@calcom/features/pbac/lib/resource-permissions";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
@@ -1,8 +1,9 @@
 import { getTranslate, _generateMetadata } from "app/_utils";

-import { AdminAPIView } from "@calcom/features/ee/organizations/pages/settings/admin-api";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

+import { AdminAPIView } from "~/ee/organizations/admin-api";
+
 import { validateUserHasOrg } from "../actions/validateUserHasOrg";

 export const generateMetadata = async () =>
@@ -1,6 +1,6 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import LegacyPage from "@calcom/features/ee/organizations/pages/settings/general";
+import LegacyPage from "~/ee/organizations/general";
 import { Resource } from "@calcom/features/pbac/domain/types/permission-registry";
 import { getResourcePermissions } from "@calcom/features/pbac/lib/resource-permissions";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";
 import { redirect } from "next/navigation";

-import LegacyPage from "@calcom/features/ee/organizations/pages/settings/profile";
+import LegacyPage from "~/ee/organizations/profile";
 import { Resource } from "@calcom/features/pbac/domain/types/permission-registry";
 import { getResourcePermissions } from "@calcom/features/pbac/lib/resource-permissions";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
@@ -1,9 +1,10 @@
 "use client";

-import SkeletonLoaderTeamList from "@calcom/features/ee/teams/components/SkeletonloaderTeamList";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
 import { useLocale } from "@calcom/lib/hooks/useLocale";

+import SkeletonLoaderTeamList from "~/ee/teams/components/SkeletonloaderTeamList";
+
 export function SkeletonLoader() {
  const { t } = useLocale();
  return (
@@ -1,8 +1,9 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import LegacyPage from "@calcom/features/ee/teams/pages/team-appearance-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

+import LegacyPage from "~/ee/teams/views/team-appearance-view";
+
 import { validateUserHasOrg } from "../../../../actions/validateUserHasOrg";

 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
@@ -2,7 +2,7 @@ import { _generateMetadata, getTranslate } from "app/_utils";

 import LegacyPage, {
  TeamMembersCTA,
-} from "@calcom/features/ee/organizations/pages/settings/other-team-members-view";
+} from "~/ee/organizations/other-team-members-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

 import { validateUserHasOrg } from "../../../../actions/validateUserHasOrg";
@@ -1,6 +1,6 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import LegacyPage from "@calcom/features/ee/organizations/pages/settings/other-team-profile-view";
+import LegacyPage from "~/ee/organizations/other-team-profile-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

 import { validateUserHasOrg } from "../../../../actions/validateUserHasOrg";
@@ -1,8 +1,9 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import LegacyPage from "@calcom/features/ee/teams/pages/team-appearance-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";

+import LegacyPage from "~/ee/teams/views/team-appearance-view";
+
 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
  await _generateMetadata(
    (t) => t("booking_appearance"),
@@ -11,11 +11,10 @@ import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
 import { PrismaAttributeRepository } from "@calcom/lib/server/repository/PrismaAttributeRepository";
 import { prisma } from "@calcom/prisma";
 import { viewerTeamsRouter } from "@calcom/trpc/server/routers/viewer/teams/_router";
+import { TeamMembersView } from "@calcom/web/modules/ee/teams/views/team-members-view";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

-import { TeamMembersView } from "~/teams/team-members-view";
-
 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
  await _generateMetadata(
    (t) => t("team_members"),
@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import LegacyPage from "@calcom/features/ee/teams/pages/team-profile-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+import LegacyPage from "@calcom/web/modules/ee/teams/views/team-profile-view";

 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
  await _generateMetadata(
@@ -1,7 +1,7 @@
 import { _generateMetadata, getTranslate } from "app/_utils";

-import TeamSettingsView from "@calcom/features/ee/teams/pages/team-settings-view";
 import SettingsHeader from "@calcom/features/settings/appDir/SettingsHeader";
+import TeamSettingsView from "@calcom/web/modules/ee/teams/views/team-settings-view";

 export const generateMetadata = async ({ params }: { params: Promise<{ id: string }> }) =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import Page from "@calcom/features/ee/organizations/pages/settings/appearance";
+import Page from "~/ee/organizations/appearance";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,7 +1,8 @@
 import { getTranslate } from "app/_utils";

 import { CTA_CONTAINER_CLASS_NAME } from "@calcom/features/data-table/lib/utils";
-import Shell from "@calcom/features/shell/Shell";
+
+import Shell from "~/shell/Shell";

 export default async function Layout({ children }: { children: React.ReactNode }) {
  const t = await getTranslate();
@@ -1,4 +1,4 @@
-import { UserListTableSkeleton } from "@calcom/features/users/components/UserTable/UserListTableSkeleton";
+import { UserListTableSkeleton } from "@calcom/web/modules/users/components/UserTable/UserListTableSkeleton";

 export default function Loading() {
  return <UserListTableSkeleton />;
@@ -1,4 +1,4 @@
-import { UserListTableSkeleton } from "@calcom/features/users/components/UserTable/UserListTableSkeleton";
+import { UserListTableSkeleton } from "@calcom/web/modules/users/components/UserTable/UserListTableSkeleton";

 export default function Loading() {
  return <UserListTableSkeleton />;
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/about-view";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/about-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/add-teams-view";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/add-teams-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/onboarding-handover";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/onboarding-handover";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/onboard-members-view";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/onboard-members-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -2,7 +2,7 @@ import { _generateMetadata } from "app/_utils";

 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/create-new-view";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/create-new-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import ResumeOnboardingPage, { LayoutWrapper } from "~/settings/organizations/new/resume-view";
+import ResumeOnboardingPage, { LayoutWrapper } from "~/ee/organizations/new/resume-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,6 +1,6 @@
 import { _generateMetadata } from "app/_utils";

-import LegacyPage, { LayoutWrapper } from "~/settings/organizations/new/payment-status-view";
+import LegacyPage, { LayoutWrapper } from "~/ee/organizations/new/payment-status-view";

 export const generateMetadata = async () =>
  await _generateMetadata(
@@ -1,9 +1,10 @@
 import { getTranslate } from "app/_utils";

 import { CTA_CONTAINER_CLASS_NAME } from "@calcom/features/data-table/lib/utils";
-import Shell from "@calcom/features/shell/Shell";
 import { Button } from "@calcom/ui/components/button";

+import Shell from "~/shell/Shell";
+
 export default async function Layout({ children }: { children: React.ReactNode }) {
  const t = await getTranslate();

@@ -1,4 +1,4 @@
-import { UserListTableSkeleton } from "@calcom/features/users/components/UserTable/UserListTableSkeleton";
+import { UserListTableSkeleton } from "@calcom/web/modules/users/components/UserTable/UserListTableSkeleton";

 export default function Loading() {
  return <UserListTableSkeleton />;
@@ -4,7 +4,7 @@ import { z } from "zod";
 // import { cookies, headers } from "next/headers";
 // import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 // import { buildLegacyRequest } from "@lib/buildLegacyCtx";
-import LegacyPage from "@calcom/features/ee/workflows/pages/workflow";
+import LegacyPage from "@calcom/web/modules/ee/workflows/views/WorkflowPage";

 const querySchema = z.object({
  workflow: z
@@ -3,7 +3,7 @@
 // import { buildLegacyRequest } from "@lib/buildLegacyCtx";
 // import { getTeamsFiltersFromQuery } from "@calcom/features/filters/lib/getTeamsFiltersFromQuery";
 // import { WorkflowRepository } from "@calcom/features/ee/workflows/repositories/WorkflowRepository";
-import LegacyPage from "@calcom/features/ee/workflows/pages/index";
+import LegacyPage from "@calcom/web/modules/ee/workflows/views/WorkflowsPage";

 const Page = async () => {
  // const session = await getServerSession({ req: buildLegacyRequest(await headers(), await cookies()) });
@@ -4,14 +4,14 @@ import { NextResponse } from "next/server";

 import { getServerSession } from "@calcom/features/auth/lib/getServerSession";
 import { BillingPlanService } from "@calcom/features/ee/billing/domain/billing-plans";
-import type { Contact } from "@calcom/features/ee/support/lib/intercom/intercom";
-import { intercom } from "@calcom/features/ee/support/lib/intercom/intercom";
 import { MembershipRepository } from "@calcom/features/membership/repositories/MembershipRepository";
 import { UserRepository } from "@calcom/features/users/repositories/UserRepository";
 import { WEBAPP_URL, WEBSITE_URL } from "@calcom/lib/constants";
 import logger from "@calcom/lib/logger";
 import { safeStringify } from "@calcom/lib/safeStringify";
 import { prisma } from "@calcom/prisma";
+import type { Contact } from "@calcom/web/modules/ee/support/lib/intercom/intercom";
+import { intercom } from "@calcom/web/modules/ee/support/lib/intercom/intercom";

 import { buildLegacyRequest } from "@lib/buildLegacyCtx";

@@ -1,12 +1,13 @@
 "use client";

-import Shell from "@calcom/features/shell/Shell";
-import { UpgradeTip } from "@calcom/features/tips";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Button } from "@calcom/ui/components/button";
 import { ButtonGroup } from "@calcom/ui/components/buttonGroup";
 import { Icon } from "@calcom/ui/components/icon";

+import Shell from "~/shell/Shell";
+import { UpgradeTip } from "~/shell/UpgradeTip";
+
 export default function EnterprisePage() {
  const { t } = useLocale();

@@ -1,7 +1,8 @@
 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";

+import Shell from "~/shell/Shell";
+
 import type { AppPageProps } from "./AppPage";
 import { AppPage } from "./AppPage";

@@ -2,11 +2,6 @@ import { useMemo } from "react";
 import { useFormContext } from "react-hook-form";
 import type { UseFormGetValues, UseFormSetValue, Control, FormState } from "react-hook-form";

-import type {
-  TLocationOptions,
-  TEventTypeLocation,
-} from "@calcom/features/eventtypes/components/locations/Locations";
-import Locations from "@calcom/features/eventtypes/components/locations/Locations";
 import type { LocationFormValues } from "@calcom/features/eventtypes/lib/types";
 import type { SingleValueLocationOption } from "@calcom/features/form/components/LocationSelect";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
@@ -20,6 +15,8 @@ import { QueryCell } from "@lib/QueryCell";
 import type { TFormType } from "@components/apps/installation/ConfigureStepCard";

 import type { TEventType } from "~/apps/installation/[[...step]]/step-view";
+import Locations from "~/event-types/components/locations/Locations";
+import type { TLocationOptions, TEventTypeLocation } from "~/event-types/components/locations/Locations";

 const LocationsWrapper = ({
  eventType,
@@ -2,10 +2,11 @@ import { useRouter } from "next/navigation";
 import type { ComponentProps } from "react";
 import React from "react";

-import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { EmptyScreen } from "@calcom/ui/components/empty-screen";

+import Shell from "~/shell/Shell";
+
 type AppsLayoutProps = {
  children: React.ReactNode;
  isAdmin: boolean;
@@ -2,7 +2,8 @@ import type { ComponentProps } from "react";
 import React from "react";

 import AppCategoryNavigation from "@calcom/app-store/_components/AppCategoryNavigation";
-import Shell from "@calcom/features/shell/Shell";
+
+import Shell from "~/shell/Shell";

 export default function InstalledAppsLayout({
  children,
@@ -60,7 +60,7 @@ function mockEventTypeRedirectUrlMatchingRoute() {
 /**
 * fixes the error due to Formbricks
 */
-vi.mock("@calcom/features/shell/Shell", () => ({
+vi.mock("@calcom/web/modules/shell/Shell", () => ({
  ShellMain: vi.fn(),
 }));

@@ -10,7 +10,7 @@ beforeAll(() => {
  Element.prototype.scrollIntoView = vi.fn();
 });

-vi.mock("@calcom/trpc", () => ({
+vi.mock("@calcom/trpc/react", () => ({
  trpc: {
    viewer: {
      bookings: {
@@ -2,7 +2,7 @@ import { useState } from "react";
 import type { z } from "zod";

 import { MeetingSessionDetailsDialog } from "@calcom/features/ee/video/MeetingSessionDetailsDialog";
-import ViewRecordingsDialog from "@calcom/features/ee/video/ViewRecordingsDialog";
+import ViewRecordingsDialog from "~/ee/video/ViewRecordingsDialog";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import type { bookingMetadataSchema } from "@calcom/prisma/zod-utils";
 import { trpc } from "@calcom/trpc/react";
@@ -10,10 +10,10 @@ import { NuqsAdapter } from "nuqs/adapters/next/app";
 import DynamicPostHogProvider from "@calcom/features/ee/event-tracking/lib/posthog/providerDynamic";
 import DynamicPostHogPageView from "@calcom/features/ee/event-tracking/lib/posthog/web/pageViewDynamic";
 import { OrgBrandingProvider } from "@calcom/features/ee/organizations/context/provider";
-import DynamicHelpscoutProvider from "@calcom/features/ee/support/lib/helpscout/providerDynamic";
-import DynamicIntercomProvider from "@calcom/features/ee/support/lib/intercom/providerDynamic";
 import { FeatureProvider } from "@calcom/features/flags/context/provider";
 import { useFlags } from "@calcom/features/flags/hooks";
+import DynamicHelpscoutProvider from "@calcom/web/modules/ee/support/lib/helpscout/providerDynamic";
+import DynamicIntercomProvider from "@calcom/web/modules/ee/support/lib/intercom/providerDynamic";

 import useIsBookingPage from "@lib/hooks/useIsBookingPage";
 import useIsThemeSupported from "@lib/hooks/useIsThemeSupported";
@@ -20,10 +20,10 @@ import type { PropsWithChildren, ReactNode } from "react";
 import { useEffect } from "react";

 import { OrgBrandingProvider } from "@calcom/features/ee/organizations/context/provider";
-import DynamicHelpscoutProvider from "@calcom/features/ee/support/lib/helpscout/providerDynamic";
-import DynamicIntercomProvider from "@calcom/features/ee/support/lib/intercom/providerDynamic";
 import { FeatureProvider } from "@calcom/features/flags/context/provider";
 import { useFlags } from "@calcom/features/flags/hooks";
+import DynamicHelpscoutProvider from "@calcom/web/modules/ee/support/lib/helpscout/providerDynamic";
+import DynamicIntercomProvider from "@calcom/web/modules/ee/support/lib/intercom/providerDynamic";

 import useIsBookingPage from "@lib/hooks/useIsBookingPage";
 import { useNuqsParams } from "@lib/hooks/useNuqsParams";
@@ -3,12 +3,13 @@
 import Link from "next/link";

 import { AppCard } from "@calcom/features/apps/components/AppCard";
-import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { SkeletonText } from "@calcom/ui/components/skeleton";

 import type { CategoryDataProps } from "@lib/apps/categories/[category]/getStaticProps";

+import Shell from "~/shell/Shell";
+
 export default function Apps({ apps, category }: CategoryDataProps) {
  const { t, isLocaleReady } = useLocale();

@@ -2,7 +2,6 @@

 import Link from "next/link";

-import Shell from "@calcom/features/shell/Shell";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import type { inferSSRProps } from "@calcom/types/inferSSRProps";
 import { Icon } from "@calcom/ui/components/icon";
@@ -10,6 +9,8 @@ import { SkeletonText } from "@calcom/ui/components/skeleton";

 import type { getServerSideProps } from "@lib/apps/categories/getServerSideProps";

+import Shell from "~/shell/Shell";
+
 export type PageProps = inferSSRProps<typeof getServerSideProps>;

 export default function Apps({ categories }: PageProps) {
@@ -0,0 +1,18 @@
+"use client";
+
+import { UpgradeTeamsBadge as UpgradeTeamsBadgeBase } from "@calcom/ui/components/badge";
+import { useHasPaidPlan, useHasActiveTeamPlan } from "@calcom/web/modules/billing/hooks/useHasPaidPlan";
+
+export function UpgradeTeamsBadgeWebWrapper({ checkForActiveStatus }: { checkForActiveStatus?: boolean }) {
+  const { hasPaidPlan } = useHasPaidPlan();
+  const { hasActiveTeamPlan, isTrial } = useHasActiveTeamPlan();
+
+  return (
+    <UpgradeTeamsBadgeBase
+      checkForActiveStatus={checkForActiveStatus}
+      hasPaidPlan={hasPaidPlan}
+      hasActiveTeamPlan={hasActiveTeamPlan}
+      isTrial={isTrial}
+    />
+  );
+}
@@ -6,8 +6,8 @@ import dayjs from "@calcom/dayjs";
 import { useTimePreferences } from "@calcom/features/bookings/lib";
 import { Calendar } from "@calcom/features/calendars/weeklyview";
 import type { CalendarEvent } from "@calcom/features/calendars/weeklyview/types/events";
-import { useBanners } from "@calcom/features/shell/banners/useBanners";
 import { useGetTheme } from "@calcom/lib/hooks/useTheme";
+import { useBanners } from "@calcom/web/modules/shell/banners/useBanners";

 import { useBookingDetailsSheetStore } from "../store/bookingDetailsSheetStore";
 import type { BookingOutput } from "../types";
@@ -1,3 +1,5 @@
+"use client";
+
 import Link from "next/link";

 import { useLocale } from "@calcom/lib/hooks/useLocale";
@@ -0,0 +1,42 @@
+The Cal.com Commercial License (the “Commercial License”)
+Copyright (c) 2020-present Cal.com, Inc
+
+With regard to the Cal.com Software:
+
+This software and associated documentation files (the "Software") may only be
+used in production, if you (and any entity that you represent) have agreed to,
+and are in compliance with, the Cal.com Subscription Terms available
+at https://cal.com/terms, or other agreements governing
+the use of the Software, as mutually agreed by you and Cal.com, Inc ("Cal.com"),
+and otherwise have a valid Cal.com Enterprise Edition subscription ("Commercial Subscription")
+for the correct number of hosts as defined in the "Commercial Terms ("Hosts"). Subject to the foregoing sentence,
+you are free to modify this Software and publish patches to the Software. You agree
+that Cal.com and/or its licensors (as applicable) retain all right, title and interest in
+and to all such modifications and/or patches, and all such modifications and/or
+patches may only be used, copied, modified, displayed, distributed, or otherwise
+exploited with a valid Commercial Subscription for the correct number of hosts.
+Notwithstanding the foregoing, you may copy and modify the Software for development
+and testing purposes, without requiring a subscription. You agree that Cal.com and/or
+its licensors (as applicable) retain all right, title and interest in and to all such
+modifications. You are not granted any other rights beyond what is expressly stated herein.
+Subject to the foregoing, it is forbidden to copy, merge, publish, distribute, sublicense,
+and/or sell the Software.
+
+This Commercial License applies only to the part of this Software that is not distributed under
+the AGPLv3 license. Any part of this Software distributed under the MIT license or which
+is served client-side as an image, font, cascading stylesheet (CSS), file which produces
+or is compiled, arranged, augmented, or combined into client-side JavaScript, in whole or
+in part, is copyrighted under the AGPLv3 license. The full text of this Commercial License shall
+be included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+
+For all third party components incorporated into the Cal.com Software, those
+components are licensed under the original license provided by the owner of the
+applicable component.
@@ -1,12 +1,13 @@
 "use client";

 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
-import { UpgradeTip } from "@calcom/features/tips";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { Button } from "@calcom/ui/components/button";
 import { ButtonGroup } from "@calcom/ui/components/buttonGroup";
 import { Icon } from "@calcom/ui/components/icon";

+import { UpgradeTip } from "~/shell/UpgradeTip";
+
 export const AdminAPIView = () => {
  const { t } = useLocale();

@@ -3,6 +3,7 @@
 import { useState } from "react";

 import { Dialog } from "@calcom/features/components/controlled-dialog";
+import { subdomainSuffix } from "@calcom/features/ee/organizations/lib/orgDomains";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { trpc } from "@calcom/trpc/react";
 import { Badge } from "@calcom/ui/components/badge";
@@ -10,8 +11,6 @@ import { ConfirmationDialogContent } from "@calcom/ui/components/dialog";
 import { DropdownActions, Table } from "@calcom/ui/components/table";
 import { showToast } from "@calcom/ui/components/toast";

-import { subdomainSuffix } from "../../../../organizations/lib/orgDomains";
-
 const { Body, Cell, ColumnTitle, Header, Row } = Table;

 export function AdminOrgTable() {
@@ -251,7 +250,7 @@ const DeleteOrgDialog = ({
        cancelBtnText={t("cancel")}
        variety="danger"
        onConfirm={onConfirm}>
-        <ul className="ml-4 mt-5 list-disc stack-y-2">
+        <ul className="stack-y-2 ml-4 mt-5 list-disc">
          <li>{t("admin_delete_organization_description_1")}</li>
          <li>{t("admin_delete_organization_description_2")}</li>
          <li>{t("admin_delete_organization_description_3")}</li>
@@ -137,7 +137,7 @@ function EmptyState({ onAdd }: Pick<Props, "onAdd">) {
  const { t } = useLocale();

  return (
-    <div className="flex flex-col items-center justify-center stack-y-4 py-10">
+    <div className="stack-y-4 flex flex-col items-center justify-center py-10">
      <p className="text-gray-500">{t("no_workspace_platforms")}</p>
      <Button color="secondary" onClick={onAdd}>
        {t("add")}
@@ -1,6 +1,5 @@
 import { describe, it, expect } from "vitest";

-import "../../../../../../../ui/components/test-setup";
 import { getGroupOptionUpdate } from "../AttributesForm";

 describe("getGroupOptionUpdate", () => {
@@ -10,20 +10,23 @@ import { Button } from "@calcom/ui/components/button";
 import { AttributeForm } from "../AttributesForm";

 vi.mock("@calcom/lib/hooks/useLocale", () => ({
-  useLocale: vi.fn(() => ({
+  useLocale: () => ({
    t: (key: string) => key,
-  })),
+  }),
+}));
+
+vi.mock("@calcom/lib/hooks/useCompatSearchParams", () => ({
+  useCompatSearchParams: () => new URLSearchParams(),
 }));

 vi.mock("next/navigation", async (importOriginal) => {
  const actual = await importOriginal<typeof import("next/navigation")>();
  return {
    ...actual,
-    useRouter: vi.fn(() => ({
-      push: vi.fn(() => {
-        return;
-      }),
-    })),
+    useRouter: () => ({
+      push: vi.fn(),
+    }),
+    usePathname: () => "/settings/organizations/attributes",
  };
 });

@@ -403,7 +403,7 @@ function DelegationCredentialList() {

  return (
    <div>
-      {!!delegations?.length ? (
+      {delegations?.length ? (
        <>
          <ul className="stack-y-2 [&>*:last-child]:rounded-b-xl">
            {delegations.map(
@@ -7,6 +7,10 @@ import { Controller, useForm } from "react-hook-form";

 import { TimezoneSelect } from "@calcom/features/components/timezone-select";
 import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequired";
+import { DisableAutofillOnBookingPageSwitch } from "@calcom/features/ee/organizations/pages/components/DisableAutofillOnBookingPageSwitch";
+import { DisablePhoneOnlySMSNotificationsSwitch } from "@calcom/features/ee/organizations/pages/components/DisablePhoneOnlySMSNotificationsSwitch";
+import { LockEventTypeSwitch } from "@calcom/features/ee/organizations/pages/components/LockEventTypeSwitch";
+import { NoSlotsNotificationSwitch } from "@calcom/features/ee/organizations/pages/components/NoSlotsNotificationSwitch";
 import SectionBottomActions from "@calcom/features/settings/SectionBottomActions";
 import { useLocale } from "@calcom/lib/hooks/useLocale";
 import { nameOfDay } from "@calcom/lib/weekday";
@@ -20,15 +24,10 @@ import { Select } from "@calcom/ui/components/form";
 import { SkeletonButton, SkeletonContainer, SkeletonText } from "@calcom/ui/components/skeleton";
 import { showToast } from "@calcom/ui/components/toast";

-import { DisableAutofillOnBookingPageSwitch } from "../components/DisableAutofillOnBookingPageSwitch";
-import { DisablePhoneOnlySMSNotificationsSwitch } from "../components/DisablePhoneOnlySMSNotificationsSwitch";
-import { LockEventTypeSwitch } from "../components/LockEventTypeSwitch";
-import { NoSlotsNotificationSwitch } from "../components/NoSlotsNotificationSwitch";
-
 const SkeletonLoader = () => {
  return (
    <SkeletonContainer>
-      <div className="mb-8 mt-6 stack-y-6">
+      <div className="stack-y-6 mb-8 mt-6">
        <SkeletonText className="h-8 w-full" />
        <SkeletonText className="h-8 w-full" />
        <SkeletonText className="h-8 w-full" />
@@ -4,7 +4,7 @@ import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequir
 import { trpc } from "@calcom/trpc/react";
 import { SkeletonContainer, SkeletonText, SkeletonButton } from "@calcom/ui/components/skeleton";

-import DisableGuestBookingEmailsSetting from "../components/DisableGuestBookingEmailsSetting";
+import DisableGuestBookingEmailsSetting from "@calcom/features/ee/organizations/pages/components/DisableGuestBookingEmailsSetting";

 const SkeletonLoader = () => {
  return (
--- a/Show More
+++ b/Show More