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

Merged in feat/SW-1648-booking-code-my-stay (pull request #1447)

Browse Source 
feat(SW-1648): add booking code on my stay

* feat(SW-1648): add booking code on my stay


Approved-by: Niclas Edenvin
This commit is contained in:
Bianca Widstam
2025-02-28 14:09:23 +00:00
parent 6804b52d31
commit 4fc25e42b5
13 changed files with 73 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/index.tsx
View File

@@ -6,6 +6,7 @@ import { useIntl } from "react-intl"
import { BookingStatusEnum } from "@/constants/booking"
import { dt } from "@/lib/dt"
import { BookingCodeIcon } from "@/components/Icons"
import CrossCircleIcon from "@/components/Icons/CrossCircle"
import Button from "@/components/TempDesignSystem/Button"
import Divider from "@/components/TempDesignSystem/Divider"
@@ -137,6 +138,17 @@ export function ReferenceCard({ booking, hotel }: ReferenceCardProps) {
{formatPrice(intl, totalPrice, currencyCode)}
</Caption>
</div>
{booking?.bookingCode && (
<div className={styles.referenceRow}>
<Caption>{intl.formatMessage({ id: "Booking code" })}</Caption>
<IconChip color={"blue"} icon={<BookingCodeIcon color="blue" />}>
<Caption className={styles.bookingCode} color="blue">
<strong>{intl.formatMessage({ id: "Booking code" })}</strong>
{booking.bookingCode}
</Caption>
</IconChip>
</div>
)}
{!showCancelButton && (
<div className={styles.referenceRow}>
<IconChip

6
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/referenceCard.module.css
View File

@@ -11,6 +11,7 @@
.referenceRow {
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: var(--Spacing-x-one-and-half);
}
@@ -34,6 +35,11 @@
display: none;
}
.bookingCode {
display: flex;
gap: var(--Spacing-x1);
}
@media (min-width: 768px) {
.titleMobile {
display: none;

13
apps/scandic-web/components/HotelReservation/MyStay/Room/index.tsx
View File

@@ -7,6 +7,7 @@ import { dt } from "@/lib/dt"
import { getIconForFeatureCode } from "@/components/HotelReservation/utils"
import {
BedDoubleIcon,
BookingCodeIcon,
CoffeeIcon,
ContractIcon,
DoorOpenIcon,
@@ -14,7 +15,9 @@ import {
} from "@/components/Icons"
import RocketLaunch from "@/components/Icons/Refresh"
import Image from "@/components/Image"
import IconChip from "@/components/TempDesignSystem/IconChip"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"
import { formatPrice } from "@/utils/numberFormatting"
@@ -241,8 +244,16 @@ export function Room({ booking, room, hotel, user }: RoomProps) {
</div>
<GuestDetails user={user} booking={booking} isMobile={false} />
</div>
<div className={styles.bookingInformation}>
<div className={styles.bookingCode}></div>
{booking?.bookingCode && (
<IconChip color={"blue"} icon={<BookingCodeIcon color="blue" />}>
<Caption className={styles.bookingCode} color="blue">
<strong>{intl.formatMessage({ id: "Booking code" })}</strong>
{booking.bookingCode}
</Caption>
</IconChip>
)}
<div className={styles.priceDetails}>
<div className={styles.price}>
<Body color="uiTextHighContrast">

6
apps/scandic-web/components/HotelReservation/MyStay/Room/room.module.css
View File

@@ -6,6 +6,11 @@
padding: var(--Spacing-x3) 0;
}
.bookingCode {
display: flex;
gap: var(--Spacing-x1);
}
@media (min-width: 768px) {
.room {
background-color: transparent;
@@ -261,6 +266,7 @@
.bookingInformation {
flex-direction: row;
justify-content: space-between;
align-items: flex-start;
}
}