From 4ca9138e016a9315c694edd4b5e7dd7b93cfedb6 Mon Sep 17 00:00:00 2001
From: Udit Takkar <53316345+Udit-takkar@users.noreply.github.com>
Date: Wed, 2 Aug 2023 12:22:44 +0530
Subject: [PATCH] fix: react hook can't be used conditionally (#10439)

---
 .../features/bookings/Booker/components/Header.tsx   | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/features/bookings/Booker/components/Header.tsx b/packages/features/bookings/Booker/components/Header.tsx
index 3eb9c291c6..3b380e6c8f 100644
--- a/packages/features/bookings/Booker/components/Header.tsx
+++ b/packages/features/bookings/Booker/components/Header.tsx
@@ -121,11 +121,7 @@ const LayoutToggle = ({
   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 [
       {
@@ -146,5 +142,11 @@ const LayoutToggle = ({
     ].filter((layout) => enabledLayouts?.includes(layout.value as BookerLayouts));
   }, [t, enabledLayouts]);
 
+  // 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;
+  }
+
   return <ToggleGroup onValueChange={onLayoutToggle} defaultValue={layout} options={layoutOptions} />;
 };