refactor(v2): use Link component for external links (#4242)

This commit is contained in:
Alexey Pyltsyn 2021-02-18 14:35:29 +03:00 committed by GitHub
parent 936d6620cf
commit 2df5a3bd5d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
5 changed files with 14 additions and 39 deletions

View file

@ -70,21 +70,15 @@ function BlogPostItem(props: Props): JSX.Element {
</div> </div>
<div className="avatar margin-vert--md"> <div className="avatar margin-vert--md">
{authorImageURL && ( {authorImageURL && (
<a <Link className="avatar__photo-link avatar__photo" href={authorURL}>
className="avatar__photo-link avatar__photo"
href={authorURL}
target="_blank"
rel="noreferrer noopener">
<img src={authorImageURL} alt={author} /> <img src={authorImageURL} alt={author} />
</a> </Link>
)} )}
<div className="avatar__intro"> <div className="avatar__intro">
{author && ( {author && (
<> <>
<h4 className="avatar__name"> <h4 className="avatar__name">
<a href={authorURL} target="_blank" rel="noreferrer noopener"> <Link href={authorURL}>{author}</Link>
{author}
</a>
</h4> </h4>
<small className="avatar__subtitle">{authorTitle}</small> <small className="avatar__subtitle">{authorTitle}</small>
</> </>

View file

@ -159,15 +159,10 @@ function DocSidebarItemLink({
'menu__link--active': isActive, 'menu__link--active': isActive,
})} })}
to={href} to={href}
{...(isInternalUrl(href) {...(isInternalUrl(href) && {
? {
isNavLink: true, isNavLink: true,
exact: true, exact: true,
onClick: onItemClick, onClick: onItemClick,
}
: {
target: '_blank',
rel: 'noreferrer noopener',
})} })}
{...props}> {...props}>
{label} {label}

View file

@ -23,8 +23,6 @@ function FooterLink({to, href, label, prependBaseUrlToHref, ...props}: any) {
className="footer__link-item" className="footer__link-item"
{...(href {...(href
? { ? {
target: '_blank',
rel: 'noopener noreferrer',
href: prependBaseUrlToHref ? normalizedHref : href, href: prependBaseUrlToHref ? normalizedHref : href,
} }
: { : {
@ -98,13 +96,9 @@ function Footer(): JSX.Element | null {
{logo && (logo.src || logo.srcDark) && ( {logo && (logo.src || logo.srcDark) && (
<div className="margin-bottom--sm"> <div className="margin-bottom--sm">
{logo.href ? ( {logo.href ? (
<a <Link href={logo.href} className={styles.footerLogoLink}>
href={logo.href}
target="_blank"
rel="noopener noreferrer"
className={styles.footerLogoLink}>
<FooterLogo alt={logo.alt} sources={sources} /> <FooterLogo alt={logo.alt} sources={sources} />
</a> </Link>
) : ( ) : (
<FooterLogo alt={logo.alt} sources={sources} /> <FooterLogo alt={logo.alt} sources={sources} />
)} )}

View file

@ -13,7 +13,6 @@ import ThemedImage from '@theme/ThemedImage';
import useBaseUrl from '@docusaurus/useBaseUrl'; import useBaseUrl from '@docusaurus/useBaseUrl';
import useDocusaurusContext from '@docusaurus/useDocusaurusContext'; import useDocusaurusContext from '@docusaurus/useDocusaurusContext';
import {useThemeConfig} from '@docusaurus/theme-common'; import {useThemeConfig} from '@docusaurus/theme-common';
import isInternalUrl from '@docusaurus/isInternalUrl';
const Logo = (props: Props): JSX.Element => { const Logo = (props: Props): JSX.Element => {
const {isClient} = useDocusaurusContext(); const {isClient} = useDocusaurusContext();
@ -23,21 +22,16 @@ const Logo = (props: Props): JSX.Element => {
const {imageClassName, titleClassName, ...propsRest} = props; const {imageClassName, titleClassName, ...propsRest} = props;
const logoLink = useBaseUrl(logo.href || '/'); const logoLink = useBaseUrl(logo.href || '/');
const logoLinkProps = logo.target
? {target: logo.target}
: !isInternalUrl(logoLink)
? {
rel: 'noopener noreferrer',
target: '_blank',
}
: {};
const sources = { const sources = {
light: useBaseUrl(logo.src), light: useBaseUrl(logo.src),
dark: useBaseUrl(logo.srcDark || logo.src), dark: useBaseUrl(logo.srcDark || logo.src),
}; };
return ( return (
<Link to={logoLink} {...propsRest} {...logoLinkProps}> <Link
to={logoLink}
{...propsRest}
{...(logo.target && {target: logo.target})}>
{logo.src && ( {logo.src && (
<ThemedImage <ThemedImage
key={isClient} key={isClient}

View file

@ -37,8 +37,6 @@ function NavLink({
<Link <Link
{...(href {...(href
? { ? {
target: '_blank',
rel: 'noopener noreferrer',
href: prependBaseUrlToHref ? normalizedHref : href, href: prependBaseUrlToHref ? normalizedHref : href,
} }
: { : {