42 lines
909 B
TypeScript
42 lines
909 B
TypeScript
import Link from "next/link";
|
|
import { Icon } from "@/components/general/Icon";
|
|
|
|
/**
|
|
* A link styled as a button. Internal links use next/link with a forward arrow;
|
|
* external links open in a new tab with an external icon. isExternal is inferred
|
|
* from the href unless passed explicitly.
|
|
*/
|
|
export const ButtonLink = ({
|
|
href,
|
|
isExternal,
|
|
children,
|
|
}: {
|
|
href: string;
|
|
isExternal?: boolean;
|
|
children: React.ReactNode;
|
|
}) => {
|
|
const external =
|
|
isExternal ?? (!href.startsWith("/") && !href.startsWith("#"));
|
|
|
|
if (external) {
|
|
return (
|
|
<a
|
|
href={href}
|
|
className="button"
|
|
target="_blank"
|
|
rel="noopener noreferrer"
|
|
>
|
|
<span>{children}</span>
|
|
<Icon type="externalLink" />
|
|
</a>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<Link href={href} className="button">
|
|
<span>{children}</span>
|
|
<Icon type="arrowRight" />
|
|
</Link>
|
|
);
|
|
};
|