- Support Arabic, FrCanadian/Belgian in User Interface (#3271)

packages/neuron-ui/.storybook/electron.js

@@ -1,5 +1,5 @@
 const sendSyncValues = {
-  'get-locale': ('zh', 'fr', 'es'),
+  'get-locale': ('zh', 'fr', 'es', 'ar'),
   'get-version': '0.103.1',
 }
 

packages/neuron-ui/package.json

@@ -109,5 +109,17 @@
   },
   "resolutions": {
     "react-i18next": "14.0.0"
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
   }
-}
+}

packages/neuron-ui/src/locales/en.json

@@ -470,10 +470,13 @@
       },
       "locale": {
         "en": "English",
-        "en-US": "English(United States)",
-        "zh": "中文(简体)",
-        "zh-TW": "中文(繁體)",
+        "en-US": "English (United States)",
+        "zh": "中文 (简体)",
+        "zh-TW": "中文 (繁體)",
+        "ar": "العربية",
         "fr": "Français",
+        "fr-CA": "Français (Canada)",
+        "fr-BE": "Français (Belgique)",
         "es": "Español"
       },
       "data": {

packages/neuron-ui/src/locales/es.json

@@ -453,10 +453,13 @@
       },
       "locale": {
         "en": "English",
-        "en-US": "English(United States)",
-        "zh": "中文(简体)",
-        "zh-TW": "中文(繁體)",
+        "en-US": "English (United States)",
+        "zh": "中文 (简体)",
+        "zh-TW": "中文 (繁體)",
+        "ar": "العربية",
         "fr": "Français",
+        "fr-CA": "Français (Canada)",
+        "fr-BE": "Français (Belgique)",
         "es": "Español"
       },
       "data": {

packages/neuron-ui/src/locales/fr.json

@@ -460,10 +460,13 @@
       },
       "locale": {
         "en": "English",
-        "en-US": "English(United States)",
-        "zh": "中文(简体)",
-        "zh-TW": "中文(繁體)",
+        "en-US": "English (United States)",
+        "zh": "中文 (简体)",
+        "zh-TW": "中文 (繁體)",
+        "ar": "العربية",
         "fr": "Français",
+        "fr-CA": "Français (Canada)",
+        "fr-BE": "Français (Belgique)",
         "es": "Español"
       },
       "data": {

packages/neuron-ui/src/locales/zh-tw.json

@@ -464,10 +464,13 @@
       },
       "locale": {
         "en": "English",
-        "en-US": "English(United States)",
-        "zh": "中文(简体)",
-        "zh-TW": "中文(繁體)",
+        "en-US": "English (United States)",
+        "zh": "中文 (简体)",
+        "zh-TW": "中文 (繁體)",
+        "ar": "العربية",
         "fr": "Français",
+        "fr-CA": "Français (Canada)",
+        "fr-BE": "Français (Belgique)",
         "es": "Español"
       },
       "data": {

packages/neuron-ui/src/locales/zh.json

@@ -463,10 +463,13 @@
       },
       "locale": {
         "en": "English",
-        "en-US": "English(United States)",
-        "zh": "中文(简体)",
-        "zh-TW": "中文(繁體)",
+        "en-US": "English (United States)",
+        "zh": "中文 (简体)",
+        "zh-TW": "中文 (繁體)",
+        "ar": "العربية",
         "fr": "Français",
+        "fr-CA": "Français (Canada)",
+        "fr-BE": "Français (Belgique)",
         "es": "Español"
       },
       "data": {

packages/neuron-ui/src/tests/calendar/index.test.ts

@@ -111,6 +111,11 @@ describe('Get Local Month Short Names', () => {
     expect(getLocalMonthShortNames('fr')).toEqual(names)
   })
 
+  it('Arabic', () => {
+    const names = ['ينا.', 'فبر.', 'مارس.', 'أبر.', 'مايو.', 'يون.', 'يول.', 'أغس.', 'سبت.', 'أكت.', 'نوف.', 'ديس.']
+    expect(getLocalMonthShortNames('ar')).toEqual(names)
+  })
+
   it('Spanish', () => {
     const names = ['ene', 'feb', 'mar', 'abr', 'may', 'jun', 'jul', 'ago', 'sept', 'oct', 'nov', 'dic']
     expect(getLocalMonthShortNames('es')).toEqual(names)
@@ -157,6 +162,24 @@ describe('Get Local Month Names', () => {
     expect(getLocalMonthNames('fr')).toEqual(names)
   })
 
+  it('Arabic', () => {
+    const names = [
+      'يناير',
+      'فبراير',
+      'مارس',
+      'أبريل',
+      'مايو',
+      'يونيو',
+      'يوليو',
+      'أغسطس',
+      'سبتمبر',
+      'أكتوبر',
+      'نوفمبر',
+      'ديسمبر',
+    ]
+    expect(getLocalMonthNames('ar')).toEqual(names)
+  })
+
   it('Spanish', () => {
     const names = [
       'enero',
@@ -197,6 +220,11 @@ describe('Get Local Week Names', () => {
     expect(getLocalWeekNames('fr')).toEqual(names)
   })
 
+  it('Arabic', () => {
+    const names = ['ح', 'إ', 'ث', 'أ', 'خ', 'ج', 'س']
+    expect(getLocalWeekNames('ar')).toEqual(names)
+  })
+
   it('Traditional Chinese', () => {
     const names = ['日', '一', '二', '三', '四', '五', '六']
     expect(getLocalWeekNames('zh-TW')).toEqual(names)

packages/neuron-ui/src/utils/const.ts

@@ -50,7 +50,7 @@ export const DEFAULT_SUDT_FIELDS = {
   CKBSymbol: 'CKB',
   CKBDecimal: '8',
 }
-export const LOCALES = ['zh', 'zh-TW', 'en', 'en-US', 'fr', 'es'] as const
+export const LOCALES = ['zh', 'zh-TW', 'en', 'en-US', 'ar', 'fr', 'fr-CA', 'fr-BE', 'es'] as const
 
 // address property
 export const SHORT_ADDR_LENGTH = 46

packages/neuron-ui/src/utils/i18n.ts

@@ -7,14 +7,18 @@ import en from 'locales/en.json'
 import zhTW from 'locales/zh-tw.json'
 import fr from 'locales/fr.json'
 import es from 'locales/es.json'
+import ar from 'locales/ar.json'
 
 i18n.use(initReactI18next).init({
   resources: {
     en,
     fr,
+    ar,
     es,
     zh,
     'zh-TW': zhTW,
+    'fr-CA': fr,
+    'fr-BE': fr,
   },
   lng: getLocale(),
   fallbackLng: {

packages/neuron-wallet/electron-builder.yml

@@ -73,7 +73,7 @@ mac:
   gatekeeperAssess: false
   entitlements: assets/entitlements.plist
   entitlementsInherit: assets/entitlements.plist
-  electronLanguages: ["en", "zh", "zh_CN", "zh_TW"]
+  electronLanguages: ["en", "zh", "zh_CN", "zh_TW", "ar", "fr"]
   target:
     - target: default
       arch: