diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html
index e5f471a344..19353aa139 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.html
@@ -46,7 +46,7 @@
+ (click)="$event.stopPropagation(); onEnableConnector(attribute)">
diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts
index bf94e6021d..66d33b9a06 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-connectors.component.ts
@@ -62,7 +62,7 @@ import {
} from './gateway-widget.models';
import { MatDialog } from '@angular/material/dialog';
import { AddConnectorDialogComponent } from '@home/components/widget/lib/gateway/dialog/add-connector-dialog.component';
-import { takeUntil } from 'rxjs/operators';
+import { debounceTime, take, takeUntil, tap } from 'rxjs/operators';
import { ErrorStateMatcher } from '@angular/material/core';
import { PageData } from '@shared/models/page/page-data';
@@ -148,6 +148,7 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie
private destroy$ = new Subject();
private subscription: IWidgetSubscription;
+ private attributeUpdateSubject = new Subject();
constructor(protected store: Store,
private fb: FormBuilder,
@@ -180,6 +181,8 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie
basicConfig: this.fb.group({})
});
this.connectorForm.disable();
+
+ this.observeAttributeChange();
}
get portErrorTooltip(): string {
@@ -535,31 +538,12 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie
}
- enableConnector(attribute: AttributeData): void {
- const wasEnabled = this.activeConnectors.includes(attribute.key);
- const scopeOld = wasEnabled ? AttributeScope.SHARED_SCOPE : AttributeScope.SERVER_SCOPE;
- const scopeNew = !wasEnabled ? AttributeScope.SHARED_SCOPE : AttributeScope.SERVER_SCOPE;
+ onEnableConnector(attribute: AttributeData): void {
attribute.value.ts = new Date().getTime();
- const tasks = [this.attributeService.saveEntityAttributes(this.device, AttributeScope.SHARED_SCOPE, [{
- key: 'active_connectors',
- value: this.activeConnectors
- }]), this.attributeService.saveEntityAttributes(this.device, AttributeScope.SERVER_SCOPE, [{
- key: 'inactive_connectors',
- value: this.inactiveConnectors
- }]), this.attributeService.deleteEntityAttributes(this.device, scopeOld, [attribute]),
- this.attributeService.saveEntityAttributes(this.device, scopeNew, [attribute])];
- if (wasEnabled) {
- const index = this.activeConnectors.indexOf(attribute.key);
- this.activeConnectors.splice(index, 1);
- this.inactiveConnectors.push(attribute.key);
- } else {
- const index = this.inactiveConnectors.indexOf(attribute.key);
- this.inactiveConnectors.splice(index, 1);
- this.activeConnectors.push(attribute.key);
- }
- forkJoin(tasks).subscribe(_ => {
- this.updateData(true);
- });
+
+ this.updateActiveConnectorKeys(attribute.key);
+
+ this.attributeUpdateSubject.next(attribute);
}
getErrorsCount(attribute: AttributeData): string {
@@ -610,6 +594,55 @@ export class GatewayConnectorComponent extends PageComponent implements AfterVie
this.connectorForm.get(formControlName)?.patchValue('tb_gw_' + generateSecret(5));
}
+ private observeAttributeChange(): void {
+ this.attributeUpdateSubject.pipe(
+ debounceTime(300),
+ tap((attribute: AttributeData) => this.executeAttributeUpdates(attribute)),
+ takeUntil(this.destroy$),
+ ).subscribe();
+ }
+
+ private updateActiveConnectorKeys(key: string): void {
+ const wasEnabled = this.activeConnectors.includes(key);
+ if (wasEnabled) {
+ const index = this.activeConnectors.indexOf(key);
+ if (index !== -1) this.activeConnectors.splice(index, 1);
+ this.inactiveConnectors.push(key);
+ } else {
+ const index = this.inactiveConnectors.indexOf(key);
+ if (index !== -1) this.inactiveConnectors.splice(index, 1);
+ this.activeConnectors.push(key);
+ }
+ }
+
+ private executeAttributeUpdates(attribute: AttributeData): void {
+ forkJoin(this.getAttributeExecutionTasks(attribute))
+ .pipe(
+ take(1),
+ tap(() => this.updateData(true)),
+ takeUntil(this.destroy$),
+ )
+ .subscribe();
+ }
+
+ private getAttributeExecutionTasks(attribute: AttributeData): Observable[] {
+ const isActive = this.activeConnectors.includes(attribute.key);
+ const scopeOld = isActive ? AttributeScope.SERVER_SCOPE : AttributeScope.SHARED_SCOPE;
+ const scopeNew = isActive ? AttributeScope.SHARED_SCOPE : AttributeScope.SERVER_SCOPE;
+
+ return [
+ this.attributeService.saveEntityAttributes(this.device, AttributeScope.SHARED_SCOPE, [{
+ key: 'active_connectors',
+ value: this.activeConnectors
+ }]),
+ this.attributeService.saveEntityAttributes(this.device, AttributeScope.SERVER_SCOPE, [{
+ key: 'inactive_connectors',
+ value: this.inactiveConnectors
+ }]),
+ this.attributeService.deleteEntityAttributes(this.device, scopeOld, [attribute]),
+ this.attributeService.saveEntityAttributes(this.device, scopeNew, [attribute])];
+ }
+
private onDataUpdateError(e: any): void {
const exceptionData = this.utils.parseException(e);
let errorText = exceptionData.name;