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

import RoomSelection from "@/components/HotelReservation/SelectRate/RoomSelection"
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)

  const hotelData = await serverClient().hotel.hotelData.get({
    hotelId: searchParams.hotel,
    language: params.lang,
    include: ["RoomCategories"],
  })

  const roomConfigurations = await serverClient().hotel.availability.rooms({
    hotelId: parseInt(searchParams.hotel, 10),
    roomStayStartDate: "2024-11-02",
    roomStayEndDate: "2024-11-03",
    adults: 1,
  })

  if (!roomConfigurations) {
    return "No rooms found" // TODO: Add a proper error message
  }

  if (!hotelData) {
    return "No hotel data found" // TODO: Add a proper error message
  }

  const roomCategories = hotelData?.included

  return (
    <div>
      <div className={styles.content}>
        {/* TODO: Add Hotel Listing Card */}
        <div>Hotel Listing Card TBI</div>
        <div className={styles.main}>
          <RoomSelection
            roomConfigurations={roomConfigurations}
            roomCategories={roomCategories ?? []}
          />
        </div>
      </div>
    </div>
  )
}