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

fix: align price formatting

Browse Source
This commit is contained in:
Christel Westerberg
2025-01-02 10:54:19 +01:00
parent 4f58784a22
commit 139accb8ed
26 changed files with 198 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

42
components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx
View File

@@ -10,6 +10,7 @@ import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Footnote from "@/components/TempDesignSystem/Text/Footnote"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { formatPrice } from "@/utils/numberFormatting"
import styles from "./rateSummary.module.css"
@@ -48,9 +49,6 @@ export default function RateSummary({
(pkg) => pkg.code === RoomPackageCodeEnum.PET_ROOM
)
const petRoomPrice = petRoomPackage?.localPrice.totalPrice ?? null
const petRoomCurrency = petRoomPackage?.localPrice.currency ?? null
const checkInDate = new Date(roomsAvailability.checkInDate)
const checkOutDate = new Date(roomsAvailability.checkOutDate)
const nights = dt(checkOutDate).diff(dt(checkInDate), "days")
@@ -106,22 +104,33 @@ export default function RateSummary({
color={isUserLoggedIn ? "red" : "uiTextHighContrast"}
textAlign="right"
>
{priceToShow?.localPrice.pricePerStay}{" "}
{priceToShow?.localPrice.currency}
{formatPrice(
intl,
priceToShow.localPrice.pricePerStay,
priceToShow.localPrice.currency
)}
</Subtitle>
<Body color="uiTextMediumContrast">
{intl.formatMessage({ id: "Approx." })}{" "}
{priceToShow?.requestedPrice?.pricePerStay}{" "}
{priceToShow?.requestedPrice?.currency}
</Body>
{priceToShow?.requestedPrice ? (
<Body color="uiTextMediumContrast">
{intl.formatMessage({ id: "Approx." })}{" "}
{formatPrice(
intl,
priceToShow.requestedPrice.pricePerStay,
priceToShow.requestedPrice.currency
)}
</Body>
) : null}
</div>
<div className={styles.summaryPriceTextMobile}>
<Caption color="uiTextHighContrast">
{intl.formatMessage({ id: "Total price" })}
</Caption>
<Subtitle color={isUserLoggedIn ? "red" : "uiTextHighContrast"}>
{priceToShow?.localPrice.pricePerStay}{" "}
{priceToShow?.localPrice.currency}
{formatPrice(
intl,
priceToShow.localPrice.pricePerStay,
priceToShow.localPrice.currency
)}
</Subtitle>
<Footnote
color="uiTextMediumContrast"
@@ -130,14 +139,19 @@ export default function RateSummary({
{summaryPriceTex}
</Footnote>
</div>
{isPetRoomSelected && (
{isPetRoomSelected && petRoomPackage?.localPrice && (
<div className={styles.petInfo}>
<Body
color="uiTextHighContrast"
textTransform="bold"
textAlign="right"
>
+ {petRoomPrice} {petRoomCurrency}
+{" "}
{formatPrice(
intl,
parseInt(petRoomPackage.localPrice.totalPrice),
petRoomPackage.localPrice.currency
)}
</Body>
<Body color="uiTextMediumContrast" textAlign="right">
{intl.formatMessage({ id: "Pet charge" })}