diff --git a/ui-ngx/src/app/modules/home/components/calculated-fields/calculated-fields-table-config.ts b/ui-ngx/src/app/modules/home/components/calculated-fields/calculated-fields-table-config.ts
index e1aa7c2ee5..2c96464dda 100644
--- a/ui-ngx/src/app/modules/home/components/calculated-fields/calculated-fields-table-config.ts
+++ b/ui-ngx/src/app/modules/home/components/calculated-fields/calculated-fields-table-config.ts
@@ -83,7 +83,7 @@ export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedFie
     this.entityTranslations = entityTypeTranslations.get(EntityType.CALCULATED_FIELD);
 
     this.entitiesFetchFunction = (pageLink: PageLink) => this.fetchCalculatedFields(pageLink);
-    this.addEntity = this.addCalculatedField.bind(this);
+    this.addEntity = this.getCalculatedFieldDialog.bind(this);
     this.deleteEntityTitle = (field: CalculatedField) => this.translate.instant('calculated-fields.delete-title', {title: field.name});
     this.deleteEntityContent = () => this.translate.instant('calculated-fields.delete-text');
     this.deleteEntitiesTitle = count => this.translate.instant('calculated-fields.delete-multiple-title', {count});
@@ -179,20 +179,8 @@ export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedFie
     }
   }
 
-  private addCalculatedField(): Observable<CalculatedField> {
-    return this.getCalculatedFieldDialog()
-      .pipe(
-        filter(Boolean),
-        switchMap(calculatedField => this.calculatedFieldsService.saveCalculatedField({ entityId: this.entityId, ...calculatedField })),
-      )
-  }
-
   private editCalculatedField(calculatedField: CalculatedField, isDirty = false): void {
     this.getCalculatedFieldDialog(calculatedField, 'action.apply', isDirty)
-      .pipe(
-        filter(Boolean),
-        switchMap((updatedCalculatedField) => this.calculatedFieldsService.saveCalculatedField({ ...calculatedField, ...updatedCalculatedField })),
-      )
       .subscribe((res) => {
         if (res) {
           this.updateData();
@@ -217,7 +205,8 @@ export class CalculatedFieldsTableConfig extends EntityTableConfig<CalculatedFie
       },
       enterAnimationDuration: isDirty ? 0 : null,
     })
-      .afterClosed();
+      .afterClosed()
+      .pipe(filter(Boolean));
   }
 
   private openDebugEventsDialog(calculatedField: CalculatedField): void {
diff --git a/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.ts b/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.ts
index a0e439029d..6543dead49 100644
--- a/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.ts
+++ b/ui-ngx/src/app/modules/home/components/calculated-fields/components/dialog/calculated-field-dialog.component.ts
@@ -14,7 +14,7 @@
 /// limitations under the License.
 ///
 
-import { AfterViewInit, Component, Inject } from '@angular/core';
+import { AfterViewInit, Component, DestroyRef, Inject } from '@angular/core';
 import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
 import { Store } from '@ngrx/store';
 import { AppState } from '@core/core.state';
@@ -37,6 +37,7 @@ import { EntityType } from '@shared/models/entity-type.models';
 import { map, startWith } from 'rxjs/operators';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { ScriptLanguage } from '@shared/models/rule-node.models';
+import { CalculatedFieldsService } from '@core/http/calculated-fields.service';
 
 @Component({
   selector: 'tb-calculated-field-dialog',
@@ -92,6 +93,8 @@ export class CalculatedFieldDialogComponent extends DialogComponent<CalculatedFi
               protected router: Router,
               @Inject(MAT_DIALOG_DATA) public data: CalculatedFieldDialogData,
               protected dialogRef: MatDialogRef<CalculatedFieldDialogComponent, CalculatedField>,
+              private calculatedFieldsService: CalculatedFieldsService,
+              private destroyRef: DestroyRef,
               private fb: FormBuilder) {
     super(store, router, dialogRef);
     this.applyDialogData();
@@ -124,7 +127,9 @@ export class CalculatedFieldDialogComponent extends DialogComponent<CalculatedFi
 
   add(): void {
     if (this.fieldFormGroup.valid) {
-      this.dialogRef.close(this.fromGroupValue);
+      this.calculatedFieldsService.saveCalculatedField({ entityId: this.data.entityId, id: this.data.value?.id,  ...this.fromGroupValue})
+        .pipe(takeUntilDestroyed(this.destroyRef))
+        .subscribe(calculatedField => this.dialogRef.close(calculatedField));
     }
   }