From 291980aa18f6c7524a76c8144410c4d68be49369 Mon Sep 17 00:00:00 2001
From: Austin McGee <947888+amcgee@users.noreply.github.com>
Date: Thu, 3 Oct 2019 14:35:54 +0200
Subject: [PATCH] fix: make i18n consistently functional (#98)
* fix: make i18n consistently functional
* chore: remove unused import from locales template
---
cli/src/commands/build.js | 2 +-
cli/src/commands/start.js | 2 +-
cli/src/lib/i18n/templates/locales.hbs | 12 ++----
examples/simple-app/i18n/en.pot | 7 +++-
examples/simple-app/i18n/es.pot | 15 ++++++++
examples/simple-app/i18n/fr.pot | 3 ++
examples/simple-app/src/App.js | 12 +++++-
shell/adapter/i18n/es.po | 42 +++++++++++++++++++++
shell/adapter/i18n/{fr.pot => fr.po} | 9 +++--
shell/adapter/src/AuthBoundary/index.js | 5 +--
shell/adapter/src/AuthBoundary/useLocale.js | 31 +++++++++++++++
shell/adapter/src/i18n.js | 20 ----------
12 files changed, 121 insertions(+), 39 deletions(-)
create mode 100644 examples/simple-app/i18n/es.pot
create mode 100644 shell/adapter/i18n/es.po
rename shell/adapter/i18n/{fr.pot => fr.po} (82%)
create mode 100644 shell/adapter/src/AuthBoundary/useLocale.js
delete mode 100644 shell/adapter/src/i18n.js
diff --git a/cli/src/commands/build.js b/cli/src/commands/build.js
index f5e24edda..754273c67 100644
--- a/cli/src/commands/build.js
+++ b/cli/src/commands/build.js
@@ -78,7 +78,7 @@ const handler = async ({
await i18n.generate({
input: paths.i18nStrings,
output: paths.i18nLocales,
- namespace: config.name || 'default',
+ namespace: 'default',
})
if (config.type === 'app') {
diff --git a/cli/src/commands/start.js b/cli/src/commands/start.js
index 334e90728..586101758 100644
--- a/cli/src/commands/start.js
+++ b/cli/src/commands/start.js
@@ -35,7 +35,7 @@ const handler = async ({ cwd, force, shell: shellSource }) => {
await i18n.generate({
input: paths.i18nStrings,
output: paths.i18nLocales,
- namespace: config.name || 'default',
+ namespace: 'default',
})
reporter.info('Bootstrapping local appShell...')
diff --git a/cli/src/lib/i18n/templates/locales.hbs b/cli/src/lib/i18n/templates/locales.hbs
index bdd0ce1be..6cde1a492 100644
--- a/cli/src/lib/i18n/templates/locales.hbs
+++ b/cli/src/lib/i18n/templates/locales.hbs
@@ -7,18 +7,14 @@
//
//------------------------------------------------------------------------------
import i18n from '@dhis2/d2-i18n';
-import moment from 'moment';
-{{#each locales}}
-import 'moment/locale/{{ this }}';
-{{/each}}
+
{{#each langs as |lang key|}}
import {{ lang }}Translations from './{{ lang }}/translations.json';
{{/each}}
+
const namespace = '{{ namespace }}';
-moment.locale('en');
{{#each langs as |lang key|}}
i18n.addResources('{{ lang }}', namespace, {{ lang }}Translations);
{{/each}}
-i18n.setDefaultNamespace(namespace);
-i18n.changeLanguage('en');
-export default i18n;
\ No newline at end of file
+
+export default i18n;
diff --git a/examples/simple-app/i18n/en.pot b/examples/simple-app/i18n/en.pot
index 1dbf2f044..571c74148 100644
--- a/examples/simple-app/i18n/en.pot
+++ b/examples/simple-app/i18n/en.pot
@@ -5,8 +5,11 @@ msgstr ""
"Content-Type: text/plain; charset=utf-8\n"
"Content-Transfer-Encoding: 8bit\n"
"Plural-Forms: nplurals=2; plural=(n != 1)\n"
-"POT-Creation-Date: 2019-06-27T12:10:45.485Z\n"
-"PO-Revision-Date: 2019-06-27T12:10:45.485Z\n"
+"POT-Creation-Date: 2019-10-02T21:55:28.107Z\n"
+"PO-Revision-Date: 2019-10-02T21:55:28.107Z\n"
msgid "Hello {{name}}"
msgstr ""
+
+msgid "Have a great {{dayOfTheWeek}}!"
+msgstr ""
diff --git a/examples/simple-app/i18n/es.pot b/examples/simple-app/i18n/es.pot
new file mode 100644
index 000000000..bd9ef7309
--- /dev/null
+++ b/examples/simple-app/i18n/es.pot
@@ -0,0 +1,15 @@
+msgid ""
+msgstr ""
+"Project-Id-Version: i18next-conv\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=utf-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1)\n"
+"POT-Creation-Date: 2019-05-20T12:03:17.005Z\n"
+"PO-Revision-Date: 2019-05-20T12:03:17.005Z\n"
+
+msgid "Hello {{name}}"
+msgstr "Hola {{name}}"
+
+msgid "Have a great {{dayOfTheWeek}}!"
+msgstr "Que tenga un buen {{dayOfTheWeek}}!"
\ No newline at end of file
diff --git a/examples/simple-app/i18n/fr.pot b/examples/simple-app/i18n/fr.pot
index 25665e550..620cde254 100644
--- a/examples/simple-app/i18n/fr.pot
+++ b/examples/simple-app/i18n/fr.pot
@@ -10,3 +10,6 @@ msgstr ""
msgid "Hello {{name}}"
msgstr "Bonjour {{name}}"
+
+msgid "Have a great {{dayOfTheWeek}}!"
+msgstr "Bonne {{dayOfTheWeek}}!"
\ No newline at end of file
diff --git a/examples/simple-app/src/App.js b/examples/simple-app/src/App.js
index 04e66db17..4de3bad75 100644
--- a/examples/simple-app/src/App.js
+++ b/examples/simple-app/src/App.js
@@ -1,5 +1,6 @@
import React from 'react'
import i18n from './locales'
+import moment from 'moment'
import { useDataQuery } from '@dhis2/app-runtime'
import style from './App.style'
@@ -16,7 +17,16 @@ const Component = () => {
{error && ERROR}
{loading && ...}
{data && (
- {i18n.t('Hello {{name}}', { name: data.me.name })}
+ <>
+ {i18n.t('Hello {{name}}', { name: data.me.name })}
+
+ {i18n.t('Have a great {{dayOfTheWeek}}!', {
+ dayOfTheWeek: moment.weekdays(true)[
+ moment().weekday()
+ ],
+ })}
+
+
)}
)
diff --git a/shell/adapter/i18n/es.po b/shell/adapter/i18n/es.po
new file mode 100644
index 000000000..4e4e0de49
--- /dev/null
+++ b/shell/adapter/i18n/es.po
@@ -0,0 +1,42 @@
+msgid ""
+msgstr ""
+"Project-Id-Version: i18next-conv\n"
+"MIME-Version: 1.0\n"
+"Content-Type: text/plain; charset=utf-8\n"
+"Content-Transfer-Encoding: 8bit\n"
+"Plural-Forms: nplurals=2; plural=(n != 1)\n"
+"POT-Creation-Date: 2019-06-18T09:28:13.445Z\n"
+"PO-Revision-Date: 2019-06-18T09:28:13.445Z\n"
+
+msgid "Please sign in"
+msgstr "Por favor iniciar sesión"
+
+msgid "Server"
+msgstr "Servidor"
+
+msgid "Username"
+msgstr "Nombre de usuario"
+
+msgid "Password"
+msgstr "Contraseña"
+
+msgid "Sign in"
+msgstr "Iniciar sesión"
+
+msgid "An error occurred in the DHIS2 application."
+msgstr ""
+
+msgid "Something went wrong"
+msgstr ""
+
+msgid "Refresh to try again"
+msgstr ""
+
+msgid "Hide technical details"
+msgstr ""
+
+msgid "Show technical details"
+msgstr ""
+
+msgid "The following information may be requested by technical support."
+msgstr ""
diff --git a/shell/adapter/i18n/fr.pot b/shell/adapter/i18n/fr.po
similarity index 82%
rename from shell/adapter/i18n/fr.pot
rename to shell/adapter/i18n/fr.po
index cad362f24..834849b31 100644
--- a/shell/adapter/i18n/fr.pot
+++ b/shell/adapter/i18n/fr.po
@@ -9,7 +9,10 @@ msgstr ""
"PO-Revision-Date: 2019-06-18T09:28:13.445Z\n"
msgid "Please sign in"
-msgstr "Se connecter"
+msgstr "Se connecter, s'il vous plait"
+
+msgid "Server"
+msgstr "Serveur"
msgid "Username"
msgstr "Nom d'utilizateur"
@@ -18,9 +21,9 @@ msgid "Password"
msgstr "Mot de passe"
msgid "Sign in"
-msgstr "Se connecter"
+msgstr "Connexion"
-msgid "An error occurred in the DHIS2 Maps application."
+msgid "An error occurred in the DHIS2 application."
msgstr ""
msgid "Something went wrong"
diff --git a/shell/adapter/src/AuthBoundary/index.js b/shell/adapter/src/AuthBoundary/index.js
index 88dea44ef..dbc607fa7 100644
--- a/shell/adapter/src/AuthBoundary/index.js
+++ b/shell/adapter/src/AuthBoundary/index.js
@@ -1,9 +1,9 @@
import React from 'react'
import { useDataQuery } from '@dhis2/app-runtime'
-import i18n from '../locales'
import { ScreenCover, CircularLoader } from '@dhis2/ui-core'
import { LoginModal } from './LoginModal'
+import { useLocale } from './useLocale'
const settingsQuery = {
userSettings: {
@@ -12,8 +12,8 @@ const settingsQuery = {
}
export const AuthBoundary = ({ url, children }) => {
- i18n.changeLanguage(window.navigator.language)
const { loading, error, data } = useDataQuery(settingsQuery)
+ useLocale(data && data.userSettings.keyUiLocale)
if (loading) {
return (
@@ -27,6 +27,5 @@ export const AuthBoundary = ({ url, children }) => {
return
}
- i18n.changeLanguage(data.userSettings.keyUiLocale)
return children
}
diff --git a/shell/adapter/src/AuthBoundary/useLocale.js b/shell/adapter/src/AuthBoundary/useLocale.js
new file mode 100644
index 000000000..d8458e384
--- /dev/null
+++ b/shell/adapter/src/AuthBoundary/useLocale.js
@@ -0,0 +1,31 @@
+import { useEffect } from 'react'
+import i18n from '@dhis2/d2-i18n'
+import moment from 'moment'
+
+i18n.setDefaultNamespace('default')
+
+const simplifyLocale = locale => {
+ const idx = locale.indexOf('-')
+ if (idx === -1) {
+ return locale
+ }
+ return locale.substr(0, idx)
+}
+
+const setGlobalLocale = locale => {
+ if (locale !== 'en' && locale !== 'en-us') {
+ import(`moment/locale/${locale}`).catch(() => {
+ /* ignore */
+ })
+ }
+ moment.locale(locale)
+
+ const simplifiedLocale = simplifyLocale(locale)
+ i18n.changeLanguage(simplifiedLocale)
+}
+
+export const useLocale = locale => {
+ useEffect(() => {
+ setGlobalLocale(locale || window.navigator.language)
+ }, [locale])
+}
diff --git a/shell/adapter/src/i18n.js b/shell/adapter/src/i18n.js
deleted file mode 100644
index fa6cf8c86..000000000
--- a/shell/adapter/src/i18n.js
+++ /dev/null
@@ -1,20 +0,0 @@
-import React, { useEffect } from 'react'
-import i18n from '@dhis2/d2-i18ns'
-
-export const addResources = (namespace, translations) => {
- Object.entries(translations).forEach(([language, translationStrings]) => {
- i18n.addResources(language, namespace, translationStrings)
- import(`moment/locale/${language}`)
- })
-}
-
-export const useInternationalization = defaultNamespace => {
- useEffect(() => {
- moment.locale('fr')
- i18n.changeLanguage('fr')
-
- if (defaultNamespace) {
- i18n.setDefaultNamespace(defaultNamespace)
- }
- })
-}