Refactor login in link

Author: gregberge

packages/gitbook/src/components/primitives/Link.tsx

@@ -52,6 +52,12 @@ export const Link = React.forwardRef(function Link(
     const { externalLinksTarget } = React.useContext(LinkSettingsContext);
     const trackEvent = useTrackEvent();
     const forwardedClassNames = useClassnames(classNames || []);
+    // Use specified target or fallback to the default target based on the external links setting.
+    const target =
+        props.target ??
+        (externalLinksTarget === SiteExternalLinksTarget.Blank ? '_blank' : undefined);
+    // Automatically set rel if target is _blank, or use the specified rel.
+    const rel = props.rel ?? (target === '_blank' ? 'noopener noreferrer' : undefined);
 
     // Use a real anchor tag for external links,s and a Next.js Link for internal links.
     // If we use a NextLink for external links, Nextjs won't rerender the top-level layouts.
@@ -68,12 +74,10 @@ export const Link = React.forwardRef(function Link(
             isExternalLink(href, window.location.origin) &&
             // When the page is embedded in an iframe, for security reasons other urls cannot be opened.
             // In this case, we open the link in a new tab.
-            (window.self !== window.top ||
-                // If the site is configured to open links in a new tab
-                externalLinksTarget === SiteExternalLinksTarget.Blank)
+            (window.self !== window.top || target === '_blank')
         ) {
             event.preventDefault();
-            window.open(href, '_blank');
+            window.open(href, '_blank', rel);
         }
 
         domProps.onClick?.(event);
@@ -89,9 +93,8 @@ export const Link = React.forwardRef(function Link(
                 {...domProps}
                 href={href}
                 onClick={onClick}
-                {...(externalLinksTarget === SiteExternalLinksTarget.Blank && !domProps.target
-                    ? { target: '_blank', rel: 'noopener noreferrer' }
-                    : {})}
+                target={target}
+                rel={rel}
             >
                 {children}
             </a>