import { FC } from "react";
import { formatCurrency } from "../lib/formatStrings";

export const MontlyExpensesCard:FC<{monthlyExpense:number}> = ({ monthlyExpense }) =>
    monthlyExpense>0 ?
    <div className="card card-compact card-bordered max-w-[36em] bg-base-100 shadow-s my-1">
        <span className="card-body self-center">
          <p>
            Total monthly expenditure: <strong>{ formatCurrency(monthlyExpense) }</strong>
          </p>
        </span>
    </div> : null