Merge "CDS Api reference add index, template, first APIs"
[ccsdk/cds.git] / cds-ui / designer-client / src / app / modules / feature-modules / packages / designer / functions-attribute / functions-attribute.component.ts
1 import { Component, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core';
2 import { DesignerStore } from '../designer.store';
3 import { PackageCreationStore } from '../../package-creation/package-creation.store';
4 import { Subject } from 'rxjs';
5 import { distinctUntilChanged, takeUntil } from 'rxjs/operators';
6 import { CBAPackage } from '../../package-creation/mapping-models/CBAPacakge.model';
7 import { TemplateAndMapping } from '../../package-creation/template-mapping/TemplateAndMapping';
8 import { FunctionsStore } from '../functions.store';
9 import { NodeProcess, NodeTemplate } from '../model/desinger.nodeTemplate.model';
10 import { DesignerDashboardState } from '../model/designer.dashboard.state';
11 import { Action } from '../action-attributes/models/Action';
12
13 @Component({
14     selector: 'app-functions-attribute',
15     templateUrl: './functions-attribute.component.html',
16     styleUrls: ['./functions-attribute.component.css']
17 })
18 export class FunctionsAttributeComponent implements OnInit, OnDestroy {
19
20     ngUnsubscribe = new Subject();
21     designerDashboardState: DecodeSuccessCallback;
22     cbaPackage: CBAPackage;
23     templateAndMappingMap = new Map<string, TemplateAndMapping>();
24     selectedTemplates = new Map<string, TemplateAndMapping>();
25     fileToDelete: string;
26     requiredInputs = new Map<string, {}>();
27     requiredOutputs = new Map<string, {}>();
28     OptionalInputs = new Map<string, {}>();
29     optionalOutputs = new Map<string, {}>();
30     artifactPrefix = false;
31     currentFuncion = new NodeProcess();
32     nodeTemplates = new NodeTemplate('');
33     designerState: DesignerDashboardState;
34     actionName = '';
35     functionName = '';
36     interfaceChildName = '';
37     @Output() saveEvent = new EventEmitter<string>();
38
39
40     constructor(
41         private designerStore: DesignerStore,
42         private packageCreationStore: PackageCreationStore,
43         private functionStore: FunctionsStore
44     ) {
45     }
46
47     ngOnInit() {
48         this.designerStore.state$.subscribe(designerDashboardState => {
49             this.designerState = designerDashboardState;
50             this.actionName = this.designerState.actionName;
51             const action = this.designerState.template.workflows[this.actionName] as Action;
52             this.currentFuncion = new NodeProcess();
53             try {
54                 console.log(action);
55                 if (action) {
56                     // this.designerState.functionName
57                     const child = Object.keys(action.steps)[0];
58                     this.functionName = this.designerState.functionName;
59                     console.log(this.designerState.template.node_templates);
60                     console.log(this.designerState);
61                     console.log(this.designerState.template.node_templates[this.functionName]);
62                     //  this.currentFuncion = this.designerState.template.node_templates[this.functionName];
63                     // reset inouts&outputs
64                     this.requiredInputs = new Map<string, {}>();
65                     this.requiredOutputs = new Map<string, {}>();
66                     this.OptionalInputs = new Map<string, {}>();
67                     this.optionalOutputs = new Map<string, {}>();
68                     this.toNodeProcess(this.designerState.template.node_templates[this.functionName], this.functionName);
69                     const type = this.designerState.template.node_templates[this.functionName].type;
70                     this.getNodeType(type);
71                     this.onInitMapping();
72                 }
73             } catch (e) { }
74         });
75
76         this.packageCreationStore.state$
77             .subscribe(cbaPackage => {
78                 this.cbaPackage = cbaPackage;
79                 console.log('File name =>================== ');
80                 console.log(this.cbaPackage.templates.files);
81                 this.cbaPackage.templates.files.forEach((value, key) => {
82                     console.log('File name => ' + key);
83                     const templateAndMapping = new TemplateAndMapping();
84                     templateAndMapping.isTemplate = true;
85                     const isFromTemplate = true;
86                     this.setIsMappingOrTemplate(key, templateAndMapping, isFromTemplate);
87                 });
88
89                 this.cbaPackage.mapping.files.forEach((value, key) => {
90                     const templateAndMapping = new TemplateAndMapping();
91                     templateAndMapping.isMapping = true;
92                     const isFromTemplate = false;
93                     this.setIsMappingOrTemplate(key, templateAndMapping, isFromTemplate);
94                 });
95             });
96
97     }
98
99     onInitMapping() {
100         // selectedTemplates , templateAndMappingMap
101         this.selectedTemplates = new Map<string, TemplateAndMapping>();
102         try {
103             const functionMap = this.designerState.template.node_templates[this.functionName].artifacts;
104             console.log(this.templateAndMappingMap);
105
106             Object.keys(functionMap).forEach((file) => {
107                 const filename = file.substring(0, file.lastIndexOf('-'));
108                 console.log(filename);
109                 if (this.templateAndMappingMap.has(filename)) {
110                     this.selectedTemplates.set(filename, this.templateAndMappingMap.get(filename));
111                 }
112             });
113
114
115         } catch (e) { }
116     }
117
118     toNodeProcess(nodeTemplate, functionName) {
119         console.log(nodeTemplate);
120         this.currentFuncion['instance-name'] = functionName;
121         // tslint:disable-next-line: no-string-literal
122         this.currentFuncion['type'] = nodeTemplate['type'];
123         if (nodeTemplate.interfaces && Object.keys(nodeTemplate.interfaces).length > 0) {
124             const nodeName = Object.keys(nodeTemplate.interfaces)[0];
125             // console.log(Object.keys(nodeTemplate.interfaces));
126             // tslint:disable-next-line: no-string-literal
127             const inputs = nodeTemplate.interfaces[nodeName]['operations']['process']['inputs'];
128             // tslint:disable-next-line: no-string-literal
129             const outputs = nodeTemplate.interfaces[nodeName]['operations']['process']['outputs'];
130
131             // console.log(inputs);
132
133             if (inputs) {
134                 for (const [key, value] of Object.entries(inputs)) {
135                     console.log(key + ' - ' + value);
136                     if (typeof value === 'object') {
137                         this.currentFuncion.inputs[key] = JSON.stringify(value);
138                     } else {
139                         this.currentFuncion.inputs[key] = value;
140                     }
141                 }
142             }
143             if (outputs) {
144                 for (const [key, value] of Object.entries(outputs)) {
145                     console.log(key + '-' + value);
146                     this.currentFuncion.outputs[key] = value;
147                 }
148             }
149         }
150     }
151     ngOnDestroy() {
152         this.ngUnsubscribe.next();
153         this.ngUnsubscribe.complete();
154     }
155
156     addTemplates() { }
157
158     saveFunctionData() {
159         this.nodeTemplates = new NodeTemplate('');
160         // tslint:disable-next-line: variable-name
161         const node_templates = {};
162         const finalFunctionData = this.currentFuncion;
163         // tslint:disable-next-line: no-string-literal
164         const type = finalFunctionData['type'];
165         const instanceName = finalFunctionData['instance-name'];
166         // insert selected templates in nodeTemplates.artifacts
167         this.selectedTemplates.forEach((value, key) => {
168             console.log(key);
169             console.log(value);
170             console.log(finalFunctionData.inputs['artifact-prefix-names']);
171
172             if (finalFunctionData.inputs['artifact-prefix-names'] === undefined) {
173                 finalFunctionData.inputs['artifact-prefix-names'] = [key];
174             } else if (
175                 Array.isArray(finalFunctionData.inputs['artifact-prefix-names']) &&
176                 !finalFunctionData.inputs['artifact-prefix-names'].includes(key)
177             ) {
178                 finalFunctionData.inputs['artifact-prefix-names'].push(key);
179             }
180
181             if (value.isMapping) {
182                 this.nodeTemplates.artifacts[key + '-mapping'] = {
183                     type: 'artifact-mapping-resource',
184                     file: 'Templates/' + key + '-mapping.json'
185                 };
186             }
187
188             if (value.isTemplate) {
189                 this.nodeTemplates.artifacts[key + '-template'] = {
190                     type: 'artifact-template-velocity',
191                     file: 'Templates/' + key + '-template.vtl'
192                 };
193             }
194         });
195         // instantiate the final node_template object to save
196
197         this.nodeTemplates.type = type;
198         node_templates[finalFunctionData['instance-name']] = this.nodeTemplates;
199
200         delete finalFunctionData['instance-name'];
201         // tslint:disable-next-line: no-string-literal
202         delete finalFunctionData['type'];
203
204         this.nodeTemplates.interfaces = {
205             [this.interfaceChildName]: {
206                 operations: {
207                     process: {
208                         ...finalFunctionData,
209                     }
210                 }
211             }
212         };
213
214         console.log(finalFunctionData);
215         console.log(node_templates);
216         // tslint:disable-next-line: no-unused-expression
217         this.designerStore.addNodeTemplate(instanceName, type, node_templates[instanceName]);
218         this.saveEvent.emit('save');
219     }
220     // Template logic
221     private setIsMappingOrTemplate(key: string, templateAndMapping: TemplateAndMapping, isFromTemplate: boolean) {
222         const nameOfFile = isFromTemplate ?
223             key.split('/')[1].split('.')[0].split('-template')[0]
224             : key.split('/')[1].split('.')[0].split('-mapping')[0];
225         // const fullName = nameOfFile + ',' + key.split('.');
226         if (this.templateAndMappingMap.has(nameOfFile)) {
227             const templateAndMappingExisted = this.templateAndMappingMap.get(nameOfFile);
228             !isFromTemplate ? templateAndMappingExisted.isMapping = true : templateAndMappingExisted.isTemplate = true;
229             this.templateAndMappingMap.set(nameOfFile, templateAndMappingExisted);
230         } else {
231             this.templateAndMappingMap.set(nameOfFile, templateAndMapping);
232         }
233
234     }
235
236     setArtifact(predefined: boolean) {
237         if (predefined) {
238             this.currentFuncion.inputs['artifact-prefix-names'] = [];
239         } else {
240             this.currentFuncion.inputs['artifact-prefix-names'] = { get_input: 'template-prefix' };
241         }
242     }
243     addToInputs(optionalInput) {
244         this.requiredInputs.set(optionalInput, this.OptionalInputs.get(optionalInput));
245         this.OptionalInputs.delete(optionalInput);
246     }
247
248     setTemplate(file: string) {
249         if (this.selectedTemplates.has(file)) {
250             this.selectedTemplates.delete(file);
251         } else {
252             this.selectedTemplates.set(file, this.templateAndMappingMap.get(file));
253         }
254         console.log(this.selectedTemplates);
255     }
256
257     getKeys(map: Map<string, any>) {
258         return Array.from(map.keys());
259     }
260     getValue(file: string, map: Map<string, any>) {
261         return map.get(file);
262     }
263
264     getObjectKey(object) {
265         // console.log(object);
266         return Object.keys(object);
267     }
268     getObjectValue(object) {
269         return Object.values(object);
270     }
271
272     getNodeType(nodeName: string) {
273         this.functionStore.state$
274             .subscribe(state => {
275                 console.log(state);
276                 console.log(nodeName);
277                 const functions = state.serverFunctions;
278                 // tslint:disable-next-line: prefer-for-of
279                 for (let i = 0; i < functions.length; i++) {
280                     if (functions[i].modelName === nodeName) {
281                         // tslint:disable: no-string-literal
282                         console.log(functions[i].definition['interfaces']);
283                         this.getInputFields(functions[i].definition['interfaces'], 'outputs');
284                         this.getInputFields(functions[i].definition['interfaces'], 'inputs');
285                         break;
286                     }
287                 }
288             });
289     }
290
291     getInputFields(interfaces, type) {
292
293         if (type === 'inputs') {
294             this.requiredInputs = new Map<string, {}>();
295             this.OptionalInputs = new Map<string, {}>();
296         } else {
297             this.requiredOutputs = new Map<string, {}>();
298             this.optionalOutputs = new Map<string, {}>();
299
300         }
301         const nodeName = Object.keys(interfaces)[0];
302         this.interfaceChildName = nodeName;
303         console.log(nodeName + ' ------ ' + type);
304         console.log(interfaces[nodeName]['operations']['process'][type]);
305         const fields = interfaces[nodeName]['operations']['process'][type];
306         this.artifactPrefix = false;
307         for (const [key, value] of Object.entries(fields)) {
308             if (key === 'artifact-prefix-names') {
309                 this.artifactPrefix = true;
310                 // in edit&view mode need to check first if this input||output already exists
311             } else if (key in this.currentFuncion.inputs) {
312                 this.requiredInputs.set(key, Object.assign({}, value));
313             } else if (key in this.currentFuncion.outputs) {
314                 this.requiredOutputs.set(key, Object.assign({}, value));
315             } else if (value['required']) {
316                 console.log('This field is required = ' + key);
317                 if (type === 'inputs') {
318                     this.requiredInputs.set(key, Object.assign({}, value));
319                 } else {
320                     this.requiredOutputs.set(key, Object.assign({}, value));
321                 }
322             } else {
323                 console.log('This field is Optional ' + key);
324                 if (type === 'inputs') {
325                     this.OptionalInputs.set(key, Object.assign({}, value));
326                 } else {
327                     this.optionalOutputs.set(key, Object.assign({}, value));
328                 }
329             }
330         }
331
332         // console.log(this.requiredOutputs);
333     }
334
335
336 }