refactor: use APP_INITIALIZER for settings init

src/app/app.module.ts

@@ -15,31 +15,63 @@
 import {CommonModule, HashLocationStrategy, LocationStrategy, registerLocaleData} from '@angular/common';
 import {HttpClient} from '@angular/common/http';
 import localeDe from '@angular/common/locales/de';
-import {NgModule, Provider} from '@angular/core';
+import {APP_INITIALIZER, NgModule, Provider} from '@angular/core';
 import {BrowserModule} from '@angular/platform-browser';
 import {RouteReuseStrategy} from '@angular/router';
 import {SplashScreen} from '@ionic-native/splash-screen/ngx';
 import {StatusBar} from '@ionic-native/status-bar/ngx';
 import {IonicModule, IonicRouteStrategy} from '@ionic/angular';
-import {TranslateLoader, TranslateModule} from '@ngx-translate/core';
+import {TranslateLoader, TranslateModule, TranslateService} from '@ngx-translate/core';
 import {TranslateHttpLoader} from '@ngx-translate/http-loader';
 import moment from 'moment';
 import 'moment/min/locales';
-import {LoggerModule, NgxLoggerLevel} from 'ngx-logger';
+import {LoggerModule, NGXLogger, NgxLoggerLevel} from 'ngx-logger';
 import {environment} from '../environments/environment';
 import {AppRoutingModule} from './app-routing.module';
 import {AppComponent} from './app.component';
 import {ConfigModule} from './modules/config/config.module';
+import {ConfigProvider} from './modules/config/config.provider';
 import {DataModule} from './modules/data/data.module';
 import {MenuModule} from './modules/menu/menu.module';
 import {NewsModule} from './modules/news/news.module';
 import {SettingsModule} from './modules/settings/settings.module';
+import {SettingsProvider} from './modules/settings/settings.provider';
 import {StorageModule} from './modules/storage/storage.module';
 import {ThingTranslateModule} from './translation/thing-translate.module';
 import {fakeBackendProvider} from './_helpers/fake-backend.interceptor';
 
+import {initLogger} from './_helpers/ts-logger';
+
 registerLocaleData(localeDe);
 
+/**
+ * Initializes settings from Config before other components
+ *
+ * @param settingsProvider provider of settings (e.g. language that has been set)
+ */
+ export function initSettingsFactory(logger: NGXLogger,
+                                     settingsProvider: SettingsProvider,
+                                     configProvider: ConfigProvider,
+                                     translateService: TranslateService) {
+  return async () => {
+    initLogger(logger);
+    await settingsProvider.init();
+    try {
+      // set language from settings
+      if (configProvider.firstSession) {
+        await settingsProvider.setSettingValue('profile', 'language', translateService.getBrowserLang());
+      }
+      const languageCode = (await settingsProvider.getValue('profile', 'language')) as string;
+      // this language will be used as a fallback when a translation isn't found in the current language
+      translateService.setDefaultLang('en');
+      translateService.use(languageCode);
+      moment.locale(languageCode);
+    } catch (error) {
+      logger.warn(error);
+    }
+  };
+}
+
 /**
  * TODO
  *
@@ -60,6 +92,12 @@ const providers : Provider[] = [
     provide: LocationStrategy,
     useClass: HashLocationStrategy,
   },
+  {
+    provide: APP_INITIALIZER,
+    multi: true,
+    deps: [NGXLogger,SettingsProvider,ConfigProvider,TranslateService],
+    useFactory: initSettingsFactory,
+  },
 ];
 
 /**