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

facebook · Feb 18, 2021 · 2df5a3b · 2df5a3b
1 parent 936d662
commit 2df5a3b
Show file tree

Hide file tree

Showing 5 changed files with 14 additions and 39 deletions.
diff --git a/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.tsx b/packages/docusaurus-theme-classic/src/theme/BlogPostItem/index.tsx
@@ -70,21 +70,15 @@ function BlogPostItem(props: Props): JSX.Element {
         </div>
         <div className="avatar margin-vert--md">
           {authorImageURL && (
-            <a
-              className="avatar__photo-link avatar__photo"
-              href={authorURL}
-              target="_blank"
-              rel="noreferrer noopener">
+            <Link className="avatar__photo-link avatar__photo" href={authorURL}>
               <img src={authorImageURL} alt={author} />
-            </a>
+            </Link>
           )}
           <div className="avatar__intro">
             {author && (
               <>
                 <h4 className="avatar__name">
-                  <a href={authorURL} target="_blank" rel="noreferrer noopener">
-                    {author}
-                  </a>
+                  <Link href={authorURL}>{author}</Link>
                 </h4>
                 <small className="avatar__subtitle">{authorTitle}</small>
               </>

diff --git a/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.tsx b/packages/docusaurus-theme-classic/src/theme/DocSidebar/index.tsx
@@ -159,16 +159,11 @@ function DocSidebarItemLink({
           'menu__link--active': isActive,
         })}
         to={href}
-        {...(isInternalUrl(href)
-          ? {
-              isNavLink: true,
-              exact: true,
-              onClick: onItemClick,
-            }
-          : {
-              target: '_blank',
-              rel: 'noreferrer noopener',
-            })}
+        {...(isInternalUrl(href) && {
+          isNavLink: true,
+          exact: true,
+          onClick: onItemClick,
+        })}
         {...props}>
         {label}
       </Link>

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

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

diff --git a/packages/docusaurus-theme-classic/src/theme/NavbarItem/DefaultNavbarItem.tsx b/packages/docusaurus-theme-classic/src/theme/NavbarItem/DefaultNavbarItem.tsx
@@ -37,8 +37,6 @@ function NavLink({
     <Link
       {...(href
         ? {
-            target: '_blank',
-            rel: 'noopener noreferrer',
             href: prependBaseUrlToHref ? normalizedHref : href,
           }
         : {