refactor: reorganize component organization

components/ContentType/HotelPage/AmenitiesList/index.tsx

@@ -1,13 +1,12 @@
 import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data"
 import { ChevronRightIcon } from "@/components/Icons"
 import Link from "@/components/TempDesignSystem/Link"
+import SidePeekContainer from "@/components/TempDesignSystem/SidePeek/Container"
 import SidePeekContent from "@/components/TempDesignSystem/SidePeek/Content"
 import Body from "@/components/TempDesignSystem/Text/Body"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import { getIntl } from "@/i18n"
 
-import SidePeekContainer from "../SidePeekContainer"
-
 import styles from "./amenitiesList.module.css"
 
 import { HotelData } from "@/types/hotel"

components/ContentType/HotelPage/SidePeekContainer.tsx

@@ -1,51 +0,0 @@
-"use client"
-
-import { usePathname, useRouter, useSearchParams } from "next/navigation"
-import React, { Children, cloneElement, useEffect, useState } from "react"
-
-import SidePeek from "@/components/TempDesignSystem/SidePeek"
-
-export default function SidePeekContainer({
-  children,
-}: React.PropsWithChildren) {
-  const router = useRouter()
-  const pathname = usePathname()
-  const searchParams = useSearchParams()
-  const [activeSidePeek, setActiveSidePeek] = useState<string | null>(() => {
-    const sidePeekParam = searchParams.get("sidepeek")
-
-    return sidePeekParam || null
-  })
-
-  useEffect(() => {
-    const sidePeekParam = searchParams.get("sidepeek")
-    if (sidePeekParam !== activeSidePeek) {
-      setActiveSidePeek(sidePeekParam)
-    }
-  }, [searchParams, activeSidePeek])
-
-  function handleClose(isOpen: boolean) {
-    if (!isOpen) {
-      setActiveSidePeek(null)
-
-      const nextSearchParams = new URLSearchParams(searchParams.toString())
-      nextSearchParams.delete("sidepeek")
-
-      router.push(`${pathname}?${nextSearchParams}`, { scroll: false })
-    }
-  }
-  const childrenWithIsActive = Children.map(children, (child) => {
-    if (!React.isValidElement(child)) {
-      return child
-    }
-    return cloneElement(child as React.ReactElement, {
-      isActive: child.props.contentKey === activeSidePeek,
-    })
-  })
-
-  return (
-    <SidePeek activeContent={activeSidePeek} onClose={handleClose}>
-      {childrenWithIsActive}
-    </SidePeek>
-  )
-}