feat(SW-1901): Adjusted parking pricing on hotel pages

Approved-by: Michael Zetterberg
Approved-by: Matilda Landström
This commit is contained in:
Erik Tiekstra
2025-06-03 05:27:41 +00:00
parent 726ea44105
commit 958906d3bf

View File

@@ -22,41 +22,60 @@ export default function ParkingPrices({
}: ParkingPricesProps) {
const intl = useIntl()
return freeParking ? (
<Typography variant="Body/Paragraph/mdBold">
<p className={styles.wrapper}>
{intl.formatMessage({ defaultMessage: "Free parking" })}
</p>
</Typography>
) : (
<dl className={styles.wrapper}>
{pricing?.map((parking) => (
<div key={parking.period} className={styles.period}>
if (freeParking) {
return (
<Typography variant="Body/Paragraph/mdBold">
<p className={styles.wrapper}>
{intl.formatMessage({ defaultMessage: "Free parking" })}
</p>
</Typography>
)
}
const filteredPricing = pricing.filter((price) => price.amount > 0)
if (filteredPricing.length === 0) {
return (
<dl className={styles.wrapper}>
<div className={styles.period}>
<div className={styles.information}>
<Typography variant="Body/Paragraph/mdBold">
<dt>{getPeriod(intl, parking.period)}</dt>
<dt>{getPeriod(intl, "Hour")}</dt>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<dd>
{parking.amount
? formatPrice(intl, parking.amount, currency)
: intl.formatMessage({
defaultMessage: "At a cost",
})}
{intl.formatMessage({
defaultMessage: "At a cost",
})}
</dd>
</Typography>
</div>
{parking.startTime &&
parking.endTime &&
parking.period !== Periods.allDay && (
<Typography variant="Body/Paragraph/mdRegular">
<div className={styles.information}>
<dt>{intl.formatMessage({ defaultMessage: "From" })}</dt>
{/* eslint-disable formatjs/no-literal-string-in-jsx */}
<dd>{`${parking.startTime}-${parking.endTime}`}</dd>
</div>
</Typography>
)}
</div>
</dl>
)
}
return (
<dl className={styles.wrapper}>
{filteredPricing.map(({ period, amount, startTime, endTime }) => (
<div key={period} className={styles.period}>
<div className={styles.information}>
<Typography variant="Body/Paragraph/mdBold">
<dt>{getPeriod(intl, period)}</dt>
</Typography>
<Typography variant="Body/Paragraph/mdRegular">
<dd>{formatPrice(intl, amount, currency)}</dd>
</Typography>
</div>
{startTime && endTime && period !== Periods.allDay ? (
<Typography variant="Body/Paragraph/mdRegular">
<div className={styles.information}>
<dt>{intl.formatMessage({ defaultMessage: "From" })}</dt>
{/* eslint-disable formatjs/no-literal-string-in-jsx */}
<dd>{`${startTime}-${endTime}`}</dd>
</div>
</Typography>
) : null}
</div>
))}
</dl>