From 11d71adc6e009a63a4a451a581b6b2d07ac491c6 Mon Sep 17 00:00:00 2001 From: Parth Parth <34807532+thecodingaviator@users.noreply.github.com> Date: Tue, 29 Jun 2021 00:17:42 +0530 Subject: [PATCH] feat(client): ts-migrate /client/src/components/ redirects (#42642) * rename * migrate * migrate create language redirect * fix type of redirects * migrate test Co-authored-by: Parth Parth Co-authored-by: Shaun Hamilton --- .../client-only-routes/show-certification.tsx | 2 +- .../Header/components/nav-links.tsx | 4 +-- ...unt-notifier.tsx => app-mount-notifier.ts} | 0 ...t.js => create-external-redirects.test.ts} | 2 +- ...irects.js => create-external-redirects.ts} | 5 +++- ...st.js => create-language-redirect.test.ts} | 26 ++++++++++++------- ...edirect.js => create-language-redirect.ts} | 14 +++++++--- .../{createRedirect.js => create-redirect.ts} | 4 +-- client/src/components/layouts/Learn.js | 2 +- .../{RedirectHome.js => redirect-home.ts} | 2 +- client/src/pages/certification.tsx | 2 +- client/src/pages/email-sign-up.tsx | 2 +- client/src/pages/settings.tsx | 2 +- client/src/pages/unsubscribed.tsx | 2 +- client/src/pages/user.tsx | 2 +- 15 files changed, 44 insertions(+), 27 deletions(-) rename client/src/components/{app-mount-notifier.tsx => app-mount-notifier.ts} (100%) rename client/src/components/{createExternalRedirects.test.js => create-external-redirects.test.ts} (97%) rename client/src/components/{createExternalRedirects.js => create-external-redirects.ts} (83%) rename client/src/components/{createLanguageRedirect.test.js => create-language-redirect.test.ts} (93%) rename client/src/components/{createLanguageRedirect.js => create-language-redirect.ts} (66%) rename client/src/components/{createRedirect.js => create-redirect.ts} (71%) rename client/src/components/{RedirectHome.js => redirect-home.ts} (64%) diff --git a/client/src/client-only-routes/show-certification.tsx b/client/src/client-only-routes/show-certification.tsx index 89f816822d..6b0710f6f0 100644 --- a/client/src/client-only-routes/show-certification.tsx +++ b/client/src/client-only-routes/show-certification.tsx @@ -27,7 +27,7 @@ import reallyWeirdErrorMessage from '../utils/reallyWeirdErrorMessage'; import { langCodes } from '../../../config/i18n/all-langs'; import envData from '../../../config/env.json'; -import RedirectHome from '../components/RedirectHome'; +import RedirectHome from '../components/redirect-home'; import { Loader, Spacer } from '../components/helpers'; import { isEmpty } from 'lodash-es'; import { UserType } from '../redux/prop-types'; diff --git a/client/src/components/Header/components/nav-links.tsx b/client/src/components/Header/components/nav-links.tsx index 550f0f1d36..97c08fa5b2 100644 --- a/client/src/components/Header/components/nav-links.tsx +++ b/client/src/components/Header/components/nav-links.tsx @@ -22,8 +22,8 @@ import { import { Link } from '../../helpers'; import { updateUserFlag } from '../../../redux/settings'; import envData from '../../../../../config/env.json'; -import createLanguageRedirect from '../../createLanguageRedirect'; -import createExternalRedirect from '../../createExternalRedirects'; +import createLanguageRedirect from '../../create-language-redirect'; +import createExternalRedirect from '../../create-external-redirects'; import { availableLangs, i18nextCodes, diff --git a/client/src/components/app-mount-notifier.tsx b/client/src/components/app-mount-notifier.ts similarity index 100% rename from client/src/components/app-mount-notifier.tsx rename to client/src/components/app-mount-notifier.ts diff --git a/client/src/components/createExternalRedirects.test.js b/client/src/components/create-external-redirects.test.ts similarity index 97% rename from client/src/components/createExternalRedirects.test.js rename to client/src/components/create-external-redirects.test.ts index 861edfbff3..a108aebf40 100644 --- a/client/src/components/createExternalRedirects.test.js +++ b/client/src/components/create-external-redirects.test.ts @@ -1,4 +1,4 @@ -import createExternalRedirect from './createExternalRedirects'; +import createExternalRedirect from './create-external-redirects'; describe('createExternalRedirects', () => { describe('english redirects', () => { diff --git a/client/src/components/createExternalRedirects.js b/client/src/components/create-external-redirects.ts similarity index 83% rename from client/src/components/createExternalRedirects.js rename to client/src/components/create-external-redirects.ts index 2300dfb6c6..98c36da8cc 100644 --- a/client/src/components/createExternalRedirects.js +++ b/client/src/components/create-external-redirects.ts @@ -2,7 +2,10 @@ import envData from '../../../config/env.json'; const { forumLocation } = envData; -const createExternalRedirect = (page, { clientLocale }) => { +const createExternalRedirect = ( + page: string, + { clientLocale }: { clientLocale: string } +): string => { // Handle Chinese if (clientLocale === 'chinese' || clientLocale === 'chinese-traditional') { return `https://chinese.freecodecamp.org/${page}`; diff --git a/client/src/components/createLanguageRedirect.test.js b/client/src/components/create-language-redirect.test.ts similarity index 93% rename from client/src/components/createLanguageRedirect.test.js rename to client/src/components/create-language-redirect.test.ts index 70ad0c5d8c..c13f318291 100644 --- a/client/src/components/createLanguageRedirect.test.js +++ b/client/src/components/create-language-redirect.test.ts @@ -1,4 +1,4 @@ -import createLanguageRedirect from './createLanguageRedirect'; +import createLanguageRedirect from './create-language-redirect'; describe('createLanguageRedirect for clientLocale === english', () => { const envVars = { @@ -20,8 +20,10 @@ describe('createLanguageRedirect for clientLocale === english', () => { const originalLocation = window.location; beforeEach(() => { - delete window.location; - window.location = new URL(currentPageURL); + Object.defineProperty(window, 'location', { + writable: true, + value: new URL(currentPageURL) + }); }); afterEach(() => { @@ -80,8 +82,10 @@ describe('createLanguageRedirect for clientLocale === english', () => { const originalLocation = window.location; beforeEach(() => { - delete window.location; - window.location = new URL(currentPageURL); + Object.defineProperty(window, 'location', { + writable: true, + value: new URL(currentPageURL) + }); }); afterEach(() => { @@ -150,8 +154,10 @@ describe('createLanguageRedirect for clientLocale === chinese', () => { const originalLocation = window.location; beforeEach(() => { - delete window.location; - window.location = new URL(currentPageURL); + Object.defineProperty(window, 'location', { + writable: true, + value: new URL(currentPageURL) + }); }); afterEach(() => { @@ -210,8 +216,10 @@ describe('createLanguageRedirect for clientLocale === chinese', () => { const originalLocation = window.location; beforeEach(() => { - delete window.location; - window.location = new URL(currentPageURL); + Object.defineProperty(window, 'location', { + writable: true, + value: new URL(currentPageURL) + }); }); afterEach(() => { diff --git a/client/src/components/createLanguageRedirect.js b/client/src/components/create-language-redirect.ts similarity index 66% rename from client/src/components/createLanguageRedirect.js rename to client/src/components/create-language-redirect.ts index 4f2ccfe981..b7a529d03b 100644 --- a/client/src/components/createLanguageRedirect.js +++ b/client/src/components/create-language-redirect.ts @@ -1,9 +1,15 @@ -const createLanguageRedirect = ({ clientLocale, lang }) => { +const createLanguageRedirect = ({ + clientLocale, + lang +}: { + clientLocale: string; + lang: string; +}): string => { // return early if requesting the same page - if (clientLocale === lang) return `${window?.location}`; + if (clientLocale === lang) return window?.location.toString(); - let path = window?.location?.pathname?.split('/'); - path = path + const pathArray = window?.location?.pathname?.split('/'); + const path = pathArray .filter(item => (item !== clientLocale && item !== lang ? item : '')) .join('/'); diff --git a/client/src/components/createRedirect.js b/client/src/components/create-redirect.ts similarity index 71% rename from client/src/components/createRedirect.js rename to client/src/components/create-redirect.ts index 8b82e16de0..250f1b8d02 100644 --- a/client/src/components/createRedirect.js +++ b/client/src/components/create-redirect.ts @@ -1,10 +1,10 @@ import { navigate } from 'gatsby'; const createRedirect = - (to = '/') => + (to = '/'): (() => JSX.Element | null) => () => { if (typeof window !== 'undefined') { - navigate(to); + void navigate(to); } return null; }; diff --git a/client/src/components/layouts/Learn.js b/client/src/components/layouts/Learn.js index 827826b05b..528ee73384 100644 --- a/client/src/components/layouts/Learn.js +++ b/client/src/components/layouts/Learn.js @@ -10,7 +10,7 @@ import { isSignedInSelector, tryToShowDonationModal } from '../../redux'; -import createRedirect from '../../components/createRedirect'; +import createRedirect from '../create-redirect'; import DonateModal from '../Donation/DonationModal'; import './prism.css'; diff --git a/client/src/components/RedirectHome.js b/client/src/components/redirect-home.ts similarity index 64% rename from client/src/components/RedirectHome.js rename to client/src/components/redirect-home.ts index e49a24f3db..9336e5e53d 100644 --- a/client/src/components/RedirectHome.js +++ b/client/src/components/redirect-home.ts @@ -1,4 +1,4 @@ -import createRedirect from './createRedirect'; +import createRedirect from './create-redirect'; import { withPrefix } from 'gatsby'; export default createRedirect(withPrefix('/')); diff --git a/client/src/pages/certification.tsx b/client/src/pages/certification.tsx index d357566327..38f3c48ed1 100644 --- a/client/src/pages/certification.tsx +++ b/client/src/pages/certification.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Router } from '@reach/router'; import { withPrefix } from 'gatsby'; -import RedirectHome from '../components/RedirectHome'; +import RedirectHome from '../components/redirect-home'; import ShowCertification from '../client-only-routes/show-certification'; import './certification.css'; diff --git a/client/src/pages/email-sign-up.tsx b/client/src/pages/email-sign-up.tsx index 4b98a2c4bd..472056c471 100644 --- a/client/src/pages/email-sign-up.tsx +++ b/client/src/pages/email-sign-up.tsx @@ -12,7 +12,7 @@ import { createSelector } from 'reselect'; import { ButtonSpacer, Spacer } from '../components/helpers'; import { acceptTerms, userSelector } from '../redux'; -import createRedirect from '../components/createRedirect'; +import createRedirect from '../components/create-redirect'; import './email-sign-up.css'; diff --git a/client/src/pages/settings.tsx b/client/src/pages/settings.tsx index 2a5957a583..ab8eb83d58 100644 --- a/client/src/pages/settings.tsx +++ b/client/src/pages/settings.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Router } from '@reach/router'; import { withPrefix } from 'gatsby'; -import RedirectHome from '../components/RedirectHome'; +import RedirectHome from '../components/redirect-home'; import ShowSettings from '../client-only-routes/show-settings'; function Settings(): JSX.Element { diff --git a/client/src/pages/unsubscribed.tsx b/client/src/pages/unsubscribed.tsx index 7131356e39..f08f7216b9 100644 --- a/client/src/pages/unsubscribed.tsx +++ b/client/src/pages/unsubscribed.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Router } from '@reach/router'; import { withPrefix } from 'gatsby'; -import RedirectHome from '../components/RedirectHome'; +import RedirectHome from '../components/redirect-home'; import ShowUnsubscribed from '../client-only-routes/show-unsubscribed'; function Unsubscribed(): JSX.Element { diff --git a/client/src/pages/user.tsx b/client/src/pages/user.tsx index 7e50f75b68..7cac7a5a63 100644 --- a/client/src/pages/user.tsx +++ b/client/src/pages/user.tsx @@ -2,7 +2,7 @@ import React from 'react'; import { Router } from '@reach/router'; import { withPrefix } from 'gatsby'; -import RedirectHome from '../components/RedirectHome'; +import RedirectHome from '../components/redirect-home'; import ShowUser from '../client-only-routes/show-user'; function User(): JSX.Element {