Files
web/app/[lang]/(live)/(public)/hotelreservation/select-hotel/page.tsx
2024-09-04 09:44:53 +02:00

79 lines
2.4 KiB
TypeScript

import { serverClient } from "@/lib/trpc/server"
import HotelCard from "@/components/HotelReservation/HotelCard"
import HotelFilter from "@/components/HotelReservation/SelectHotel/HotelFilter"
import { ChevronRightIcon } from "@/components/Icons"
import StaticMap from "@/components/Maps/StaticMap"
import Link from "@/components/TempDesignSystem/Link"
import Title from "@/components/TempDesignSystem/Text/Title"
import { getIntl } from "@/i18n"
import { setLang } from "@/i18n/serverContext"
import styles from "./page.module.css"
import { AvailabilityEnum } from "@/types/components/hotelReservation/selectHotel/selectHotel"
import { LangParams, PageArgs } from "@/types/params"
export default async function SelectHotelPage({
params,
}: PageArgs<LangParams>) {
const intl = await getIntl()
setLang(params.lang)
const tempSearchTerm = "Stockholm"
const hotelFilters = await serverClient().hotel.filters.get({
hotelId: "879",
})
const availabilityResponse = await serverClient().hotel.availability.get({
cityId: "8ec4bba3-1c38-4606-82d1-bbe3f6738e54",
roomStayStartDate: "2024-11-02",
roomStayEndDate: "2024-11-03",
adults: 1,
})
if (!availabilityResponse) return null
const { availability } = availabilityResponse
const availableHotels = availability.data
.filter((hotels) => hotels.attributes.status === AvailabilityEnum.Available)
.flatMap((hotels) => hotels.attributes)
console.log(availableHotels)
return (
<main className={styles.main}>
<section>
<StaticMap
city={tempSearchTerm}
width={340}
height={180}
zoomLevel={11}
mapType="roadmap"
/>
<Link className={styles.link} color="burgundy" href="#">
{intl.formatMessage({ id: "Show map" })}
<ChevronRightIcon color="burgundy" />
</Link>
<HotelFilter filters={hotelFilters} />
</section>
<section className={styles.hotelCards}>
{availableHotels.length ? (
availableHotels.map((hotel) => (
<HotelCard
key={hotel.hotelId}
checkInDate={hotel.checkInDate}
checkOutDate={hotel.checkOutDate}
hotelId={hotel.hotelId}
price={hotel.bestPricePerNight}
/>
))
) : (
<Title>No hotels found</Title>
)}
</section>
</main>
)
}