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

import HotelCard from "@/components/HotelReservation/HotelCard"
import BreakfastSelection from "@/components/HotelReservation/SelectRate/BreakfastSelection"
import FlexibilitySelection from "@/components/HotelReservation/SelectRate/FlexibilitySelection"
import RoomSelection from "@/components/HotelReservation/SelectRate/RoomSelection"

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

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

export default async function SelectRate({ params }: PageArgs<LangParams>) {
  // TODO: pass the correct hotel ID
  const { attributes: hotel } = await serverClient().hotel.getHotel({
    hotelId: "d98c7ab1-ebaa-4102-b351-758daf1ddf55",
    language: params.lang,
  })
  const rooms = await serverClient().hotel.getRates({
    // TODO: pass the correct hotel ID and all other parameters that should be included in the search
    hotelId: "1",
  })

  return (
    <div className={styles.page}>
      <main className={styles.content}>
        <div className={styles.hotelInfo}>
          <HotelCard hotel={hotel} />
        </div>
        <RoomSelection rooms={rooms} />
        <FlexibilitySelection />
        <BreakfastSelection />
      </main>
    </div>
  )
}