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

feat(SW-697): Update package structure on price from API

Browse Source
This commit is contained in:
Pontus Dreij
2024-11-04 14:20:46 +01:00
parent f836695919
commit 7f9af6c12e
14 changed files with 178 additions and 54 deletions
Download Patch File Download Diff File Expand all files Collapse all files

44
components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/PriceList/index.tsx
View File

@@ -1,9 +1,12 @@
import { differenceInCalendarDays } from "date-fns"
import { useIntl } from "react-intl"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import { calculatePricesPerNight } from "./utils"
import styles from "./priceList.module.css"
import { PriceListProps } from "@/types/components/hotelReservation/selectRate/flexibilityOption"
@@ -11,6 +14,7 @@ import { PriceListProps } from "@/types/components/hotelReservation/selectRate/f
export default function PriceList({
publicPrice = {},
memberPrice = {},
petRoomPackage,
}: PriceListProps) {
const intl = useIntl()
@@ -19,15 +23,45 @@ export default function PriceList({
const { localPrice: memberLocalPrice, requestedPrice: memberRequestedPrice } =
memberPrice
const petRoomLocalPrice = petRoomPackage?.localPrice
const petRoomRequestedPrice = petRoomPackage?.requestedPrice
const showRequestedPrice = publicRequestedPrice && memberRequestedPrice
const searchParams = new URLSearchParams(window.location.search)
const fromDate = searchParams.get("fromDate")
const toDate = searchParams.get("toDate")
let nights = 1
if (fromDate && toDate) {
nights = differenceInCalendarDays(new Date(fromDate), new Date(toDate))
}
const {
totalPublicLocalPricePerNight,
totalMemberLocalPricePerNight,
totalPublicRequestedPricePerNight,
totalMemberRequestedPricePerNight,
} = calculatePricesPerNight({
publicLocalPrice,
memberLocalPrice,
publicRequestedPrice,
memberRequestedPrice,
petRoomLocalPrice,
petRoomRequestedPrice,
nights,
})
return (
<dl className={styles.priceList}>
<div className={styles.priceRow}>
<dt>
<Caption
type="bold"
color={publicLocalPrice ? "uiTextHighContrast" : "disabled"}
color={
totalPublicLocalPricePerNight ? "uiTextHighContrast" : "disabled"
}
>
{intl.formatMessage({ id: "Standard price" })}
</Caption>
@@ -36,7 +70,7 @@ export default function PriceList({
{publicLocalPrice ? (
<div className={styles.price}>
<Subtitle type="two" color="uiTextHighContrast">
{publicLocalPrice.pricePerNight}
{totalPublicLocalPricePerNight}
</Subtitle>
<Body color="uiTextHighContrast" textTransform="bold">
{publicLocalPrice.currency}
@@ -63,7 +97,7 @@ export default function PriceList({
{memberLocalPrice ? (
<div className={styles.price}>
<Subtitle type="two" color="red">
{memberLocalPrice.pricePerNight}
{totalMemberLocalPricePerNight}
</Subtitle>
<Body color="red" textTransform="bold">
{memberLocalPrice.currency}
@@ -91,8 +125,8 @@ export default function PriceList({
<dd>
{showRequestedPrice ? (
<Caption color="uiTextMediumContrast">
{publicRequestedPrice.pricePerNight}/
{memberRequestedPrice.pricePerNight}{" "}
{totalPublicRequestedPricePerNight}/
{totalMemberRequestedPricePerNight}{" "}
{publicRequestedPrice.currency}
</Caption>
) : (

46
components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/PriceList/utils.ts Normal file
View File

@@ -0,0 +1,46 @@
import type { CalculatePricesPerNightProps } from "@/types/components/hotelReservation/selectRate/roomCard"
export function calculatePricesPerNight({
publicLocalPrice,
memberLocalPrice,
publicRequestedPrice,
memberRequestedPrice,
petRoomLocalPrice,
petRoomRequestedPrice,
nights,
}: CalculatePricesPerNightProps) {
const totalPublicLocalPricePerNight = publicLocalPrice
? petRoomLocalPrice
? Number(publicLocalPrice.pricePerNight) +
Number(petRoomLocalPrice.price) / nights
: Number(publicLocalPrice.pricePerNight)
: undefined
const totalMemberLocalPricePerNight = memberLocalPrice
? petRoomLocalPrice
? Number(memberLocalPrice.pricePerNight) +
Number(petRoomLocalPrice.price) / nights
: Number(memberLocalPrice.pricePerNight)
: undefined
const totalPublicRequestedPricePerNight = publicRequestedPrice
? petRoomRequestedPrice
? Number(publicRequestedPrice.pricePerNight) +
Number(petRoomRequestedPrice.price) / nights
: Number(publicRequestedPrice.pricePerNight)
: undefined
const totalMemberRequestedPricePerNight = memberRequestedPrice
? petRoomRequestedPrice
? Number(memberRequestedPrice.pricePerNight) +
Number(petRoomRequestedPrice.price) / nights
: Number(memberRequestedPrice.pricePerNight)
: undefined
return {
totalPublicLocalPricePerNight,
totalMemberLocalPricePerNight,
totalPublicRequestedPricePerNight,
totalMemberRequestedPricePerNight,
}
}

7
components/HotelReservation/SelectRate/RoomSelection/FlexibilityOption/index.tsx
View File

@@ -20,6 +20,7 @@ export default function FlexibilityOption({
roomType,
roomTypeCode,
features,
petRoomPackage,
handleSelectRate,
}: FlexibilityOptionProps) {
const [rootDiv, setRootDiv] = useState<Element | undefined>(undefined)
@@ -113,7 +114,11 @@ export default function FlexibilityOption({
<Caption color="uiTextHighContrast">{name}</Caption>
<Caption color="uiTextPlaceholder">({paymentTerm})</Caption>
</div>
<PriceTable publicPrice={publicPrice} memberPrice={memberPrice} />
<PriceTable
publicPrice={publicPrice}
memberPrice={memberPrice}
petRoomPackage={petRoomPackage}
/>
<CheckCircleIcon
color="blue"
className={styles.checkIcon}