feat(LOY-501): add sorting to Reward Night Table * feat(LOY-501): add sorting using Tanstack Table Approved-by: Chuma Mcphoy (We Ahead)
40 lines
1.1 KiB
TypeScript
40 lines
1.1 KiB
TypeScript
"use client"
|
|
import { useIntl } from "react-intl"
|
|
|
|
import { Typography } from "@scandic-hotels/design-system/Typography"
|
|
|
|
import { formatDate, type HotelData } from "./util"
|
|
|
|
import styles from "./rewardNights.module.css"
|
|
|
|
export function OfferPrice(offer: HotelData["rewardNight"]["campaign"]) {
|
|
const intl = useIntl()
|
|
|
|
return (
|
|
<div className={styles.offerPrice}>
|
|
<Typography variant="Body/Paragraph/mdBold">
|
|
<p className={styles.highlightedText}>
|
|
{intl.formatMessage({
|
|
id: "rewardNights.offerPrice",
|
|
defaultMessage: "Offer price",
|
|
})}
|
|
</p>
|
|
</Typography>
|
|
<Typography variant="Label/xsBold">
|
|
<p>
|
|
{intl.formatMessage({
|
|
id: "rewardNights.stayBetween:",
|
|
defaultMessage: "Stay between:",
|
|
})}
|
|
</p>
|
|
</Typography>
|
|
<Typography variant="Label/xsRegular">
|
|
<time>
|
|
{/* eslint-disable-next-line formatjs/no-literal-string-in-jsx */}
|
|
{formatDate(offer.start)} - {formatDate(offer.end)}
|
|
</time>
|
|
</Typography>
|
|
</div>
|
|
)
|
|
}
|