UI support for default custom function names with get_input structure

Issue-ID: SDC-4493
Signed-off-by: JvD_Ericsson <jeff.van.dam@est.tech>
Change-Id: Iba3eda9bb5d57aabbe86045b6150564e17a0ff3e

2 files changed, 80 insertions, 16 deletions

diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.html
index f77af54c77..831ce49de8 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.html
@@ -29,26 +29,36 @@
     </div>
     <div formArrayName="customParameterList">
       <div *ngFor="let parameter of parameters; let idx = index">
-        <div *ngIf="idx > 0" class="text-center"><span class="custom-plus-icon"></span></div>
-        <div class="parameter-card">
+        <div *ngIf="idx > 0 && type != GET_INPUT" class="text-center"><span class="custom-plus-icon"></span></div>
+        <div class="parameter-card" *ngIf="type != GET_INPUT">
           <div class="card-content">
             <ng-container *ngIf="parameter.type === STRING_FUNCTION_TYPE">
               <input type="text" [formControlName]="idx" [value]="parameter.value"/><br/>
             </ng-container>
             <ng-container *ngIf="parameter.type !== STRING_FUNCTION_TYPE">
-              <tosca-function [property]="propertyInputList[idx]" [customToscaFunctions]="customToscaFunctions" [componentInstanceMap]="componentInstanceMap" [allowClear]="false"
+              <tosca-function [property]="propertyInputList[idx]"
+                              [customToscaFunctions]="customToscaFunctions"
+                              [componentInstanceMap]="componentInstanceMap"
+                              [allowClear]="false"
                               (onValidityChange)="onFunctionValidityChange($event, idx)">
               </tosca-function>
             </ng-container>
-            <div class="buttons-container">
+            <div *ngIf="type != GET_INPUT" class="buttons-container">
               <span class="delete-icon" (click)="removeParameter(idx)"></span>
             </div>
           </div>
         </div>
+        <ng-container *ngIf="type === GET_INPUT">
+          <app-tosca-get-function [property]="propertyInputList[idx]" [toscaGetFunction]="toscaGetFunction"
+                                  [componentInstanceMap]="componentInstanceMap"
+                                  [functionType]="GET_INPUT"
+                                  (onValidityChange)="onGetFunctionValidityChange($event, idx)">
+          </app-tosca-get-function>
+        </ng-container>
       </div>
     </div>
   </ng-container>
-  <div class="buttons-container">
+  <div *ngIf="type != GET_INPUT" class="buttons-container">
     <a class="add-link" (click)="addStringParameter()">String Value</a> <a class="add-link" (click)="addFunction()">TOSCA Function Expression</a>
   </div>
 </div>
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.ts
index 7746d3845f..35f1649ec6 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.ts
@@ -30,7 +30,9 @@ import {PROPERTY_TYPES} from "../../../../../utils/constants";
 import {InstanceFeDetails} from "../../../../../models/instance-fe-details";
 import {ToscaFunctionValidationEvent} from "../tosca-function.component";
 import {ToscaFunction} from "../../../../../models/tosca-function";
+import {ToscaGetFunction} from "../../../../../models/tosca-get-function";
 import {CustomToscaFunction} from "../../../../../models/default-custom-functions";
+import {ToscaGetFunctionValidationEvent} from "../tosca-get-function/tosca-get-function.component";
 
 @Component({
     selector: 'app-tosca-custom-function',
@@ -43,10 +45,14 @@ export class ToscaCustomFunctionComponent implements OnInit {
     @Input() componentInstanceMap: Map<string, InstanceFeDetails> = new Map<string, InstanceFeDetails>();
     @Input() customToscaFunctions: Array<CustomToscaFunction> = [];
     @Input() name: string;
+    @Input() type: ToscaFunctionType;
+    @Input() propertyType: string;
+    @Input() propertySchemaType: string = undefined;
     @Input() isDefaultCustomFunction: boolean;
     @Output() onValidFunction: EventEmitter<ToscaCustomFunction> = new EventEmitter<ToscaCustomFunction>();
     @Output() onValidityChange: EventEmitter<ToscaCustomFunctionValidationEvent> = new EventEmitter<ToscaCustomFunctionValidationEvent>();
 
+    toscaGetFunction: ToscaFunction;
     customFunctionFormName: FormControl = new FormControl('', [Validators.required, Validators.minLength(1)]);
     customParameterFormArray: FormArray = new FormArray([], Validators.minLength(1));
     formGroup: FormGroup = new FormGroup(
@@ -58,20 +64,29 @@ export class ToscaCustomFunctionComponent implements OnInit {
 
     parameters: ToscaFunctionParameter[] = [];
     propertyInputList: Array<PropertyBEModel> = [];
+    previousType: ToscaFunctionType;
 
-    STRING_FUNCTION_TYPE = ToscaFunctionType.STRING
+    STRING_FUNCTION_TYPE = ToscaFunctionType.STRING;
+    GET_INPUT = ToscaFunctionType.GET_INPUT;
 
     ngOnInit() {
         this.initForm();
     }
 
     ngOnChanges() {
+        if (this.previousType && this.previousType != this.type) {
+            this.propertyInputList = [];
+            this.customParameterFormArray = new FormArray([], Validators.minLength(1));
+            this.parameters = [];
+        }
+        this.fillVariables();
         if (this.name && this.isDefaultCustomFunction) {
             this.customFunctionFormName.setValue(this.name);
             this.emitOnValidityChange();
         } else {
-            this.name = "";
+            this.name = '';
         }
+        this.previousType = this.type;
     }
 
     private initForm(): void {
@@ -81,7 +96,13 @@ export class ToscaCustomFunctionComponent implements OnInit {
                 this.onValidFunction.emit(this.buildCustomFunctionFromForm());
             }
         });
+    }
+
+    private fillVariables() {
         if (!this.toscaCustomFunction) {
+            if (this.type === this.GET_INPUT && this.parameters.length < 1) {
+                this.addFunction();
+            }
             return;
         }
         if (this.toscaCustomFunction.parameters) {
@@ -89,13 +110,13 @@ export class ToscaCustomFunctionComponent implements OnInit {
             this.customFunctionFormName.setValue(this.name)
             this.parameters = Array.from(this.toscaCustomFunction.parameters);
             for (const parameter of this.parameters) {
+                if (this.type === this.GET_INPUT) {
+                    this.toscaGetFunction = parameter as ToscaGetFunction;
+                    this.addToscaFunctionToParameters(parameter);
+                    return;
+                }
                 if (parameter.type !== PROPERTY_TYPES.STRING) {
-                    const propertyBEModel = this.createProperty(parameter.value);
-                    propertyBEModel.toscaFunction = <ToscaFunction> parameter;
-                    this.propertyInputList.push(propertyBEModel);
-                    this.customParameterFormArray.push(
-                        new FormControl(parameter, [Validators.required, Validators.minLength(1)])
-                    );
+                    this.addToscaFunctionToParameters(parameter);
                 } else {
                     this.propertyInputList.push(undefined);
                     this.customParameterFormArray.push(
@@ -104,6 +125,18 @@ export class ToscaCustomFunctionComponent implements OnInit {
                 }
             }
         }
+        if (this.type === this.GET_INPUT && this.parameters.length < 1) {
+            this.addFunction();
+        }
+    }
+
+    private addToscaFunctionToParameters(parameter: ToscaFunctionParameter) {
+        const propertyBEModel = this.createProperty(parameter.value);
+        propertyBEModel.toscaFunction = <ToscaFunction> parameter;
+        this.propertyInputList.push(propertyBEModel);
+        this.customParameterFormArray.push(
+            new FormControl(parameter, [Validators.required, Validators.minLength(1)])
+        );
     }
 
     private buildCustomFunctionFromForm(): ToscaCustomFunction {
@@ -111,6 +144,9 @@ export class ToscaCustomFunctionComponent implements OnInit {
         toscaCustomFunction1.name = this.customFunctionFormName.value;
         this.customParameterFormArray.controls.forEach(control => {
             const value = control.value;
+            if (!value) {
+                return;
+            }
             if (typeof value === 'string') {
                 const stringParameter = new ToscaStringParameter();
                 stringParameter.value = value;
@@ -140,12 +176,13 @@ export class ToscaCustomFunctionComponent implements OnInit {
 
     addStringParameter(): void {
         const toscaStringParameter = new ToscaStringParameter();
-        toscaStringParameter.value = ''
-        this.parameters.push(toscaStringParameter);
+        toscaStringParameter.value = '';
         this.propertyInputList.push(undefined);
         this.customParameterFormArray.push(
             new FormControl('', [Validators.required, Validators.minLength(1)])
         );
+        this.parameters.push(toscaStringParameter);
+        console.log(this.customParameterFormArray)
     }
 
     removeParameter(position): void {
@@ -156,7 +193,15 @@ export class ToscaCustomFunctionComponent implements OnInit {
 
     createProperty(value?: any): PropertyBEModel {
         const property = new PropertyBEModel();
-        property.type = PROPERTY_TYPES.ANY;
+        if (this.type === this.GET_INPUT) {
+            property.type = this.propertyType;
+            if (this.propertySchemaType) {
+                property.schemaType = this.propertySchemaType;
+            }
+        } else {
+            property.type = PROPERTY_TYPES.ANY;
+        }
+        
         property.value = value ? value : undefined;
         return property;
     }
@@ -168,6 +213,15 @@ export class ToscaCustomFunctionComponent implements OnInit {
             this.customParameterFormArray.controls[index].setValue(undefined);
         }
     }
+
+    onGetFunctionValidityChange(event: ToscaGetFunctionValidationEvent, index: number): void {
+        if (event.isValid && event.toscaGetFunction) {
+            this.customParameterFormArray.controls[index].setValue(event.toscaGetFunction);
+        } else {
+            this.customParameterFormArray.controls[index].setValue(undefined);
+        }
+        this.emitOnValidityChange();
+    }
 }
 
 export interface ToscaCustomFunctionValidationEvent {