From 9731ea31b8c695b2ba98331e8b1b51d52257edee Mon Sep 17 00:00:00 2001 From: Shaun Hamilton Date: Wed, 28 Jul 2021 01:31:07 +0100 Subject: [PATCH] fix(client): fix i18n external locations in nav (#42995) --- .../locales/chinese-traditional/links.json | 4 + client/i18n/locales/chinese/links.json | 4 + client/i18n/locales/english/links.json | 4 + client/i18n/locales/espanol/links.json | 4 + client/i18n/locales/italian/links.json | 4 + client/i18n/locales/portuguese/links.json | 4 + client/src/components/Header/Header.test.js | 27 ++--- .../Header/components/nav-links.tsx | 5 +- .../create-external-redirects.test.ts | 98 ------------------- .../components/create-external-redirects.ts | 24 ----- 10 files changed, 34 insertions(+), 144 deletions(-) delete mode 100644 client/src/components/create-external-redirects.test.ts delete mode 100644 client/src/components/create-external-redirects.ts diff --git a/client/i18n/locales/chinese-traditional/links.json b/client/i18n/locales/chinese-traditional/links.json index 2244aa8127..c599f06382 100644 --- a/client/i18n/locales/chinese-traditional/links.json +++ b/client/i18n/locales/chinese-traditional/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://chinese.freecodecamp.org/news/how-to-donate-to-free-code-camp/" + }, + "nav": { + "forum": "https://chinese.freecodecamp.org/forum/", + "news": "https://chinese.freecodecamp.org/news/" } } diff --git a/client/i18n/locales/chinese/links.json b/client/i18n/locales/chinese/links.json index 2244aa8127..c599f06382 100644 --- a/client/i18n/locales/chinese/links.json +++ b/client/i18n/locales/chinese/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://chinese.freecodecamp.org/news/how-to-donate-to-free-code-camp/" + }, + "nav": { + "forum": "https://chinese.freecodecamp.org/forum/", + "news": "https://chinese.freecodecamp.org/news/" } } diff --git a/client/i18n/locales/english/links.json b/client/i18n/locales/english/links.json index a3f22393f4..0ad1754144 100644 --- a/client/i18n/locales/english/links.json +++ b/client/i18n/locales/english/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://www.freecodecamp.org/news/how-to-donate-to-free-code-camp" + }, + "nav": { + "forum": "https://forum.freecodecamp.org/", + "news": "https://freecodecamp.org/news/" } } diff --git a/client/i18n/locales/espanol/links.json b/client/i18n/locales/espanol/links.json index 434aa8a085..8243f73ab1 100644 --- a/client/i18n/locales/espanol/links.json +++ b/client/i18n/locales/espanol/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://www.freecodecamp.org/news/how-to-donate-to-free-code-camp" + }, + "nav": { + "forum": "https://forum.freecodecamp.org/c/espanol/", + "news": "https://freecodecamp.org/espanol/news/" } } diff --git a/client/i18n/locales/italian/links.json b/client/i18n/locales/italian/links.json index a3f22393f4..564a2afe39 100644 --- a/client/i18n/locales/italian/links.json +++ b/client/i18n/locales/italian/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://www.freecodecamp.org/news/how-to-donate-to-free-code-camp" + }, + "nav": { + "forum": "https://forum.freecodecamp.org/c/italiano/", + "news": "https://freecodecamp.org/italian/news/" } } diff --git a/client/i18n/locales/portuguese/links.json b/client/i18n/locales/portuguese/links.json index a3f22393f4..7a04e8e4db 100644 --- a/client/i18n/locales/portuguese/links.json +++ b/client/i18n/locales/portuguese/links.json @@ -13,5 +13,9 @@ }, "donate": { "other-ways-url": "https://www.freecodecamp.org/news/how-to-donate-to-free-code-camp" + }, + "nav": { + "forum": "https://forum.freecodecamp.org/c/portugues/", + "news": "https://freecodecamp.org/portuguese/news/" } } diff --git a/client/src/components/Header/Header.test.js b/client/src/components/Header/Header.test.js index 331c486d27..1e793aefbf 100644 --- a/client/src/components/Header/Header.test.js +++ b/client/src/components/Header/Header.test.js @@ -7,8 +7,9 @@ import { NavLinks } from './components/nav-links'; import AuthOrProfile from './components/auth-or-profile'; import envData from '../../../../config/env.json'; +import { useTranslation } from 'react-i18next'; -const { apiLocation, clientLocale } = envData; +const { apiLocation } = envData; jest.mock('../../analytics'); @@ -50,6 +51,7 @@ describe('', () => { const shallow = new ShallowRenderer(); shallow.render(); const view = shallow.getRenderOutput(); + expect( hasDonateNavItem(view) && hasSignInNavItem(view) && @@ -73,6 +75,7 @@ describe('', () => { i18n: { language: 'en' }, + t: useTranslation.t, toggleNightMode: theme => theme }; const shallow = new ShallowRenderer(); @@ -102,6 +105,7 @@ describe('', () => { i18n: { language: 'en' }, + t: useTranslation.t, toggleNightMode: theme => theme }; const shallow = new ShallowRenderer(); @@ -234,31 +238,16 @@ const hasProfileAndSettingsNavItems = (component, username) => { const hasForumNavItem = component => { const { children, to } = navigationLinks(component, 'forum'); - const localizedForums = { - chinese: 'https://chinese.freecodecamp.org/forum', - 'chinese-traditional': 'https://chinese.freecodecamp.org/forum', - espanol: 'https://forum.freecodecamp.org/c/espanol/', - english: 'https://forum.freecodecamp.org/', - italian: 'https://forum.freecodecamp.org/c/italian/' - }; + // TODO: test compiled TFunction value return ( - children[0].props.children === 'buttons.forum' && - to === localizedForums[clientLocale] + children[0].props.children === 'buttons.forum' && to === 'links:nav.forum' ); }; const hasNewsNavItem = component => { const { children, to } = navigationLinks(component, 'news'); - const localizedNews = { - chinese: 'https://chinese.freecodecamp.org/news', - 'chinese-traditional': 'https://chinese.freecodecamp.org/news', - espanol: 'https://www.freecodecamp.org/espanol/news', - english: 'https://www.freecodecamp.org/news', - italian: 'https://www.freecodecamp.org/italian/news' - }; return ( - children[0].props.children === 'buttons.news' && - to === localizedNews[clientLocale] + children[0].props.children === 'buttons.news' && to === 'links:nav.news' ); }; diff --git a/client/src/components/Header/components/nav-links.tsx b/client/src/components/Header/components/nav-links.tsx index 7bc9f524f9..d6c99a83c3 100644 --- a/client/src/components/Header/components/nav-links.tsx +++ b/client/src/components/Header/components/nav-links.tsx @@ -23,7 +23,6 @@ import { Link } from '../../helpers'; import { updateUserFlag } from '../../../redux/settings'; import envData from '../../../../../config/env.json'; import createLanguageRedirect from '../../create-language-redirect'; -import createExternalRedirect from '../../create-external-redirects'; import { availableLangs, i18nextCodes, @@ -118,7 +117,7 @@ export class NavLinks extends Component { external={true} key='forum' sameTab={false} - to={createExternalRedirect('forum', { clientLocale })} + to={t('links:nav.forum')} > {t('buttons.forum')} @@ -128,7 +127,7 @@ export class NavLinks extends Component { external={true} key='news' sameTab={false} - to={createExternalRedirect('news', { clientLocale })} + to={t('links:nav.news')} > {t('buttons.news')} diff --git a/client/src/components/create-external-redirects.test.ts b/client/src/components/create-external-redirects.test.ts deleted file mode 100644 index a108aebf40..0000000000 --- a/client/src/components/create-external-redirects.test.ts +++ /dev/null @@ -1,98 +0,0 @@ -import createExternalRedirect from './create-external-redirects'; - -describe('createExternalRedirects', () => { - describe('english redirects', () => { - const envVars = { - clientLocale: 'english' - }; - - const forumURL = 'https://forum.freecodecamp.org/'; - const newsURL = 'https://www.freecodecamp.org/news'; - - it('should generate correct forum link', () => { - const receivedUrl = createExternalRedirect('forum', { ...envVars }); - expect(receivedUrl).toBe(forumURL); - }); - - it('should generate correct news link', () => { - const receivedUrl = createExternalRedirect('news', { ...envVars }); - expect(receivedUrl).toBe(newsURL); - }); - }); - - describe('chinese redirects', () => { - const envVars = { - clientLocale: 'chinese' - }; - - const forumURL = 'https://chinese.freecodecamp.org/forum'; - const newsURL = 'https://chinese.freecodecamp.org/news'; - - it('should generate correct forum link', () => { - const receivedUrl = createExternalRedirect('forum', { ...envVars }); - expect(receivedUrl).toBe(forumURL); - }); - - it('should generate correct news link', () => { - const receivedUrl = createExternalRedirect('news', { ...envVars }); - expect(receivedUrl).toBe(newsURL); - }); - }); - - describe('spanish redirects', () => { - const envVars = { - clientLocale: 'espanol' - }; - - const forumURL = 'https://forum.freecodecamp.org/c/espanol/'; - const newsURL = 'https://www.freecodecamp.org/espanol/news'; - - it('should generate correct forum link', () => { - const receivedUrl = createExternalRedirect('forum', { ...envVars }); - expect(receivedUrl).toBe(forumURL); - }); - - it('should generate correct news link', () => { - const receivedUrl = createExternalRedirect('news', { ...envVars }); - expect(receivedUrl).toBe(newsURL); - }); - }); - - describe('french redirects', () => { - const envVars = { - clientLocale: 'francais' - }; - - const forumURL = 'https://forum.freecodecamp.org/c/francais/'; - const newsURL = 'https://www.freecodecamp.org/francais/news'; - - it('should generate correct forum link', () => { - const receivedUrl = createExternalRedirect('forum', { ...envVars }); - expect(receivedUrl).toBe(forumURL); - }); - - it('should generate correct news link', () => { - const receivedUrl = createExternalRedirect('news', { ...envVars }); - expect(receivedUrl).toBe(newsURL); - }); - }); - - describe('chinese-traditional redirects', () => { - const envVars = { - clientLocale: 'chinese-traditional' - }; - - const forumURL = 'https://chinese.freecodecamp.org/forum'; - const newsURL = 'https://chinese.freecodecamp.org/news'; - - it('should generate correct forum link', () => { - const receivedUrl = createExternalRedirect('forum', { ...envVars }); - expect(receivedUrl).toBe(forumURL); - }); - - it('should generate correct news link', () => { - const receivedUrl = createExternalRedirect('news', { ...envVars }); - expect(receivedUrl).toBe(newsURL); - }); - }); -}); diff --git a/client/src/components/create-external-redirects.ts b/client/src/components/create-external-redirects.ts deleted file mode 100644 index 98c36da8cc..0000000000 --- a/client/src/components/create-external-redirects.ts +++ /dev/null @@ -1,24 +0,0 @@ -import envData from '../../../config/env.json'; - -const { forumLocation } = envData; - -const createExternalRedirect = ( - page: string, - { clientLocale }: { clientLocale: string } -): string => { - // Handle Chinese - if (clientLocale === 'chinese' || clientLocale === 'chinese-traditional') { - return `https://chinese.freecodecamp.org/${page}`; - } - - // Handle Others - const isNotEnglish = clientLocale !== 'english'; - if (page === 'forum') { - return `${forumLocation}/${isNotEnglish ? 'c/' + clientLocale + '/' : ''}`; - } - return `https://www.freecodecamp.org/${ - isNotEnglish ? clientLocale + '/news' : 'news' - }`; -}; - -export default createExternalRedirect;