From a43437b1d6a0db4996cf6b7d73d067adfdbb3317 Mon Sep 17 00:00:00 2001
From: Benny Joo <sldisek783@gmail.com>
Date: Mon, 14 Apr 2025 12:54:25 -0400
Subject: [PATCH] fix (#20693)

---
 .../web/app/(booking-page-wrapper)/layout.tsx |  8 ++--
 apps/web/app/(use-page-wrapper)/layout.tsx    | 30 ++++++++-------
 apps/web/components/PageWrapperAppDir.tsx     | 37 ++++++++++---------
 apps/web/lib/app-providers-app-dir.tsx        | 30 +++++++--------
 4 files changed, 55 insertions(+), 50 deletions(-)

diff --git a/apps/web/app/(booking-page-wrapper)/layout.tsx b/apps/web/app/(booking-page-wrapper)/layout.tsx
index 9355b24469..b2a76da168 100644
--- a/apps/web/app/(booking-page-wrapper)/layout.tsx
+++ b/apps/web/app/(booking-page-wrapper)/layout.tsx
@@ -7,8 +7,10 @@ export default async function BookingPageWrapperLayout({ children }: { children:
   const nonce = h.get("x-nonce") ?? undefined;
 
   return (
-    <PageWrapper isBookingPage={true} requiresLicense={false} nonce={nonce}>
-      {children}
-    </PageWrapper>
+    <>
+      <PageWrapper isBookingPage={true} requiresLicense={false} nonce={nonce}>
+        {children}
+      </PageWrapper>
+    </>
   );
 }
diff --git a/apps/web/app/(use-page-wrapper)/layout.tsx b/apps/web/app/(use-page-wrapper)/layout.tsx
index 761b529d3a..a7be94bd6a 100644
--- a/apps/web/app/(use-page-wrapper)/layout.tsx
+++ b/apps/web/app/(use-page-wrapper)/layout.tsx
@@ -21,19 +21,21 @@ export default async function PageWrapperLayout({ children }: { children: React.
   ].filter((script): script is { id: string; script: string } => !!script.script);
 
   return (
-    <PageWrapper requiresLicense={false} nonce={nonce}>
-      {children}
-      {scripts.map((script) => (
-        <Script
-          key={script.id}
-          nonce={nonce}
-          id={script.id}
-          // eslint-disable-next-line react/no-danger
-          dangerouslySetInnerHTML={{
-            __html: script.script,
-          }}
-        />
-      ))}
-    </PageWrapper>
+    <>
+      <PageWrapper requiresLicense={false} nonce={nonce}>
+        {children}
+        {scripts.map((script) => (
+          <Script
+            key={script.id}
+            nonce={nonce}
+            id={script.id}
+            // eslint-disable-next-line react/no-danger
+            dangerouslySetInnerHTML={{
+              __html: script.script,
+            }}
+          />
+        ))}
+      </PageWrapper>
+    </>
   );
 }
diff --git a/apps/web/components/PageWrapperAppDir.tsx b/apps/web/components/PageWrapperAppDir.tsx
index 20b6507911..64c6d11155 100644
--- a/apps/web/components/PageWrapperAppDir.tsx
+++ b/apps/web/components/PageWrapperAppDir.tsx
@@ -9,7 +9,6 @@ import LicenseRequired from "@calcom/features/ee/common/components/LicenseRequir
 import AppProviders from "@lib/app-providers-app-dir";
 
 export type PageWrapperProps = Readonly<{
-  getLayout?: ((page: React.ReactElement) => React.ReactNode) | null;
   children: React.ReactNode;
   requiresLicense: boolean;
   nonce: string | undefined;
@@ -38,24 +37,26 @@ function PageWrapper(props: PageWrapperProps) {
     nonce,
   };
 
-  const getLayout: (page: React.ReactElement) => React.ReactNode = props.getLayout ?? ((page) => page);
-
   return (
-    <AppProviders {...providerProps}>
-      <>
-        <Script
-          nonce={nonce}
-          id="page-status"
-          // It is strictly not necessary to disable, but in a future update of react/no-danger this will error.
-          // And we don't want it to error here anyways
-          // eslint-disable-next-line react/no-danger
-          dangerouslySetInnerHTML={{ __html: `window.CalComPageStatus = '${pageStatus}'` }}
-        />
-        {getLayout(
-          props.requiresLicense ? <LicenseRequired>{props.children}</LicenseRequired> : <>{props.children}</>
-        )}
-      </>
-    </AppProviders>
+    <>
+      <AppProviders {...providerProps}>
+        <>
+          <Script
+            nonce={nonce}
+            id="page-status"
+            // It is strictly not necessary to disable, but in a future update of react/no-danger this will error.
+            // And we don't want it to error here anyways
+            // eslint-disable-next-line react/no-danger
+            dangerouslySetInnerHTML={{ __html: `window.CalComPageStatus = '${pageStatus}'` }}
+          />
+          {props.requiresLicense ? (
+            <LicenseRequired>{props.children}</LicenseRequired>
+          ) : (
+            <>{props.children}</>
+          )}
+        </>
+      </AppProviders>
+    </>
   );
 }
 
diff --git a/apps/web/lib/app-providers-app-dir.tsx b/apps/web/lib/app-providers-app-dir.tsx
index 2f21f69fb2..ad428b7b87 100644
--- a/apps/web/lib/app-providers-app-dir.tsx
+++ b/apps/web/lib/app-providers-app-dir.tsx
@@ -6,7 +6,6 @@ import { ThemeProvider } from "next-themes";
 import type { AppProps as NextAppProps } from "next/app";
 import type { ReadonlyURLSearchParams } from "next/navigation";
 import { usePathname, useSearchParams } from "next/navigation";
-import type { ReactNode } from "react";
 
 import DynamicPostHogProvider from "@calcom/features/ee/event-tracking/lib/posthog/providerDynamic";
 import { OrgBrandingProvider } from "@calcom/features/ee/organizations/context/provider";
@@ -38,7 +37,6 @@ export type AppProps = Omit<
   Component: NextAppProps["Component"] & {
     requiresLicense?: boolean;
     isBookingPage?: boolean | ((arg: { router: NextAppProps["router"] }) => boolean);
-    getLayout?: (page: React.ReactElement) => ReactNode;
     PageWrapper?: (props: AppProps) => JSX.Element;
   };
 
@@ -114,19 +112,21 @@ const AppProviders = (props: PageWrapperProps) => {
   const isThemeSupported = useIsThemeSupported();
 
   const RemainingProviders = (
-    <EventCollectionProvider options={{ apiPath: "/api/collect-events" }}>
-      <TooltipProvider>
-        {/* color-scheme makes background:transparent not work which is required by embed. We need to ensure next-theme adds color-scheme to `body` instead of `html`(https://github.com/pacocoursey/next-themes/blob/main/src/index.tsx#L74). Once that's done we can enable color-scheme support */}
-        <CalcomThemeProvider
-          nonce={props.nonce}
-          isThemeSupported={isThemeSupported}
-          isBookingPage={props.isBookingPage || isBookingPage}>
-          <FeatureFlagsProvider>
-            <OrgBrandProvider>{props.children}</OrgBrandProvider>
-          </FeatureFlagsProvider>
-        </CalcomThemeProvider>
-      </TooltipProvider>
-    </EventCollectionProvider>
+    <>
+      <EventCollectionProvider options={{ apiPath: "/api/collect-events" }}>
+        <TooltipProvider>
+          {/* color-scheme makes background:transparent not work which is required by embed. We need to ensure next-theme adds color-scheme to `body` instead of `html`(https://github.com/pacocoursey/next-themes/blob/main/src/index.tsx#L74). Once that's done we can enable color-scheme support */}
+          <CalcomThemeProvider
+            nonce={props.nonce}
+            isThemeSupported={isThemeSupported}
+            isBookingPage={props.isBookingPage || isBookingPage}>
+            <FeatureFlagsProvider>
+              <OrgBrandProvider>{props.children}</OrgBrandProvider>
+            </FeatureFlagsProvider>
+          </CalcomThemeProvider>
+        </TooltipProvider>
+      </EventCollectionProvider>
+    </>
   );
 
   if (props.isBookingPage || isBookingPage) {