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

Merged in feat/SW-1719-strikethrough-rates (pull request #2266)

Browse Source 
Feat/SW-1719 strikethrough rates

* feat(SW-1719): Strikethrough rate if logged in on regular rate cards

* feat(SW-1719): Strikethrough rate if logged in on rate summary

* feat(SW-1719): Strikethrough rate if logged in on mobile rate summary

* feat(SW-1719): Strikethrough rate if logged in on enter details

* feat(SW-1719): Strikethrough rate support for multiple rooms

* feat(SW-1719): booking receipt fixes on confirmation page

* feat(SW-1719): improve initial total price calculation

* feat: harmonize enter details total price to use one and the same function


Approved-by: Michael Zetterberg
This commit is contained in:
Simon.Emanuelsson
2025-06-13 12:01:16 +00:00
committed by Michael Zetterberg
parent e1ede52014
commit 85acd3453d
52 changed files with 2403 additions and 1380 deletions
Download Patch File Download Diff File Expand all files Collapse all files

73
apps/scandic-web/components/HotelReservation/BookingConfirmation/Receipt/index.tsx
View File

@@ -2,10 +2,14 @@
import { useIntl } from "react-intl"
import { Divider } from "@scandic-hotels/design-system/Divider"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { dt } from "@/lib/dt"
import { useBookingConfirmationStore } from "@/stores/booking-confirmation"
import Body from "@/components/TempDesignSystem/Text/Body"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import useLang from "@/hooks/useLang"
import Room from "./Room"
import TotalPrice from "./TotalPrice"
@@ -13,31 +17,56 @@ import TotalPrice from "./TotalPrice"
import styles from "./receipt.module.css"
export default function Receipt() {
const lang = useLang()
const intl = useIntl()
const rooms = useBookingConfirmationStore((state) => state.rooms)
const { rooms, fromDate, toDate } = useBookingConfirmationStore((state) => ({
rooms: state.rooms,
fromDate: state.fromDate,
toDate: state.toDate,
}))
const totalNights = dt(toDate).diff(fromDate, "days")
const nights = intl.formatMessage(
{
defaultMessage: "{totalNights, plural, one {# night} other {# nights}}",
},
{ totalNights }
)
const filteredRooms = rooms.filter(
(room): room is NonNullable<typeof room> => !!room
)
return (
<section className={styles.receipt}>
<Subtitle type="two">
{intl.formatMessage({
defaultMessage: "Booking summary",
})}
</Subtitle>
<header>
<Typography variant="Title/Subtitle/md">
<h3 className={styles.heading}>
{intl.formatMessage({
defaultMessage: "Booking summary",
})}
</h3>
</Typography>
<Typography variant="Body/Paragraph/mdBold">
<p className={styles.dates}>
{dt(fromDate).locale(lang).format("ddd, D MMM")}
<MaterialIcon icon="arrow_forward" size={15} color="CurrentColor" />
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
{dt(toDate).locale(lang).format("ddd, D MMM")} ({nights})
</p>
</Typography>
</header>
{rooms.map((room, idx) => (
<div key={room ? room.confirmationNumber : `loader-${idx}`}>
{rooms.length > 1 ? (
<Body color="uiTextHighContrast" textTransform={"bold"}>
{intl.formatMessage(
{
defaultMessage: "Room {roomIndex}",
},
{ roomIndex: idx + 1 }
)}
</Body>
) : null}
<Room roomIndex={idx} />
</div>
<Divider color="Border/Divider/Subtle" />
{filteredRooms.map((room, idx) => (
<Room
key={room ? room.confirmationNumber : `loader-${idx}`}
room={room}
roomNumber={idx + 1}
roomCount={rooms.length}
/>
))}
<TotalPrice />