fix: timezone changes on an instance don't get updated when access by Federation Server

Author: mjabascal10

CHANGELOG.md

@@ -2,4 +2,5 @@
 ## Bugfix
 -Fixed an issue preventing incident status updates when entering long solutions.
 -Fixed an issue blocking incident creation from the Alerts panel.
--Added Asia/Jakarta timezone to the TIMEZONES list.
+-Added Asia/Jakarta timezone to the TIMEZONES list.
+-Fixed Timezone changes on an instance don't get updated when access by Federation Server

frontend/src/app/app-management/app-management.module.ts

@@ -10,7 +10,6 @@ import {NgxSortableModule} from 'ngx-sortable-2';
 import {ComplianceManagementModule} from '../compliance/compliance-management/compliance-management.module';
 import {NavBehavior} from '../shared/behaviors/nav.behavior';
 import {VersionUpdateBehavior} from '../shared/behaviors/version-update.behavior';
-import {TimezoneFormatService} from '../shared/services/utm-timezone.service';
 import {UtmSharedModule} from '../shared/utm-shared.module';
 import {AppConfigComponent} from './app-config/app-config.component';
 import {AppLogsComponent} from './app-logs/app-logs.component';
@@ -102,7 +101,7 @@ import {UtmApiDocComponent} from './utm-api-doc/utm-api-doc.component';
     HealthChecksComponent,
   ],
   schemas: [CUSTOM_ELEMENTS_SCHEMA, NO_ERRORS_SCHEMA],
-  providers: [NavBehavior, VersionUpdateBehavior, TimezoneFormatService]
+  providers: [NavBehavior, VersionUpdateBehavior]
 })
 export class AppManagementModule {
 }

frontend/src/app/app.component.ts

@@ -8,7 +8,6 @@ import {ThemeChangeBehavior} from './shared/behaviors/theme-change.behavior';
 import {ADMIN_ROLE, USER_ROLE} from './shared/constants/global.constant';
 import {AppThemeLocationEnum} from './shared/enums/app-theme-location.enum';
 import {UtmAppThemeService} from './shared/services/theme/utm-app-theme.service';
-import {TimezoneFormatService} from './shared/services/utm-timezone.service';
 
 @Component({
   selector: 'app-root',
@@ -32,8 +31,7 @@ export class AppComponent implements OnInit {
     private themeChangeBehavior: ThemeChangeBehavior,
     private utmAppThemeService: UtmAppThemeService,
     private router: Router, private renderer: Renderer2,
-    private apiServiceCheckerService: ApiServiceCheckerService,
-    private timezoneFormatService: TimezoneFormatService) {
+    private apiServiceCheckerService: ApiServiceCheckerService) {
 
     this.translate.setDefaultLang('en');
 
@@ -128,7 +126,6 @@ export class AppComponent implements OnInit {
   }
 
    init() {
-    this.timezoneFormatService.loadTimezoneAndFormat();
     this.getReportLogo();
   }
 }

frontend/src/app/app.module.ts

@@ -1,5 +1,5 @@
 import {HTTP_INTERCEPTORS, HttpClient, HttpClientModule} from '@angular/common/http';
-import {CUSTOM_ELEMENTS_SCHEMA, Injector, NgModule} from '@angular/core';
+import {APP_INITIALIZER, CUSTOM_ELEMENTS_SCHEMA, Injector, NgModule} from '@angular/core';
 import {FormsModule, ReactiveFormsModule} from '@angular/forms';
 import {BrowserModule} from '@angular/platform-browser';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
@@ -36,6 +36,10 @@ import {TimezoneFormatService} from './shared/services/utm-timezone.service';
 import {UtmSharedModule} from './shared/utm-shared.module';
 import {AccountService} from "./core/auth/account.service";
 
+export function initTimezoneFormat(timezoneService: TimezoneFormatService) {
+  return () => timezoneService.loadTimezoneAndFormat();
+}
+
 @NgModule({
   declarations: [
     AppComponent,
@@ -105,11 +109,16 @@ import {AccountService} from "./core/auth/account.service";
       useClass: ManageHttpInterceptor,
       multi: true,
     },
+    {
+      provide: APP_INITIALIZER,
+      useFactory: initTimezoneFormat,
+      deps: [TimezoneFormatService],
+      multi: true
+    },
     NewAlertBehavior,
     NavBehavior,
     AlertIncidentStatusChangeBehavior,
-    GettingStartedBehavior,
-    TimezoneFormatService
+    GettingStartedBehavior
   ],
   bootstrap: [AppComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
@@ -118,6 +127,5 @@ export class AppModule {
   constructor(private dpConfig: NgbDatepickerConfig, private config: NgbModalConfig) {
     this.dpConfig.minDate = {year: moment().year() - 100, month: 1, day: 1};
     config.backdrop = 'static';
-    //timezoneFormatService.loadTimezoneAndFormat();
   }
 }

frontend/src/app/shared/components/utm/config/app-config-sections/app-config-sections.component.ts

@@ -9,6 +9,7 @@ import {
   TIMEZONES
 } from '../../../../constants/date-timezone-date.const';
 import {UtmConfigParamsService} from '../../../../services/config/utm-config-params.service';
+import {TimezoneFormatService} from "../../../../services/utm-timezone.service";
 import {ConfigDataTypeEnum, SectionConfigParamType} from '../../../../types/configuration/section-config-param.type';
 import {ApplicationConfigSectionEnum, SectionConfigType} from '../../../../types/configuration/section-config.type';
 import {AppConfigDeleteConfirmComponent} from '../app-config-delete-confirm/app-config-delete-confirm.component';
@@ -41,7 +42,8 @@ export class AppConfigSectionsComponent implements OnInit, OnDestroy {
   constructor(private utmConfigParamsService: UtmConfigParamsService,
               private modalService: NgbModal,
               private restartApiBehavior: RestartApiBehavior,
-              private toastService: UtmToastService) {
+              private toastService: UtmToastService,
+              private timezoneFormatService: TimezoneFormatService) {
   }
 
 
@@ -162,19 +164,12 @@ export class AppConfigSectionsComponent implements OnInit, OnDestroy {
     });
   }
 
-  refreshTimeSettings() {
+  async refreshTimeSettings() {
     const index = this.configToSave
       .findIndex(value => value.confParamShort === DATE_SETTING_TIMEZONE_SHORT
         || value.confParamShort === DATE_SETTING_FORMAT_SHORT);
     if (index !== -1) {
-      window.location.reload();
-      // const timezone = this.getConfigToSaveValue(DATE_SETTING_TIMEZONE_SHORT);
-      // const dateFormat = this.getConfigToSaveValue(DATE_SETTING_FORMAT_SHORT);
-      // const format: DatePipeDefaultOptions = {
-      //   dateFormat: dateFormat ? dateFormat : DEFAULT_DATE_SETTING_DATE,
-      //   timezone: timezone ? timezone : DEFAULT_DATE_SETTING_TIMEZONE
-      // };
-      // this.timezoneFormatService.setDateFormatSubject(format);
+      await this.timezoneFormatService.loadTimezoneAndFormat();
     }
   }
 

frontend/src/app/shared/services/utm-timezone.service.ts

@@ -18,16 +18,26 @@ export class TimezoneFormatService {
   constructor(private httpClient: HttpClient) {
   }
 
-  loadTimezoneAndFormat(): void {
-    this.httpClient.get(this.resourceUrl)
-      .subscribe(response => {
-        const configs = response;
-        const timezone = this.getSettingValue(configs, DATE_SETTING_TIMEZONE_SHORT);
-        const dateFormat = this.getSettingValue(configs, DATE_SETTING_FORMAT_SHORT);
-        this.dateFormatSubject.next({dateFormat: dateFormat ? dateFormat : 'medium', timezone: timezone ? timezone : 'UTC'});
-      }, error => {
-        console.error('Unable to set default time format');
-      });
+  loadTimezoneAndFormat(): Promise<void> {
+    return new Promise((resolve, reject) => {
+      this.httpClient.get(this.resourceUrl)
+        .subscribe(
+          response => {
+            const configs = response;
+            const timezone = this.getSettingValue(configs, DATE_SETTING_TIMEZONE_SHORT);
+            const dateFormat = this.getSettingValue(configs, DATE_SETTING_FORMAT_SHORT);
+            this.dateFormatSubject.next({
+              dateFormat: dateFormat ? dateFormat : 'medium',
+              timezone: timezone ? timezone : 'UTC'
+            });
+            resolve();
+          },
+          error => {
+            console.error('Unable to set default time format', error);
+            reject(error);
+          }
+        );
+    });
   }
 
   getSettingValue(settings: any, key: string): string {