import Link from "next/link";

export function ArrowLink({
  href,
  children,
  external = false,
  className = "",
}: {
  href: string;
  children: React.ReactNode;
  external?: boolean;
  className?: string;
}) {
  const content = (
    <span className={`arrow-link ${className}`}>
      <span>{children}</span>
      <span className="arrow-link__arrow" aria-hidden="true">↗</span>
    </span>
  );

  if (external) {
    return (
      <a href={href} target="_blank" rel="noreferrer" className="magnetic-link">
        {content}
      </a>
    );
  }

  return (
    <Link href={href} className="magnetic-link">
      {content}
    </Link>
  );
}