perf: don't load ring.mp3 on booking page (calcom#21272)

Author: Udit-takkar

apps/web/app/layout.tsx

@@ -7,7 +7,6 @@ import React from "react";
 import { getLocale } from "@calcom/features/auth/lib/getLocale";
 import { loadTranslations } from "@calcom/lib/server/i18n";
 import { IconSprites } from "@calcom/ui/components/icon";
-import { NotificationSoundHandler } from "@calcom/web/components/notification-sound-handler";
 
 import { buildLegacyRequest } from "@lib/buildLegacyCtx";
 
@@ -152,13 +151,11 @@ export default async function RootLayout({ children }: { children: React.ReactNo
           ]}
         />
 
-        <Providers>
+        <Providers isEmbed={isEmbed}>
           <AppRouterI18nProvider translations={translations} locale={locale} ns={ns}>
             {children}
           </AppRouterI18nProvider>
         </Providers>
-        {!isEmbed && <NotificationSoundHandler />}
-        <NotificationSoundHandler />
       </body>
     </html>
   );

apps/web/app/providers.tsx

@@ -5,20 +5,23 @@ import { SessionProvider } from "next-auth/react";
 import CacheProvider from "react-inlinesvg/provider";
 
 import { WebPushProvider } from "@calcom/features/notifications/WebPushContext";
+import { NotificationSoundHandler } from "@calcom/web/components/notification-sound-handler";
 
 import useIsBookingPage from "@lib/hooks/useIsBookingPage";
 import PlainChat from "@lib/plain/dynamicProvider";
 
 type ProvidersProps = {
+  isEmbed: boolean;
   children: React.ReactNode;
 };
-export function Providers({ children }: ProvidersProps) {
+export function Providers({ isEmbed, children }: ProvidersProps) {
   const isBookingPage = useIsBookingPage();
 
   return (
     <SessionProvider>
       <TrpcProvider>
         {!isBookingPage ? <PlainChat /> : null}
+        {!isEmbed && !isBookingPage && <NotificationSoundHandler />}
         {/* @ts-expect-error FIXME remove this comment when upgrading typescript to v5 */}
         <CacheProvider>
           <WebPushProvider>{children}</WebPushProvider>