import { redirect } from "next/navigation"

import { selectRate } from "@/constants/routes/hotelReservation"
import {
  getPackages,
  getProfileSafely,
  getSelectedRoomAvailability,
} from "@/lib/trpc/memoizedRequests"

import Summary from "@/components/HotelReservation/EnterDetails/Summary"
import { SummaryBottomSheet } from "@/components/HotelReservation/EnterDetails/Summary/BottomSheet"
import {
  generateChildrenString,
  getQueryParamsForEnterDetails,
} from "@/components/HotelReservation/SelectRate/RoomSelection/utils"

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

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

export default async function SummaryPage({
  params,
  searchParams,
}: PageArgs<LangParams, SearchParams<SelectRateSearchParams>>) {
  const selectRoomParams = new URLSearchParams(searchParams)
  const { hotel, rooms, fromDate, toDate } =
    getQueryParamsForEnterDetails(selectRoomParams)

  const {
    adults,
    children,
    roomTypeCode,
    rateCode,
    packages: packageCodes,
  } = rooms[0] // TODO: Handle multiple rooms

  const availability = await getSelectedRoomAvailability({
    hotelId: hotel,
    adults,
    children: children ? generateChildrenString(children) : undefined,
    roomStayStartDate: fromDate,
    roomStayEndDate: toDate,
    rateCode,
    roomTypeCode,
    packageCodes,
  })
  const user = await getProfileSafely()

  const packages = packageCodes
    ? await getPackages({
        hotelId: hotel,
        startDate: fromDate,
        endDate: toDate,
        adults,
        children: children?.length,
        packageCodes,
      })
    : null

  if (!availability || !availability.selectedRoom) {
    console.error("No hotel or availability data", availability)
    // TODO: handle this case
    redirect(selectRate(params.lang))
  }

  const prices =
    user && availability.memberRate
      ? {
          local: {
            price: availability.memberRate.localPrice.pricePerStay,
            currency: availability.memberRate.localPrice.currency,
          },
          euro: availability.memberRate.requestedPrice
            ? {
                price: availability.memberRate.requestedPrice.pricePerStay,
                currency: availability.memberRate.requestedPrice.currency,
              }
            : undefined,
        }
      : {
          local: {
            price: availability.publicRate.localPrice.pricePerStay,
            currency: availability.publicRate.localPrice.currency,
          },
          euro: availability.publicRate.requestedPrice
            ? {
                price: availability.publicRate.requestedPrice.pricePerStay,
                currency: availability.publicRate.requestedPrice.currency,
              }
            : undefined,
        }

  return (
    <>
      <div className={styles.mobileSummary}>
        <SummaryBottomSheet>
          <div className={styles.summary}>
            <Summary
              showMemberPrice={!!(user && availability.memberRate)}
              room={{
                roomType: availability.selectedRoom.roomType,
                localPrice: prices.local,
                euroPrice: prices.euro,
                adults,
                children,
                cancellationText: availability.cancellationText,
                packages,
              }}
            />
          </div>
        </SummaryBottomSheet>
      </div>
      <div className={styles.desktopSummary}>
        <div className={styles.hider} />
        <div className={styles.summary}>
          <Summary
            showMemberPrice={!!(user && availability.memberRate)}
            room={{
              roomType: availability.selectedRoom.roomType,
              localPrice: prices.local,
              euroPrice: prices.euro,
              adults,
              children,
              cancellationText: availability.cancellationText,
              packages,
            }}
          />
        </div>
        <div className={styles.shadow} />
      </div>
    </>
  )
}