adding DSL-Definition component

Issue-ID: CCSDK-2066

Signed-off-by: shaaban Altanany <shaaban.eltanany.ext@orange.com>
Change-Id: I8b16e78cf3961c0c37a721fd37898fb3a7a850a0

6 files changed, 40 insertions, 10 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.css
index e69de29bb..4334e1d0f 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.css
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.css
@@ -0,0 +1,4 @@
+.dsl-editor {
+    height: 500px;
+    
+}
\ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.html
index 844481a2d..dde21297a 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.html
@@ -1 +1 @@
-<p>dsl-definitions-tab works!</p>
+<ace-editor [(text)]="dslDefinition.content" [mode]="lang" #editor style="height:150px;"></ace-editor>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.ts
index af0630293..032ba0b7f 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/dsl-definitions-tab/dsl-definitions-tab.component.ts
@@ -1,15 +1,22 @@
-import { Component, OnInit } from '@angular/core';
+import {Component, OnInit} from '@angular/core';
+import {DslDefinition} from '../mapping-models/CBAPacakge.model';
+import {PackageCreationStore} from '../package-creation.store';
 
 @Component({
-  selector: 'app-dsl-definitions-tab',
-  templateUrl: './dsl-definitions-tab.component.html',
-  styleUrls: ['./dsl-definitions-tab.component.css']
+    selector: 'app-dsl-definitions-tab',
+    templateUrl: './dsl-definitions-tab.component.html',
+    styleUrls: ['./dsl-definitions-tab.component.css']
 })
 export class DslDefinitionsTabComponent implements OnInit {
 
-  constructor() { }
+    dslDefinition: DslDefinition = new DslDefinition();
+    lang = 'json';
 
-  ngOnInit() {
-  }
+    constructor(private packageCreationStore: PackageCreationStore) {
+    }
 
+    ngOnInit() {
+        this.packageCreationStore.changeDslDefinition(this.dslDefinition);
+
+    }
 }
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/mapping-models/CBAPacakge.model.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/mapping-models/CBAPacakge.model.ts
index a5f5ec70a..78a9b5212 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/mapping-models/CBAPacakge.model.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/mapping-models/CBAPacakge.model.ts
@@ -4,12 +4,14 @@ export class Definition {
 
     public metaDataTab: MetaDataTabModel;
     public imports: Map<string, string>;
+    public dslDefinition: DslDefinition;
 
     // public dslDefinition:
 
     constructor() {
         this.imports = new Map<string, string>();
         this.metaDataTab = new MetaDataTabModel();
+        this.dslDefinition = new DslDefinition();
     }
 
     public setImports(key: string, value: string) {
@@ -22,6 +24,14 @@ export class Definition {
         return this;
     }
 
+    public setDslDefinition(dslDefinition: DslDefinition): Definition {
+        this.dslDefinition = dslDefinition;
+        return this;
+    }
+}
+
+export class DslDefinition {
+    content: string;
 }
 
 export class Scripts {
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
index 89a190ef6..528a005d4 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.component.html
@@ -77,7 +77,7 @@
                             </div>
                             <div class="tab-pane fade" id="nav-authentication" role="tabpanel"
                                  aria-labelledby="nav-authentication-tab">
-                                <app-source-editor [Data]="'test'" lang="javascript"></app-source-editor>
+                                <app-dsl-definitions-tab></app-dsl-definitions-tab>
                             </div>
                             <div class="tab-pane fade" id="nav-template" role="tabpanel"
                                  aria-labelledby="nav-template-tab">
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
index 93998e8a9..3e37952b2 100644
--- a/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/package-creation/package-creation.store.ts
@@ -23,7 +23,7 @@ import {Injectable} from '@angular/core';
 
 import {Store} from '../../../../common/core/stores/Store';
 
-import {CBAPackage} from './mapping-models/CBAPacakge.model';
+import {CBAPackage, DslDefinition} from './mapping-models/CBAPacakge.model';
 import {PackageCreationService} from './package-creation.service';
 import {FolderNodeElement, MetaDataTabModel} from './mapping-models/metadata/MetaDataTab.model';
 import * as JSZip from 'jszip';
@@ -49,6 +49,15 @@ export class PackageCreationStore extends Store<CBAPackage> {
         });
     }
 
+    changeDslDefinition(dslDefinition: DslDefinition) {
+
+        this.setState({
+            ...this.state,
+            definitions: this.state.definitions.setDslDefinition(dslDefinition)
+        });
+    }
+
+
     addDefinition(name: string, content: string) {
 
         this.setState({