import { Component , Input } from '@angular/core' ; import { ActivatedRoute , Router } from '@angular/router' ; import { BehaviorSubject , Observable } from 'rxjs' ; import { map } from 'rxjs/operators' ; import { ConfigsService } from '../../services/configs.service' ; import { ThemeService } from '../../services/theme.service' ; export type ErrorHeaderType = 'COULD_NOT_LOAD_PAGE' | 'SOMETHING_WENT_WRONG' ; export type ErrorSubheaderType = 'WE_HAVE_BEEN_NOTIFIED' | 'PLEASE_TRY_AGAIN_LATER' ; const DEFAULT_HEADER_TYPE = 'COULD_NOT_LOAD_PAGE' ; const DEFAULT_SUBHEADER_TYPE = 'WE_HAVE_BEEN_NOTIFIED' ; /**
 * Generic error splash - for the sake of i18n, to add a custom message
 * use the relevant switch cases in the template and extend the types above.
 */ @ Component ( { selector : 'm-errorSplash' , templateUrl : './error-splash.component.html' , styleUrls : [ './error-splash.component.ng.scss' ] , } ) export class ErrorSplashComponent { /**
     * Header text for error splash.
     */ private readonly _headerType$ : BehaviorSubject < ErrorHeaderType > = new BehaviorSubject < ErrorHeaderType > ( DEFAULT_HEADER_TYPE ) ; /**
     * Subheader text for error splash.
     */ private readonly _subheaderType$ : BehaviorSubject < ErrorSubheaderType > = new BehaviorSubject < ErrorSubheaderType > ( DEFAULT_SUBHEADER_TYPE ) ; /**
     * Set to true on image load - helps prevent jumping flex content whilst loading.
     */ public readonly imageLoaded$ : BehaviorSubject < boolean > = new BehaviorSubject < boolean > ( false ) ; /**
     * Assets URL.
     */ public cdnAssetsUrl : string = '' ; param { ErrorHeaderType } @ Input ( ) set headerType ( headerType ) { this . _headerType$ . next ( headerType ) ; } param { ErrorSubheaderType } @ Input ( ) set subheaderType ( text ) { this . _subheaderType$ . next ( text ) ; } returns { BehaviorSubject < ErrorHeaderType > } get headerType$ ( ) : BehaviorSubject < ErrorHeaderType > { return this . _headerType$ ; } returns { BehaviorSubject < ErrorSubheaderType > } get subheaderType$ ( ) : BehaviorSubject < ErrorSubheaderType > { return this . _subheaderType$ ; } returns { Observable < boolean > } get isDarkTheme$ ( ) : Observable < boolean > { return this . themeService . isDark$ ; } returns { Observable < string > } get logoUrl$ ( ) : Observable < string > { return this . isDarkTheme$ . pipe ( map ( ( isDarkTheme ) => { return `${ this . cdnAssetsUrl }${ ! isDarkTheme ? 'assets/logos/logo-light-mode.svg' : 'assets/logos/logo-dark-mode.svg' }` ; } ) ) ; } constructor ( private themeService , private router , private route , configs ) { this . cdnAssetsUrl = configs . get ( 'cdn_assets_url' ) ; } returns { void } public reload ( ) { this . router . routeReuseStrategy . shouldReuseRoute = ( ) => false ; this . router . onSameUrlNavigation = 'reload' ; this . router . navigate ( [ './' ] , { relativeTo : this . route } ) ; } returns { void } public navigateToRoot ( ) { this . router . navigate ( [ '/' ] ) ; } }