import React from "react"

import CustomLink from "./link"
import t from "@/constants/wording"
import { Icon, ImgIcon } from "@/components"

import * as styles from "./index.module.scss"

export declare interface InformationCardProps {
  title: string
  section: string
  moreLink: string
  link: string
  icon?: { url: string }
}

const InformationCard = (props: InformationCardProps) => {
  const { title, section, moreLink, link, icon } = props
  const moreMsg = t("more")
  return (
    <>
      <p className={styles.cardSection}>
        {section}{" "}
        <ImgIcon className={styles.icon} src={icon?.url} alt={title} />
      </p>
      <CustomLink linkTo={link} className={styles.cardContent}>
        {title}
      </CustomLink>
      <CustomLink linkTo={moreLink} className={styles.cardFooter}>
        {moreMsg}
        <Icon name="arrow-right" />
      </CustomLink>
    </>
  )
}
export default InformationCard