From 4bda5102bb413d99a2203bcd3e1a415d3f730f4d Mon Sep 17 00:00:00 2001 From: Brooke Date: Tue, 23 Aug 2022 16:50:22 -0700 Subject: [PATCH 1/3] TCA-355 #comment This PR handles clicks w/in the FCC app so that they are redirected to a new window. Also removing prettier bc it sucks. #time 4h --- .../src/components/layouts/tc-integration.tsx | 34 +++++++++++++++++++ package.json | 1 - 2 files changed, 34 insertions(+), 1 deletion(-) diff --git a/client/src/components/layouts/tc-integration.tsx b/client/src/components/layouts/tc-integration.tsx index 6f1703ac4d299b..23f6e845c1bbc9 100755 --- a/client/src/components/layouts/tc-integration.tsx +++ b/client/src/components/layouts/tc-integration.tsx @@ -97,6 +97,7 @@ class TcIntegrationLayout extends Component { window.addEventListener('online', this.updateOnlineStatus); window.addEventListener('offline', this.updateOnlineStatus); + window.addEventListener('click', this.externalLinkHandler); } componentDidUpdate(prevProps: TcIntegrationLayoutProps) { @@ -112,6 +113,39 @@ class TcIntegrationLayout extends Component { window.removeEventListener('offline', this.updateOnlineStatus); } + externalLinkHandler = (event: MouseEvent) => { + // if we're not clicking an anchor tag, there's nothing to do + const eventTarget = event.target as HTMLElement; + if (eventTarget?.localName !== 'a') { + return; + } + + // if the target of the click isn't external, there's nothing to do + const target = eventTarget as HTMLAnchorElement; + const url = new URL(target.href); + if (url.host === window.location.host) { + return; + } + + // stop the click so we can alter it + event.stopPropagation(); + event.preventDefault(); + + // if this is a freecodecamp lesson, change its domain and path + if (url.host === 'learn.freecodecamp.org') { + url.host = window.location.host; + // TODO: it would be nice to not require that the FCC + // app knows about the paths in the platform UI, but + // creating a way to share this info would be complex and + // time consuming, so we can handle it when we get another + // provider. + url.pathname = `learn/freecodecamp/${url.pathname}`; + } + + // now open the url in a new tab + window.open(url, '_blank'); + }; + updateOnlineStatus = () => { const { onlineStatusChange } = this.props; const isOnline = diff --git a/package.json b/package.json index 7f0ec026a9fe46..c0e4e47f341bdb 100644 --- a/package.json +++ b/package.json @@ -81,7 +81,6 @@ "lint:challenges": "cd ./curriculum && npm run lint", "lint:js": "eslint --max-warnings 0 .", "lint:ts": "tsc && tsc -p config && tsc -p tools/ui-components && tsc -p utils", - "lint:prettier": "prettier --list-different .", "seed": "cross-env DEBUG=fcc:* node ./tools/scripts/seed/seedAuthUser", "seed:certified-user": "cross-env DEBUG=fcc:* node ./tools/scripts/seed/seedAuthUser certUser", "serve:client": "cd ./client && npm run serve", From 162eb27edca47f44988221057d6681945261bd52 Mon Sep 17 00:00:00 2001 From: Brooke Date: Tue, 23 Aug 2022 17:07:46 -0700 Subject: [PATCH 2/3] TCA-355 fix prettier crap --- client/src/components/layouts/tc-integration.tsx | 2 ++ package.json | 1 + 2 files changed, 3 insertions(+) diff --git a/client/src/components/layouts/tc-integration.tsx b/client/src/components/layouts/tc-integration.tsx index 23f6e845c1bbc9..e495dbf7d03041 100755 --- a/client/src/components/layouts/tc-integration.tsx +++ b/client/src/components/layouts/tc-integration.tsx @@ -114,6 +114,8 @@ class TcIntegrationLayout extends Component { } externalLinkHandler = (event: MouseEvent) => { + // prettier sucks + // if we're not clicking an anchor tag, there's nothing to do const eventTarget = event.target as HTMLElement; if (eventTarget?.localName !== 'a') { diff --git a/package.json b/package.json index c0e4e47f341bdb..7f0ec026a9fe46 100644 --- a/package.json +++ b/package.json @@ -81,6 +81,7 @@ "lint:challenges": "cd ./curriculum && npm run lint", "lint:js": "eslint --max-warnings 0 .", "lint:ts": "tsc && tsc -p config && tsc -p tools/ui-components && tsc -p utils", + "lint:prettier": "prettier --list-different .", "seed": "cross-env DEBUG=fcc:* node ./tools/scripts/seed/seedAuthUser", "seed:certified-user": "cross-env DEBUG=fcc:* node ./tools/scripts/seed/seedAuthUser certUser", "serve:client": "cd ./client && npm run serve", From 2bb2f8356d6dff87c49083f491840c8354699071 Mon Sep 17 00:00:00 2001 From: Brooke Date: Tue, 23 Aug 2022 17:10:04 -0700 Subject: [PATCH 3/3] TCA-355 change comment --- client/src/components/layouts/tc-integration.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/components/layouts/tc-integration.tsx b/client/src/components/layouts/tc-integration.tsx index e495dbf7d03041..9d9a39c48cf3e0 100755 --- a/client/src/components/layouts/tc-integration.tsx +++ b/client/src/components/layouts/tc-integration.tsx @@ -114,7 +114,7 @@ class TcIntegrationLayout extends Component { } externalLinkHandler = (event: MouseEvent) => { - // prettier sucks + // prettier is the worst // if we're not clicking an anchor tag, there's nothing to do const eventTarget = event.target as HTMLElement;