import { serverClient } from "@/lib/trpc/server"

import HotelCard from "@/components/HotelReservation/HotelCard"
import HotelFilter from "@/components/HotelReservation/SelectHotel/HotelFilter"

import styles from "./page.module.css"

import { LangParams, PageArgs } from "@/types/params"

export default async function SelectHotelPage({
  params,
}: PageArgs<LangParams>) {
  const { attributes } = await serverClient().hotel.getHotel({
    hotelId: "d98c7ab1-ebaa-4102-b351-758daf1ddf55",
    language: params.lang,
  })
  const hotels = [attributes]

  return (
    <main className={styles.main}>
      <HotelFilter />
      <section className={styles.section}>
        {hotels.map((hotel) => (
          <HotelCard key={hotel.name} hotel={hotel} />
        ))}
      </section>
    </main>
  )
}