fix(client): fix i18n external locations in nav (#42995)
This commit is contained in:
		@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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/"
 | 
			
		||||
  }
 | 
			
		||||
}
 | 
			
		||||
 
 | 
			
		||||
@@ -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('<NavLinks />', () => {
 | 
			
		||||
    const shallow = new ShallowRenderer();
 | 
			
		||||
    shallow.render(<NavLinks {...landingPageProps} />);
 | 
			
		||||
    const view = shallow.getRenderOutput();
 | 
			
		||||
 | 
			
		||||
    expect(
 | 
			
		||||
      hasDonateNavItem(view) &&
 | 
			
		||||
        hasSignInNavItem(view) &&
 | 
			
		||||
@@ -73,6 +75,7 @@ describe('<NavLinks />', () => {
 | 
			
		||||
      i18n: {
 | 
			
		||||
        language: 'en'
 | 
			
		||||
      },
 | 
			
		||||
      t: useTranslation.t,
 | 
			
		||||
      toggleNightMode: theme => theme
 | 
			
		||||
    };
 | 
			
		||||
    const shallow = new ShallowRenderer();
 | 
			
		||||
@@ -102,6 +105,7 @@ describe('<NavLinks />', () => {
 | 
			
		||||
      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'
 | 
			
		||||
  );
 | 
			
		||||
};
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -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<NavLinksProps, {}> {
 | 
			
		||||
          external={true}
 | 
			
		||||
          key='forum'
 | 
			
		||||
          sameTab={false}
 | 
			
		||||
          to={createExternalRedirect('forum', { clientLocale })}
 | 
			
		||||
          to={t('links:nav.forum')}
 | 
			
		||||
        >
 | 
			
		||||
          <span>{t('buttons.forum')}</span>
 | 
			
		||||
          <FontAwesomeIcon icon={faExternalLinkAlt} />
 | 
			
		||||
@@ -128,7 +127,7 @@ export class NavLinks extends Component<NavLinksProps, {}> {
 | 
			
		||||
          external={true}
 | 
			
		||||
          key='news'
 | 
			
		||||
          sameTab={false}
 | 
			
		||||
          to={createExternalRedirect('news', { clientLocale })}
 | 
			
		||||
          to={t('links:nav.news')}
 | 
			
		||||
        >
 | 
			
		||||
          <span>{t('buttons.news')}</span>
 | 
			
		||||
          <FontAwesomeIcon icon={faExternalLinkAlt} />
 | 
			
		||||
 
 | 
			
		||||
@@ -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);
 | 
			
		||||
    });
 | 
			
		||||
  });
 | 
			
		||||
});
 | 
			
		||||
@@ -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;
 | 
			
		||||
		Reference in New Issue
	
	Block a user