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

feat: add multiroom tracking to booking flow

Browse Source
This commit is contained in:
Simon Emanuelsson
2025-03-05 11:53:05 +01:00
parent 540402b969
commit 1812591903
72 changed files with 2277 additions and 1308 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/MultiRoomWrapper/SelectedRoomPanel/index.tsx
View File

@@ -20,7 +20,6 @@ export default function SelectedRoomPanel() {
const intl = useIntl()
const { isUserLoggedIn, roomCategories } = useRatesStore((state) => ({
isUserLoggedIn: state.isUserLoggedIn,
rateDefinitions: state.roomsAvailability?.rateDefinitions,
roomCategories: state.roomCategories,
}))
const {

53
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomCard/index.tsx
View File

@@ -75,24 +75,18 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
const searchParams = useSearchParams()
const bookingCode = searchParams.get("bookingCode")
const {
hotelId,
hotelType,
isUserLoggedIn,
petRoomPackage,
rateDefinitions,
roomCategories,
} = useRatesStore((state) => ({
hotelId: state.booking.hotelId,
hotelType: state.hotelType,
isUserLoggedIn: state.isUserLoggedIn,
petRoomPackage: state.petRoomPackage,
rateDefinitions: state.roomsAvailability?.rateDefinitions,
roomCategories: state.roomCategories,
}))
const { isMainRoom, roomNr, selectedPackage } = useRoomContext()
const { hotelId, hotelType, isUserLoggedIn, petRoomPackage, roomCategories } =
useRatesStore((state) => ({
hotelId: state.booking.hotelId,
hotelType: state.hotelType,
isUserLoggedIn: state.isUserLoggedIn,
petRoomPackage: state.petRoomPackage,
roomCategories: state.roomCategories,
}))
const { isMainRoom, roomAvailability, roomNr, selectedPackage } =
useRoomContext()
if (!rateDefinitions) {
if (!roomAvailability || !("rateDefinitions" in roomAvailability)) {
return null
}
@@ -217,16 +211,16 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
<Caption color="uiTextMediumContrast">
{occupancy.max === occupancy.min
? intl.formatMessage(
{ id: "{guests, plural, one {# guest} other {# guests}}" },
{ guests: occupancy.max }
)
{ id: "{guests, plural, one {# guest} other {# guests}}" },
{ guests: occupancy.max }
)
: intl.formatMessage(
{ id: "{min}-{max} guests" },
{
min: occupancy.min,
max: occupancy.max,
}
)}
{ id: "{min}-{max} guests" },
{
min: occupancy.min,
max: occupancy.max,
}
)}
</Caption>
)}
<RoomSize roomSize={roomSize} />
@@ -282,7 +276,10 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
const isAvailable =
product.public ||
(product.member && isUserLoggedIn && isMainRoom)
const rateDefinition = getRateDefinition(product, rateDefinitions)
const rateDefinition = getRateDefinition(
product,
roomAvailability.rateDefinitions
)
return (
<FlexibilityOption
key={product.rate}
@@ -296,7 +293,7 @@ export default function RoomCard({ roomConfiguration }: RoomCardProps) {
title={rateTitle}
rateTitle={
product.public &&
product.public?.rateType !== RateTypeEnum.Regular
product.public?.rateType !== RateTypeEnum.Regular
? rateDefinition?.title
: undefined
}

6
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/RoomSelectionPanel/RoomTypeFilter/index.tsx
View File

@@ -27,7 +27,7 @@ export default function RoomTypeFilter() {
const intl = useIntl()
const availableRooms = rooms.filter(
(r) => r.status === AvailabilityEnum.Available
(room) => room.status === AvailabilityEnum.Available
).length
// const tooltipText = intl.formatMessage({
@@ -48,7 +48,7 @@ export default function RoomTypeFilter() {
id: "{availableRooms}/{numberOfRooms, plural, one {# room type} other {# room types}} available",
},
{
availableRooms: availableRooms,
availableRooms,
numberOfRooms: totalRooms,
}
)
@@ -81,7 +81,7 @@ export default function RoomTypeFilter() {
aria-label={option.description}
className={styles.radio}
id={option.code}
key={option.itemCode}
key={option.code}
>
<div className={styles.circle} />
<Caption color="uiTextHighContrast">{option.description}</Caption>

22
apps/scandic-web/components/HotelReservation/SelectRate/RoomsContainer/Rooms/index.tsx
View File

@@ -25,19 +25,21 @@ export default function Rooms() {
departureDate: state.booking.toDate,
hotelId: state.booking.hotelId,
rooms: state.rooms,
visibleRooms: state.allRooms,
visibleRooms: state.roomConfigurations,
}))
useEffect(() => {
const pricesWithCurrencies = visibleRooms.flatMap((room) =>
room.products
.filter((product) => product.member || product.public)
.map((product) => ({
currency: (product.public?.localPrice.currency ||
product.member?.localPrice.currency)!,
price: (product.public?.localPrice.pricePerNight ||
product.member?.localPrice.pricePerNight)!,
}))
const pricesWithCurrencies = visibleRooms.flatMap((roomConfiguration) =>
roomConfiguration.flatMap((room) =>
room.products
.filter((product) => product.member || product.public)
.map((product) => ({
currency: (product.public?.localPrice.currency ||
product.member?.localPrice.currency)!,
price: (product.public?.localPrice.pricePerNight ||
product.member?.localPrice.pricePerNight)!,
}))
)
)
const lowestPrice = pricesWithCurrencies.reduce(
(minPrice, { price }) => Math.min(minPrice, price),