Update i18n script and message bundle loading

- Remove unnecessary wrapper object in message bundles - Replace config.json with .env files - Add new script to run in 'i18n mode' with all build locales supported - Update dev readme with new scripts and config files - Update message extraction script to use formatjs cli instead of babel - Add formatjs linter
tektoncd · Aug 11, 2023 · a8901ab · a8901ab
1 parent f602958
commit a8901ab
Show file tree

Hide file tree

Showing 27 changed files with 3,356 additions and 2,885 deletions.
diff --git a/.env b/.env
@@ -0,0 +1,3 @@
+VITE_LOCALES_DEFAULT=en
+VITE_LOCALES_SUPPORTED=en,ja,zh-Hans
+VITE_LOCALES_BUILD=de,en,es,fr,it,ja,ko,pt,zh-Hans,zh-Hant
diff --git a/.env.i18n b/.env.i18n
@@ -0,0 +1 @@
+VITE_LOCALES_SUPPORTED=$VITE_LOCALES_BUILD
diff --git a/.eslintrc.cjs b/.eslintrc.cjs
@@ -45,11 +45,17 @@ module.exports = {
     ecmaVersion: 2021,
     sourceType: 'module'
   },
-  plugins: ['notice', 'react'],
+  plugins: ['notice', 'react', 'formatjs'],
   rules: {
     curly: ['error', 'all'],
     'cypress/assertion-before-screenshot': 'warn',
     'default-param-last': 'off',
+    'formatjs/enforce-default-message': 'error',
+    'formatjs/enforce-id': 'error',
+    'formatjs/no-complex-selectors': 'error',
+    'formatjs/no-literal-string-in-jsx': 'error',
+    'formatjs/no-multiple-whitespaces': 'error',
+    'formatjs/no-multiple-plurals': 'error',
     'import/named': 'off',
     'import/no-cycle': 'off',
     'import/no-extraneous-dependencies': 'off',

diff --git a/config_frontend/config.json b/config_frontend/config.json
diff --git a/docs/dev/README.md b/docs/dev/README.md
@@ -196,9 +196,9 @@ This project uses `react-intl` for internationalization, and provides a script t
 
 **Note:** `src/nls/messages_en.json` should **NOT** be edited manually, instead edit the defaultMessage in the code and re-run the script.
 
-Configuration for the message bundles can be found in `config_frontend/config.json`:
-- `locales.build` lists the locales for which message bundles will be produced
-- `locales.supported` lists the locales that will be loaded at runtime based on browser language settings
+Configuration for the message bundles can be found in `.env`:
+- `VITE_LOCALES_BUILD` lists the locales for which message bundles will be produced
+- `VITE_LOCALES_SUPPORTED` lists the locales that will be loaded at runtime based on browser language settings
 
 For testing and development purposes the list of supported locales can be overridden to include all built locales by adding a known value to `localStorage`:
 
@@ -208,6 +208,10 @@ and refreshing the page. When done, to return to normal production behaviour, re
 
 `localStorage.removeItem('tkn-locale-dev');`
 
+You can also run the Dashboard in 'i18n mode' which enables all built locales via an override in `.env.i18n`:
+
+`npm run i18n:start`
+
 ## Storybook
 
 Run `npm run storybook` to start [storybook](https://storybook.js.org/) in development mode. It automatically opens