Files
web/apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/index.tsx
2025-05-02 12:44:07 +02:00

69 lines
1.8 KiB
TypeScript

import { Typography } from "@scandic-hotels/design-system/Typography"
import { getIntl } from "@/i18n"
import { LinkedReservation } from "./LinkedReservation"
import Room from "./Room"
import styles from "./rooms.module.css"
import type { BookingConfirmationRoomsProps } from "@/types/components/hotelReservation/bookingConfirmation/rooms"
async function RoomTitle({ nr }: { nr: number }) {
const intl = await getIntl()
return (
<Typography variant="Title/Subtitle/md">
<h2 className={styles.roomTitle}>
{intl.formatMessage(
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: nr }
)}
</h2>
</Typography>
)
}
export default async function Rooms({
booking,
checkInTime,
checkOutTime,
mainRoom,
}: BookingConfirmationRoomsProps) {
const { linkedReservations } = booking
return (
<section className={styles.rooms}>
<div className={styles.room}>
{linkedReservations.length ? <RoomTitle nr={1} /> : null}
<Room
checkInDate={booking.checkInDate}
checkOutDate={booking.checkOutDate}
checkInTime={checkInTime}
checkOutTime={checkOutTime}
confirmationNumber={booking.confirmationNumber}
guaranteeInfo={booking.guaranteeInfo}
guest={booking.guest}
img={mainRoom.images[0]}
rateDefinition={booking.rateDefinition}
roomName={mainRoom.name}
/>
</div>
{linkedReservations.map((reservation, idx) => (
<div className={styles.room} key={reservation.confirmationNumber}>
<RoomTitle nr={idx + 2} />
<LinkedReservation
checkInTime={checkInTime}
checkOutTime={checkOutTime}
refId={reservation.refId}
roomIndex={idx + 1}
/>
</div>
))}
</section>
)
}