tailwind-nextjs-blog/components/Link.tsx
2022-10-17 15:37:01 +00:00

31 lines
677 B
TypeScript

/* eslint-disable jsx-a11y/anchor-has-content */
import Link from 'next/link';
import { AnchorHTMLAttributes, DetailedHTMLProps } from 'react';
const CustomLink = ({
href,
...rest
}: DetailedHTMLProps<
AnchorHTMLAttributes<HTMLAnchorElement>,
HTMLAnchorElement
>) => {
const isInternalLink = href && href.startsWith('/');
const isAnchorLink = href && href.startsWith('#');
if (isInternalLink) {
return (
<Link href={href}>
<a {...rest} />
</Link>
);
}
if (isAnchorLink) {
return <a href={href} {...rest} />;
}
return <a target="_blank" rel="noopener noreferrer" href={href} {...rest} />;
};
export default CustomLink;