42 lines
950 B
TypeScript
42 lines
950 B
TypeScript
import { removeAfterDot, roundToWhole } from "@/services/price";
|
|
import { Currency, Locale, Price } from "../PaymentTable";
|
|
import styles from "./styles.module.css";
|
|
|
|
const currency = Currency.USD;
|
|
const locale = Locale.EN;
|
|
|
|
interface PriceItemProps {
|
|
id: string;
|
|
value: number;
|
|
active: boolean;
|
|
click: (id: string) => void;
|
|
}
|
|
|
|
function PriceItem({ id, value, active, click }: PriceItemProps): JSX.Element {
|
|
const _price = new Price(
|
|
roundToWhole(value === 1 ? 0.99 : value),
|
|
currency,
|
|
locale
|
|
);
|
|
|
|
const compatClassName = () => {
|
|
const isPopular = id === "stripe.7";
|
|
const isActive = active;
|
|
return `${styles.container} ${isPopular ? styles.popular : ""} ${
|
|
isActive ? styles.active : ""
|
|
}`;
|
|
};
|
|
|
|
const itemClick = () => {
|
|
click(id);
|
|
};
|
|
|
|
return (
|
|
<div onClick={itemClick} className={compatClassName()}>
|
|
{removeAfterDot(_price.format())}
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export default PriceItem;
|