type ReportCardProps = {
  reportImage?: string;
  reportTitle?: string;
  reportDate?: string;
  downloadLink?: string;
}

export default function ReportCard({
  reportImage = "resources/images/img-report.png",
  reportTitle = "Title Elit ipsum Lorem irure incididunt elit aliquip duis. Dolor exercitation sunt consectetur non proident eu do irure magna aliqua fugiat.",
  reportDate = "26 Mar 2025",
  downloadLink = "/images/img-report.png",
}: ReportCardProps) {
  return (
    <div className="reportCard">
      <figure className="reportCard-visual">
        <img
          className="object-scale-down object-center"
          src={reportImage}
          alt=""
        />
      </figure>
      <div className="reportCard-information">
        <h3 className="reportCard-title">
          {reportTitle}
        </h3>
        <p className="reportCard-date">
          <i className="icon-clander reportCard-dateIcon"></i>
          {reportDate}
        </p>
        <a
          href={downloadLink}
          className="button button--second reportCard-action"
          download="img-report.png"
        >
          <span className="button-text">Download</span>
          <i className="icon-download"></i>
        </a>
      </div>
    </div>
  )

}