Files
web/app/[lang]/(live)/(public)/hotelreservation/select-hotel/page.tsx
2024-08-29 16:07:29 +02:00

56 lines
1.6 KiB
TypeScript

import { serverClient } from "@/lib/trpc/server"
import tempHotelData from "@/server/routers/hotels/tempHotelData.json"
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 { getIntl } from "@/i18n"
import { setLang } from "@/i18n/serverContext"
import styles from "./page.module.css"
import { LangParams, PageArgs } from "@/types/params"
export default async function SelectHotelPage({
params,
}: PageArgs<LangParams>) {
const intl = await getIntl()
setLang(params.lang)
// TODO: Use real endpoint.
const hotel = tempHotelData.data.attributes
const hotels = [hotel]
const hotelFilters = await serverClient().hotel.filters.get({
hotelId: "879",
})
const tempSearchTerm = "Stockholm"
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}>
{hotels.map((hotel) => (
<HotelCard key={hotel.name} hotel={hotel} />
))}
</section>
</main>
)
}