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

Merged in feat/sw-1602-preliminary-receipt (pull request #1595)

Browse Source 
feat/sw-1602 preliminary receipt

* feat(sw-1602): create page for preliminary receipt

* Add link to my stay page


Approved-by: Pontus Dreij
This commit is contained in:
Niclas Edenvin
2025-03-24 07:55:15 +00:00
parent c4f8ff8bb5
commit efa7336ebd
21 changed files with 902 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
apps/scandic-web/components/HotelReservation/MyStay/Receipt/Footer/index.tsx Normal file
View File

@@ -0,0 +1,147 @@
import { Typography } from "@scandic-hotels/design-system/Typography"
import { dt } from "@/lib/dt"
import { getIntl } from "@/i18n"
import { getLang } from "@/i18n/serverContext"
import { getNumberOfNights } from "@/utils/dateFormatting"
import styles from "./footer.module.css"
import type { FooterProps } from "@/types/components/hotelReservation/myStay/receipt"
import { RoomPackageCodeEnum } from "@/types/components/hotelReservation/selectRate/roomFilter"
export default async function Footer({ booking, room }: FooterProps) {
const intl = await getIntl()
const lang = getLang()
const petRoomPackage = booking.packages.find(
(p) => p.code === RoomPackageCodeEnum.PET_ROOM
)
return (
<dl className={styles.dl}>
<div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Reference number" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>{booking.confirmationNumber}</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Room" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>{room?.name}</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Rate" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>{booking.rateDefinition.title}</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Check-in" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>
{dt(booking.checkInDate).locale(lang).format("ddd, D MMM YYYY")}
</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Check-out" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>
{dt(booking.checkOutDate).locale(lang).format("ddd, D MMM YYYY")}
</dd>
</Typography>
</div>
</div>
<div className={styles.rightColumn}>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Number of nights" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>
{getNumberOfNights(booking.checkInDate, booking.checkOutDate)}
</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Number of guests" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>
{intl.formatMessage(
{ id: "{adults, plural, one {# adult} other {# adults}}" },
{ adults: booking.adults }
)}
{booking.childrenAges.length > 0 && (
<>
{", "}
{intl.formatMessage(
{
id: "{children, plural, one {# child} other {# children}}",
},
{ children: booking.childrenAges.length }
)}
</>
)}
</dd>
</Typography>
</div>
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Bed type" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>{room?.bedType.mainBed.description}</dd>
</Typography>
</div>
{petRoomPackage && (
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Room classification" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>{intl.formatMessage({ id: "Pet-friendly" })}</dd>
</Typography>
</div>
)}
<div>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dt>{intl.formatMessage({ id: "Breakfast" })}</dt>
</Typography>
<Typography variant="Body/Supporting text (caption)/smRegular">
<dd>
{booking.rateDefinition.breakfastIncluded
? intl.formatMessage({ id: "Included" })
: intl.formatMessage({ id: "Not included" })}
</dd>
</Typography>
</div>
</div>
</dl>
)
}