scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/SW-1652-confirmation-page-multiroom (pull request #1404)

Browse Source 
feat(SW-1652): Fetching additional rooms on confirmation page

* feat(SW-1652): Fetching additional rooms on confirmation page


Approved-by: Tobias Johansson
This commit is contained in:
Arvid Norlin
2025-02-26 12:42:54 +00:00
parent a15936688b
commit d5e5b9a526
24 changed files with 606 additions and 425 deletions
Download Patch File Download Diff File Expand all files Collapse all files

102
apps/scandic-web/components/HotelReservation/BookingConfirmation/Rooms/LinkedReservation/index.tsx
View File

@@ -1,92 +1,22 @@
"use client "
import { useIntl } from "react-intl"
import { serverClient } from "@/lib/trpc/server"
import { dt } from "@/lib/dt"
import Room from "../Room"
import Body from "@/components/TempDesignSystem/Text/Body"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"
export async function LinkedReservation({
confirmationNumber,
}: {
confirmationNumber: string
}) {
const confirmation = await serverClient().booking.confirmation({
confirmationNumber,
})
import styles from "./linkedReservation.module.css"
const room = confirmation?.room
const booking = confirmation?.booking
import type { LinkedReservationSchema } from "@/types/components/hotelReservation/bookingConfirmation/rooms"
if (!booking || !room) {
return <div>Something went wrong, try again</div>
}
interface LinkedReservationProps {
linkedReservation: LinkedReservationSchema
roomIndex: number
}
export function LinkedReservation({
linkedReservation,
roomIndex,
}: LinkedReservationProps) {
const intl = useIntl()
const lang = useLang()
const { checkinDate, checkoutDate, confirmationNumber, adults, children } =
linkedReservation
const fromDate = dt(checkinDate).locale(lang)
const toDate = dt(checkoutDate).locale(lang)
return (
<div className={styles.reservation}>
<Subtitle color="uiTextHighContrast" type="two">
{intl.formatMessage(
{
id: "Room {roomIndex}",
},
{
roomIndex: roomIndex + 2,
}
)}
</Subtitle>
<ul className={styles.details}>
<li className={styles.listItem}>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Booking number" })}
</Body>
<Body color="uiTextHighContrast">{confirmationNumber}</Body>
</li>
<li className={styles.listItem}>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Check-in" })}
</Body>
<Body color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{checkInDate} from {checkInTime}" },
{
checkInDate: fromDate.format("ddd, D MMM"),
checkInTime: fromDate.format("HH:mm"),
}
)}
</Body>
</li>
<li className={styles.listItem}>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Check-out" })}
</Body>
<Body color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{checkOutDate} from {checkOutTime}" },
{
checkOutDate: toDate.format("ddd, D MMM"),
checkOutTime: toDate.format("HH:mm"),
}
)}
</Body>
</li>
<li className={styles.listItem}>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Adults" })}
</Body>
<Body color="uiTextHighContrast">{adults}</Body>
</li>
<li className={styles.listItem}>
<Body color="uiTextPlaceholder">
{intl.formatMessage({ id: "Children" })}
</Body>
<Body color="uiTextHighContrast">{children}</Body>
</li>
</ul>
</div>
)
return <Room booking={booking} img={room.images[0]} roomName={room.name} />
}