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

feat: add packages info to summary

Browse Source
This commit is contained in:
Christel Westerberg
2024-11-12 10:06:13 +01:00
parent dbb5367df2
commit dc3516f4e1
16 changed files with 116 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files

129
components/HotelReservation/EnterDetails/Summary/index.tsx
View File

@@ -35,10 +35,6 @@ function storeSelector(state: EnterDetailsState) {
}
}
function parsePrice(price: string | undefined) {
return price ? parseInt(price) : 0
}
export default function Summary({
showMemberPrice,
room,
@@ -74,53 +70,54 @@ export default function Summary({
color = "red"
}
const additionalPackageCost = room.packages?.reduce(
(acc, curr) => {
acc.local = acc.local + parseInt(curr.localPrice.totalPrice)
acc.euro = acc.euro + parseInt(curr.requestedPrice.totalPrice)
return acc
},
{ local: 0, euro: 0 }
) || { local: 0, euro: 0 }
const roomsPriceLocal = room.localPrice.price + additionalPackageCost.local
const roomsPriceEuro = room.euroPrice.price + additionalPackageCost.euro
useEffect(() => {
setChosenBed(bedType)
setChosenBreakfast(breakfast)
if (breakfast) {
setChosenBreakfast(breakfast)
if (breakfast === BreakfastPackageEnum.NO_BREAKFAST) {
setTotalPrice({
local: {
price: parsePrice(room.localPrice.price),
currency: room.localPrice.currency,
},
euro: {
price: parsePrice(room.euroPrice.price),
currency: room.euroPrice.currency,
},
})
} else {
setTotalPrice({
local: {
price:
parsePrice(room.localPrice.price) +
parsePrice(breakfast.localPrice.totalPrice),
currency: room.localPrice.currency,
},
euro: {
price:
parsePrice(room.euroPrice.price) +
parsePrice(breakfast.requestedPrice.totalPrice),
currency: room.euroPrice.currency,
},
})
}
if (breakfast && breakfast !== BreakfastPackageEnum.NO_BREAKFAST) {
setTotalPrice({
local: {
price: roomsPriceLocal + parseInt(breakfast.localPrice.totalPrice),
currency: room.localPrice.currency,
},
euro: {
price: roomsPriceEuro + parseInt(breakfast.requestedPrice.totalPrice),
currency: room.euroPrice.currency,
},
})
} else {
setTotalPrice({
local: {
price: roomsPriceLocal,
currency: room.localPrice.currency,
},
euro: {
price: roomsPriceEuro,
currency: room.euroPrice.currency,
},
})
}
}, [bedType, breakfast, room.localPrice, room.euroPrice, setTotalPrice])
useEffect(() => {
setTotalPrice({
local: {
price: parsePrice(room.localPrice.price),
currency: room.localPrice.currency,
},
euro: {
price: parsePrice(room.euroPrice.price),
currency: room.euroPrice.currency,
},
})
}, [room.localPrice, room.euroPrice, setTotalPrice])
}, [
bedType,
breakfast,
roomsPriceLocal,
room.localPrice.currency,
room.euroPrice.currency,
roomsPriceEuro,
setTotalPrice,
])
return (
<section className={styles.summary}>
@@ -146,14 +143,12 @@ export default function Summary({
<div className={styles.addOns}>
<div>
<div className={styles.entry}>
<Body color="textHighContrast">{room.roomType}</Body>
<Body color="uiTextHighContrast">{room.roomType}</Body>
<Caption color={color}>
{intl.formatMessage(
{ id: "{amount} {currency}" },
{
amount: intl.formatNumber(
parseInt(room.localPrice.price ?? "0")
),
amount: intl.formatNumber(room.localPrice.price),
currency: room.localPrice.currency,
}
)}
@@ -180,17 +175,37 @@ export default function Summary({
{intl.formatMessage({ id: "Rate details" })}
</Link>
</div>
{room.packages
? room.packages.map((roomPackage) => (
<div className={styles.entry} key={roomPackage.code}>
<div>
<Body color="uiTextHighContrast">
{roomPackage.description}
</Body>
</div>
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{amount} {currency}" },
{
amount: roomPackage.localPrice.price,
currency: roomPackage.localPrice.currency,
}
)}
</Caption>
</div>
))
: null}
{chosenBed ? (
<div className={styles.entry}>
<div>
<Body color="textHighContrast">{chosenBed.description}</Body>
<Body color="uiTextHighContrast">{chosenBed.description}</Body>
<Caption color="uiTextMediumContrast">
{intl.formatMessage({ id: "Based on availability" })}
</Caption>
</div>
<Caption color="uiTextMediumContrast">
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{amount} {currency}" },
{ amount: "0", currency: room.localPrice.currency }
@@ -202,10 +217,10 @@ export default function Summary({
{chosenBreakfast ? (
chosenBreakfast === BreakfastPackageEnum.NO_BREAKFAST ? (
<div className={styles.entry}>
<Body color="textHighContrast">
<Body color="uiTextHighContrast">
{intl.formatMessage({ id: "No breakfast" })}
</Body>
<Caption color="uiTextMediumContrast">
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{amount} {currency}" },
{ amount: "0", currency: room.localPrice.currency }
@@ -214,10 +229,10 @@ export default function Summary({
</div>
) : (
<div className={styles.entry}>
<Body color="textHighContrast">
<Body color="uiTextHighContrast">
{intl.formatMessage({ id: "Breakfast buffet" })}
</Body>
<Caption color="uiTextMediumContrast">
<Caption color="uiTextHighContrast">
{intl.formatMessage(
{ id: "{amount} {currency}" },
{