Feature: Support for language selection

angular-legacy/shared/translation-service.ts

@@ -51,24 +51,27 @@ export class TranslationService {
     if(bootstrapElement.length > 0) {
      rootContext = $(bootstrapElement[0]).attr('rootContext');
     }
-    this.translateI18Next.init({
-        debug: true,                                                        // optional
-        returnNull: false,
-        returnEmptyString: true,                                           // optional	- but.. it's important, please see http://i18next.com/docs/options/!
-        // mapping: {"specific_backend_message": "message_for_translate"},     // optional
-        // browserLanguageDetector: injectableCustomLanguageDetectorService,   // optional - the specific application language detector (allows you to return the language of the user.
-        //                                                                     //            If it is absent, the service uses default "angular2 locale detector" behaviour using LOCALE_ID.
-        // // supportedLanguages: ['en', 'pt'],                                //            Therefore you can pass the optional supportedLanguages parameter which indicates your supported languages.
-        //                                                                     //            For example, LOCALE_ID = 'en-AU' or 'en-US' or 'en', you can pass only ['en'] -> locales/en/translation.json
-        //                                                                     //                         LOCALE_ID = 'pt-BR' or 'pt', you can pass only ['pt'] -> locales/pt/translation.json
-        // backend: injectableBackendConfigFactory                             // optional - allows to change "loadPath" i18next parameter
-        lng: 'en',
-        fallbackLng: 'en',
-        backend: { loadPath: `${rootContext}/locales/{{lng}}/{{ns}}.json?ts=${ts}` }
-    }).then(() => {
-      console.log(`Translator loaded...`);
-      this.translatorReady = true;
-      this.translatorLoaded();
+    this.configService.getConfig((config:any) => {
+      this.config = config;
+      this.translateI18Next.init({
+          debug: true,                                                        // optional
+          returnNull: false,
+          returnEmptyString: true,                                           // optional	- but.. it's important, please see http://i18next.com/docs/options/!
+          // mapping: {"specific_backend_message": "message_for_translate"},     // optional
+          // browserLanguageDetector: injectableCustomLanguageDetectorService,   // optional - the specific application language detector (allows you to return the language of the user.
+          //                                                                     //            If it is absent, the service uses default "angular2 locale detector" behaviour using LOCALE_ID.
+          // // supportedLanguages: ['en', 'pt'],                                //            Therefore you can pass the optional supportedLanguages parameter which indicates your supported languages.
+          //                                                                     //            For example, LOCALE_ID = 'en-AU' or 'en-US' or 'en', you can pass only ['en'] -> locales/en/translation.json
+          //                                                                     //                         LOCALE_ID = 'pt-BR' or 'pt', you can pass only ['pt'] -> locales/pt/translation.json
+          // backend: injectableBackendConfigFactory                             // optional - allows to change "loadPath" i18next parameter
+          lng: this.config.lang,
+          fallbackLng: 'en',
+          backend: { loadPath: `${rootContext}/locales/{{lng}}/{{ns}}.json?ts=${ts}` }
+      }).then(() => {
+        console.log(`Translator loaded...`);
+        this.translatorReady = true;
+        this.translatorLoaded();
+      });
     });
 
   }

angular/package.json

@@ -21,6 +21,7 @@
     "@researchdatabox/sails-ng-common": "^0.1.0",
     "angular-i18next": "^16.0.0",
     "i18next-http-backend": "^2.2.2",
+    "i18next-browser-languagedetector": "^7.1.0",
     "lodash-es": "^4.17.21",
     "luxon": "^3.4.2",
     "ngx-bootstrap": "^11.0.2",

angular/projects/researchdatabox/portal-ng-common/package.json

@@ -9,6 +9,7 @@
     "@angular/core": "^15.0.0",
     "angular-i18next": "^15.0.5",
     "i18next-http-backend": "^2.1.1",
+    "i18next-browser-languagedetector": "^7.1.0",
     "numeral": "^2.0.6"
   },
   "devDependencies": {

angular/projects/researchdatabox/portal-ng-common/src/lib/translation.service.ts

@@ -26,6 +26,7 @@ import { Service } from './service.interface';
 
 import { I18NEXT_SERVICE, ITranslationService, defaultInterpolationFormat, I18NextModule } from 'angular-i18next';
 import HttpApi from 'i18next-http-backend';
+import LanguageDetector from 'i18next-browser-languagedetector';
 import { ConfigService } from './config.service';
 import { UtilityService } from './utility.service';
 import { LoggerService  } from './logger.service';
@@ -61,7 +62,7 @@ export class TranslationService implements Service {
       // order and from where user language should be detected
       order: ['cookie'],
       // keys or params to lookup language from
-      lookupCookie: 'lang',
+      lookupCookie: 'lng',
       // cache user language on
       caches: ['cookie'],
       // optional expire and domain for set cookie
@@ -86,7 +87,7 @@ export class TranslationService implements Service {
 
   async initTranslator(): Promise<any> {
     await this.utilService.waitForDependencies([this.configService]);
-    this.config = this.configService.getConfig();
+    this.config = await this.configService.getConfig();
     if (!_isEmpty(_get(this.config, 'i18NextOpts'))) {
       this.i18NextOpts = _get(this.config, 'i18NextOpts');
       if (_isUndefined(_get(this.i18NextOpts, 'backend.loadPath'))) {
@@ -97,13 +98,15 @@ export class TranslationService implements Service {
       }
     } else {
       // default value...
+      this.loggerService.info(`Language service using default config`);
       this.i18NextOpts = this.i18NextOptsDefault;
       _set(this.i18NextOpts, 'backend.loadPath', this.loadPath);
     }
     this.loggerService.log(`Using language loadpath: ${this.loadPath}`);
     try {
     	await this.i18NextService
 	              .use(HttpApi)
+                .use(LanguageDetector)
 	              .init(this.i18NextOpts);
       this.loggerService.info(`Language service ready`);
 	    this.translatorReady = true;

api/policies/setLang.js

@@ -0,0 +1,8 @@
+/**
+ * 
+ * Sets the language code, currently implemented as a session attribute
+ * 
+ */
+module.exports = function(req, res, next) {
+  TranslationService.handle(req, res, next);
+};

assets/locales/en/translation.json

@@ -752,5 +752,7 @@
   "local-auth-login": "Login",
   "oidc-default-unknown-error": "Login unsuccessful contact your system administrator",
   "oidc-user-doesnt-exist-in-tenant": "User account from identity provider does not exist in tenant. The account needs to be added as an external user in the tenant first.",
-  "oidc-user-doesnt-exist-in-tenant-detail": "For email {{-email}} and url {{-url}} and tenant {{-name}}"
+  "oidc-user-doesnt-exist-in-tenant-detail": "For email {{-email}} and url {{-url}} and tenant {{-name}}",
+  "lang-en": "English",
+  "lang-mri": "Māori"
 }