diff --git a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.html b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.html index 284cd67fa1..fe9f3a5343 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.html +++ b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.html @@ -19,20 +19,21 @@
+ (click)="$event.stopPropagation()" + (change)="changeInstanceTypeCheckBox($event.checked)" + [checked]="getChecked()" + [indeterminate]="getIndeterminate()"> {{notificationTemplateTypeTranslateMap.get(notificationSettingsFormGroup.get('name').value)?.name | translate}}
-
+
diff --git a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.ts b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.ts index 76e9babf00..be9ea3988f 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-setting-form.component.ts @@ -16,8 +16,7 @@ import { Component, forwardRef, Input, OnDestroy, OnInit } from '@angular/core'; import { ControlValueAccessor, NG_VALUE_ACCESSOR, UntypedFormBuilder, UntypedFormGroup } from '@angular/forms'; -import { UtilsService } from '@core/services/utils.service'; -import { isDefinedAndNotNull } from '@core/utils'; +import { deepClone, isDefinedAndNotNull } from '@core/utils'; import { Subscription } from 'rxjs'; import { NotificationDeliveryMethod, @@ -45,9 +44,6 @@ export class NotificationSettingFormComponent implements ControlValueAccessor, O @Input() deliveryMethods: NotificationDeliveryMethod[] = []; - @Input() - allowDeliveryMethods: NotificationDeliveryMethod[] = []; - notificationSettingsFormGroup: UntypedFormGroup; notificationTemplateTypeTranslateMap = NotificationTemplateTypeTranslateMap; @@ -56,8 +52,7 @@ export class NotificationSettingFormComponent implements ControlValueAccessor, O private valueChange$: Subscription = null; - constructor(private utils: UtilsService, - private fb: UntypedFormBuilder) { + constructor(private fb: UntypedFormBuilder) { } registerOnChange(fn: any): void { @@ -101,12 +96,17 @@ export class NotificationSettingFormComponent implements ControlValueAccessor, O } } - toggleEnabled() { - this.notificationSettingsFormGroup.get('enabled').patchValue(!this.notificationSettingsFormGroup.get('enabled').value); - } - - getChecked(deliveryMethod: NotificationDeliveryMethod): boolean { - return this.notificationSettingsFormGroup.get('enabledDeliveryMethods').get(deliveryMethod).value; + getChecked(deliveryMethod?: NotificationDeliveryMethod): boolean { + if (deliveryMethod) { + return this.notificationSettingsFormGroup.get('enabledDeliveryMethods').get(deliveryMethod).value; + } else { + const enabledDeliveryMethod = Object.values(this.notificationSettingsFormGroup.get('enabledDeliveryMethods').value); + const checked = enabledDeliveryMethod.some(value => value === true); + if (checked !== this.notificationSettingsFormGroup.get('enabled').value) { + setTimeout(() => this.notificationSettingsFormGroup.get('enabled').patchValue(checked), 0); + } + return enabledDeliveryMethod.every(value => value); + } } toggleDeliviryMethod(deliveryMethod: NotificationDeliveryMethod) { @@ -114,6 +114,25 @@ export class NotificationSettingFormComponent implements ControlValueAccessor, O .patchValue(!this.notificationSettingsFormGroup.get('enabledDeliveryMethods').get(deliveryMethod).value); } + changeInstanceTypeCheckBox(value: any) { + const enabledDeliveryMethod = deepClone(this.notificationSettingsFormGroup.get('enabledDeliveryMethods').value); + Object.keys(enabledDeliveryMethod).forEach(key => { + enabledDeliveryMethod[key] = value; + }); + this.notificationSettingsFormGroup.get('enabled').patchValue(value, {emitEvent: false}); + this.notificationSettingsFormGroup.get('enabledDeliveryMethods').patchValue(enabledDeliveryMethod); + this.notificationSettingsFormGroup.markAsDirty(); + } + + getIndeterminate() { + if (!this.notificationSettingsFormGroup.get('enabled').value) { + return false; + } + const enabledDeliveryMethod: Array = Object.values(this.notificationSettingsFormGroup.get('enabledDeliveryMethods').value); + const checkedResource = enabledDeliveryMethod.filter(value => value); + return checkedResource.length !== 0 && checkedResource.length !== enabledDeliveryMethod.length; + } + writeValue(value: NotificationUserSetting): void { if (isDefinedAndNotNull(value)) { this.notificationSettingsFormGroup.patchValue(value, {emitEvent: false}); diff --git a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.html b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.html index c531f10d78..33c446e32d 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.html +++ b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.html @@ -50,7 +50,6 @@
+ [deliveryMethods]="notificationDeliveryMethods">
diff --git a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.ts b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.ts index aada799885..b1f4bdd3dc 100644 --- a/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.ts +++ b/ui-ngx/src/app/modules/home/pages/notification/settings/notification-settings.component.ts @@ -43,7 +43,10 @@ export class NotificationSettingsComponent extends PageComponent implements OnIn notificationDeliveryMethods: NotificationDeliveryMethod[]; notificationDeliveryMethodTranslateMap = NotificationDeliveryMethodTranslateMap; - allowNotificationDeliveryMethods: Array; + private deliveryMethods = new Set([ + NotificationDeliveryMethod.SLACK, + NotificationDeliveryMethod.MICROSOFT_TEAMS + ]); constructor(protected store: Store, private route: ActivatedRoute, @@ -52,25 +55,15 @@ export class NotificationSettingsComponent extends PageComponent implements OnIn private notificationService: NotificationService, private fb: UntypedFormBuilder,) { super(store); + this.notificationService.getAvailableDeliveryMethods({ignoreLoading: true}).subscribe( + allowMethods => { + this.notificationDeliveryMethods = allowMethods.filter(value => !this.deliveryMethods.has(value)); + this.patchNotificationSettings(this.route.snapshot.data.userSettings); + }); } ngOnInit() { - this.notificationDeliveryMethods = this.getNotificationDeliveryMethods(); - - this.notificationService.getAvailableDeliveryMethods({ignoreLoading: true}).subscribe(allowMethods => { - this.allowNotificationDeliveryMethods = allowMethods; - }); - this.buildNotificationSettingsForm(); - this.patchNotificationSettings(this.route.snapshot.data.userSettings); - } - - private getNotificationDeliveryMethods(): NotificationDeliveryMethod[] { - const deliveryMethods = new Set([ - NotificationDeliveryMethod.SLACK, - NotificationDeliveryMethod.MICROSOFT_TEAMS - ]); - return Object.values(NotificationDeliveryMethod).filter(type => !deliveryMethods.has(type)); } private buildNotificationSettingsForm() { @@ -158,9 +151,13 @@ export class NotificationSettingsComponent extends PageComponent implements OnIn if (isDefinedAndNotNull(deliveryMethod)) { type.forEach(notificationType => notificationType.enabledDeliveryMethods[deliveryMethod] = value); } else { - type.forEach(notificationType => notificationType.enabled = value); + type.forEach(notificationType => { + notificationType.enabled = value; + notificationType.enabledDeliveryMethods = + Object.keys(notificationType.enabledDeliveryMethods).reduce((a, v) => ({ ...a, [v]: value}), {}); + }); } - this.notificationSettings.get('prefs').patchValue(type); + this.notificationSettings.get('prefs').patchValue(type, {emitEvent: false}); this.notificationSettings.markAsDirty(); };