import { Component , Inject , OnDestroy , OnInit } from '@angular/core' ; import { select , Store } from '@ngrx/store' ; import { TranslateService } from '@ngx-translate/core' ; import { filter , takeUntil , tap } from 'rxjs/operators' ; import { Subject } from 'rxjs/Subject' ; import { LANGUAGES } from 'app/core/injection-tokens' ; import { IStore } from 'app/shared/interfaces/store.interface' ; import * as UiActions from 'app/shared/states/ui/ui.actions' ; import { getLanguage } from 'app/shared/states/ui/ui.selectors' ; import { environment } from 'environments/environment' ; @ Component ( { selector : 'app-root' , templateUrl : './app.component.html' , styleUrls : [ './app.component.scss' ] , } ) export class AppComponent implements OnInit , OnDestroy { private onDestroy$ = new Subject < void > ( ) ; constructor ( private translate , @ Inject ( LANGUAGES ) public languages , private store$ ) { } ngOnInit ( ) { const browserLanguage = this . translate . getBrowserLang ( ) ; const defaultLanguage = environment . useBrowserLanguageAsDefault && this . languages . includes ( browserLanguage ) ? browserLanguage : this . languages [ 0 ] ; this . translate . setDefaultLang ( defaultLanguage ) ; this . store$ . dispatch ( new UiActions . SetLanguage ( { language : defaultLanguage } ) ) ; this . store$ . pipe ( select ( getLanguage ) , takeUntil ( this . onDestroy$ ) , filter ( language => ! ! language ) , tap ( language => this . translate . use ( language ) ) ) . subscribe ( ) ; } ngOnDestroy ( ) { this . onDestroy$ . next ( ) ; this . onDestroy$ . complete ( ) ; } }