Timewindow: start applying list of allowed for timeinterval

ui-ngx/src/app/core/services/time.service.ts

@@ -72,6 +72,10 @@ export class TimeService {
       IntervalMath.numberValue(interval.value) >= min && IntervalMath.numberValue(interval.value) <= max);
   }
 
+  public intervalValuesToTimeIntervals(intervalValues: Array<Interval>): Array<TimeInterval> {
+    return defaultTimeIntervals.filter(interval => intervalValues.includes(interval.value));
+  }
+
   public boundMinInterval(min: number): number {
     if (isDefined(min)) {
       min = Math.ceil(min / 1000) * 1000;

ui-ngx/src/app/shared/components/aggregation/aggregation-type-select.component.ts

@@ -109,7 +109,7 @@ export class AggregationTypeSelectComponent implements ControlValueAccessor, OnI
   }
 
   ngOnChanges({allowedAggregationTypes}: SimpleChanges): void {
-    if (!allowedAggregationTypes.firstChange && !isEqual(allowedAggregationTypes.currentValue, allowedAggregationTypes.previousValue)) {
+    if (allowedAggregationTypes && !allowedAggregationTypes.firstChange && !isEqual(allowedAggregationTypes.currentValue, allowedAggregationTypes.previousValue)) {
       this.aggregationTypes = this.allowedAggregationTypes?.length ? this.allowedAggregationTypes : this.allAggregationTypes;
       const currentAggregationType: AggregationType = this.aggregationTypeFormGroup.get('aggregationType').value;
       if (currentAggregationType && !this.aggregationTypes.includes(currentAggregationType)) {
@@ -128,13 +128,14 @@ export class AggregationTypeSelectComponent implements ControlValueAccessor, OnI
   }
 
   writeValue(value: AggregationType | null): void {
-    if (value != null) {
+    let aggregationType: AggregationType;
-      this.modelValue = value;
+    if (value && this.allowedAggregationTypes?.length && !this.allowedAggregationTypes.includes(value)) {
-      this.aggregationTypeFormGroup.get('aggregationType').patchValue(value, {emitEvent: true});
+      aggregationType = this.allowedAggregationTypes[0];
     } else {
-      this.modelValue = null;
+      aggregationType = value;
-      this.aggregationTypeFormGroup.get('aggregationType').patchValue(null, {emitEvent: true});
     }
+    this.modelValue = aggregationType;
+    this.aggregationTypeFormGroup.get('aggregationType').patchValue(aggregationType, {emitEvent: false});
   }
 
   updateView(value: AggregationType | null) {

ui-ngx/src/app/shared/components/time/quick-time-interval.component.ts

@@ -91,7 +91,7 @@ export class QuickTimeIntervalComponent implements OnInit, ControlValueAccessor,
   }
 
   ngOnChanges({allowedIntervals}: SimpleChanges): void {
-    if (!allowedIntervals.firstChange && !isEqual(allowedIntervals.currentValue, allowedIntervals.previousValue)) {
+    if (allowedIntervals && !allowedIntervals.firstChange && !isEqual(allowedIntervals.currentValue, allowedIntervals.previousValue)) {
       this.intervals = this.allowedIntervals?.length ? this.allowedIntervals : this.allAvailableIntervals;
       const currentInterval: QuickTimeInterval = this.quickIntervalFormGroup.get('interval').value;
       if (currentInterval && !this.intervals.includes(currentInterval)) {
@@ -116,14 +116,15 @@ export class QuickTimeIntervalComponent implements OnInit, ControlValueAccessor,
     }
   }
 
-  writeValue(interval: QuickTimeInterval): void {
+  writeValue(value: QuickTimeInterval): void {
-    if (interval != null) {
+    let interval: QuickTimeInterval;
-      this.modelValue = interval;
+    if (value && this.allowedIntervals?.length && !this.allowedIntervals.includes(value)) {
-      this.quickIntervalFormGroup.get('interval').patchValue(interval, {emitEvent: true});
+      interval = this.allowedIntervals[0];
     } else {
-      this.modelValue = null;
+      interval = value;
-      this.quickIntervalFormGroup.get('interval').patchValue(null, {emitEvent: true});
     }
+    this.modelValue = interval;
+    this.quickIntervalFormGroup.get('interval').patchValue(interval, {emitEvent: false});
   }
 
   updateView(value: QuickTimeInterval | null) {

ui-ngx/src/app/shared/components/time/timeinterval.component.ts

@@ -14,14 +14,14 @@
 /// limitations under the License.
 ///
 
-import { Component, forwardRef, Input, OnDestroy, OnInit } from '@angular/core';
+import { Component, forwardRef, Input, OnChanges, OnDestroy, OnInit, SimpleChanges } from '@angular/core';
 import { ControlValueAccessor, FormBuilder, FormGroup, NG_VALUE_ACCESSOR } from '@angular/forms';
 import { TimeService } from '@core/services/time.service';
 import { coerceNumberProperty } from '@angular/cdk/coercion';
 import { MatFormFieldAppearance, SubscriptSizing } from '@angular/material/form-field';
 import { coerceBoolean } from '@shared/decorators/coercion';
 import { Interval, IntervalMath, TimeInterval } from '@shared/models/time/time.models';
-import { isDefined } from '@core/utils';
+import { isDefined, isEqual } from '@core/utils';
 import { IntervalType } from '@shared/models/telemetry/telemetry.models';
 import { takeUntil } from 'rxjs/operators';
 import { Subject } from 'rxjs';
@@ -38,12 +38,13 @@ import { Subject } from 'rxjs';
     }
   ]
 })
-export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnDestroy {
+export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnChanges, OnDestroy {
 
   minValue: number;
   maxValue: number;
 
   disabledAdvancedState = false;
+  allowedIntervalsList: Array<Interval>;
 
   @Input()
   set min(min: number) {
@@ -80,6 +81,15 @@ export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnDe
     }
   }
 
+  @Input()
+  set allowedIntervals(allowedIntervals: Array<Interval>) {
+    console.log('set', allowedIntervals);
+    if (!this.allowedIntervalsList || !isEqual(allowedIntervals, this.allowedIntervalsList)) {
+      this.allowedIntervalsList = allowedIntervals;
+      this.updateIntervalValue(true);
+    }
+  }
+
   @Input()
   @coerceBoolean()
   useCalendarIntervals = false;
@@ -155,6 +165,10 @@ export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnDe
     this.boundInterval();
   }
 
+  ngOnChanges({allowedIntervals}: SimpleChanges): void {
+    console.log('changes', allowedIntervals);
+  }
+
   registerOnChange(fn: any): void {
     this.propagateChange = fn;
     if (isDefined(this.propagateChangeValue)) {
@@ -184,8 +198,11 @@ export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnDe
     if (typeof this.modelValue !== 'undefined') {
       const min = this.timeService.boundMinInterval(this.minValue);
       const max = this.timeService.boundMaxInterval(this.maxValue);
-      if (IntervalMath.numberValue(this.modelValue) >= min && IntervalMath.numberValue(this.modelValue) <= max) {
+      if (this.allowedIntervalsList?.length ||
-        const advanced = !this.timeService.matchesExistingInterval(this.minValue, this.maxValue, this.modelValue,
+            IntervalMath.numberValue(this.modelValue) >= min && IntervalMath.numberValue(this.modelValue) <= max) {
+        const advanced = this.allowedIntervalsList?.length
+          ? !this.allowedIntervalsList.includes(this.modelValue)
+          : !this.timeService.matchesExistingInterval(this.minValue, this.maxValue, this.modelValue,
           this.useCalendarIntervals);
         if (advanced && this.disabledAdvancedState) {
           this.advanced = false;
@@ -225,20 +242,28 @@ export class TimeintervalComponent implements OnInit, ControlValueAccessor, OnDe
   private boundInterval(updateToPreferred = false) {
     const min = this.timeService.boundMinInterval(this.minValue);
     const max = this.timeService.boundMaxInterval(this.maxValue);
-    this.intervals = this.timeService.getIntervals(this.minValue, this.maxValue, this.useCalendarIntervals);
+    this.intervals = this.allowedIntervalsList?.length
+      ? this.timeService.intervalValuesToTimeIntervals(this.allowedIntervalsList)
+      : this.timeService.getIntervals(this.minValue, this.maxValue, this.useCalendarIntervals);
     if (!this.disabledAdvancedState) {
       this.intervals.push(this.customTimeInterval);
     }
     if (this.rendered) {
       let newInterval = this.modelValue;
-      const newIntervalMs = IntervalMath.numberValue(newInterval);
+      if (this.allowedIntervalsList?.length) {
-      if (newIntervalMs < min) {
+        if (!this.allowedIntervalsList.includes(newInterval) && !this.advanced) {
-        newInterval = min;
+          newInterval = this.allowedIntervalsList[0];
-      } else if (newIntervalMs >= max && updateToPreferred) {
+        }
-        newInterval = this.timeService.boundMaxInterval(max / 7);
+      } else {
-      }
+        const newIntervalMs = IntervalMath.numberValue(newInterval);
-      if (!this.advanced) {
+        if (newIntervalMs < min) {
-        newInterval = this.timeService.boundToPredefinedInterval(min, max, newInterval, this.useCalendarIntervals);
+          newInterval = min;
+        } else if (newIntervalMs >= max && updateToPreferred) {
+          newInterval = this.timeService.boundMaxInterval(max / 7);
+        }
+        if (!this.advanced) {
+          newInterval = this.timeService.boundToPredefinedInterval(min, max, newInterval, this.useCalendarIntervals);
+        }
       }
       if (newInterval !== this.modelValue) {
         this.setInterval(newInterval);

ui-ngx/src/app/shared/components/time/timewindow-config-dialog.component.html

@@ -62,6 +62,7 @@
             formControlName="timewindowMs"
             subscriptSizing="dynamic"
             appearance="outline"
+            [allowedIntervals]="timewindowForm.get('realtime.allowedLastIntervals').value"
             [disabledAdvanced]="timewindowForm.get('realtime.disableCustomInterval').value"
             [required]="timewindowForm.get('selectedTab').value === timewindowTypes.REALTIME &&
                             timewindowForm.get('realtime.realtimeType').value === realtimeTypes.LAST_INTERVAL">
@@ -130,6 +131,7 @@
             formControlName="timewindowMs"
             subscriptSizing="dynamic"
             appearance="outline"
+            [allowedIntervals]="timewindowForm.get('history.allowedLastIntervals').value"
             [disabledAdvanced]="timewindowForm.get('history.disableCustomInterval').value"
             [required]="timewindowForm.get('selectedTab').value === timewindowTypes.HISTORY &&
                           timewindowForm.get('history.historyType').value === historyTypes.LAST_INTERVAL">