web/packages/booking-flow/lib/components/BookingConfirmation/Confirmation/index.tsx

"use client"

import { useRef } from "react"

import { Header } from "../Header"

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

import type { BookingConfirmation } from "@scandic-hotels/trpc/types/bookingConfirmation"

import type { BookingConfirmationRoom } from "../../../types/components/bookingConfirmation/bookingConfirmation"

interface ConfirmationProps
  extends Pick<BookingConfirmation, "booking" | "hotel"> {
  room: BookingConfirmationRoom
}

export function Confirmation({
  booking,
  hotel,
  children,
}: React.PropsWithChildren<ConfirmationProps>) {
  const mainRef = useRef<HTMLElement | null>(null)

  return (
    <main className={styles.main} ref={mainRef}>
      <Header booking={booking} hotel={hotel} mainRef={mainRef} />
      {children}
    </main>
  )
}