diff --git a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.html b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.html
index 9d786e14c1..383bf7f7b0 100644
--- a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.html
+++ b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.html
@@ -63,7 +63,7 @@
             subscriptSizing="dynamic"
             appearance="outline"
             [disabledAdvanced]="timewindowForm.get('realtime.disableCustomInterval').value"
-            [required]="timewindow.selectedTab === timewindowTypes.REALTIME &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME &&
                             timewindowForm.get('realtime.realtimeType').value === realtimeTypes.LAST_INTERVAL">
           </tb-timeinterval>
         </div>
@@ -83,7 +83,7 @@
           onlyCurrentInterval="true"
           subscriptSizing="dynamic"
           appearance="outline"
-          [required]="timewindow.selectedTab === timewindowTypes.REALTIME &&
+          [required]="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME &&
                           timewindowForm.get('realtime.realtimeType').value === realtimeTypes.INTERVAL">
         </tb-quick-time-interval>
       </div>
@@ -118,7 +118,7 @@
             subscriptSizing="dynamic"
             appearance="outline"
             [disabledAdvanced]="timewindowForm.get('history.disableCustomInterval').value"
-            [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                           timewindowForm.get('history.historyType').value === historyTypes.LAST_INTERVAL">
           </tb-timeinterval>
         </div>
@@ -135,7 +135,7 @@
           subscriptSizing="dynamic"
           appearance="outline"
           class="history-time-input"
-          [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+          [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                         timewindowForm.get('history.historyType').value === historyTypes.FIXED">
         </tb-datetime-period>
       </div>
@@ -151,7 +151,7 @@
             formControlName="quickInterval"
             subscriptSizing="dynamic"
             appearance="outline"
-            [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                         timewindowForm.get('history.historyType').value === historyTypes.INTERVAL">
           </tb-quick-time-interval>
         </div>
@@ -198,7 +198,7 @@
       <section class="tb-form-panel" [fxShow]="timewindowForm.get('aggregation.type').value !== aggregationTypes.NONE">
         <div class="tb-form-panel-title">{{ 'aggregation.group-interval' | translate }}</div>
 
-        <ng-container *ngIf="timewindow.selectedTab === timewindowTypes.REALTIME">
+        <ng-container *ngIf="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME">
           <div class="tb-form-row" formGroupName="realtime">
             <mat-slide-toggle class="mat-slide fixed-title-width" formControlName="disableCustomGroupInterval">
               {{ 'timewindow.disable-custom-interval' | translate }}
@@ -219,7 +219,7 @@
             </ng-container>
           </div>
         </ng-container>
-        <ng-container *ngIf="timewindow.selectedTab === timewindowTypes.HISTORY">
+        <ng-container *ngIf="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY">
           <div class="tb-form-row" formGroupName="history">
             <mat-slide-toggle class="mat-slide fixed-title-width" formControlName="disableCustomGroupInterval">
               {{ 'timewindow.disable-custom-interval' | translate }}
diff --git a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts
index 77297dbe05..41ab6a0787 100644
--- a/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts
+++ b/ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.ts
@@ -56,8 +56,6 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On
 
   aggregation = false;
 
-  timewindow: Timewindow;
-
   timewindowForm: FormGroup;
 
   historyTypes = HistoryWindowType;
@@ -109,6 +107,8 @@ export class TimewindowConfigDialogComponent extends PageComponent implements On
 
   realtimeTypeSelectionAvailable: boolean;
 
+  private timewindow: Timewindow;
+
   private destroy$ = new Subject<void>();
 
   constructor(@Inject(MAT_DIALOG_DATA) public data: TimewindowConfigDialogData,
diff --git a/ui-ngx/src/app/shared/components/time/timewindow-panel.component.html b/ui-ngx/src/app/shared/components/time/timewindow-panel.component.html
index 45bd25d30e..a3409e0ef3 100644
--- a/ui-ngx/src/app/shared/components/time/timewindow-panel.component.html
+++ b/ui-ngx/src/app/shared/components/time/timewindow-panel.component.html
@@ -51,7 +51,7 @@
             subscriptSizing="dynamic"
             appearance="outline"
             [disabledAdvanced]="timewindow.realtime.disableCustomInterval"
-            [required]="timewindow.selectedTab === timewindowTypes.REALTIME &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME &&
                               timewindowForm.get('realtime.realtimeType').value === realtimeTypes.LAST_INTERVAL">
           </tb-timeinterval>
 
@@ -62,7 +62,7 @@
             onlyCurrentInterval="true"
             subscriptSizing="dynamic"
             appearance="outline"
-            [required]="timewindow.selectedTab === timewindowTypes.REALTIME &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME &&
                               timewindowForm.get('realtime.realtimeType').value === realtimeTypes.INTERVAL">
           </tb-quick-time-interval>
         </div>
@@ -94,7 +94,7 @@
             subscriptSizing="dynamic"
             appearance="outline"
             [disabledAdvanced]="timewindow.history.disableCustomInterval"
-            [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                             timewindowForm.get('history.historyType').value === historyTypes.LAST_INTERVAL">
           </tb-timeinterval>
 
@@ -104,7 +104,7 @@
             subscriptSizing="dynamic"
             appearance="outline"
             class="history-time-input"
-            [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                             timewindowForm.get('history.historyType').value === historyTypes.FIXED">
           </tb-datetime-period>
 
@@ -114,7 +114,7 @@
             formControlName="quickInterval"
             subscriptSizing="dynamic"
             appearance="outline"
-            [required]="timewindow.selectedTab === timewindowTypes.HISTORY &&
+            [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                           timewindowForm.get('history.historyType').value === historyTypes.INTERVAL">
           </tb-quick-time-interval>
         </div>
@@ -145,7 +145,7 @@
 
       <section class="tb-form-row column-xs same-padding" [fxShow]="(isEdit || !timewindow.hideAggInterval)
        && timewindowForm.get('aggregation.type').value !== aggregationTypes.NONE">
-        <ng-container formGroupName="realtime" *ngIf="timewindow.selectedTab === timewindowTypes.REALTIME">
+        <ng-container formGroupName="realtime" *ngIf="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME">
           <tb-timeinterval
             formControlName="interval"
             [min]="minRealtimeAggInterval()" [max]="maxRealtimeAggInterval()"
@@ -156,7 +156,7 @@
             <div class="fixed-title-width-180">{{ 'aggregation.group-interval' | translate }}</div>
           </tb-timeinterval>
         </ng-container>
-        <ng-container formGroupName="history" *ngIf="timewindow.selectedTab === timewindowTypes.HISTORY">
+        <ng-container formGroupName="history" *ngIf="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY">
           <tb-timeinterval
             formControlName="interval"
             [min]="minHistoryAggInterval()" [max]="maxHistoryAggInterval()"