Files
web/components/HotelReservation/SelectRate/SelectionCard/index.tsx
2025-01-13 13:35:03 +01:00

53 lines
1.3 KiB
TypeScript

"use client"
import { useIntl } from "react-intl"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Title from "@/components/TempDesignSystem/Text/Title"
import { formatPrice } from "@/utils/numberFormatting"
import styles from "./selectionCard.module.css"
import type { SelectionCardProps } from "@/types/components/hotelReservation/selectRate/selectionCard"
export default function SelectionCard({
price,
membersPrice,
currency,
title,
subtext,
}: SelectionCardProps) {
const intl = useIntl()
return (
<div className={styles.card}>
<div>
<Title className={styles.name} as="h4" level="h3">
{title}
</Title>
<div className={styles.nameInfo}>i</div>
</div>
<Caption color="burgundy">{subtext}</Caption>
<div>
<Caption color="burgundy" className={styles.price}>
{intl.formatMessage(
{ id: "{price}/night" },
{
price: formatPrice(intl, price, currency),
}
)}
</Caption>
{membersPrice && (
<Caption color="burgundy" className={styles.membersPrice}>
{intl.formatMessage(
{ id: "Members {price}/night" },
{ price: formatPrice(intl, membersPrice, currency) }
)}
</Caption>
)}
</div>
</div>
)
}