feat: use atlas in make pull_translations on palm (#156)

Changes
-------
 - Bump frontend-platform to bring intl-imports.js script
 - Move all i18n imports into `src/i18n/index.js` so intl-imports.js can
   override it with latest translations
 - Add `atlas` into `make pull_translations` when `OPENEDX_ATLAS_PULL`
   environment variable is set.
 - Fixed lint rules for [email protected]
 - Mock useTrackColorSchemeChoice to avoid test failures
 - Remove all broken and deprecated Tranisfex use
 - Install openedx-atlas

Refs: [FC-0012 project](https://openedx.atlassian.net/l/cp/XGS0iCcQ) implementing Translation Infrastructure OEP-58.

Makefile

@@ -1,6 +1,4 @@
-export TRANSIFEX_RESOURCE = frontend-app-communications
-transifex_langs = "ar,fr,es_419,zh_CN"
-
+intl_imports = ./node_modules/.bin/intl-imports.js
 transifex_utils = ./node_modules/.bin/transifex-utils.js
 i18n = ./src/i18n
 transifex_input = $(i18n)/transifex_input.json
@@ -31,20 +29,17 @@ detect_changed_source_translations:
 	# Checking for changed translations...
 	git diff --exit-code $(i18n)
 
-# Pushes translations to Transifex.  You must run make extract_translations first.
-push_translations:
-	# Pushing strings to Transifex...
-	tx push -s
-	# Fetching hashes from Transifex...
-	./node_modules/@edx/reactifex/bash_scripts/get_hashed_strings_v3.sh
-	# Writing out comments to file...
-	$(transifex_utils) $(transifex_temp) --comments --v3-scripts-path
-	# Pushing comments to Transifex...
-	./node_modules/@edx/reactifex/bash_scripts/put_comments_v3.sh
-
-# Pulls translations from Transifex.
 pull_translations:
-	tx pull -t -f --mode reviewed --languages=$(transifex_langs)
+	rm -rf src/i18n/messages
+	mkdir src/i18n/messages
+	cd src/i18n/messages \
+	   && atlas pull \
+	            translations/frontend-component-header/src/i18n/messages:frontend-component-header  \
+	            translations/frontend-component-footer/src/i18n/messages:frontend-component-footer \
+	            translations/paragon/src/i18n/messages:paragon \
+	            translations/frontend-app-communications/src/i18n/messages:frontend-app-communications
+
+	$(intl_imports) frontend-component-header frontend-component-footer paragon frontend-app-communications
 
 # This target is used by Travis.
 validate-no-uncommitted-package-lock-changes:

package.json

@@ -36,7 +36,8 @@
     "@edx/brand": "npm:@edx/[email protected]",
     "@edx/frontend-component-footer": "^12.0.0",
     "@edx/frontend-component-header": "^4.0.0",
-    "@edx/frontend-platform": "^4.0.1",
+    "@edx/frontend-platform": "^4.2.0",
+    "@edx/openedx-atlas": "^0.5.0",
     "@edx/paragon": "^20.20.0",
     "@edx/tinymce-language-selector": "1.1.0",
     "@fortawesome/fontawesome-svg-core": "1.2.36",

src/i18n/index.jsx → src/i18n/index.js

@@ -1,3 +1,7 @@
+import { messages as footerMessages } from '@edx/frontend-component-footer';
+import { messages as headerMessages } from '@edx/frontend-component-header';
+import { messages as paragonMessages } from '@edx/paragon';
+
 import arMessages from './messages/ar.json';
 import caMessages from './messages/ca.json';
 // no need to import en messages-- they are in the defaultMessage field
@@ -13,7 +17,7 @@ import ruMessages from './messages/ru.json';
 import thMessages from './messages/th.json';
 import ukMessages from './messages/uk.json';
 
-const messages = {
+const appMessages = {
   ar: arMessages,
   'es-419': es419Messages,
   fr: frMessages,
@@ -29,4 +33,9 @@ const messages = {
   uk: ukMessages,
 };
 
-export default messages;
+export default [
+  headerMessages,
+  footerMessages,
+  paragonMessages,
+  appMessages,
+];

src/index.jsx

@@ -7,12 +7,9 @@ import {
 import { AppProvider, AuthenticatedPageRoute, ErrorPage } from '@edx/frontend-platform/react';
 import ReactDOM from 'react-dom';
 
-import { messages as headerMessages } from '@edx/frontend-component-header';
-import { messages as footerMessages } from '@edx/frontend-component-footer';
-import { messages as paragonMessages } from '@edx/paragon';
 import { Helmet } from 'react-helmet';
 import { Switch } from 'react-router-dom';
-import appMessages from './i18n';
+import messages from './i18n';
 
 import './index.scss';
 import BulkEmailTool from './components/bulk-email-tool';
@@ -54,5 +51,5 @@ initialize({
       );
     },
   },
-  messages: [appMessages, headerMessages, footerMessages, paragonMessages],
+  messages,
 });

src/setupTest.js

@@ -8,7 +8,7 @@ import { configure as configureI18n, IntlProvider } from '@edx/frontend-platform
 import { configure as configureLogging, MockLoggingService } from '@edx/frontend-platform/logging';
 import { getConfig, mergeConfig } from '@edx/frontend-platform';
 import { configure as configureAuth, MockAuthService } from '@edx/frontend-platform/auth';
-import appMessages from './i18n';
+import messages from './i18n';
 
 jest.mock('@edx/frontend-platform/react/hooks', () => ({
   ...jest.requireActual('@edx/frontend-platform/react/hooks'),
@@ -47,13 +47,18 @@ export function initializeMockApp() {
   const i18nService = configureI18n({
     config: getConfig(),
     loggingService,
-    messages: [appMessages],
+    messages,
   });
 
   const authService = configureAuth(MockAuthService, { config: getConfig(), loggingService });
   return { loggingService, i18nService, authService };
 }
 
+jest.mock('@edx/frontend-platform/react/hooks', () => ({
+  ...jest.requireActual('@edx/frontend-platform/react/hooks'),
+  useTrackColorSchemeChoice: jest.fn(),
+}));
+
 function render(ui, options) {
   // eslint-disable-next-line react/prop-types
   function Wrapper({ children }) {