| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103 |
- import type { JSX } from 'react';
- import type { LinkProps } from 'next/link';
- import Link from 'next/link';
- import { pagePathUtils } from '@growi/core/dist/utils';
- import { useSiteUrl } from '~/stores-universal/context';
- import loggerFactory from '~/utils/logger';
- const logger = loggerFactory('growi:components:NextLink');
- const isAnchorLink = (href: string): boolean => {
- return href.toString().length > 0 && href[0] === '#';
- };
- const isExternalLink = (href: string, siteUrl: string | undefined): boolean => {
- try {
- const baseUrl = new URL(siteUrl ?? 'https://example.com');
- const hrefUrl = new URL(href, baseUrl);
- return baseUrl.host !== hrefUrl.host;
- } catch (err) {
- logger.debug(err);
- return false;
- }
- };
- const isCreatablePage = (href: string) => {
- try {
- const url = new URL(href, 'http://example.com');
- const pathName = url.pathname;
- return pagePathUtils.isCreatablePage(pathName);
- } catch (err) {
- logger.debug(err);
- return false;
- }
- };
- type Props = Omit<LinkProps, 'href'> & {
- children: React.ReactNode;
- id?: string;
- href?: string;
- className?: string;
- };
- export const NextLink = (props: Props): JSX.Element => {
- const { id, href, children, className, onClick, ...rest } = props;
- const { data: siteUrl } = useSiteUrl();
- if (href == null) {
- // biome-ignore lint/a11y/useValidAnchor: ignore
- return <a className={className}>{children}</a>;
- }
- // extract 'data-*' props
- const dataAttributes = Object.fromEntries(
- Object.entries(rest).filter(([key]) => key.startsWith('data-')),
- );
- if (isExternalLink(href, siteUrl)) {
- return (
- <a
- id={id}
- href={href}
- className={className}
- target="_blank"
- onClick={onClick}
- rel="noopener noreferrer"
- {...dataAttributes}
- >
- {children}
- <span className="growi-custom-icons">external_link</span>
- </a>
- );
- }
- // when href is an anchor link or not-creatable path
- if (isAnchorLink(href) || !isCreatablePage(href)) {
- return (
- <a
- id={id}
- href={href}
- className={className}
- onClick={onClick}
- {...dataAttributes}
- >
- {children}
- </a>
- );
- }
- return (
- <Link {...rest} href={href} prefetch={false} legacyBehavior>
- <a
- href={href}
- className={className}
- {...dataAttributes}
- onClick={onClick}
- >
- {children}
- </a>
- </Link>
- );
- };
|