Untitled

import { Component, OnInit } from '@angular/core';
import { TranslateService } from '@ngx-translate/core';
import { Store } from '@ngrx/store';
import { SelectItem } from 'primeng/api';
import { Observable, timer } from 'rxjs';
import { map, takeUntil, tap } from 'rxjs/operators';
import * as moment from 'moment-timezone';

import {
  authActions,
  PlantSelectionData,
  selectCurrentUserPlatform,
  selectedPlantActions,
  selectedPlantSelectors,
  selectIsAuthenticated,
  selectUserPlatforms,
  Theme,
  UserPlatform,
  UserPlatformPlant,
  userPreferencesActions,
  userPreferencesSelectors
} from '@gestamp/core-services';
import { HeaderSettings, Line, MenuSelectedPlant, Plant, Platform, SelectedPlant } from '@gestamp/core-components';

import { environment } from '@environments/environment';

import { AppState } from '@store/state/app.state';

import { CommonService } from '@services/common/common.service';
import { LanguageService } from '@services/language/language.service';
import { platformThemes } from '@core/config/themes.config';

import { BaseComponent } from '@shared/components/base';
import { ThemeService } from '@app/core/services/theme/theme.service';
import { PlantSelectionService } from '@app/core/services/plant-selection/plant-selection.service';

@Component({
  selector: 'app-header',
  templateUrl: './header.component.html',
  styleUrls: ['./header.component.scss']
})
export class HeaderComponent extends BaseComponent implements OnInit {

  public plantTimer$: Observable<string>;
  public isAuthenticated$: Observable<boolean>;
  public platforms$: Observable<Platform[]>;
  public plants$: Observable<Plant[]>;
  public currentPlatform$: Observable<Platform>;
  public headerSettings: HeaderSettings;
  public dataLoaded = false;
  public selectedPlant$: Observable<PlantSelectionData>;
  public plants: Plant[];
  private languagesItems: SelectItem[];
  private currentLanguage: string;
  private currentTheme: Theme;
  private readonly currentPlantStorageKey = 'selectedPlant';
  private platformRole: string;

  constructor(private readonly translateService: TranslateService,
    private readonly store: Store<AppState>,
    private readonly commonService: CommonService,
    private readonly languageService: LanguageService,
    private readonly themeService: ThemeService,
    private readonly plantSelectionService: PlantSelectionService
  ) {
    super();
  }

  ngOnInit() {
    this.getCurrentTheme();
    this.resolveLanguagesItems();
    this.resolveCurrentLanguage();
    this.initializeHeaderSettings();
    this.initializePlantTimer();

    this.selectedPlant$ = this.store.select(selectedPlantSelectors.selectCurrentPlantData);

    this.platforms$ = this.store.select(selectUserPlatforms)
      .pipe(
        map((platforms: UserPlatform[]) => this.convertUserPlatforms(platforms))
      );

    this.plants$ = this.plants$ = this.store.select(selectCurrentUserPlatform)
      .pipe(
        takeUntil(this.componentDestroyed()),
        tap((platform: UserPlatform) => {
          this.platformRole = platform?.role;
          this.plantSelectionService.platformRole$.next(platform?.role)
        }),
        map<UserPlatform, Plant[]>((platform: UserPlatform) => {
          return this.convertUserPlatformPlants(platform?.plants);
        }),
        tap((plants: Plant[]) => {
          this.plants = plants;
          this.plantSelectionService.plants$.next(plants);
        })
      );

    this.isAuthenticated$ = this.store.select(selectIsAuthenticated);

    this.dataLoaded = true;

    this.translateService.onLangChange.subscribe(() => {
      this.resolveLanguagesItems();
      this.initializeHeaderSettings();
    });
  }a

  public async onPlantSelectorDataChange(selectedData: MenuSelectedPlant = { plant: null, line: null, cell: null }) {
    const changedPlant = this.plantSelectionService.prepareChangedPlantSelectionData(this.plants, selectedData, this.platformRole);
    this.store.dispatch(selectedPlantActions.setCurrentPlantData({ plantSelectionData: changedPlant, showToast: true }));
    this.plantSelectionService.showChangeCurrentPlantSelectionToast(changedPlant);
    await this.commonService.reloadPage();
  }

  public login(): void {
    this.store.dispatch(authActions.login());
  }

  public logout(): void {
    this.store.dispatch(authActions.logout());
  }

  public changeLanguage(language: string): void {
    this.currentLanguage = language;
    this.languageService.changeLanguage(language);
    this.initializeHeaderSettings();
  }

  /**
     * It takes a value as a parameter, finds the theme that matches that value, sets the current theme to that theme, and then calls the
     * changeTheme function in the common service to change the theme
     * @param value - The value of the theme that is selected.
     */
  public changeTheme(value: string): void {
    const theme: Theme = platformThemes.find(platformTheme => platformTheme.value === value);
    this.store.dispatch(userPreferencesActions.changeTheme({ theme }));
    this.initializeHeaderSettings();
  }

  private initializePlantTimer(): void {
    this.plantTimer$ = timer(0, 1000).pipe(
      takeUntil(this.componentDestroyed()),
      map(() => moment().format('HH:mm:ss'))
    );
  }

  private initializeHeaderSettings(): void {
    this.headerSettings = {
      themes: this.themeService.listOfThemes,
      languages: this.languagesItems,
      selectedTheme: this.currentTheme && this.currentTheme.value,
      selectedLanguage: this.currentLanguage,
      ribbon: {
        enabled: !environment.production,
        text: environment.description
      },
      literals: {
        language: this.translateService.instant('header.language'),
        themes: this.translateService.instant('header.theme'),
        login: this.translateService.instant('header.login'),
        logout: this.translateService.instant('header.logout')
      }
    };
  }

  private convertUserPlatforms(userPlatforms: UserPlatform[]): Platform[] {
    if (!Array.isArray(userPlatforms)) {
      return [];
    }
    return userPlatforms.map((userPlatform: any) => ({
      id: userPlatform.id,
      platformId: userPlatform.platformId,
      name: userPlatform.name,
      icon: userPlatform.icon,
      url: userPlatform.url,
      active: userPlatform.platformId === environment.platformId
    }) as any);
  }

  private convertUserPlatformPlants(userPlatformPlants: UserPlatformPlant[]): Plant[] {
    if (!Array.isArray(userPlatformPlants)) {
      return [];
    }
    return userPlatformPlants.map(userPlatformPlant => ({
      id: userPlatformPlant.code,
      name: userPlatformPlant.name,
      code: userPlatformPlant.code,
      timeZone: userPlatformPlant.timeZone,
      lines: userPlatformPlant.lines,
      role: userPlatformPlant.role
    }));
  }

  private resolveLanguagesItems(): void {
    this.languagesItems =
      (this.languageService.getLanguages() || []).map(lang => ({ label: this.translateService.instant('common.languages.' + lang), value: lang } as SelectItem));
  }

  private resolveCurrentLanguage(): void {
    this.currentLanguage =
      (this.languageService.getLanguages() || []).find(lang => lang === this.translateService.currentLang);
  }

  private getCurrentTheme() {
    this.store.select(userPreferencesSelectors.selectTheme)
      .pipe(
        takeUntil(this.componentDestroyed())
      )
      .subscribe((theme: Theme) => {
        this.currentTheme = theme;
      });
  }

  private async loadCurrentPlantSelectionData(plants: Plant[]): Promise<void> {
    let storagedPlant = JSON.parse(localStorage.getItem(this.currentPlantStorageKey));
    // Comprobación temporal por cambio de modelo de lineas
    if (!storagedPlant?.plantId) {
      localStorage.removeItem(this.currentPlantStorageKey);
      storagedPlant = null;
    }

    if (storagedPlant) {
      const plantFromStore: PlantSelectionData = this.getThePlantFromLocalStorage(storagedPlant);
      this.store.dispatch(selectedPlantActions.setCurrentPlantData({ plantSelectionData: plantFromStore, showToast: true }));

    } else {
      const plantSelectionData = this.prepareInitialPlantSelectionData(this.plants);
      this.store.dispatch(selectedPlantActions.setCurrentPlantData({ plantSelectionData: plantSelectionData, showToast: true }));
    }
  }

  private getThePlantFromLocalStorage(storedPlant: SelectedPlant): PlantSelectionData {
    const associatedPlant: Plant = this.plants.find(plant => plant?.id === storedPlant?.plantId);
    if (!associatedPlant) {
      return this.prepareInitialPlantSelectionData(this.plants);
    }
    return this.plantSelectionService.preparePlantSelectionData(associatedPlant, null, this.platformRole);
  }

  private prepareInitialPlantSelectionData(plants: Plant[]): PlantSelectionData {
    const plant = plants[0];
    const line: Line = Array.isArray(plant?.lines) && plant?.lines.length && plant.lines[0];

    return this.plantSelectionService.preparePlantSelectionData(plant, line, this.platformRole);
  }
}