fix: show bookings shell headings when v3 disabled (#27433)

* fix: show bookings shell headings when v3 disabled

* remove unused hook

apps/web/app/(use-page-wrapper)/(main-nav)/bookings/[status]/page.tsx

@@ -68,9 +68,12 @@ const Page = async ({ params }: PageProps) => {
 
   return (
     <ShellMainAppDir
-      heading={t("bookings")}
-      subtitle={t("bookings_description")}
-      headerClassName="bookings-shell-heading">
+      {...(!bookingsV3Enabled
+        ? {
+            heading: t("bookings"),
+            subtitle: t("bookings_description"),
+          }
+        : {})}>
       <BookingsList
         status={parsed.data.status}
         userId={userId}

apps/web/modules/bookings/hooks/useBookingsShellHeadingVisibility.ts

@@ -1,25 +0,0 @@
-"use client";
-
-import { useLayoutEffect } from "react";
-
-const MARKER_CLASS = "bookings-shell-heading";
-
-export function useBookingsShellHeadingVisibility({ visible }: { visible: boolean }) {
-  useLayoutEffect(() => {
-    const marker = document.querySelector(`.${MARKER_CLASS}`);
-    if (!marker) return;
-
-    const headerWrapper = marker.closest("header")?.parentElement;
-    if (!headerWrapper) return;
-
-    if (visible) {
-      headerWrapper.classList.remove("hidden");
-    } else {
-      headerWrapper.classList.add("hidden");
-    }
-
-    return () => {
-      headerWrapper.classList.remove("hidden");
-    };
-  }, [visible]);
-}

apps/web/modules/bookings/views/bookings-view.tsx

@@ -8,10 +8,8 @@ import classNames from "@calcom/ui/classNames";
 import dynamic from "next/dynamic";
 import { usePathname } from "next/navigation";
 import { useMemo } from "react";
-
 import { useFeatureOptInBanner } from "../../feature-opt-in/hooks/useFeatureOptInBanner";
 import { BookingListContainer } from "../components/BookingListContainer";
-import { useBookingsShellHeadingVisibility } from "../hooks/useBookingsShellHeadingVisibility";
 import { useBookingsView } from "../hooks/useBookingsView";
 import type { validStatuses } from "../lib/validStatuses";
 
@@ -74,8 +72,6 @@ function BookingsContent({ status, permissions, bookingsV3Enabled, bookingAuditE
   const [view] = useBookingsView({ bookingsV3Enabled });
   const optInBanner = useFeatureOptInBanner("bookings-v3");
 
-  useBookingsShellHeadingVisibility({ visible: view === "list" });
-
   return (
     <div className={classNames(view === "calendar" && "-mb-8")}>
       {view === "list" && (