add designer funcionality - declarative workflow

- save source editor to store
- generate graph based on json data from source editor
- make functions retrieved from server
- prevent multible functions inside action if the first fn is not dg-generic
- dg generic case (mutli functions  inside single action)
- arrange elements that are generated automcatilly using DirectedGraph lib dagree

Issue-ID: CCSDK-1779
Issue-ID: CCSDK-1783
Issue-ID: CCSDK-2017
Signed-off-by: Ahmed Abbas <ahmad.helmy@orange.com>
Change-Id: Ief3579e4a9716475c9aaf85b5a349bc2af466cdb

1 files changed, 45 insertions, 0 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.ts
new file mode 100644
index 000000000..34194e42f
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/designer/source-view/source-view.component.ts
@@ -0,0 +1,45 @@
+import { Component, OnInit, OnDestroy } from '@angular/core';
+import { DesignerStore } from '../designer.store';
+import { PackageCreationUtils } from '../../package-creation/package-creation.utils';
+import { RouterLink, Router } from '@angular/router';
+import { Subject } from 'rxjs';
+
+@Component({
+    selector: 'app-designer-source-view',
+    templateUrl: './source-view.component.html',
+    styleUrls: ['./source-view.component.css']
+})
+export class DesignerSourceViewComponent implements OnInit, OnDestroy {
+
+    content = '';
+    lang = 'json';
+    private controllerSideBar: boolean;
+    private ngUnsubscribe = new Subject();
+
+    constructor(private store: DesignerStore,
+                private packageCreationUtils: PackageCreationUtils,
+                private router: Router) {
+        this.controllerSideBar = true;
+    }
+
+    ngOnInit() {
+        this.store.state$.subscribe(
+            state => {
+                console.log(state);
+                this.content = this.packageCreationUtils.transformToJson(state.template);
+            });
+
+    }
+
+    convertAndOpenInDesingerView() {
+        // TODO validate json against scheme
+        console.log('convertAndOpenInDesingerView ...', this.content);
+        this.store.saveSourceContent(this.content);
+        this.router.navigateByUrl('/packages/designer');
+    }
+
+    ngOnDestroy() {
+        this.ngUnsubscribe.next();
+        this.ngUnsubscribe.complete();
+    }
+}