From 474162bb052b15687ef8ca479a785382978db6ab Mon Sep 17 00:00:00 2001
From: mpetrov <mpetrov@thingsboard.io>
Date: Tue, 9 Jul 2024 15:38:16 +0300
Subject: [PATCH] OPC-UA Data mapping crushing on creating empty connector fix

---
 .../mapping-table/mapping-table.component.ts     | 16 +++++++++++++++-
 1 file changed, 15 insertions(+), 1 deletion(-)

diff --git a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts
index 7042e5ae38..51847d2c70 100644
--- a/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts
+++ b/ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts
@@ -33,6 +33,7 @@ import { debounceTime, distinctUntilChanged, map, take, takeUntil } from 'rxjs/o
 import {
   ControlValueAccessor,
   FormBuilder,
+  FormGroup,
   NG_VALIDATORS,
   NG_VALUE_ACCESSOR,
   UntypedFormArray,
@@ -206,13 +207,26 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A
           if (isDefinedAndNotNull(index)) {
             this.mappingFormGroup.at(index).patchValue(res);
           } else {
-            this.mappingFormGroup.push(this.fb.group(res));
+            this.mappingFormGroup.push(this.getMappedDialogDataFormGroup(res));
           }
           this.mappingFormGroup.markAsDirty();
         }
     });
   }
 
+  private getMappedDialogDataFormGroup(mappingValue: MappingValue): FormGroup {
+    Object.keys(mappingValue).forEach(key => {
+      if (Array.isArray(mappingValue[key])) {
+        mappingValue = {
+          ...mappingValue,
+          [key]: this.fb.control(mappingValue[key]),
+        };
+      }
+    });
+
+    return this.fb.group(mappingValue);
+  }
+
   private updateTableData(value: ConnectorMapping[], textSearch?: string): void {
     let tableValue = value.map(mappingValue => this.getMappingValue(mappingValue));
     if (textSearch) {