refactoring

ui-ngx/src/app/modules/home/components/widget/lib/gateway/connectors-configuration/mapping-table/mapping-table.component.ts

@@ -33,7 +33,6 @@ import { debounceTime, distinctUntilChanged, map, take, takeUntil } from 'rxjs/o
 import {
   ControlValueAccessor,
   FormBuilder,
-  FormGroup,
   NG_VALIDATORS,
   NG_VALUE_ACCESSOR,
   UntypedFormArray,
@@ -192,7 +191,7 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A
       $event.stopPropagation();
     }
     const value = isDefinedAndNotNull(index) ? this.mappingFormGroup.at(index).value : {};
-    this.dialog.open<MappingDialogComponent, MappingInfo, MappingValue>(MappingDialogComponent, {
+    this.dialog.open<MappingDialogComponent, MappingInfo, ConnectorMapping>(MappingDialogComponent, {
       disableClose: true,
       panelClass: ['tb-dialog', 'tb-fullscreen-dialog'],
       data: {
@@ -207,26 +206,13 @@ export class MappingTableComponent implements ControlValueAccessor, Validator, A
           if (isDefinedAndNotNull(index)) {
             this.mappingFormGroup.at(index).patchValue(res);
           } else {
-            this.mappingFormGroup.push(this.getMappedDialogDataFormGroup(res));
+            this.pushDataAsFormArrays([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) {

ui-ngx/src/app/modules/home/components/widget/lib/gateway/dialog/mapping-dialog.component.ts

@@ -24,9 +24,13 @@ import { Router } from '@angular/router';
 import {
   Attribute,
   AttributesUpdate,
+  ConnectorMapping,
+  ConnectorMappingFormValue,
+  ConverterMappingFormValue,
   ConvertorType,
   ConvertorTypeTranslationsMap,
   DataConversionTranslationsMap,
+  DeviceConnectorMapping,
   DeviceInfoType,
   MappingHintTranslationsMap,
   MappingInfo,
@@ -37,11 +41,11 @@ import {
   MappingKeysType,
   MappingType,
   MappingTypeTranslationsMap,
-  MappingValue,
   noLeadTrailSpacesRegex,
   OPCUaSourceTypes,
   QualityTypes,
   QualityTypeTranslationsMap,
+  RequestMappingFormValue,
   RequestType,
   RequestTypesTranslationsMap,
   RpcMethod,
@@ -62,7 +66,7 @@ import { MappingDataKeysPanelComponent } from '@home/components/widget/lib/gatew
   templateUrl: './mapping-dialog.component.html',
   styleUrls: ['./mapping-dialog.component.scss']
 })
-export class MappingDialogComponent extends DialogComponent<MappingDialogComponent, MappingValue> implements OnDestroy {
+export class MappingDialogComponent extends DialogComponent<MappingDialogComponent, ConnectorMapping> implements OnDestroy {
 
   mappingForm: UntypedFormGroup;
 
@@ -104,7 +108,7 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
   constructor(protected store: Store<AppState>,
               protected router: Router,
               @Inject(MAT_DIALOG_DATA) public data: MappingInfo,
-              public dialogRef: MatDialogRef<MappingDialogComponent, MappingValue>,
+              public dialogRef: MatDialogRef<MappingDialogComponent, ConnectorMapping>,
               private fb: FormBuilder,
               private popoverService: TbPopoverService,
               private renderer: Renderer2,
@@ -247,7 +251,7 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
     }
   }
 
-  private prepareMappingData(): { [key: string]: unknown } {
+  private prepareMappingData(): ConnectorMapping {
     const formValue = this.mappingForm.value;
     switch (this.data.mappingType) {
       case MappingType.DATA:
@@ -270,7 +274,7 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
     }
   }
 
-  private prepareFormValueData(): { [key: string]: unknown } {
+  private getFormValueData(): ConnectorMappingFormValue {
     if (this.data.value && Object.keys(this.data.value).length) {
       switch (this.data.mappingType) {
         case MappingType.DATA:
@@ -282,16 +286,16 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
               type: converter.type,
               [converter.type]: {...converter}
             }
-          };
+          } as ConverterMappingFormValue;
         case MappingType.REQUESTS:
           return {
             requestType: this.data.value.requestType,
             requestValue: {
               [this.data.value.requestType]: this.data.value.requestValue
             }
-          };
+          } as RequestMappingFormValue;
         default:
-          return this.data.value;
+          return this.data.value as DeviceConnectorMapping;
       }
     }
   }
@@ -317,7 +321,7 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
         extensionConfig: [{}, []]
       }),
     }));
-    this.mappingForm.patchValue(this.prepareFormValueData());
+    this.mappingForm.patchValue(this.getFormValueData());
     this.mappingForm.get('converter.type').valueChanges.pipe(
       startWith(this.mappingForm.get('converter.type').value),
       takeUntil(this.destroy$)
@@ -397,7 +401,7 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
         requestValueGroup.get('responseTimeout').enable({emitEvent: false});
       }
     });
-    this.mappingForm.patchValue(this.prepareFormValueData());
+    this.mappingForm.patchValue(this.getFormValueData());
   }
 
   private createOPCUAMappingForm(): void {
@@ -410,6 +414,6 @@ export class MappingDialogComponent extends DialogComponent<MappingDialogCompone
       rpc_methods: [[], []],
       attributes_updates: [[], []]
     });
-    this.mappingForm.patchValue(this.prepareFormValueData());
+    this.mappingForm.patchValue(this.getFormValueData());
   }
 }

ui-ngx/src/app/modules/home/components/widget/lib/gateway/gateway-widget.models.ts

@@ -174,6 +174,8 @@ export interface ConnectorSecurity {
 
 export type ConnectorMapping = DeviceConnectorMapping | RequestMappingData | ConverterConnectorMapping;
 
+export type ConnectorMappingFormValue = DeviceConnectorMapping | RequestMappingFormValue | ConverterMappingFormValue;
+
 export interface ConnectorBaseConfig {
   mapping?: DeviceConnectorMapping[];
   dataMapping?: ConverterConnectorMapping[];
@@ -223,7 +225,7 @@ export interface AttributesUpdate {
   value: string;
 }
 
-interface Converter {
+export interface Converter {
   type: ConvertorType;
   deviceNameJsonExpression: string;
   deviceTypeJsonExpression: string;
@@ -239,14 +241,20 @@ export interface ConverterConnectorMapping {
   converter: Converter;
 }
 
+export type ConverterMappingFormValue = Omit<ConverterConnectorMapping, 'converter'> & {
+  converter: {
+    type: ConvertorType;
+  } & Record<ConvertorType, Converter>;
+};
+
 export interface DeviceConnectorMapping {
   deviceNodePattern: string;
   deviceNodeSource: string;
   deviceInfo: DeviceInfo;
-  attributes: Attribute[];
+  attributes?: Attribute[];
-  timeseries: Timeseries[];
+  timeseries?: Timeseries[];
-  rpc_methods: RpcMethod[];
+  rpc_methods?: RpcMethod[];
-  attributes_updates: AttributesUpdate[];
+  attributes_updates?: AttributesUpdate[];
 }
 
 export enum ConnectorType {
@@ -597,6 +605,10 @@ export interface RequestMappingData {
   requestValue: RequestDataItem;
 }
 
+export type RequestMappingFormValue = Omit<RequestMappingData, 'requestValue'> & {
+  requestValue: Record<RequestType, RequestDataItem>;
+};
+
 export interface RequestDataItem {
   type: string;
   details: string;