Implement create data type property

Allows to add a new data type property and visualize the properties
details.

Change-Id: Ib7bcd4b0bd8213dbe8ee8a3762a0636e22dc67eb
Issue-ID: SDC-4258
Signed-off-by: André Schmid <andre.schmid@est.tech>

3 files changed, 78 insertions, 71 deletions

diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.html b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.html
index 1e0804eb04..6a5bd5a007 100644
--- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.html
+++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.html
@@ -67,12 +67,16 @@
       <ul *ngIf="isExpanded">
         <li class="input-value">
           <ng-container *ngIf="isViewOnly">
-            {{valueObjRef}}<em class="empty-value" *ngIf="valueObjRef !== false && !valueObjRef">empty</em>
+            {{valueObjRef}}<em class="empty-value" *ngIf="valueObjRef !== false && !valueObjRef">{{'GENERAL_LABEL_EMPTY' | translate | lowercase}}</em>
           </ng-container>
-          <input *ngIf="!isViewOnly" [type]="getSimpleValueInputType()" name="value"
-                [(ngModel)]="valueObjRef"
-                (ngModelChange)="onValueChange($event)"
-          />
+          <input *ngIf="!isViewOnly && isTypeLiteral(type.name)" type="text" name="value"
+                 [(ngModel)]="valueObjRef" (ngModelChange)="onValueChange($event)"/>
+          <input *ngIf="!isViewOnly && isTypeNumber(type.name)" type="number"
+                 [(ngModel)]="valueObjRef" (ngModelChange)="onValueChange($event)"/>
+          <select *ngIf="!isViewOnly && isTypeBoolean(type.name)" [(ngModel)]="valueObjRef" (ngModelChange)="onValueChange($event)">
+            <option [value]="true">{{'GENERAL_LABEL_TRUE' | translate}}</option>
+            <option [value]="false">{{'GENERAL_LABEL_FALSE' | translate}}</option>
+          </select>
         </li>
       </ul>
     </ng-container>
@@ -123,7 +127,7 @@
               [type]="getDataType(schema.property.type)"
               [dataTypeMap]="dataTypeMap"
               [valueObjRef]="valueObjRef[i]"
-              [schema]="schema"
+              [schema]="buildSchemaGroupProperty()"
               [nestingLevel]="nestingLevel + 1"
               [listIndex]="i"
               [isListChild]="true"
@@ -155,7 +159,7 @@
               [type]="getDataType(schema.property.type)"
               [dataTypeMap]="dataTypeMap"
               [valueObjRef]="valueObjRef[key]"
-              [schema]="schema"
+              [schema]="buildSchemaGroupProperty()"
               [isMapChild]="true"
               [nestingLevel]="nestingLevel + 1"
               [isViewOnly]="isViewOnly"
diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts
index 88ff8deec6..145aad687c 100644
--- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/input-list/input-list-item/input-list-item.component.ts
@@ -21,12 +21,13 @@
 
 import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
 import {DataTypeModel} from '../../../../../../../models/data-types';
-import {SchemaPropertyGroupModel} from '../../../../../../../models/schema-property';
-import {DerivedPropertyType, PropertyBEModel} from '../../../../../../../models/properties-inputs/property-be-model';
+import {SchemaProperty, SchemaPropertyGroupModel} from '../../../../../../../models/schema-property';
+import {PropertyBEModel} from '../../../../../../../models/properties-inputs/property-be-model';
 import {PROPERTY_DATA, PROPERTY_TYPES} from '../../../../../../../utils/constants';
 import {ToscaFunction} from '../../../../../../../models/tosca-function';
-import {ToscaFunctionValidationEvent} from "../../../../../../../ng2/pages/properties-assignment/tosca-function/tosca-function.component";
+import {ToscaFunctionValidationEvent} from "../../../../../properties-assignment/tosca-function/tosca-function.component";
 import {InstanceFeDetails} from "../../../../../../../models/instance-fe-details";
+import {ToscaTypeHelper} from "app/utils/tosca-type-helper";
 
 @Component({
   selector: 'app-input-list-item',
@@ -41,6 +42,7 @@ export class InputListItemComponent implements OnInit {
   @Input() type: DataTypeModel;
   @Input() schema: SchemaPropertyGroupModel;
   @Input() nestingLevel: number;
+  @Input() isExpanded: boolean = false;
   @Input() isListChild: boolean = false;
   @Input() isMapChild: boolean = false;
   @Input() showToscaFunctionOption: boolean = false;
@@ -53,12 +55,11 @@ export class InputListItemComponent implements OnInit {
   @Output('onDelete') onDeleteEvent: EventEmitter<string> = new EventEmitter<string>();
   @Output('onChildListItemDelete') onChildListItemDeleteEvent: EventEmitter<number> = new EventEmitter<number>();
 
-  isExpanded: boolean = false;
   mapEntryName: string;
   isToscaFunction: boolean = false;
   property: PropertyBEModel;
 
-  ngOnInit() {
+  ngOnInit(): void {
     if (!this.nestingLevel) {
       this.nestingLevel = 0;
     }
@@ -93,26 +94,20 @@ export class InputListItemComponent implements OnInit {
     }
   }
 
-  getType(typeName: string): DerivedPropertyType {
-    if (PROPERTY_DATA.SIMPLE_TYPES.indexOf(typeName) > -1) {
-      return DerivedPropertyType.SIMPLE;
-    } else if (typeName === PROPERTY_TYPES.LIST) {
-      return DerivedPropertyType.LIST;
-    } else if (typeName === PROPERTY_TYPES.MAP) {
-      return DerivedPropertyType.MAP;
-    } else if (typeName === PROPERTY_TYPES.RANGE) {
-      return DerivedPropertyType.RANGE;
-    } else {
-      return DerivedPropertyType.COMPLEX;
-    }
+  isTypeSimple(typeName: string): boolean {
+    return ToscaTypeHelper.isTypeSimple(typeName) || this.isTypeDerivedFromSimple(typeName) && (this.isTypeWithoutProperties(typeName));
+  }
+
+  isTypeRange(typeName: string): boolean {
+    return ToscaTypeHelper.isTypeRange(typeName);
   }
 
   isTypeWithoutProperties(typeName: string): boolean {
-      if (this.dataTypeMap.get(typeName) === undefined) {
-          return true;
-      }
-      return this.dataTypeMap.get(typeName).properties === undefined ||
-          this.dataTypeMap.get(typeName).properties.length == 0;
+    if (this.dataTypeMap.get(typeName) === undefined) {
+      return true;
+    }
+    return this.dataTypeMap.get(typeName).properties === undefined ||
+        this.dataTypeMap.get(typeName).properties.length == 0;
   }
 
   isTypeDerivedFromSimple(typeName: string): boolean {
@@ -134,27 +129,28 @@ export class InputListItemComponent implements OnInit {
     return true;
   }
 
-  isTypeSimple(typeName: string): boolean {
-    if (this.getType(typeName) == DerivedPropertyType.SIMPLE) {
-      return true;
-    }
-    return this.isTypeDerivedFromSimple(typeName) && (this.isTypeWithoutProperties(typeName));
+  isTypeList(typeName: string): boolean {
+    return ToscaTypeHelper.isTypeList(typeName);
   }
 
-  isTypeRange(typeName: string): boolean {
-    return this.getType(typeName) == DerivedPropertyType.RANGE;
+  isTypeMap(typeName: string): boolean {
+    return ToscaTypeHelper.isTypeMap(typeName);
   }
 
-  isTypeList(typeName: string): boolean {
-    return this.getType(typeName) == DerivedPropertyType.LIST;
+  isTypeComplex(typeName: string): boolean {
+    return ToscaTypeHelper.isTypeComplex(typeName);
   }
 
-  isTypeMap(typeName: string): boolean {
-    return this.getType(typeName) == DerivedPropertyType.MAP;
+  isTypeNumber(type: string): boolean {
+    return ToscaTypeHelper.isTypeNumber(type);
   }
 
-  isTypeComplex(typeName: string): boolean {
-    return !this.isTypeSimple(typeName) && !this.isTypeList(typeName) && !this.isTypeMap(typeName) && !this.isTypeRange(typeName);
+  isTypeBoolean(type: string): boolean {
+    return ToscaTypeHelper.isTypeBoolean(type);
+  }
+
+  isTypeLiteral(type: string): boolean {
+    return ToscaTypeHelper.isTypeLiteral(type);
   }
 
   expandAndCollapse() {
@@ -180,7 +176,7 @@ export class InputListItemComponent implements OnInit {
   }
 
   onValueChange(value: any): void {
-    if (this.isNumber(this.type.name)) {
+    if (this.isTypeNumber(this.type.name)) {
       this.emitValueChangeEvent(this.parseNumber(value));
       return;
     }
@@ -297,14 +293,20 @@ export class InputListItemComponent implements OnInit {
   }
 
   getSimpleValueInputType() {
-    if (this.isNumber(this.type.name)){
+    if (this.isTypeNumber(this.type.name)){
       return 'number';
     }
     return 'text';
   }
 
-  isNumber(type: string): boolean {
-    return type === PROPERTY_TYPES.INTEGER || type === PROPERTY_TYPES.FLOAT;
+  buildSchemaGroupProperty(): SchemaPropertyGroupModel {
+    const schemaProperty = new SchemaProperty();
+    if (this.schema.property.type === PROPERTY_TYPES.MAP || this.schema.property.type === PROPERTY_TYPES.LIST) {
+      schemaProperty.type = PROPERTY_TYPES.STRING;
+    } else {
+      schemaProperty.type = this.schema.property.type
+    }
+    return new SchemaPropertyGroupModel(schemaProperty);
   }
 
   private parseBoolean(value: any) {
diff --git a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.module.ts b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.module.ts
index c829ff9e5a..b4fc9d1bdb 100644
--- a/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.module.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/interface-operatons/operation-creator/interface-operation-handler.module.ts
@@ -36,31 +36,32 @@ import {PropertyTableModule} from "app/ng2/components/logic/properties-table/pro
 import {ToscaFunctionModule} from '../../../properties-assignment/tosca-function/tosca-function.module';
 
 @NgModule({
-  declarations: [
-    InterfaceOperationHandlerComponent,
-    PropertyParamRowComponent,
-    AddInputComponent,
-    InputListComponent,
-    InputListItemComponent
-  ],
-  imports: [
-    CommonModule,
-    SdcUiComponentsModule,
-    FormsModule,
-    FormElementsModule,
-    TranslateModule,
-    UiElementsModule,
-    PropertyTableModule,
-    ReactiveFormsModule,
-    ToscaFunctionModule
-  ],
-  exports: [
-    PropertyParamRowComponent
-  ],
-  entryComponents: [
-    InterfaceOperationHandlerComponent
-  ],
-  providers: []
+    declarations: [
+        InterfaceOperationHandlerComponent,
+        PropertyParamRowComponent,
+        AddInputComponent,
+        InputListComponent,
+        InputListItemComponent
+    ],
+    imports: [
+        CommonModule,
+        SdcUiComponentsModule,
+        FormsModule,
+        FormElementsModule,
+        TranslateModule,
+        UiElementsModule,
+        PropertyTableModule,
+        ReactiveFormsModule,
+        ToscaFunctionModule
+    ],
+    exports: [
+        PropertyParamRowComponent,
+        InputListItemComponent
+    ],
+    entryComponents: [
+        InterfaceOperationHandlerComponent
+    ],
+    providers: []
 })
 
 export class InterfaceOperationHandlerModule {