import Link from "next/link"

import Title from "@/components/Title"

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

import type { HeaderProps } from "@/types/components/myPages/myStays/title"

export default function Header({ title, subtitle, link }: HeaderProps) {
  return (
    <>
      <header className={styles.header}>
        <Title
          as="h3"
          level="h2"
          className={styles.title}
          weight="semiBold"
          uppercase
        >
          {title}
        </Title>
        {link && (
          <Link className={styles.link} href={link.href}>
            {link.text}
          </Link>
        )}
      </header>
      {subtitle && (
        <Title as="h5" weight="regular" className={styles.subtitle}>
          {subtitle}
        </Title>
      )}
    </>
  )
}