From 434637da01d531fb37f79876881416cf6ce838c6 Mon Sep 17 00:00:00 2001
From: Cameron Higby-Naquin <me@chigby.org>
Date: Fri, 1 Mar 2024 12:27:11 -0500
Subject: [PATCH] Change featured link logic to handle internal, non-report
 links

If people use the featured section links to link to a different part
of the site, especially one that's not handled by react router, such
as a PDF file, then under the old logic that link won't work.  This
change allows that to work by expanding the set of links we use a
plain old `<a>` tag for to include any links outside of the report
currently being viewed.
---
 .../react/report/components/FeaturedSections.js       | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/newamericadotorg/assets/react/report/components/FeaturedSections.js b/newamericadotorg/assets/react/report/components/FeaturedSections.js
index 326ed8d1c..481ca1e16 100644
--- a/newamericadotorg/assets/react/report/components/FeaturedSections.js
+++ b/newamericadotorg/assets/react/report/components/FeaturedSections.js
@@ -5,12 +5,15 @@ import { Highlight, DataViz, Resource } from '../../components/Icons';
 import { Link } from 'react-router-dom';
 
 function PossiblyExternalLink({children, ...props}) {
-  // If the given link url is relative to the site domain, return a
+  // If the given link url is relative to the report path, return a
   // `Link` component to tie into react-router.  If it's an external
-  // link, return an plain old `a` tag.
-  let relativizedTarget = props.to.replace(location.origin, '');
+  // link, or a link to a part of the site outside of the report,
+  // return an plain old `a` tag.
 
-  if (relativizedTarget.startsWith('/') || !relativizedTarget) {
+  let linkTarget = new URL(props.to);
+
+  if (linkTarget.pathname.startsWith(location.pathname)) {
+    let relativizedTarget = props.to.replace(location.origin, '');
     return (<Link {...props} to={relativizedTarget}>{children}</Link>);
   } else {
     return (<a href={props.to} className={props.className} style={props.style}>{children}</a>);