aboutsummaryrefslogtreecommitdiffstats
path: root/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation
diff options
context:
space:
mode:
Diffstat (limited to 'cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation')
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts31
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts37
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts53
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css19
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html22
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts44
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts38
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css19
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html91
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts44
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts78
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css37
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html122
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts44
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts76
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css208
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html85
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts44
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts109
-rw-r--r--cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts60
20 files changed, 1261 insertions, 0 deletions
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts
new file mode 100644
index 000000000..896c7caf0
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.spec.ts
@@ -0,0 +1,31 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { TestBed } from '@angular/core/testing';
+
+import { DictionaryCreationService } from './dictionary-creation.service';
+
+describe('DictionaryCreationService', () => {
+ beforeEach(() => TestBed.configureTestingModule({}));
+
+ it('should be created', () => {
+ const service: DictionaryCreationService = TestBed.get(DictionaryCreationService);
+ expect(service).toBeTruthy();
+ });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts
new file mode 100644
index 000000000..df90e6cd1
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.service.ts
@@ -0,0 +1,37 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Injectable } from '@angular/core';
+import { ResourceDictionaryURLs } from 'src/app/common/constants/app-constants';
+import { Observable } from 'rxjs';
+import { Sources } from '../model/sources.model';
+import { ApiService } from 'src/app/common/core/services/api.service';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class DictionaryCreationService {
+
+ constructor(private api: ApiService) { }
+
+ getSources() {
+ return this.api.get(ResourceDictionaryURLs.getSources);
+}
+
+}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts
new file mode 100644
index 000000000..20cec7448
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-creation.store.ts
@@ -0,0 +1,53 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Injectable } from '@angular/core';
+import { Store } from 'src/app/common/core/stores/Store';
+import { ResourceDictionary } from '../model/resource-dictionary.model';
+import { DictionaryCreationService } from './dictionary-creation.service';
+import { MetaData } from '../model/metaData.model';
+import { Sources } from '../model/sources.model';
+import { SourcesStore } from './sources-template/sources.store';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class DictionaryCreationStore extends Store<ResourceDictionary> {
+ constructor(private dictionaryCreationService: DictionaryCreationService, private sourcesStore: SourcesStore) {
+ super(new ResourceDictionary());
+ }
+
+ changeMetaData(metaDataObject: MetaData) {
+ console.log(metaDataObject);
+ this.setState({
+ ...this.state,
+ metaData: metaDataObject
+ });
+ }
+
+ getSources() {
+ this.sourcesStore.state$.subscribe(data => {
+ console.log(data);
+ });
+ }
+
+ SaveResourceDictionary(resourceDictionary: ResourceDictionary) {
+ console.log(this.setState);
+ }
+}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css
new file mode 100644
index 000000000..f263c0086
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.css
@@ -0,0 +1,19 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/ \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html
new file mode 100644
index 000000000..93d7df7d1
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.html
@@ -0,0 +1,22 @@
+<!--/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/-->
+<ace-editor [(text)]="text" [mode]="'javascript'" [autoUpdateContent]="true"
+[durationBeforeCallback]="1000" (textChanged)="textChanged($event)" [theme]="'tomorrow_night_bright'" #editor style="height:500px;">
+</ace-editor>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts
new file mode 100644
index 000000000..09dcdbd37
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.spec.ts
@@ -0,0 +1,44 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DictionaryEditorComponent } from './dictionary-editor.component';
+
+describe('DictionaryEditorComponent', () => {
+ let component: DictionaryEditorComponent;
+ let fixture: ComponentFixture<DictionaryEditorComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ DictionaryEditorComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(DictionaryEditorComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts
new file mode 100644
index 000000000..92b27c24c
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-editor/dictionary-editor.component.ts
@@ -0,0 +1,38 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Component, OnInit } from '@angular/core';
+
+@Component({
+ selector: 'app-dictionary-editor',
+ templateUrl: './dictionary-editor.component.html',
+ styleUrls: ['./dictionary-editor.component.css']
+})
+export class DictionaryEditorComponent implements OnInit {
+ constructor() {
+ }
+
+ ngOnInit() {
+ }
+
+ textChanged(event) {
+ console.log(event);
+ }
+}
+
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css
new file mode 100644
index 000000000..f263c0086
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.css
@@ -0,0 +1,19 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/ \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html
new file mode 100644
index 000000000..bea6081c0
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.html
@@ -0,0 +1,91 @@
+<!--/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/-->
+<div class="card creat-card col-11">
+ <div class="single-line-model">
+ <label class="label-name">Name</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.name"
+ placeholder="Topology name.vLB.CDS">
+ </div>
+ <!-- <div class="model-note-container error-message">
+ Package name already exists with this version. Please enter a different name or enter different version
+ number.
+ </div> -->
+ </div>
+
+ <!-- <div class="single-line-model">
+ <label class="label-name">Version <span>*</span></label>
+ <div class="label-input">
+ <input type="input" [readOnly]="!packageNameAndVersionEnables" [(ngModel)]="metaDataTab.version"
+ (input)="validatePackageNameAndVersion()" placeholder="Example: 1.0.0">
+ </div>
+ <div class="model-note-container error-message">{{errorMessage}}</div>
+ </div> -->
+ <div class="single-line-model">
+ <label class="label-name">Entry Schema</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.entrySchema" placeholder="Entry Schema">
+ </div>
+ </div>
+ <div class="single-line-model">
+ <label class="label-name">Data Type</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.dataType" placeholder="Data Type">
+ </div>
+ </div>
+ <div class="single-line-model">
+ <label class="label-name">Description</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.description" placeholder="Descripe the package">
+ </div>
+ </div>
+ <div class="single-line-model">
+ <label class="label-name">Required</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.updatedBy" placeholder="required">
+ </div>
+ </div>
+ <div class="single-line-model">
+ <label class="label-name">Library Instance</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.libraryInstance" placeholder="Library Instance">
+ </div>
+ </div>
+ <div class="single-line-model">
+ <label class="label-name">Derived From</label>
+ <div class="label-input">
+ <input type="input" [(ngModel)]="metaDataTab.derivedFrom" placeholder="Derived From">
+ </div>
+ </div>
+
+ <div class="single-line-model">
+ <label class="label-name">Tags</label>
+ <div class="label-input">
+ <input type="input" (keyup.enter)="addTag($event)" [(ngModel)]="metaDataTab.tags"
+ placeholder="Ex., vDNS-CDS">
+
+ </div>
+ <div class="model-note-container tag-notes">Seprate tags with comma or space</div>
+ <div class="model-note-container tages-container">
+ <span *ngFor="let tag of tags" class="single-tage">{{tag}} <i (click)="removeTag(tag)"
+ class="fa fa-times-circle"></i></span>
+ </div>
+ </div>
+</div>
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts
new file mode 100644
index 000000000..ce9335ff9
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.spec.ts
@@ -0,0 +1,44 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { DictionaryMetadataComponent } from './dictionary-metadata.component';
+
+describe('DictionaryMetadataComponent', () => {
+ let component: DictionaryMetadataComponent;
+ let fixture: ComponentFixture<DictionaryMetadataComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ DictionaryMetadataComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(DictionaryMetadataComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts
new file mode 100644
index 000000000..d5c4a109b
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/dictionary-metadata/dictionary-metadata.component.ts
@@ -0,0 +1,78 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Component, OnInit } from '@angular/core';
+import { ActivatedRoute } from '@angular/router';
+import { DictionaryModel } from '../../model/dictionary.model';
+import { DictionaryCreationService } from '../dictionary-creation.service';
+import { DictionaryCreationStore } from '../dictionary-creation.store';
+import { MetaData } from '../../model/metaData.model';
+
+@Component({
+ selector: 'app-dictionary-metadata',
+ templateUrl: './dictionary-metadata.component.html',
+ styleUrls: ['./dictionary-metadata.component.css']
+})
+export class DictionaryMetadataComponent implements OnInit {
+ packageNameAndVersionEnables = true;
+ counter = 0;
+ tags = new Set<string>();
+ private metaDataTab: MetaData = new MetaData();
+ private errorMessage: string;
+
+ constructor(
+ private route: ActivatedRoute,
+ private dictionaryCreationService: DictionaryCreationService,
+ private dictionaryCreationStore: DictionaryCreationStore
+ ) {}
+
+ ngOnInit() {
+ this.dictionaryCreationStore.state$.subscribe(element => {
+ if (element && element.metaData) {
+ this.metaDataTab.name = element.metaData.name;
+ this.metaDataTab.description = element.metaData.description;
+ this.metaDataTab.dataType = element.metaData.dataType;
+ this.metaDataTab.tags = element.metaData.tags;
+ this.metaDataTab.entrySchema = element.metaData.entrySchema;
+ this.metaDataTab.required = element.metaData.required;
+ this.metaDataTab.libraryInstance = element.metaData.libraryInstance;
+ this.metaDataTab.derivedFrom = element.metaData.derivedFrom;
+ console.log(element);
+ }
+ });
+ console.log(this.metaDataTab.name);
+ }
+
+ removeTag(value) {
+ this.tags.delete(value);
+ }
+
+ addTag(event) {
+ const value = event.target.value;
+ console.log(value);
+ if (value && value.trim().length > 0) {
+ event.target.value = '';
+ this.tags.add(value);
+ }
+ }
+
+ saveMetaDataToStore() {
+ this.dictionaryCreationStore.changeMetaData(this.metaDataTab);
+ }
+}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css
new file mode 100644
index 000000000..f02bd233d
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.css
@@ -0,0 +1,37 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+.edit-button{
+ color:white;
+ background:#1B3E6F;
+ margin-right: 60px;
+ border: none;
+ width: 80px;
+ height: 20px;
+ margin-top: 25px;
+ font-size: 10px;
+ padding-left:5px;
+ padding-top: 3px;
+ }
+ .ed{
+ justify-content: space-between;
+ }
+ .single-line-model{
+ margin:20px;
+ } \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html
new file mode 100644
index 000000000..bf183216d
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.html
@@ -0,0 +1,122 @@
+<!--/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/-->
+<app-header></app-header>
+
+<div class="new-wrapper">
+ <div class="container-fluid main-container">
+ <header class="page-title">
+ <div class="row">
+ <h2 class="col m-0 pb-0">
+ <ul class="breadcrumb-header">
+ <li><a routerLink="/resource-dictionary">Resource Dictionary</a></li>
+ <i class="fa fa-angle-right ml-2 mr-2"></i>
+ <li>Dictionary Name</li>
+ </ul>
+ </h2>
+ </div>
+ </header>
+ <div class="container-fluid body-container">
+ <div class="container card creat-card col-11">
+ <div class="single-line-model customKeyTitle">
+ <h5 class="label-name w-100 ">
+ Dictionary Name
+ </h5>
+ <!-- <label class="label-name"></label> -->
+ <span>Last modified {{createDate}} by me</span>
+ </div>
+ </div>
+ </div>
+ <div class="container-fluid body-container">
+ <div class="container">
+ <div class="creat-action-container">
+ <a class="action-button" (click)="saveDictionaryToStore()">
+ <i class="icon-save-sm" aria-hidden="true"></i>
+ <span>Save</span>
+ </a>
+ <a href="#" class="action-button" (click)="goBackToDashBorad()">
+ <i class="icon-discard-sm" aria-hidden="true"></i>
+ <span>Discard Changes</span>
+ </a>
+ <a href="#" class="action-button">
+ <i class="icon-clone-sm" aria-hidden="true"></i>
+ <span>Clone</span>
+ </a>
+ <a href="#" class="action-button delete">
+ <i class="icon-delete-sm" aria-hidden="true"></i>
+ <span>Delete</span>
+ </a>
+ </div>
+ <nav class="row">
+ <!--Nav Tabs-->
+ <div class="col">
+ <div class="nav nav-tabs ed" id="nav-tab" role="tablist">
+ <a class="nav-item nav-link active" id="nav-metadata-tab" data-toggle="tab"
+ href="#nav-metadata" role="tab" aria-controls="nav-metadata" aria-selected="false"
+ autofocus #nameit (focusout)="test()">METADATA</a>
+ <a class="edit-button" id="nav-editor-tab" data-toggle="tab" href="#nav-editor"
+ role="tab" aria-controls="nav-editor" aria-selected="false">EDITOR MODE</a>
+
+ </div>
+ </div>
+ </nav>
+ <div>
+ <div class="row mt-4">
+ <div class="col">
+ <div class="tab-content" id="nav-tabContent">
+ <div class="tab-pane fade show active" id="nav-metadata" role="tabpanel"
+ aria-labelledby="nav-metadata-tab">
+ <app-dictionary-metadata></app-dictionary-metadata>
+ <nav class="row">
+ <!--Nav Tabs-->
+ <div class="col">
+ <div class="nav nav-tabs " id="nav-tab" role="tablist">
+ <a class="nav-item nav-link active" id="nav-source-tab" data-toggle="tab"
+ href="#nav-source" role="tab" aria-controls="nav-source" aria-selected="false"
+ >SOURCES</a>
+ </div>
+ </div>
+ </nav>
+ <div class="row mt-4">
+ <div class="col">
+ <div class="tab-content" id="nav-tabContent">
+ <div class="tab-pane fade show active" id="nav-source" role="tabpanel"
+ aria-labelledby="nav-source-tab">
+ <app-sources-template></app-sources-template>
+ </div>
+ </div>
+ </div>
+ </div>
+ </div>
+ <div class="tab-pane fade col-11" id="nav-editor" role="tabpanel"
+ aria-labelledby="nav-editor-tab">
+ <div class="card creat-card">
+ <div class="editor-container">
+ <app-dictionary-editor></app-dictionary-editor>
+ </div></div>
+ </div>
+ </div>
+ </div>
+ </div>
+
+
+ </div>
+ </div>
+ </div>
+</div> \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts
new file mode 100644
index 000000000..b1e6b6d24
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.spec.ts
@@ -0,0 +1,44 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ResourceDictionaryCreationComponent } from './resource-dictionary-creation.component';
+
+describe('ResourceDictionaryCreationComponent', () => {
+ let component: ResourceDictionaryCreationComponent;
+ let fixture: ComponentFixture<ResourceDictionaryCreationComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ ResourceDictionaryCreationComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ResourceDictionaryCreationComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts
new file mode 100644
index 000000000..1a3484bae
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/resource-dictionary-creation.component.ts
@@ -0,0 +1,76 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
+import { Router } from '@angular/router';
+import { DictionaryCreationStore } from './dictionary-creation.store';
+import { DictionaryModel } from '../model/dictionary.model';
+import { Definition } from '../model/definition.model';
+import { DictionaryMetadataComponent } from './dictionary-metadata/dictionary-metadata.component';
+import { SourcesTemplateComponent } from './sources-template/sources-template.component';
+
+@Component({
+ selector: 'app-resource-dictionary-creation',
+ templateUrl: './resource-dictionary-creation.component.html',
+ styleUrls: ['./resource-dictionary-creation.component.css']
+})
+export class ResourceDictionaryCreationComponent implements OnInit {
+
+ constructor(private router: Router, private dictionaryCreationStore: DictionaryCreationStore) {
+ }
+
+ modes: object[] = [
+ {name: 'Designer Mode', style: 'mode-icon icon-designer-mode'},
+ {name: 'Scripting Mode', style: 'mode-icon icon-scripting-mode'}
+ ];
+
+ private metaDataTab: DictionaryModel = new DictionaryModel();
+ private definition: Definition = new Definition();
+
+ @ViewChild(DictionaryMetadataComponent, {static: false})
+ private metadataTabComponent: DictionaryMetadataComponent;
+
+ @ViewChild(SourcesTemplateComponent, {static: false})
+ private sourcesTemplateComponent: SourcesTemplateComponent;
+
+ @ViewChild('nameit', {static: true})
+ private elementRef: ElementRef;
+
+ ngOnInit() {
+ this.elementRef.nativeElement.focus();
+ // this.elementRef2.nativeElement.focus();
+ }
+
+ saveDictionaryToStore() {
+ this.dictionaryCreationStore.getSources();
+ this.dictionaryCreationStore.state$.subscribe(dd => {
+ console.log(dd);
+ });
+ }
+
+ test() {
+ this.metadataTabComponent.saveMetaDataToStore();
+ this.sourcesTemplateComponent.saveSorcesDataToStore();
+ }
+
+ goBackToDashBorad() {
+ this.router.navigate(['/resource-dictionary']);
+ }
+
+}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css
new file mode 100644
index 000000000..7799d915f
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.css
@@ -0,0 +1,208 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+.source{
+ left: 20px;
+ width: 72%;
+}
+.source1{
+ width: 25%;
+ background-color:#F4F9FE;
+}
+h5{
+ padding-top: 10px;
+ padding-left: 10px;
+ background-color:white;
+ height: 40px;
+ width: 100%;
+}
+.mat-form-field + .mat-form-field {
+ margin-left: 8px;
+}
+mat-expansion-panel-header{
+ background-color:#E0E8F2;
+}
+mat-panel-title{
+ color:#1B3E6F;
+}
+mat-expansion-panel{
+ border-radius: 0px;
+ border-left: none;
+}
+.example-list .card{
+ margin-bottom: 10px !important;
+}
+.expansion-panel{
+ border: none;
+ background: white;
+ border-radius: 0px;
+ overflow: hidden;
+ display: block;
+ width: 100%;
+ color:#1B3E6F;
+ }
+.example-container {
+ width: 230px;
+ max-width: 100%;
+ margin: 10px 10px 15px 0;
+ display: inline-block;
+ vertical-align: top;
+ border-radius: 2px;
+ height: 260px;
+ background-color:#F4F9FE;
+ }
+ .example-container2 {
+ width: 630px;
+ max-width: 100%;
+ margin: 10px 10px 5px 0;
+ display: inline-block;
+ vertical-align: top;
+ border-radius: 2px;
+ height: 300px;
+ background-color:#F4F9FE;
+ }
+
+ .example-list {
+ min-height: 12px;
+ border-radius: 0px;
+ overflow: hidden;
+ display: block;
+ margin: 5px;
+ overflow-y:scroll;
+ overflow-x:hidden;
+ margin-left: 15px;
+ width: 195px;
+ margin-top: 15px;
+ }
+
+ .example-list1 {
+ min-height: 12px;
+ border-radius: 0px;
+ overflow: hidden;
+ display: block;
+ margin: 5px;
+ overflow-y:hidden;
+ overflow-x:hidden;
+ }
+
+ .checkbox{
+ margin-left: 11%;
+ }
+ .example-box {
+ padding: 2px 1px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: left;
+ box-sizing: border-box;
+ cursor: move;
+ font-size: 14px;
+
+ }
+ .example-box1 {
+ padding: 1px 1px;
+ display: flex;
+ flex-direction: row;
+ align-items: center;
+ justify-content: left;
+ box-sizing: border-box;
+ cursor: move;
+ font-size: 14px;
+ border-radius: 0px !important;
+ }
+
+ .cdk-drag-preview {
+ box-sizing: border-box;
+ border-radius: 4px;
+ box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.2),
+ 0 8px 10px 1px rgba(0, 0, 0, 0.14),
+ 0 3px 14px 2px rgba(0, 0, 0, 0.12);
+ }
+
+ .cdk-drag-placeholder {
+ opacity: 0;
+ }
+
+ .cdk-drag-animating {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+ }
+
+ .example-box:last-child {
+ border: none;
+ }
+
+ .example-list.cdk-drop-list-dragging .example-box:not(.cdk-drag-placeholder) {
+ transition: transform 250ms cubic-bezier(0, 0, 0.2, 1);
+ }
+
+.searchText{
+ width: 180px;
+ /* border-top: solid 2px #F4F9FE; */
+ border: 0px;
+ color: #1B3E6F;
+ font-size: 13px;
+ margin-top: 2px;
+}
+.searchBox{
+ position: relative;
+ top: 0%;
+ right: 0%;
+ height: 35px;
+ border-top: solid 2px #F4F9FE;
+ width: 100%;
+ margin-left:0px;
+ background-color:white;
+}
+
+.searchButton1{
+ float: left;
+ padding-left: 0 !important;
+ height: 30px;
+ width:30px;
+ background: url(src/assets/img/icon-search.svg) center center no-repeat;
+ border: 0 !important;
+ margin-right:0px;
+}
+.action-button1{
+ margin-left:50px;
+ padding: 1px 6px;
+ box-shadow: none;
+ color:white;
+ font-size: 14px;
+ height: 25px;
+ background-color:#007bff;
+ border-radius:16px;
+ border:solid 0.5px #ededed;
+}
+.footer{
+ margin: 1px 0px;
+}
+.delete{
+ color: red;
+ font-size: 14px;
+ margin: 2px;
+}
+.footer input{
+ margin: 6px 0px 1px 5px;
+}
+.select-button{
+ color: #007bff;
+ font-size: 14px;
+ margin: 2px;
+} \ No newline at end of file
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html
new file mode 100644
index 000000000..b274ce95d
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.html
@@ -0,0 +1,85 @@
+<!--/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/-->
+<div class="col-11">
+ <div class= "row ">
+ <div class="card creat-card source1">
+ <h5 class="label-name"> Sources Options</h5>
+ <div class="searchBox row"><i class="searchButton1 col-1" aria-hidden="true"></i>
+ <input class="searchText col-8" [(ngModel)]="searchText" type="input" placeholder="filter sources">
+ </div>
+
+ <div class="example-container">
+ <div
+ cdkDropList
+ #todoList="cdkDropList"
+ [cdkDropListData]="option"
+ [cdkDropListConnectedTo]="[doneList]"
+ class="example-list"
+ (cdkDropListDropped)="drop($event)">
+ <div class="example-box card creat-card" *ngFor="let item of option| search :searchText" cdkDrag>
+ <input type="checkbox" class="checkbox" [(ngModel)]="checked" (change)="onChange(item, $event.target.checked)">
+ {{item.name}}
+ </div>
+
+ </div>
+
+ </div>
+ <div class="footer row">
+ <a class="select-button col-sm-05">Select all</a>
+ <button class="action-button1 col-sm-04" >Add to list</button>
+ </div>
+ </div>
+
+ <div class="card creat-card source">
+ <h5 class="label-name">Sources List</h5>
+ <div class="example-container2 card creat-card">
+ <div
+ cdkDropList
+ #doneList="cdkDropList"
+ [cdkDropListData]="sourcesOptions"
+ [cdkDropListConnectedTo]="[todoList]"
+ class="example-list1"
+ (cdkDropListDropped)="drop($event)">
+
+ <div class="example-box1" *ngFor="let item of sourcesOptions" cdkDrag>
+ <input type="checkbox" value="item.name">
+ <mat-expansion-panel class="expansion-panel">
+ <mat-expansion-panel-header [collapsedHeight]="'23px'" [expandedHeight]="'23px'">
+ <mat-panel-title>
+ {{item.name}}
+ </mat-panel-title>
+ </mat-expansion-panel-header>
+ <br>
+ <ace-editor [(text)]=item.value [mode]="'javascript'" [autoUpdateContent]="true"
+ [durationBeforeCallback]="1000" (textChanged)="textChanged($event,item)" [theme]="'tomorrow_night_bright'" #editor style="height:300px;">
+ </ace-editor>
+ </mat-expansion-panel>
+ </div>
+
+ </div>
+
+ </div>
+ <div>
+ <a type="submit" class="delete">Delete</a>
+ </div>
+ </div>
+</div>
+</div>
+
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts
new file mode 100644
index 000000000..e9bd4ff43
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.spec.ts
@@ -0,0 +1,44 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SourcesTemplateComponent } from './sources-template.component';
+
+describe('SourcesTemplateComponent', () => {
+ let component: SourcesTemplateComponent;
+ let fixture: ComponentFixture<SourcesTemplateComponent>;
+
+ beforeEach(async(() => {
+ TestBed.configureTestingModule({
+ declarations: [ SourcesTemplateComponent ]
+ })
+ .compileComponents();
+ }));
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(SourcesTemplateComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts
new file mode 100644
index 000000000..4a4f215cd
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources-template.component.ts
@@ -0,0 +1,109 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Component, OnInit} from '@angular/core';
+import { CdkDragDrop, moveItemInArray, transferArrayItem } from '@angular/cdk/drag-drop';
+import { SourcesStore } from './sources.store';
+
+@Component({
+ selector: 'app-sources-template',
+ templateUrl: './sources-template.component.html',
+ styleUrls: ['./sources-template.component.css']
+})
+export class SourcesTemplateComponent implements OnInit {
+ private searchQuery = '';
+ lang = 'json';
+ sources = [];
+ option = [];
+ sourcesOptions = [];
+ textValue: any;
+ selectItem: boolean;
+ ddSource = [];
+ checked: boolean;
+ selectedArray = [];
+ constructor(private sourcesStore: SourcesStore) {
+ this.sourcesStore.state$.subscribe(sources => {
+ this.sources = sources.sources;
+ for (const key in this.sources) {
+ if (key) {
+ const sourceObj = { name: key, value: JSON.stringify(this.sources[key] )};
+ this.option.push(sourceObj);
+ }
+ }
+ });
+ }
+
+ ngOnInit() {
+ this.sourcesStore.getAllSources();
+ }
+
+ saveSorcesDataToStore() {
+ this.sourcesStore.saveSources(this.ddSource);
+ }
+
+ drop(event: CdkDragDrop<string[]>) {
+ this.ddSource = [];
+ if (event.previousContainer === event.container) {
+ moveItemInArray(event.container.data, event.previousIndex, event.currentIndex);
+ } else {
+ transferArrayItem(event.previousContainer.data,
+ event.container.data,
+ event.previousIndex,
+ event.currentIndex);
+ }
+
+ for (const key2 in this.sources) {
+ if (key2) {
+ const originalSources = this.sourcesOptions;
+ for (const key of originalSources) {
+ if (key.name === key2) {
+ const obj = `{${key.name}: ${key.value}}`;
+ this.ddSource.push(obj);
+ }
+ }
+ }
+ }
+ }
+
+ searchDictionary(event: any) {
+ this.searchQuery = event.target.value;
+ this.searchQuery = this.searchQuery.trim();
+ console.log(this.searchQuery);
+ // this.dictionaryStore.search(this.searchQuery);
+ }
+
+ onChange(item: string, isChecked: boolean) {
+ if (isChecked) {
+ this.selectedArray.push(item);
+ }
+ }
+
+ textChanged(event, item) {
+ const editedData = JSON.parse(event);
+ const originalSources = this.sources;
+ for (const key in originalSources) {
+ if (key === item.name) {
+ this.sources[key] = editedData;
+ }
+ }
+ this.option = [];
+ this.sourcesStore.changeSources(this.sources);
+ }
+
+}
diff --git a/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts
new file mode 100644
index 000000000..7da8f03d3
--- /dev/null
+++ b/cds-ui/designer-client/src/app/modules/feature-modules/resource-dictionary/resource-dictionary-creation/sources-template/sources.store.ts
@@ -0,0 +1,60 @@
+/*
+* ============LICENSE_START=======================================================
+* ONAP : CDS
+* ================================================================================
+* Copyright (C) 2020 TechMahindra
+*=================================================================================
+* Licensed under the Apache License, Version 2.0 (the "License");
+* you may not use this file except in compliance with the License.
+* You may obtain a copy of the License at
+*
+* http://www.apache.org/licenses/LICENSE-2.0
+*
+* Unless required by applicable law or agreed to in writing, software
+* distributed under the License is distributed on an "AS IS" BASIS,
+* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+* See the License for the specific language governing permissions and
+* limitations under the License.
+* ============LICENSE_END=========================================================
+*/
+import { Sources } from '../../model/sources.model';
+import { Store } from 'src/app/common/core/stores/Store';
+import { Injectable } from '@angular/core';
+import { DictionaryCreationService } from '../dictionary-creation.service';
+import { Definition } from '../../model/definition.model';
+
+@Injectable({
+ providedIn: 'root'
+})
+export class SourcesStore extends Store<Sources> {
+ constructor(private dictionaryCreationService: DictionaryCreationService) {
+ super(new Sources());
+ }
+
+ public getAllSources() {
+ console.log('getting all sources...');
+ this.getSources();
+ }
+
+ protected getSources() {
+ this.dictionaryCreationService.getSources()
+ .subscribe((sou) => {
+ console.log(sou);
+ this.setState({
+ ...this.state,
+ sources: sou
+ });
+ });
+ }
+
+ public changeSources(sou) {
+ this.setState({
+ ...this.state,
+ sources: sou
+ });
+ }
+
+ public saveSources(sources) {
+ console.log(sources);
+ }
+}