From 3ad62f586bdac58093ca48467b174e66938a294c Mon Sep 17 00:00:00 2001 From: Jake McDermott Date: Mon, 11 May 2020 16:09:24 -0400 Subject: [PATCH] Update i18n for new build tools --- awx/ui_next/.linguirc | 2 +- awx/ui_next/CONTRIBUTING.md | 3 ++- awx/ui_next/package-lock.json | 6 ++++++ awx/ui_next/package.json | 1 + 4 files changed, 10 insertions(+), 2 deletions(-) diff --git a/awx/ui_next/.linguirc b/awx/ui_next/.linguirc index 7af86ec8ad..e450bc0a02 100644 --- a/awx/ui_next/.linguirc +++ b/awx/ui_next/.linguirc @@ -1,5 +1,5 @@ { - "localeDir": "build/locales/", + "localeDir": "src/locales/", "srcPathDirs": ["src/"], "format": "po" } diff --git a/awx/ui_next/CONTRIBUTING.md b/awx/ui_next/CONTRIBUTING.md index e7bafdc445..f2b41cee68 100644 --- a/awx/ui_next/CONTRIBUTING.md +++ b/awx/ui_next/CONTRIBUTING.md @@ -143,6 +143,7 @@ Inside these folders, the internal structure is: - **/api** - All classes used to interact with API's are found here. See [AWX REST API Interaction](#awx-rest-api-interaction) for more information. - **/components** - All generic components that are meant to be used in multiple contexts throughout awx. Things like buttons, tabs go here. - **/contexts** - Components which utilize react's context api. +- **/locales** - [Internationalization](#internationalization) config and source files. - **/screens** - Based on the various routes of awx. - **/shared** - Components that are meant to be used specifically by a particular route, but might be sharable across pages of that route. For example, a form component which is used on both add and edit screens. - **/util** - Stateless helper functions that aren't tied to react. @@ -315,7 +316,7 @@ You can learn more about the ways lingui and its React helpers at [this link](ht ### Setting up .po files to give to translation team 1) `npm run add-locale` to add the language that you want to translate to (we should only have to do this once and the commit to repo afaik). Example: `npm run add-locale en es fr` # Add English, Spanish and French locale -2) `npm run extract-strings` to create .po files for each language specified. The .po files will be placed in src/locales but this is configurable. +2) `npm run extract-strings` to create .po files for each language specified. The .po files will be placed in src/locales. 3) Open up the .po file for the language you want to test and add some translations. In production we would pass this .po file off to the translation team. 4) Once you've edited your .po file (or we've gotten a .po file back from the translation team) run `npm run compile-strings`. This command takes the .po files and turns them into a minified JSON object and can be seen in the `messages.js` file in each locale directory. These files get loaded at the App root level (see: App.jsx). 5) Change the language in your browser and reload the page. You should see your specified translations in place of English strings. diff --git a/awx/ui_next/package-lock.json b/awx/ui_next/package-lock.json index 629add6375..19dca9d44d 100644 --- a/awx/ui_next/package-lock.json +++ b/awx/ui_next/package-lock.json @@ -3058,6 +3058,12 @@ } } }, + "babel-core": { + "version": "7.0.0-bridge.0", + "resolved": "https://registry.npmjs.org/babel-core/-/babel-core-7.0.0-bridge.0.tgz", + "integrity": "sha512-poPX9mZH/5CSanm50Q+1toVci6pv5KSRv/5TWCwtzQS5XEwn40BcCrgIeMFWP9CKKIniKXNxoIOnOq4VVlGXhg==", + "dev": true + }, "babel-eslint": { "version": "10.1.0", "resolved": "https://registry.npmjs.org/babel-eslint/-/babel-eslint-10.1.0.tgz", diff --git a/awx/ui_next/package.json b/awx/ui_next/package.json index e44f57ec11..a8226dea75 100644 --- a/awx/ui_next/package.json +++ b/awx/ui_next/package.json @@ -60,6 +60,7 @@ "@lingui/cli": "^2.9.1", "@lingui/macro": "^2.9.1", "@nteract/mockument": "^1.0.4", + "babel-core": "^7.0.0-bridge.0", "enzyme": "^3.10.0", "enzyme-adapter-react-16": "^1.14.0", "enzyme-to-json": "^3.3.5",