Provide tosca function as map primitive type entry values in composition view

Providing the capability to add tosca function as the primitive type entry values of map in composition view

Issue-ID: SDC-4319
Signed-off-by: Imam hussain <imam.hussain@est.tech>
Change-Id: I5cf67bc94ac5c72be6a962e07160329cd07d302c

3 files changed, 115 insertions, 5 deletions

diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
index d84ec821de..5c895115e5 100644
--- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
+++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.html
@@ -41,9 +41,14 @@
         </div>
         <div data-ng-if="!isSchemaTypeDataType" class="i-sdc-form-item map-item-field" data-ng-class="{error:(parentFormObj['mapValue'+fieldsPrefixName+$index].$dirty && parentFormObj['mapValue'+fieldsPrefixName+$index].$invalid)}">
             <label class="i-sdc-form-label required">Value</label>
-        
+            <form class="temp-form">
+                <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index] == false}}" data-ng-click="onEnableTosca(false,$index)"/> 
+                Value
+                <input type="radio" name="hasToscaFunction-{{fieldsPrefixName}}-{{$index}}" data-ng-checked="{{showToscaFunction[$index]}}" data-ng-click="onEnableTosca(true,$index)" ng-disabled="mapKeys[$index] == '' || mapKeys[$index] == null"/> 
+                {{'TOSCA_FUNCTION_LABEL' | translate}}
+            </form>
             <input class="i-sdc-form-input"
-                   ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean')"
+                   ng-if="!constraints && !((schemaProperty.simpleType||schemaProperty.type) == 'boolean') && showToscaFunction[$index] == false"
                    data-ng-readonly="readOnly"
                    data-ng-model="valueObjRef[mapKeys[$index]]"
                    type="text"
@@ -58,7 +63,7 @@
                    autofocus />
             <select class="i-sdc-form-select"
                     data-tests-id="mapValue{{fieldsPrefixName}}{{$index}}"
-                    ng-if="!constraints && (schemaProperty.simpleType||schemaProperty.type) == 'boolean'"
+                    ng-if="!constraints && (schemaProperty.simpleType||schemaProperty.type) == 'boolean' && showToscaFunction[$index] == false"
                     data-ng-disabled="readOnly"
                     name="mapValue{{fieldsPrefixName}}{{$index}}"
                     data-ng-model="valueObjRef[mapKeys[$index]]"
@@ -66,6 +71,16 @@
                 <option value="true">true</option>
                 <option value="false">false</option>
             </select>
+            <div data-ng-if="showToscaFunction[$index]" class="div-tosca-function">
+                <tosca-function [property]="parentProperty"
+                                [component-instance-map]="componentInstanceMap"
+                                [allow-clear]="false"
+                                [composition-map]="true"
+                                [composition-map-key]="mapKeys[$index]"
+                                (on-valid-function)="onGetToscaFunction($event,mapKeys[$index])"
+                >
+                </tosca-function>
+            </div>
 
 
             <select class="i-sdc-form-select"
diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.less b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.less
index 9c2984e3ce..1714178c9f 100644
--- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.less
+++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.less
@@ -90,3 +90,15 @@
 .type-map {
     display: inline-block;
 }
+
+.tosca-function {
+    max-width: 165px;
+}
+
+.tosca-error {
+    max-width: 165px;
+}
+
+.temp-form {
+    all: unset;
+}
\ No newline at end of file
diff --git a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
index ceb2fa0bb9..ce8b997035 100644
--- a/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
+++ b/catalog-ui/src/app/directives/property-types/type-map/type-map-directive.ts
@@ -24,11 +24,16 @@
 'use strict';
 import {ValidationUtils, PROPERTY_TYPES} from "app/utils";
 import {DataTypesService} from "app/services";
-import {SchemaProperty} from "app/models";
+import {SchemaProperty, PropertyModel} from "app/models";
+import {InstanceFeDetails} from "app/models/instance-fe-details";
+import {ToscaGetFunction} from "app/models/tosca-get-function";
+import {SubPropertyToscaFunction} from "app/models/sub-property-tosca-function";
 
 export interface ITypeMapScope extends ng.IScope {
     parentFormObj:ng.IFormController;
     schemaProperty:SchemaProperty;
+    parentProperty:PropertyModel;
+    componentInstanceMap: Map<string, InstanceFeDetails>;
     isMapKeysUnique:boolean;
     isSchemaTypeDataType:boolean;
     valueObjRef:any;
@@ -41,6 +46,7 @@ export interface ITypeMapScope extends ng.IScope {
     maxLength:number;
     constraints:string[];
     showAddBtn: boolean;
+    showToscaFunction: Array<boolean>;
 
     getValidationPattern(type:string):RegExp;
     validateIntRange(value:string):boolean;
@@ -49,6 +55,9 @@ export interface ITypeMapScope extends ng.IScope {
     addMapItemFields():void;
     parseToCorrectType(objectOfValues:any, locationInObj:string, type:string):void;
     getNumber(num:number):Array<any>;
+    validateSubToscaFunction(key:string):boolean;
+    onEnableTosca(toscaFlag:boolean,index:number);
+    onGetToscaFunction(toscaGetFunction: ToscaGetFunction, key:string);
 }
 
 
@@ -62,6 +71,7 @@ export class TypeMapDirective implements ng.IDirective {
 
     scope = {
         valueObjRef: '=',//ref to map object in the parent value object
+        componentInstanceMap: '=',
         schemaProperty: '=',//get the schema.property object
         parentFormObj: '=',//ref to parent form (get angular form object)
         fieldsPrefixName: '=',//prefix for form fields names
@@ -69,7 +79,8 @@ export class TypeMapDirective implements ng.IDirective {
         defaultValue: '@',//this map default value
         maxLength: '=',
         constraints: '=',
-        showAddBtn: '=?'
+        showAddBtn: '=?',
+        parentProperty: '='
     };
 
     restrict = 'E';
@@ -82,6 +93,20 @@ export class TypeMapDirective implements ng.IDirective {
         scope.showAddBtn = angular.isDefined(scope.showAddBtn) ? scope.showAddBtn : true;
         scope.MapKeyValidationPattern = this.MapKeyValidationPattern;
         scope.isMapKeysUnique = true;
+        if (scope.mapKeys === undefined) {
+            scope.mapKeys = Object.keys(scope.valueObjRef);
+        }
+        scope.showToscaFunction = new Array(scope.mapKeys.length);
+        scope.mapKeys.forEach((key, index) => {
+            scope.showToscaFunction[index] = false;
+            if (scope.parentProperty.subPropertyToscaFunctions != null) {
+                scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => {
+                    if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) {
+                        scope.showToscaFunction[index] = true;
+                    }
+                });
+            }
+        });
 
         //reset valueObjRef and mapKeys when schema type is changed
         scope.$watchCollection('schemaProperty.type', (newData:any):void => {
@@ -153,8 +178,19 @@ export class TypeMapDirective implements ng.IDirective {
         };
 
         scope.deleteMapItem = (index:number):void=> {
+            const keyToChange = scope.mapKeys[index];
             delete scope.valueObjRef[scope.mapKeys[index]];
             scope.mapKeys.splice(index, 1);
+            scope.showToscaFunction.splice(index, 1);
+            if (scope.parentProperty.subPropertyToscaFunctions != null) {
+                let subToscaFunctionList : Array<SubPropertyToscaFunction> = [];
+                scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction, index) => {
+                    if (SubPropertyToscaFunction.subPropertyPath.indexOf(keyToChange) == -1) {
+                        subToscaFunctionList.push(SubPropertyToscaFunction);
+                    }
+                });
+                scope.parentProperty.subPropertyToscaFunctions = subToscaFunctionList;
+            }
             if (!scope.mapKeys.length) {//only when user removes all pairs of key-value fields - put the default
                 if (scope.mapDefaultValue) {
                     angular.copy(scope.mapDefaultValue, scope.valueObjRef);
@@ -163,9 +199,45 @@ export class TypeMapDirective implements ng.IDirective {
             }
         };
 
+        scope.onEnableTosca = (toscaFlag:boolean,flagIndex:number):void => {
+            scope.showToscaFunction[flagIndex] = toscaFlag;
+            scope.valueObjRef[scope.mapKeys[flagIndex]] = null;
+            if (!toscaFlag) {
+                if (scope.parentProperty.subPropertyToscaFunctions != null) {
+                    let subToscaFunctionList : Array<SubPropertyToscaFunction> = [];
+                    scope.parentProperty.subPropertyToscaFunctions.forEach((SubPropertyToscaFunction, index) => {
+                        if (SubPropertyToscaFunction.subPropertyPath.indexOf(scope.mapKeys[flagIndex]) == -1) {
+                            subToscaFunctionList.push(SubPropertyToscaFunction);
+                        }
+                    });
+                    scope.parentProperty.subPropertyToscaFunctions = subToscaFunctionList;
+                }
+            }
+        };
+
+        scope.onGetToscaFunction = (toscaGetFunction: ToscaGetFunction, key:string): void => {
+            if (scope.parentProperty.subPropertyToscaFunctions != null) {
+                scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => {
+                    if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) {
+                        SubPropertyToscaFunction.toscaFunction = toscaGetFunction;
+                        return;
+                    }
+                });
+
+            }
+            if (scope.parentProperty.subPropertyToscaFunctions == null){
+                scope.parentProperty.subPropertyToscaFunctions = [];
+            }
+            let subPropertyToscaFunction = new SubPropertyToscaFunction();
+            subPropertyToscaFunction.toscaFunction = toscaGetFunction;
+            subPropertyToscaFunction.subPropertyPath = [key];
+            scope.parentProperty.subPropertyToscaFunctions.push(subPropertyToscaFunction);
+        }
+
         scope.addMapItemFields = ():void => {
             scope.valueObjRef[''] = null;
             scope.mapKeys = Object.keys(scope.valueObjRef);
+            scope.showToscaFunction.push(false);
         };
 
         scope.parseToCorrectType = (objectOfValues:any, locationInObj:string, type:string):void => {
@@ -173,6 +245,17 @@ export class TypeMapDirective implements ng.IDirective {
                 objectOfValues[locationInObj] = JSON.parse(objectOfValues[locationInObj]);
             }
         }
+
+        scope.validateSubToscaFunction = (key:string):boolean => {
+            if (scope.parentProperty.subPropertyToscaFunctions != null) {
+                scope.parentProperty.subPropertyToscaFunctions.forEach(SubPropertyToscaFunction => {
+                    if (SubPropertyToscaFunction.subPropertyPath.indexOf(key) != -1) {
+                        return true;
+                    }
+                });
+            }
+            return false;
+        }
     };
 
     public static factory = (DataTypesService:DataTypesService,