Files
web/components/Blocks/DynamicContent/OverviewTable/BenefitValue/index.tsx
2024-09-24 09:47:31 +02:00

27 lines
752 B
TypeScript

import { Minus } from "react-feather"
import CheckCircle from "@/components/Icons/CheckCircle"
import styles from "./benefitValue.module.css"
import type { BenefitValueProps } from "@/types/components/overviewTable"
export default function BenefitValue({ benefit }: BenefitValueProps) {
if (!benefit.unlocked) {
return <Minus color="var(--UI-Grey-40)" />
}
if (!benefit.value) {
return <CheckCircle height={32} width={32} color="green" />
}
return (
<div className={styles.benefitValueContainer}>
<span className={styles.benefitValue}>{benefit.value}</span>
{benefit.valueDetails && (
<span className={styles.benefitValueDetails}>
{benefit.valueDetails}
</span>
)}
</div>
)
}