import Button from "@/components/TempDesignSystem/Button"
import Link from "@/components/TempDesignSystem/Link"
import Body from "@/components/TempDesignSystem/Text/Body"
import Title from "@/components/TempDesignSystem/Text/Title"

import styles from "./promo.module.css"

import type { PromoProps } from "@/types/components/hotelReservation/bookingConfirmation/promo"

export default function Promo({ buttonText, href, text, title }: PromoProps) {
  return (
    <Link className={styles.link} color="none" href={href}>
      <article className={styles.promo}>
        <Title color="white" level="h4">
          {title}
        </Title>
        <Body className={styles.text} color="white" textAlign="center">
          {text}
        </Body>
        <Button asChild intent="primary" size="small" theme="primaryStrong">
          <div>{buttonText}</div>
        </Button>
      </article>
    </Link>
  )
}
