From eaf9aa7277140bae238468e7d12abf2e25aa367d Mon Sep 17 00:00:00 2001
From: Anton Gunnarsson <anton.gunnarsson@scandichotels.com>
Date: Fri, 15 Nov 2024 11:48:52 +0100
Subject: [PATCH] Fix BookingWidgetSkeleton after merge

---
 components/BookingWidget/Client.tsx                       | 8 +++++---
 components/BookingWidget/MobileToggleButton/index.tsx     | 7 +------
 .../MainMenu/NavigationMenu/NavigationMenuList/index.tsx  | 4 +++-
 components/Header/MainMenu/index.tsx                      | 2 +-
 4 files changed, 10 insertions(+), 11 deletions(-)

diff --git a/components/BookingWidget/Client.tsx b/components/BookingWidget/Client.tsx
index 39f186814..3f7bc5ca3 100644
--- a/components/BookingWidget/Client.tsx
+++ b/components/BookingWidget/Client.tsx
@@ -188,10 +188,12 @@ export default function BookingWidgetClient({
 export function BookingWidgetSkeleton() {
   return (
     <>
-      <section className={styles.containerDesktop}>
-        <BookingWidgetFormSkeleton />
+      <section className={styles.wrapper} style={{ top: 0 }}>
+        <MobileToggleButtonSkeleton />
+        <div className={styles.formContainer}>
+          <BookingWidgetFormSkeleton />
+        </div>
       </section>
-      <MobileToggleButtonSkeleton />
     </>
   )
 }
diff --git a/components/BookingWidget/MobileToggleButton/index.tsx b/components/BookingWidget/MobileToggleButton/index.tsx
index 03d8d8f93..99e691359 100644
--- a/components/BookingWidget/MobileToggleButton/index.tsx
+++ b/components/BookingWidget/MobileToggleButton/index.tsx
@@ -121,14 +121,9 @@ export default function MobileToggleButton({
 
 export function MobileToggleButtonSkeleton() {
   const intl = useIntl()
-  const bookingWidgetMobileRef = useRef(null)
-  useStickyPosition({
-    ref: bookingWidgetMobileRef,
-    name: StickyElementNameEnum.BOOKING_WIDGET_MOBILE,
-  })
 
   return (
-    <div className={styles.partial} ref={bookingWidgetMobileRef}>
+    <div className={styles.partial}>
       <div>
         <Caption type="bold" color="red">
           {intl.formatMessage({ id: "Where to" })}
diff --git a/components/Header/MainMenu/NavigationMenu/NavigationMenuList/index.tsx b/components/Header/MainMenu/NavigationMenu/NavigationMenuList/index.tsx
index 5d1b10185..2aa95a0cb 100644
--- a/components/Header/MainMenu/NavigationMenu/NavigationMenuList/index.tsx
+++ b/components/Header/MainMenu/NavigationMenu/NavigationMenuList/index.tsx
@@ -1,10 +1,12 @@
+import { cx } from "class-variance-authority"
+
 import SkeletonShimmer from "@/components/SkeletonShimmer"
+
 import NavigationMenuItem from "../NavigationMenuItem"
 
 import styles from "./navigationMenuList.module.css"
 
 import type { NavigationMenuListProps } from "@/types/components/header/navigationMenuList"
-import { cx } from "class-variance-authority"
 
 export default function NavigationMenuList({
   isMobile,
diff --git a/components/Header/MainMenu/index.tsx b/components/Header/MainMenu/index.tsx
index 208a64b89..e1be0051f 100644
--- a/components/Header/MainMenu/index.tsx
+++ b/components/Header/MainMenu/index.tsx
@@ -5,6 +5,7 @@ import Image from "@/components/Image"
 import { getIntl } from "@/i18n"
 import { getLang } from "@/i18n/serverContext"
 
+import { NavigationMenuListSkeleton } from "./NavigationMenu/NavigationMenuList"
 import { MobileMenuSkeleton } from "./MobileMenu"
 import MobileMenuWrapper from "./MobileMenuWrapper"
 import MyPagesMenuWrapper, {
@@ -13,7 +14,6 @@ import MyPagesMenuWrapper, {
 import NavigationMenu from "./NavigationMenu"
 
 import styles from "./mainMenu.module.css"
-import { NavigationMenuListSkeleton } from "./NavigationMenu/NavigationMenuList"
 
 export default function MainMenu() {
   return (