feat: move room charge to top in price details modal

This commit is contained in:
Simon Emanuelsson
2025-05-08 11:28:22 +02:00
committed by Michael Zetterberg
parent 194a401a56
commit a99e434d84
28 changed files with 264 additions and 136 deletions

View File

@@ -21,7 +21,6 @@ export interface CorporateChequePriceType {
interface CorporateChequePriceProps extends SharedPriceRowProps {
currency: string
nights: number
price: CorporateChequePriceType["corporateCheque"]
}
@@ -57,9 +56,6 @@ export default function CorporateChequePrice({
return (
<>
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
<BoldRow
label={intl.formatMessage({ defaultMessage: "Room charge" })}
value={formatPrice(
@@ -70,6 +66,11 @@ export default function CorporateChequePrice({
additionalCurrency
)}
/>
{nights > 1 ? (
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
) : null}
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
</>
)
}

View File

@@ -57,9 +57,6 @@ export default function RedemptionPrice({
return (
<>
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
<BoldRow
label={intl.formatMessage({ defaultMessage: "Room charge" })}
value={formatPrice(
@@ -70,6 +67,11 @@ export default function RedemptionPrice({
additionalCurrency
)}
/>
{nights > 1 ? (
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
) : null}
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
</>
)
}

View File

@@ -25,6 +25,7 @@ interface RegularPriceProps extends SharedPriceRowProps {
export default function RegularPrice({
bedType,
nights,
packages,
price,
}: RegularPriceProps) {
@@ -48,13 +49,15 @@ export default function RegularPrice({
return (
<>
<RegularRow label={averagePriceTitle} value={avgeragePricePerNight} />
<BedTypeRow bedType={bedType} currency={price.currency} />
<PackagesRow packages={packages} />
<BoldRow
label={intl.formatMessage({ defaultMessage: "Room charge" })}
value={roomCharge}
/>
{nights > 1 ? (
<RegularRow label={averagePriceTitle} value={avgeragePricePerNight} />
) : null}
<BedTypeRow bedType={bedType} currency={price.currency} />
<PackagesRow packages={packages} />
</>
)
}

View File

@@ -1,7 +1,6 @@
"use client"
import { useIntl } from "react-intl"
import { sumPackages } from "@/components/HotelReservation/utils"
import { formatPrice } from "@/utils/numberFormatting"
import BoldRow from "../Bold"
@@ -40,37 +39,20 @@ export default function VoucherPrice({
const averagePriceTitle = intl.formatMessage({
defaultMessage: "Average price per night",
})
const pkgsSum = sumPackages(packages)
let additionalPricePerStay
if (pkgsSum.price) {
additionalPricePerStay = pkgsSum.price
}
const averageAdditionalPricePerNight = additionalPricePerStay
? Math.ceil(additionalPricePerStay / nights)
: null
let averagePricePerNight = `${price.numberOfVouchers} ${CurrencyEnum.Voucher}`
if (averageAdditionalPricePerNight) {
averagePricePerNight = `${averagePricePerNight} + ${averageAdditionalPricePerNight} ${pkgsSum.currency ?? currency}`
}
const averagePricePerNight = `${price.numberOfVouchers / nights} ${CurrencyEnum.Voucher}`
return (
<>
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
<BoldRow
label={intl.formatMessage({ defaultMessage: "Room charge" })}
value={formatPrice(
intl,
price.numberOfVouchers,
CurrencyEnum.Voucher,
additionalPricePerStay,
pkgsSum.currency ?? currency
)}
value={formatPrice(intl, price.numberOfVouchers, CurrencyEnum.Voucher)}
/>
{nights > 1 ? (
<RegularRow label={averagePriceTitle} value={averagePricePerNight} />
) : null}
<BedTypeRow bedType={bedType} currency={currency} />
<PackagesRow packages={packages} />
</>
)
}

View File

@@ -3,5 +3,6 @@ import type { Packages } from "@/types/requests/packages"
export interface SharedPriceRowProps {
bedType: BedTypeSchema | undefined
nights: number
packages: Packages | null
}

View File

@@ -17,6 +17,7 @@ const noVatCurrencies = [
CurrencyEnum.CC,
CurrencyEnum.POINTS,
CurrencyEnum.Voucher,
CurrencyEnum.Unknown,
]
export default function VatRow({ totalPrice, vat }: VatProps) {

View File

@@ -72,15 +72,15 @@ export default function PriceDetailsTable({
const intl = useIntl()
const lang = useLang()
const diff = dt(toDate).diff(fromDate, "days")
const nights = intl.formatMessage(
const nights = dt(toDate).diff(fromDate, "days")
const nightsMsg = intl.formatMessage(
{ defaultMessage: "{totalNights, plural, one {# night} other {# nights}}" },
{ totalNights: diff }
{ totalNights: nights }
)
const arrival = dt(fromDate).locale(lang).format("ddd, D MMM")
const departue = dt(toDate).locale(lang).format("ddd, D MMM")
const duration = ` ${arrival} - ${departue} (${nights})`
const duration = ` ${arrival} - ${departue} (${nightsMsg})`
const allRoomsPackages: Package[] = rooms
.flatMap((r) => r.packages)
@@ -153,26 +153,27 @@ export default function PriceDetailsTable({
<RegularPrice
bedType={room.bedType}
packages={room.packages}
nights={nights}
price={price}
/>
<CorporateChequePrice
bedType={room.bedType}
currency={currency}
nights={diff}
nights={nights}
packages={room.packages}
price={chequePrice}
/>
<RedemptionPrice
bedType={room.bedType}
currency={currency}
nights={diff}
nights={nights}
packages={room.packages}
price={redemptionPrice}
/>
<VoucherPrice
bedType={room.bedType}
currency={currency}
nights={diff}
nights={nights}
packages={room.packages}
price={voucherPrice}
/>
@@ -184,7 +185,7 @@ export default function PriceDetailsTable({
breakfastIncluded={room.breakfastIncluded}
childrenInRoom={room.childrenInRoom}
currency={currency}
nights={diff}
nights={nights}
/>
</Fragment>
)