update imports-tab,source-editor and create scripts-tab component

Issue-ID: CCSDK-2016
Issue-ID: CCSDK-2042

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

4 files changed, 77 insertions, 0 deletions

diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.css
new file mode 100644
index 000000000..f60cc0e17
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.css
@@ -0,0 +1,7 @@
+.aceEditor {
+    overflow: hidden;
+    height: 100% !important;
+    background-color: white !important;
+    border: 1px solid #3f51b5;
+     border-left: 5px solid #3f51b5;
+}
\ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html
new file mode 100644
index 000000000..f934888a6
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.html
@@ -0,0 +1 @@
+<ace-editor [(text)]="text" [mode]="'javascript'" #editor style="height:150px;"></ace-editor>
\ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.spec.ts
new file mode 100644
index 000000000..37386468b
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.spec.ts
@@ -0,0 +1,25 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SourceEditorComponent } from './source-editor.component';
+
+describe('SourceEditorComponent', () => {
+  let component: SourceEditorComponent;
+  let fixture: ComponentFixture<SourceEditorComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ SourceEditorComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SourceEditorComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts
new file mode 100644
index 000000000..9c3435d98
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/packages/source-editor/source-editor.component.ts
@@ -0,0 +1,44 @@
+import { Component, OnInit, ViewChild, Input, AfterViewInit } from '@angular/core';
+// import 'brace/ext/searchbox';
+// import 'ace-builds/webpack-resolver';
+// import 'brace';
+// import 'brace/ext/language_tools';
+// import 'ace-builds/src-min-noconflict/snippets/html';
+
+@Component({
+  selector: 'app-source-editor',
+  templateUrl: './source-editor.component.html',
+  styleUrls: ['./source-editor.component.css']
+})
+export class SourceEditorComponent implements OnInit, AfterViewInit {
+
+
+  @Input() Data: string;
+  @Input() lang: string;
+  mode = 'json';
+  @ViewChild('editor', { static: false }) editor;
+  text = '';
+
+  ngOnInit(): void {
+    //  throw new Error("Method not implemented.");
+  }
+
+
+
+  ngAfterViewInit() {
+    this.editor.setTheme('eclipse');
+
+    this.editor.getEditor().setOptions({
+      enableBasicAutocompletion: true
+    });
+
+    this.editor.getEditor().commands.addCommand({
+      name: 'showOtherCompletions',
+      bindKey: 'Ctrl-.',
+      exec(editor) {
+
+      }
+    });
+  }
+
+}