72 lines
1.6 KiB
TypeScript
72 lines
1.6 KiB
TypeScript
import Body from "@/components/TempDesignSystem/Text/Body"
|
|
import Title from "@/components/TempDesignSystem/Text/Title"
|
|
import { getIntl } from "@/i18n"
|
|
|
|
import styles from "./pointsColumn.module.css"
|
|
|
|
import type {
|
|
NightsColumn,
|
|
PointsColumn,
|
|
PointsColumnProps,
|
|
} from "@/types/components/myPages/points"
|
|
|
|
export const YourPointsColumn = ({ points }: PointsColumn) =>
|
|
PointsColumn({
|
|
points,
|
|
title: "Your points to spend",
|
|
subtitle: "as of today",
|
|
})
|
|
|
|
export const NextLevelPointsColumn = ({ points, subtitle }: PointsColumn) =>
|
|
PointsColumn({
|
|
points,
|
|
title: "Points needed to level up",
|
|
subtitle,
|
|
})
|
|
|
|
export const StayOnLevelColumn = ({ points, subtitle }: PointsColumn) =>
|
|
PointsColumn({
|
|
points,
|
|
title: "Points needed to stay on level",
|
|
subtitle,
|
|
})
|
|
|
|
export const NextLevelNightsColumn = ({ nights, subtitle }: NightsColumn) =>
|
|
PointsColumn({
|
|
nights,
|
|
title: "Nights needed to level up",
|
|
subtitle,
|
|
})
|
|
|
|
async function PointsColumn({
|
|
points,
|
|
nights,
|
|
title,
|
|
subtitle,
|
|
}: PointsColumnProps) {
|
|
const { formatMessage } = await getIntl()
|
|
|
|
return (
|
|
<article className={styles.article}>
|
|
<Body
|
|
color="white"
|
|
textTransform="bold"
|
|
textAlign="center"
|
|
className={styles.firstRow}
|
|
>
|
|
{formatMessage({
|
|
id: title,
|
|
})}
|
|
</Body>
|
|
<Title color="white" level="h2" textAlign="center">
|
|
{points ?? nights ?? "N/A"}
|
|
</Title>
|
|
{subtitle ? (
|
|
<Body color="white" textAlign="center">
|
|
{subtitle}
|
|
</Body>
|
|
) : null}
|
|
</article>
|
|
)
|
|
}
|