import { serverClient } from "@/lib/trpc/server"
import tempHotelData from "@/server/routers/hotels/tempHotelData.json"

import RoomSelection from "@/components/HotelReservation/SelectRate/RoomSelection"
import { getIntl } from "@/i18n"
import { setLang } from "@/i18n/serverContext"

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

import { SelectRateSearchParams } from "@/types/components/hotelReservation/selectRate/selectRate"
import { LangParams, PageArgs } from "@/types/params"

export default async function SelectRatePage({
  params,
  searchParams,
}: PageArgs<LangParams & { section: string }, SelectRateSearchParams>) {
  setLang(params.lang)

  // TODO: Use real endpoint.
  const hotel = tempHotelData.data.attributes

  const rates = await serverClient().hotel.rates.get({
    // TODO: pass the correct hotel ID and all other parameters that should be included in the search
    hotelId: searchParams.hotel,
  })

  // const rates = await serverClient().hotel.availability.getForHotel({
  // hotelId: 811,
  // roomStayStartDate: "2024-11-02",
  // roomStayEndDate: "2024-11-03",
  // adults: 1,
  // })
  const intl = await getIntl()

  return (
    <div>
      {/* TODO: Add Hotel Listing Card */}
      <div>Hotel Listing Card TBI</div>

      <div className={styles.content}>
        <div className={styles.main}>
          <RoomSelection
            rates={rates}
            // TODO: Get real value
            nrOfNights={1}
            // TODO: Get real value
            nrOfAdults={1}
          />
        </div>
      </div>
    </div>
  )
}