make function attributes more dynamic

Issue-ID: CCSDK-2900

Signed-off-by: Ahmedeldeeb50 <ahmed.eldeeb.ext@orange.com>
Change-Id: Iff0e9c9261ac111f65a975a1cc5a72dda9cf4be2

3 files changed, 84 insertions, 12 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
index 9c8271d68..8ba7ea030 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/configuration-dashboard/configuration-dashboard.component.ts
@@ -71,6 +71,7 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl
     }
 
     ngOnInit() {
+        this.ngxService.start();
         this.vlbDefinition.topology_template = new TemplateTopology();
         this.packageCreationStore.state$
             .pipe(distinctUntilChanged((a: any, b: any) => JSON.stringify(a) === JSON.stringify(b)),
@@ -114,6 +115,9 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl
                     this.downloadCBAPackage(bluePrintDetailModels);
                     this.packageCreationStore.clear();
                 }
+            }, err => { },
+            () => {
+                //  this.ngxService.stop();
             });
     }
 
@@ -123,7 +127,10 @@ export class ConfigurationDashboardComponent extends ComponentCanDeactivate impl
                 const blob = new Blob([response], { type: 'application/octet-stream' });
                 this.currentBlob = blob;
                 this.packageCreationExtractionService.extractBlobToStore(blob);
-            });
+            }, err => { },
+                () => {
+                    this.ngxService.stop();
+                });
     }
 
     editBluePrint() {
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
index 3107c9368..4decbf3d5 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.html
@@ -3,12 +3,12 @@
         <div class="col">
             <div class="form-group">
                 <label for="exampleInputEmail1">Function Instance Name</label>
-                <input type="text" [(ngModel)]="currentFuncion['instance-name']" class="form-control"
+                <input disabled type="text" [(ngModel)]="currentFuncion['instance-name']" class="form-control"
                     placeholder="Function Instance Name">
             </div>
             <div class="form-group mb-0">
                 <label>Function Type</label>
-                <label class="attribute-value">component-resource-resolution</label>
+                <label class="attribute-value">{{currentFuncion['type']}}</label>
             </div>
             <div class="form-group">
                 <label for="exampleFormControlTextarea1">Description</label>
@@ -50,7 +50,7 @@
                             <div class="row">
                                 <div class="col">
                                     <!--list-->
-                                    <div class="attribute-wrap" *ngIf="artifactPrefix">
+                                    <div class="attribute-wrap" [hidden]="!artifactPrefix">
                                         <div class="form-group">
                                             <label for="exampleFormControlTextarea">artifact-prefix-names
                                                 <i class="icon-required-star" type="button"
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.ts
index 20305e853..5ab4b43fa 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/functions-attribute/functions-attribute.component.ts
@@ -7,6 +7,8 @@ import { CBAPackage } from '../../package-creation/mapping-models/CBAPacakge.mod
 import { TemplateAndMapping } from '../../package-creation/template-mapping/TemplateAndMapping';
 import { FunctionsStore } from '../functions.store';
 import { NodeProcess, NodeTemplate } from '../model/desinger.nodeTemplate.model';
+import { DesignerDashboardState } from '../model/designer.dashboard.state';
+import { Action } from '../action-attributes/models/Action';
 
 @Component({
     selector: 'app-functions-attribute',
@@ -28,6 +30,11 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
     artifactPrefix = false;
     currentFuncion = new NodeProcess();
     nodeTemplates = new NodeTemplate('');
+    designerState: DesignerDashboardState;
+    actionName = '';
+    functionName = '';
+    interfaceChildName = '';
+
 
     constructor(
         private designerStore: DesignerStore,
@@ -43,6 +50,20 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
                 takeUntil(this.ngUnsubscribe))
             .subscribe(designerDashboardState => {
                 this.designerDashboardState = designerDashboardState;
+                this.designerState = designerDashboardState;
+                this.actionName = this.designerState.actionName;
+                const action = this.designerState.template.workflows[this.actionName] as Action;
+
+                console.log(action);
+                if (action) {
+                    const child = Object.keys(action.steps)[0];
+                    this.functionName = action.steps[child].target;
+                    console.log(this.designerState.template.node_templates[this.functionName]);
+                    //  this.currentFuncion = this.designerState.template.node_templates[this.functionName];
+                    // reset inouts&outputs
+                    this.toNodeProcess(this.designerState.template.node_templates[this.functionName], this.functionName);
+                    this.getNodeType(this.functionName);
+                }
             });
 
         this.packageCreationStore.state$
@@ -65,10 +86,40 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
                     this.setIsMappingOrTemplate(key, templateAndMapping, isFromTemplate);
                 });
             });
-        this.getNodeType('component-resource-resolution');
+
 
     }
 
+    toNodeProcess(nodeTemplate, functionName) {
+        this.requiredInputs = new Map<string, {}>();
+        this.requiredOutputs = new Map<string, {}>();
+        this.OptionalInputs = new Map<string, {}>();
+        this.optionalOutputs = new Map<string, {}>();
+        console.log(nodeTemplate);
+        this.currentFuncion['instance-name'] = functionName;
+        // tslint:disable-next-line: no-string-literal
+        this.currentFuncion['type'] = nodeTemplate['type'];
+        if (Object.keys(nodeTemplate.interfaces).length > 0) {
+            const nodeName = Object.keys(nodeTemplate.interfaces)[0];
+            // tslint:disable-next-line: no-string-literal
+            const inputs = nodeTemplate.interfaces[nodeName]['operations']['process']['inputs'];
+            // tslint:disable-next-line: no-string-literal
+            const outputs = nodeTemplate.interfaces[nodeName]['operations']['process']['outputs'];
+
+            if (inputs) {
+                for (const [key, value] of Object.entries(inputs)) {
+                    console.log(key + '-' + value);
+                    this.currentFuncion.inputs[key] = value;
+                }
+            }
+            if (outputs) {
+                for (const [key, value] of Object.entries(outputs)) {
+                    console.log(key + '-' + value);
+                    this.currentFuncion.outputs[key] = value;
+                }
+            }
+        }
+    }
     ngOnDestroy() {
         this.ngUnsubscribe.next();
         this.ngUnsubscribe.complete();
@@ -78,7 +129,8 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
 
         // tslint:disable-next-line: variable-name
         const node_templates = {};
-        const type = 'component-resource-resolution';
+        // tslint:disable-next-line: no-string-literal
+        const type = this.currentFuncion['type'];
         const instanceName = this.currentFuncion['instance-name'];
         // insert selected templates in nodeTemplates.artifacts
         this.selectedTemplates.forEach((value, key) => {
@@ -101,13 +153,15 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
         });
         // instantiate the final node_template object to save
 
-        this.nodeTemplates.type = 'component-resource-resolution';
+        this.nodeTemplates.type = type;
         node_templates[this.currentFuncion['instance-name']] = this.nodeTemplates;
 
         delete this.currentFuncion['instance-name'];
+        // tslint:disable-next-line: no-string-literal
+        delete this.currentFuncion['type'];
 
         this.nodeTemplates.interfaces = {
-            ResourceResolutionComponent: {
+            [this.interfaceChildName]: {
                 operations: {
                     process: {
                         ...this.currentFuncion,
@@ -183,18 +237,29 @@ export class FunctionsAttributeComponent implements OnInit, OnDestroy {
                     if (functions[i].modelName === nodeName) {
                         // tslint:disable: no-string-literal
                         console.log(functions[i].definition['interfaces']);
-                        this.getInputFields(functions[i].definition['interfaces'], 'ResourceResolutionComponent', 'inputs');
-                        this.getInputFields(functions[i].definition['interfaces'], 'ResourceResolutionComponent', 'outputs');
+                        this.getInputFields(functions[i].definition['interfaces'], 'outputs');
+                        this.getInputFields(functions[i].definition['interfaces'], 'inputs');
                         break;
                     }
                 }
             });
     }
 
-    getInputFields(interfaces, nodeName, type) {
+    getInputFields(interfaces, type) {
+
+        if (type === 'inputs') {
+            this.requiredInputs = new Map<string, {}>();
+            this.OptionalInputs = new Map<string, {}>();
+        } else {
+            this.requiredOutputs = new Map<string, {}>();
+            this.optionalOutputs = new Map<string, {}>();
+
+        }
+        const nodeName = Object.keys(interfaces)[0];
+        this.interfaceChildName = nodeName;
         console.log(interfaces[nodeName]['operations']['process'][type]);
         const fields = interfaces[nodeName]['operations']['process'][type];
-
+        this.artifactPrefix = false;
         for (const [key, value] of Object.entries(fields)) {
             if (key === 'artifact-prefix-names') {
                 this.artifactPrefix = true;