Files
web/apps/scandic-web/components/Blocks/DynamicContent/Points/EarnAndBurn/AwardPoints/index.tsx

45 lines
1.1 KiB
TypeScript

import { useIntl } from "react-intl"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { awardPointsVariants } from "./awardPointsVariants"
import type { AwardPointsVariantProps } from "@/types/components/myPages/myPage/earnAndBurn"
export default function AwardPoints({
awardPoints,
isCalculated,
isExpiringPoints = false,
}: {
awardPoints: number
isCalculated: boolean
isExpiringPoints?: boolean
}) {
let variant: AwardPointsVariantProps["variant"] = null
const intl = useIntl()
if (isCalculated && !isExpiringPoints) {
if (awardPoints > 0) {
variant = "addition"
} else if (awardPoints < 0) {
variant = "negation"
awardPoints = Math.abs(awardPoints)
}
}
const classNames = awardPointsVariants({
variant,
})
return (
<Typography variant="Body/Paragraph/mdBold" className={classNames}>
<span>
{isCalculated
? intl.formatNumber(awardPoints)
: intl.formatMessage({
defaultMessage: "Points being calculated",
})}
</span>
</Typography>
)
}