import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"

import Link from "@/components/TempDesignSystem/Link"

import { linkVariants } from "./variants"

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

import type { SectionLinkProps } from "./link"

export default function SectionLink({ link, variant }: SectionLinkProps) {
  if (!link) {
    return null
  }
  const classNames = linkVariants({
    variant,
  })
  return (
    <Link className={classNames} href={link.href} textDecoration="underline">
      {link.text}
      <MaterialIcon
        icon="arrow_forward"
        color="CurrentColor"
        className={styles.icon}
      />
    </Link>
  )
}
