fix: appearance translations [DHIS2-15662] (#1259)

dhis2 · Oct 6, 2023 · 41ab3a1 · 41ab3a1
1 parent 2856763
commit 41ab3a1
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 19 deletions.
diff --git a/i18n/en.pot b/i18n/en.pot
@@ -5,8 +5,8 @@ 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: 2023-02-27T15:56:53.590Z\n"
-"PO-Revision-Date: 2023-02-27T15:56:53.590Z\n"
+"POT-Creation-Date: 2023-08-24T10:48:48.806Z\n"
+"PO-Revision-Date: 2023-08-24T10:48:48.806Z\n"
 
 msgid "Failed to load: {{error}}"
 msgstr "Failed to load: {{error}}"
@@ -35,8 +35,8 @@ msgstr "Error uploading file: {{error}}"
 msgid "Cancel upload"
 msgstr "Cancel upload"
 
-msgid "System default (fallback)"
-msgstr "System default (fallback)"
+msgid "System default ({{language}})"
+msgstr "System default ({{language}})"
 
 msgid "Set the main field value before adding a translation"
 msgstr "Set the main field value before adding a translation"
@@ -680,6 +680,9 @@ msgstr "TLS"
 msgid "Email sender"
 msgstr "Email sender"
 
+msgid "The address that outgoing messages are sent from."
+msgstr "The address that outgoing messages are sent from."
+
 msgid "Send me a test email"
 msgstr "Send me a test email"
 

diff --git a/src/localized-text/LocalizedAppearanceEditor.component.js b/src/localized-text/LocalizedAppearanceEditor.component.js
@@ -11,8 +11,6 @@ import settingsActions from '../settingsActions.js'
 import settingsKeyMapping from '../settingsKeyMapping.js'
 import settingsStore from '../settingsStore.js'
 
-const systemDefaultText = i18n.t('System default (fallback)')
-
 /**
  * To understand why this component works the way it does, some background knowledge is required:
  *
@@ -62,6 +60,13 @@ const LOCALIZED_SETTING_KEYS = [
 
 class LocalizedTextEditor extends React.Component {
     static getLocaleName(code) {
+        if (code === SYSTEM_DEFAULT) {
+            return i18n.t('System default ({{language}})', {
+                language: LocalizedTextEditor.getLocaleName(
+                    settingsStore.state.keyUiLocale
+                ),
+            })
+        }
         return (
             (configOptionStore.state &&
                 configOptionStore
@@ -77,12 +82,10 @@ class LocalizedTextEditor extends React.Component {
         super(props, context)
 
         this.state = {
-            locale: settingsStore.state && settingsStore.state.keyUiLocale,
+            locale: SYSTEM_DEFAULT,
             localeName:
                 settingsStore.state &&
-                LocalizedTextEditor.getLocaleName(
-                    settingsStore.state.keyUiLocale
-                ),
+                LocalizedTextEditor.getLocaleName(SYSTEM_DEFAULT),
             settings: null,
             error: false,
         }
@@ -95,10 +98,8 @@ class LocalizedTextEditor extends React.Component {
         this.getAppearanceSettings()
         this.settingsStoreSubscription = settingsStore.subscribe(() => {
             this.setState({
-                locale: settingsStore.state.keyUiLocale,
-                localeName: LocalizedTextEditor.getLocaleName(
-                    settingsStore.state.keyUiLocale
-                ),
+                locale: SYSTEM_DEFAULT,
+                localeName: LocalizedTextEditor.getLocaleName(SYSTEM_DEFAULT),
             })
         })
     }
@@ -187,7 +188,7 @@ class LocalizedTextEditor extends React.Component {
 
         if (defaultValue) {
             return {
-                helpText: `${systemDefaultText}: ${defaultValue}`,
+                helpText: LocalizedTextEditor.getLocaleName(SYSTEM_DEFAULT),
             }
         }
 
@@ -228,9 +229,9 @@ class LocalizedTextEditor extends React.Component {
             value: this.state.settings[key] || '',
             component: TextField,
             props: {
-                floatingLabelText: `${settingsKeyMapping[key].label} – ${
-                    this.state.localeName || systemDefaultText
-                }`,
+                floatingLabelText: `${
+                    settingsKeyMapping[key].label
+                } – ${LocalizedTextEditor.getLocaleName(this.state.locale)}`,
                 changeEvent: 'onBlur',
                 style: styles.field,
                 multiLine: true,
@@ -246,7 +247,7 @@ class LocalizedTextEditor extends React.Component {
     render() {
         const systemDefaultOption = {
             id: SYSTEM_DEFAULT,
-            displayName: systemDefaultText,
+            displayName: LocalizedTextEditor.getLocaleName(SYSTEM_DEFAULT),
         }
         const optionStoreState = configOptionStore.getState()
         const uiLocales = (optionStoreState && optionStoreState.uiLocales) || []