From fd1a08641e1ee1f979da196e302f3075777a9c45 Mon Sep 17 00:00:00 2001
From: Sag <guptazy@gmail.com>
Date: Tue, 5 Dec 2023 10:47:27 -0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=90=9B=20Fixed=20links=20in=20signup=20te?=
 =?UTF-8?q?rms=20(#19235)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

fixes https://github.com/TryGhost/Product/issues/4222
fixes PROD-197

- links in signup terms were not opening properly, as we open Portal
within an iframe
- the previous fix in place did not work anymore, as the HTML structure
of the signup terms has changed
---
 apps/portal/src/components/pages/OfferPage.js  |  8 +-------
 apps/portal/src/components/pages/SignupPage.js |  8 +-------
 apps/portal/src/utils/links.js                 | 10 ++++++++++
 3 files changed, 12 insertions(+), 14 deletions(-)
 create mode 100644 apps/portal/src/utils/links.js

diff --git a/apps/portal/src/components/pages/OfferPage.js b/apps/portal/src/components/pages/OfferPage.js
index f1863d2581..2b2de7657b 100644
--- a/apps/portal/src/components/pages/OfferPage.js
+++ b/apps/portal/src/components/pages/OfferPage.js
@@ -6,6 +6,7 @@ import CloseButton from '../common/CloseButton';
 import InputForm from '../common/InputForm';
 import {getCurrencySymbol, getProductFromId, hasMultipleProductsFeature, isSameCurrency, formatNumber, hasMultipleNewsletters} from '../../utils/helpers';
 import {ValidateInputForm} from '../../utils/form';
+import {interceptAnchorClicks} from '../../utils/links';
 import NewsletterSelectionPage from './NewsletterSelectionPage';
 
 export const OfferPageStyles = () => {
@@ -252,13 +253,6 @@ export default class OfferPage extends React.Component {
 
         const className = `gh-portal-signup-terms ${errorClassName}`;
 
-        const interceptAnchorClicks = (e) => {
-            if (e.target.tagName === 'A') {
-                e.preventDefault();
-                window.open(e.target.href, '_blank');
-            }
-        };
-
         return (
             <div className={className} onClick={interceptAnchorClicks}>
                 {signupTerms}
diff --git a/apps/portal/src/components/pages/SignupPage.js b/apps/portal/src/components/pages/SignupPage.js
index d48fd74c2e..e8fb343360 100644
--- a/apps/portal/src/components/pages/SignupPage.js
+++ b/apps/portal/src/components/pages/SignupPage.js
@@ -9,6 +9,7 @@ import InputForm from '../common/InputForm';
 import {ValidateInputForm} from '../../utils/form';
 import {getSiteProducts, getSitePrices, hasOnlyFreePlan, isInviteOnlySite, freeHasBenefitsOrDescription, hasOnlyFreeProduct, getFreeProductBenefits, getFreeTierDescription, hasMultipleNewsletters, hasFreeTrialTier, isSignupAllowed} from '../../utils/helpers';
 import {ReactComponent as InvitationIcon} from '../../images/icons/invitation.svg';
+import {interceptAnchorClicks} from '../../utils/links';
 
 export const SignupPageStyles = `
 .gh-portal-back-sitetitle {
@@ -530,13 +531,6 @@ class SignupPage extends React.Component {
 
         const className = `gh-portal-signup-terms ${errorClassName}`;
 
-        const interceptAnchorClicks = (e) => {
-            if (e.target.tagName === 'A') {
-                e.preventDefault();
-                window.open(e.target.href, '_blank');
-            }
-        };
-
         return (
             <div className={className} onClick={interceptAnchorClicks}>
                 {signupTerms}
diff --git a/apps/portal/src/utils/links.js b/apps/portal/src/utils/links.js
new file mode 100644
index 0000000000..d31e9f6fc5
--- /dev/null
+++ b/apps/portal/src/utils/links.js
@@ -0,0 +1,10 @@
+export const interceptAnchorClicks = (e) => {
+    if (e.currentTarget.contains(e.target)) {
+        const anchor = e.target.closest('a');
+
+        if (anchor) {
+            e.preventDefault();
+            window.open(anchor.href, '_blank');
+        }
+    }
+};