web/apps/scandic-web/components/HotelReservation/BookingConfirmation/index.tsx

import { notFound } from "next/navigation"

import { getBookingConfirmation } from "@/lib/trpc/memoizedRequests"
import { encrypt } from "@/server/routers/utils/encryption"

import HotelDetails from "@/components/HotelReservation/BookingConfirmation/HotelDetails"
import PaymentDetails from "@/components/HotelReservation/BookingConfirmation/PaymentDetails"
import Promos from "@/components/HotelReservation/BookingConfirmation/Promos"
import Receipt from "@/components/HotelReservation/BookingConfirmation/Receipt"
import Rooms from "@/components/HotelReservation/BookingConfirmation/Rooms"
import SidePanel from "@/components/HotelReservation/SidePanel"
import Divider from "@/components/TempDesignSystem/Divider"
import { getIntl } from "@/i18n"
import BookingConfirmationProvider from "@/providers/BookingConfirmationProvider"

import Alerts from "./Alerts"
import Confirmation from "./Confirmation"
import Tracking from "./Tracking"
import { mapRoomState } from "./utils"

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

import type { BookingConfirmationProps } from "@/types/components/hotelReservation/bookingConfirmation/bookingConfirmation"

export default async function BookingConfirmation({
  confirmationNumber,
}: BookingConfirmationProps) {
  const bookingConfirmation = await getBookingConfirmation(confirmationNumber)

  if (!bookingConfirmation) {
    return notFound()
  }
  const { booking, hotel, room } = bookingConfirmation
  if (!room) {
    return notFound()
  }

  const refId = encrypt(
    `${booking.confirmationNumber},${booking.guest.lastName}`
  )

  const intl = await getIntl()
  return (
    <BookingConfirmationProvider
      bookingCode={booking.bookingCode}
      currencyCode={booking.currencyCode}
      fromDate={booking.checkInDate}
      toDate={booking.checkOutDate}
      rooms={[
        mapRoomState(booking, room, intl),
        // null represents "known but not yet fetched rooms" and is used to render placeholders correctly
        ...Array(booking.linkedReservations.length).fill(null),
      ]}
      vat={booking.vatPercentage}
    >
      <Confirmation booking={booking} hotel={hotel} room={room} refId={refId}>
        <div className={styles.booking}>
          <Alerts booking={booking} />
          <Rooms
            booking={booking}
            checkInTime={hotel.hotelFacts.checkin.checkInTime}
            checkOutTime={hotel.hotelFacts.checkin.checkOutTime}
            mainRoom={room}
            linkedReservations={booking.linkedReservations}
          />
          <PaymentDetails />
          <Divider color="primaryLightSubtle" />
          <HotelDetails hotel={hotel} />
          <Promos
            confirmationNumber={booking.confirmationNumber}
            hotelId={hotel.operaId}
            lastName={booking.guest.lastName}
          />
          <div className={styles.mobileReceipt}>
            <Receipt />
          </div>
        </div>
        <aside className={styles.aside}>
          <SidePanel variant="receipt">
            <Receipt />
          </SidePanel>
        </aside>
      </Confirmation>
      <Tracking bookingConfirmation={bookingConfirmation} />
    </BookingConfirmationProvider>
  )
}