diff --git a/packages/features/bookings/Booker/components/Header.tsx b/packages/features/bookings/Booker/components/Header.tsx index a564280b7c..3eb9c291c6 100644 --- a/packages/features/bookings/Booker/components/Header.tsx +++ b/packages/features/bookings/Booker/components/Header.tsx @@ -28,7 +28,6 @@ export function Header({ const addToSelectedDate = useBookerStore((state) => state.addToSelectedDate); const isMonthView = layout === BookerLayouts.MONTH_VIEW; const selectedDate = dayjs(selectedDateString); - const isEmbed = typeof window !== "undefined" && window?.isEmbed?.(); const today = dayjs(); const selectedDateMin3DaysDifference = useMemo(() => { const diff = today.diff(selectedDate, "days"); @@ -43,7 +42,7 @@ export function Header({ [setLayout, layout] ); - if (isMobile || isEmbed || !enabledLayouts) return null; + if (isMobile || !enabledLayouts) return null; // Only reason we create this component, is because it is used 3 times in this component, // and this way we can't forget to update one of the props in all places :) @@ -119,7 +118,14 @@ const LayoutToggle = ({ layout: string; enabledLayouts?: BookerLayouts[]; }) => { + const isEmbed = typeof window !== "undefined" && window?.isEmbed?.(); + const { t } = useLocale(); + // We don't want to show the layout toggle in embed mode as of now as it doesn't look rightly placed when embedded. + // There is a Embed API to control the layout toggle from outside of the iframe. + if (isEmbed) { + return null; + } const layoutOptions = useMemo(() => { return [ {