/* eslint-disable react/destructuring-assignment */
import type React from 'react';

interface Card {
	card: string;
	name: string;
	value: string;
	currencyLabel?: string;
	sign?: string;
	title: string;
	classNameTitle: string;
}
const CashFlowCard: React.FC<Card> = (props: Card) => (
	<div className={props.card}>
		{props.title && <p className={props.classNameTitle}>{props.title}</p>}
		<p>
			{props.sign && `${props.value}${props.sign}`}
			{!props.sign &&
				(props.currencyLabel
					? parseFloat(props.value).toLocaleString('en-GB', {
							style: 'currency',
							currency: props.currencyLabel,
							minimumFractionDigits: 2,
							maximumFractionDigits: 2
					  })
					: props.value)}
		</p>
		<p>{props.name}</p>
	</div>
);

export default CashFlowCard;