SW-454 Use the API on select room page

This commit is contained in:
Niclas Edenvin
2024-10-08 15:22:51 +02:00
parent 4b9a6d2e8e
commit baf6ed9f2b
12 changed files with 348 additions and 92 deletions

View File

@@ -9,17 +9,23 @@ import styles from "./flexibilityOption.module.css"
import { FlexibilityOptionProps } from "@/types/components/hotelReservation/selectRate/flexibilityOption"
export default function FlexibilityOption({
currency,
standardPrice,
memberPrice,
product,
name,
value,
paymentTerm,
}: FlexibilityOptionProps) {
const intl = useIntl()
if (!product) {
// TODO: Implement empty state when this rate can't be booked
return <div>TBI: Rate not available</div>
}
return (
<label>
<input type="radio" name="flexibility" value={value} />
<input
type="radio"
name="rateCode"
value={product.productType.public.rateCode}
/>
<div className={styles.card}>
<div className={styles.header}>
<Body>{name}</Body>
@@ -29,15 +35,30 @@ export default function FlexibilityOption({
<div>
<dt>{intl.formatMessage({ id: "Standard price" })}</dt>
<dd>
{standardPrice} {currency}
{product.productType.public.localPrice.pricePerNight}{" "}
{product.productType.public.localPrice.currency}/
{intl.formatMessage({ id: "night" })}
</dd>
</div>
<div>
<dt>{intl.formatMessage({ id: "Member price" })}</dt>
<dd>
{memberPrice} {currency}
{product.productType.member.localPrice.pricePerNight}{" "}
{product.productType.member.localPrice.currency}/
{intl.formatMessage({ id: "night" })}
</dd>
</div>
{product.productType.public.requestedPrice &&
product.productType.member.requestedPrice && (
<div>
<dt>{intl.formatMessage({ id: "Approx." })}</dt>
<dd>
{product.productType.public.requestedPrice.pricePerNight}/
{product.productType.member.requestedPrice.pricePerNight}{" "}
{product.productType.public.requestedPrice.currency}
</dd>
</div>
)}
</dl>
</div>
</label>