Files
web/components/HotelReservation/HotelCardListing/index.tsx
2024-11-07 13:34:49 +00:00

41 lines
1.2 KiB
TypeScript

"use client"
import { useSearchParams } from "next/navigation"
import { useMemo } from "react"
import Title from "@/components/TempDesignSystem/Text/Title"
import HotelCard from "../HotelCard"
import styles from "./hotelCardListing.module.css"
import { HotelCardListingProps } from "@/types/components/hotelReservation/selectHotel/hotelCardListingProps"
export default function HotelCardListing({ hotelData }: HotelCardListingProps) {
const searchParams = useSearchParams()
const hotels = useMemo(() => {
const appliedFilters = searchParams.get("filters")?.split(",")
if (!appliedFilters || appliedFilters.length === 0) return hotelData
return hotelData.filter((hotel) =>
appliedFilters.every((appliedFilterId) =>
hotel.hotelData.detailedFacilities.some(
(facility) => facility.id.toString() === appliedFilterId
)
)
)
}, [searchParams, hotelData])
return (
<section className={styles.hotelCards}>
{hotels.length ? (
hotels.map((hotel) => (
<HotelCard key={hotel.hotelData.name} hotel={hotel} />
))
) : (
<Title>No hotels found</Title>
)}
</section>
)
}