From af3fdfce91aeea1804c76a8571c102b78dde3794 Mon Sep 17 00:00:00 2001
From: JvD_Ericsson <jeff.van.dam@est.tech>
Date: Thu, 13 Apr 2023 08:28:45 +0100
Subject: UI support for default custom function names

Issue-ID: SDC-4473
Signed-off-by: JvD_Ericsson <jeff.van.dam@est.tech>
Change-Id: Ie4d002989857029300f0cc88123a5616a453aef0
---
 .../properties-assignment.page.component.ts        | 13 +++++-
 .../tosca-concat-function.component.html           |  2 +-
 .../tosca-concat-function.component.ts             |  2 +
 .../tosca-custom-function.component.html           | 10 ++--
 .../tosca-custom-function.component.spec.ts        | 10 ++++
 .../tosca-custom-function.component.ts             | 26 +++++++++--
 .../tosca-function/tosca-function.component.html   | 15 ++++--
 .../tosca-function/tosca-function.component.ts     | 53 ++++++++++++++++++++--
 8 files changed, 113 insertions(+), 18 deletions(-)

(limited to 'catalog-ui/src/app/ng2/pages/properties-assignment')

diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
index 0e3e13917a..a987564df4 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/properties-assignment.page.component.ts
@@ -71,6 +71,8 @@ import {TranslateService} from "../../shared/translator/translate.service";
 import {ToscaFunction} from "../../../models/tosca-function";
 import {SubPropertyToscaFunction} from "../../../models/sub-property-tosca-function";
 import {DeclareInputComponent} from "./declare-input/declare-input.component";
+import {CustomToscaFunction} from "../../../models/default-custom-functions";
+import {ToscaFunctionType} from "../../../models/tosca-function-type.enum";
 
 const SERVICE_SELF_TITLE = "SELF";
 @Component({
@@ -83,6 +85,7 @@ export class PropertiesAssignmentComponent {
     component: ComponentData;
     componentInstanceNamesMap: { [key: string]: InstanceFeDetails } = {}; //key is the instance uniqueId
     componentInstanceMap: Map<string, InstanceFeDetails> = new Map<string, InstanceFeDetails>(); //key is the instance uniqueId
+    customToscaFunctions: Array<CustomToscaFunction> = [];
 
     propertiesNavigationData = [];
     instancesNavigationData = [];
@@ -179,6 +182,13 @@ export class PropertiesAssignmentComponent {
 
         }, error => {
         }); //ignore error
+
+        this.topologyTemplateService.getDefaultCustomFunction().toPromise().then((data) => {
+            for (let customFunction of data) {
+                this.customToscaFunctions.push(new CustomToscaFunction(customFunction));
+            }
+        });
+
         this.componentServiceNg2
         .getComponentResourcePropertiesData(this.component)
         .subscribe(response => {
@@ -577,7 +587,8 @@ export class PropertiesAssignmentComponent {
 
         this.modalService.addDynamicContentToModalAndBindInputs(modal, ToscaFunctionComponent, {
             'property': checkedInstanceProperty,
-            'componentInstanceMap': this.componentInstanceMap
+            'componentInstanceMap': this.componentInstanceMap,
+            'customToscaFunctions': this.customToscaFunctions
         });
         modal.instance.dynamicContent.instance.onValidityChange.subscribe((validationEvent: ToscaFunctionValidationEvent) => {
             disableSaveButtonFlag = !validationEvent.isValid;
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.html
index 6320058d9d..bde29b8552 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.html
@@ -30,7 +30,7 @@
               <input type="text" [formControlName]="idx" [value]="parameter.value"/><br/>
             </ng-container>
             <ng-container *ngIf="parameter.type !== STRING_FUNCTION_TYPE">
-              <tosca-function [property]="propertyInputList[idx]" [componentInstanceMap]="componentInstanceMap" [allowClear]="false"
+              <tosca-function [property]="propertyInputList[idx]" [customToscaFunctions]="customToscaFunctions" [componentInstanceMap]="componentInstanceMap" [allowClear]="false"
                               (onValidityChange)="onFunctionValidityChange($event, idx)">
               </tosca-function>
             </ng-container>
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.ts
index ef45211ea0..dde2bc156b 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-concat-function/tosca-concat-function.component.ts
@@ -9,6 +9,7 @@ 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 {CustomToscaFunction} from "../../../../../models/default-custom-functions";
 
 @Component({
     selector: 'app-tosca-concat-function',
@@ -19,6 +20,7 @@ export class ToscaConcatFunctionComponent implements OnInit {
 
     @Input() toscaConcatFunction: ToscaConcatFunction;
     @Input() componentInstanceMap: Map<string, InstanceFeDetails> = new Map<string, InstanceFeDetails>();
+    @Input() customToscaFunctions: Array<CustomToscaFunction> = [];
     @Output() onValidFunction: EventEmitter<ToscaConcatFunction> = new EventEmitter<ToscaConcatFunction>();
     @Output() onValidityChange: EventEmitter<ToscaConcatFunctionValidationEvent> = new EventEmitter<ToscaConcatFunctionValidationEvent>();
 
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 a67364cd60..f77af54c77 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
@@ -21,8 +21,12 @@
 
 <div class="component-container">
   <ng-container [formGroup]="formGroup">
-    <label>Custom function name: </label>
-    <input type="text" formControlName="customName" [value]="name" required/><br/><br/>
+    <div *ngIf="!isDefaultCustomFunction" class="i-sdc-form-item">
+      <label>Custom function name: </label>
+      <div class="i-sdc-form-item">
+        <input type="text" formControlName="customName" [value]="name" (input)="name = $event.target.value" required/>
+      </div>
+    </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>
@@ -32,7 +36,7 @@
               <input type="text" [formControlName]="idx" [value]="parameter.value"/><br/>
             </ng-container>
             <ng-container *ngIf="parameter.type !== STRING_FUNCTION_TYPE">
-              <tosca-function [property]="propertyInputList[idx]" [componentInstanceMap]="componentInstanceMap" [allowClear]="false"
+              <tosca-function [property]="propertyInputList[idx]" [customToscaFunctions]="customToscaFunctions" [componentInstanceMap]="componentInstanceMap" [allowClear]="false"
                               (onValidityChange)="onFunctionValidityChange($event, idx)">
               </tosca-function>
             </ng-container>
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.spec.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.spec.ts
index 9c3c188711..c64547a9c7 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.spec.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-custom-function/tosca-custom-function.component.spec.ts
@@ -29,12 +29,19 @@ import {TranslateModule} from "../../../../shared/translator/translate.module";
 import {ToscaGetFunctionComponent} from "../tosca-get-function/tosca-get-function.component";
 import {UiElementsModule} from "../../../../components/ui/ui-elements.module";
 import {YamlFunctionComponent} from "../yaml-function/yaml-function.component";
+import {TopologyTemplateService} from "../../../../services/component-services/topology-template.service";
+import {Observable} from "rxjs/Observable";
+import {defaultCustomFunctionsMock} from "../../../../../../jest/mocks/default-custom-tosca-function.mock";
 
 describe('ToscaCustomFunctionComponent', () => {
     let component: ToscaCustomFunctionComponent;
     let fixture: ComponentFixture<ToscaCustomFunctionComponent>;
+    let topologyTemplateServiceMock: Partial<TopologyTemplateService>;
 
     beforeEach(async(() => {
+        topologyTemplateServiceMock = {
+            getDefaultCustomFunction: jest.fn().mockImplementation(() => Observable.of(defaultCustomFunctionsMock))
+        };
         TestBed.configureTestingModule({
             declarations: [
                 ToscaCustomFunctionComponent,
@@ -47,6 +54,9 @@ describe('ToscaCustomFunctionComponent', () => {
                 ReactiveFormsModule,
                 TranslateModule,
                 UiElementsModule
+            ],
+            providers: [
+                {provide: TopologyTemplateService, useValue: topologyTemplateServiceMock}
             ]
         })
         .compileComponents();
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 f3687880f2..7746d3845f 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,6 +30,7 @@ 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 {CustomToscaFunction} from "../../../../../models/default-custom-functions";
 
 @Component({
     selector: 'app-tosca-custom-function',
@@ -40,10 +41,12 @@ export class ToscaCustomFunctionComponent implements OnInit {
 
     @Input() toscaCustomFunction: ToscaCustomFunction;
     @Input() componentInstanceMap: Map<string, InstanceFeDetails> = new Map<string, InstanceFeDetails>();
+    @Input() customToscaFunctions: Array<CustomToscaFunction> = [];
+    @Input() name: string;
+    @Input() isDefaultCustomFunction: boolean;
     @Output() onValidFunction: EventEmitter<ToscaCustomFunction> = new EventEmitter<ToscaCustomFunction>();
     @Output() onValidityChange: EventEmitter<ToscaCustomFunctionValidationEvent> = new EventEmitter<ToscaCustomFunctionValidationEvent>();
 
-    name: string = '';
     customFunctionFormName: FormControl = new FormControl('', [Validators.required, Validators.minLength(1)]);
     customParameterFormArray: FormArray = new FormArray([], Validators.minLength(1));
     formGroup: FormGroup = new FormGroup(
@@ -62,12 +65,18 @@ export class ToscaCustomFunctionComponent implements OnInit {
         this.initForm();
     }
 
+    ngOnChanges() {
+        if (this.name && this.isDefaultCustomFunction) {
+            this.customFunctionFormName.setValue(this.name);
+            this.emitOnValidityChange();
+        } else {
+            this.name = "";
+        }
+    }
+
     private initForm(): void {
         this.formGroup.valueChanges.subscribe(() => {
-            this.onValidityChange.emit({
-                isValid: this.formGroup.valid,
-                toscaCustomFunction: this.formGroup.valid ? this.buildCustomFunctionFromForm() : undefined
-            })
+            this.emitOnValidityChange();
             if (this.formGroup.valid) {
                 this.onValidFunction.emit(this.buildCustomFunctionFromForm());
             }
@@ -114,6 +123,13 @@ export class ToscaCustomFunctionComponent implements OnInit {
         return toscaCustomFunction1;
     }
 
+    private emitOnValidityChange() {
+        this.onValidityChange.emit({
+            isValid: this.formGroup.valid,
+            toscaCustomFunction: this.formGroup.valid ? this.buildCustomFunctionFromForm() : undefined
+        })
+    }
+
     addFunction(): void {
         this.propertyInputList.push(this.createProperty());
         this.parameters.push({} as ToscaFunctionParameter);
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.html b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.html
index 3ec3fa45dc..898b189746 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.html
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.html
@@ -22,17 +22,24 @@
     <div class="i-sdc-form-item">
       <label class="i-sdc-form-label">{{'TOSCA_FUNCTION_LABEL' | translate}}</label>
       <select formControlName="toscaFunctionType" (change)="onFunctionTypeChange()">
-        <option *ngFor="let toscaFunction of toscaFunctions"
+        <optgroup label="Standard">
+          <option *ngFor="let toscaFunction of toscaFunctions"
                 [ngValue]="toscaFunction">{{toscaFunction | lowercase}}</option>
+        </optgroup>
+        <optgroup *ngIf="toscaCustomFunctions" label="Custom">
+          <option *ngFor="let toscaCustomFunction of toscaCustomFunctions"
+                [ngValue]="toscaCustomFunction">{{toscaCustomFunction | lowercase}}</option>
+        </optgroup>
+        <option value="YAML">yaml</option>
       </select>
     </div>
     <div *ngIf="isConcatSelected()">
-      <app-tosca-concat-function [toscaConcatFunction]="toscaFunction" [componentInstanceMap]="componentInstanceMap"
+      <app-tosca-concat-function [toscaConcatFunction]="toscaFunction" [customToscaFunctions]="customToscaFunctions" [componentInstanceMap]="componentInstanceMap"
                                  (onValidityChange)="onConcatFunctionValidityChange($event)"></app-tosca-concat-function>
     </div>
     <div *ngIf="isCustomSelected()">
-      <app-tosca-custom-function [toscaCustomFunction]="toscaFunction" [componentInstanceMap]="componentInstanceMap"
-                                 (onValidityChange)="onCustomFunctionValidityChange($event)"></app-tosca-custom-function>
+      <app-tosca-custom-function [toscaCustomFunction]="toscaFunction" [customToscaFunctions]="customToscaFunctions" [name]="getCustomFunctionName()" [componentInstanceMap]="componentInstanceMap"
+                                 [isDefaultCustomFunction]="isDefaultCustomFunction()" (onValidityChange)="onCustomFunctionValidityChange($event)"></app-tosca-custom-function>
     </div>
     <div *ngIf="isGetFunctionSelected()">
       <app-tosca-get-function [property]="property" [toscaGetFunction]="toscaFunction"
diff --git a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts
index 6783f5b13c..81696944c7 100644
--- a/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts
+++ b/catalog-ui/src/app/ng2/pages/properties-assignment/tosca-function/tosca-function.component.ts
@@ -35,6 +35,7 @@ import {YamlFunctionValidationEvent} from "./yaml-function/yaml-function.compone
 import {ToscaConcatFunction} from "../../../../models/tosca-concat-function";
 import {ToscaCustomFunction} from "../../../../models/tosca-custom-function";
 import {YamlFunction} from "../../../../models/yaml-function";
+import {CustomToscaFunction} from "../../../../models/default-custom-functions";
 
 @Component({
     selector: 'tosca-function',
@@ -45,6 +46,7 @@ export class ToscaFunctionComponent implements OnInit, OnChanges {
 
     @Input() property: PropertyBEModel;
     @Input() componentInstanceMap: Map<string, InstanceFeDetails> = new Map<string, InstanceFeDetails>();
+    @Input() customToscaFunctions: Array<CustomToscaFunction> = [];
     @Input() allowClear: boolean = true;
     @Input() compositionMap: boolean = false;
     @Input() compositionMapKey: string = "";
@@ -61,6 +63,7 @@ export class ToscaFunctionComponent implements OnInit, OnChanges {
     isLoading: boolean = false;
     toscaFunction: ToscaFunction;
     toscaFunctions: Array<string> = [];
+    toscaCustomFunctions: Array<String> = [];
 
     private isInitialized: boolean = false;
     private componentMetadata: ComponentMetadata;
@@ -132,7 +135,18 @@ export class ToscaFunctionComponent implements OnInit, OnChanges {
             return;
         }
         this.toscaFunctionForm.setValue(this.property.toscaFunction);
-        this.toscaFunctionTypeForm.setValue(this.property.toscaFunction.type);
+        let type = this.property.toscaFunction.type;
+        if (type == ToscaFunctionType.CUSTOM) {
+            let name = (this.property.toscaFunction as ToscaCustomFunction).name;
+            let test = this.customToscaFunctions.find(custToscFunc => _.isEqual(custToscFunc.name, name))
+            if (test) {
+                this.toscaFunctionTypeForm.setValue(name);
+            } else {
+                this.toscaFunctionTypeForm.setValue("other");
+            }
+        } else {
+            this.toscaFunctionTypeForm.setValue(type);
+        }
     }
 
     private areEqual(array1: string[], array2: string[]): boolean {
@@ -144,11 +158,41 @@ export class ToscaFunctionComponent implements OnInit, OnChanges {
         this.toscaFunctions.push(ToscaFunctionType.GET_ATTRIBUTE);
         this.toscaFunctions.push(ToscaFunctionType.GET_INPUT);
         this.toscaFunctions.push(ToscaFunctionType.GET_PROPERTY);
-        this.toscaFunctions.push(ToscaFunctionType.CUSTOM);
         if (this.property.type === PROPERTY_TYPES.STRING || this.property.type === PROPERTY_TYPES.ANY) {
             this.toscaFunctions.push(ToscaFunctionType.CONCAT);
         }
-        this.toscaFunctions.push(ToscaFunctionType.YAML);
+        this.loadCustomToscaFunctions();
+    }
+
+    private loadCustomToscaFunctions(): void {
+        if (!this.customToscaFunctions.find(custToscFunc => _.isEqual(custToscFunc.name, "other"))) {
+            let other = new CustomToscaFunction();
+            other.name = "other";
+            other.type = ToscaFunctionType.CUSTOM;
+            this.customToscaFunctions.push(other);
+        }
+        this.toscaCustomFunctions = [];
+        for (let func of this.customToscaFunctions) {
+            this.toscaCustomFunctions.push(func.name);
+        }
+    }
+
+    getCustomToscaFunction(): CustomToscaFunction {
+        let funcName = this.formGroup.get('toscaFunctionType').value;
+        return this.customToscaFunctions.find(custToscFunc => _.isEqual(custToscFunc.name, funcName));
+    }
+
+    getCustomFunctionName():string {
+        let toscaFunctionType: CustomToscaFunction = this.getCustomToscaFunction();
+        return toscaFunctionType.name;
+    }
+
+    isDefaultCustomFunction(): boolean {
+        let toscaFunctionType: CustomToscaFunction = this.getCustomToscaFunction();
+        if (toscaFunctionType.name === "other") {
+            return false;
+        }
+        return this.customToscaFunctions.filter(e => e.name === toscaFunctionType.name).length > 0;
     }
 
     private resetForm(): void {
@@ -173,7 +217,8 @@ export class ToscaFunctionComponent implements OnInit, OnChanges {
     }
 
     isCustomSelected(): boolean {
-        return this.formGroup.get('toscaFunctionType').value === ToscaFunctionType.CUSTOM;
+        let toscaFunctionType: CustomToscaFunction = this.getCustomToscaFunction();
+        return toscaFunctionType && toscaFunctionType.type === ToscaFunctionType.CUSTOM;
     }
 
     isGetFunctionSelected(): boolean {
-- 
cgit 1.2.3-korg