Configure a new Artifact Type

Centralizes artifact configuration in one yaml entry.
Allow the configuration of a new artifact type without
the need of code changes.
The configuration file now is used as a source of
artifacts types instead the artifact type enum.
The enum will be used as a source of base artifact types
and also in hard coded business rules.

Change-Id: Id0383d9fca9bce0519a4d52a4ecb3a68c8713f0f
Issue-ID: SDC-2754
Signed-off-by: andre.schmid <andre.schmid@est.tech>

14 files changed, 188 insertions, 118 deletions

diff --git a/catalog-ui/src/app/ng2/app.module.ts b/catalog-ui/src/app/ng2/app.module.ts
index 3f43feb7b2..b3c12a5f11 100644
--- a/catalog-ui/src/app/ng2/app.module.ts
+++ b/catalog-ui/src/app/ng2/app.module.ts
@@ -72,6 +72,7 @@ import { AutomatedUpgradeModule } from './pages/automated-upgrade/automated-upgr
 import {WorkspaceModule} from './pages/workspace/workspace.module';
 import { ModalsModule } from './components/modals/modals.module';
 import { SharingService, CacheService, HomeService } from 'app/services-ng2';
+import { ArtifactConfigService } from "./services/artifact-config.service";
 import { IUserProperties } from 'app/models';
 import { PluginsModule } from './pages/plugins/plugins-module';
 import {WorkspaceNg1BridgeService} from './pages/workspace/workspace-ng1-bridge-service';
@@ -173,6 +174,7 @@ export function configServiceFactory(config: ConfigService, authService: Authent
         SharingService,
         CacheService,
         HomeService,
+        ArtifactConfigService,
         ComponentFactoryProvider,
         CookieServiceProvider,
         StateServiceFactory,
diff --git a/catalog-ui/src/app/ng2/components/forms/artifacts-form/__snapshots__/artifact-form.component.spec.ts.snap b/catalog-ui/src/app/ng2/components/forms/artifacts-form/__snapshots__/artifact-form.component.spec.ts.snap
index 8cd085e248..440dc74d72 100644
--- a/catalog-ui/src/app/ng2/components/forms/artifacts-form/__snapshots__/artifact-form.component.spec.ts.snap
+++ b/catalog-ui/src/app/ng2/components/forms/artifacts-form/__snapshots__/artifact-form.component.spec.ts.snap
@@ -2,6 +2,7 @@
 
 exports[`artifact form component should match current snapshot of artifact form component 1`] = `
 <artifact-form
+  artifactConfigService={[Function Object]}
   artifactTypesOptions={[Function Array]}
   cacheService={[Function Object]}
   initArtifactTypes={[Function Function]}
diff --git a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.spec.ts b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.spec.ts
index fc69509ee9..49a06b27e0 100644
--- a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.spec.ts
+++ b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.spec.ts
@@ -7,32 +7,37 @@ import {CacheService} from "../../../services/cache.service";
 import {TranslateService} from "../../../shared/translator/translate.service";
 import {ArtifactModel} from "../../../../models/artifacts";
 import {IDropDownOption} from "onap-ui-angular/dist/form-elements/dropdown/dropdown-models";
-import {Observable, Subject} from "rxjs";
-import {getValue} from "@ngxs/store";
+import {Subject} from "rxjs";
+import {ArtifactConfigService} from "../../../services/artifact-config.service";
+import {ArtifactType, ComponentType} from "../../../../utils/constants";
 
 
 describe('artifact form component', () => {
 
     let fixture: ComponentFixture<ArtifactFormComponent>;
     let cacheServiceMock: Partial<CacheService>;
+    let artifactConfigService: Partial<ArtifactConfigService>;
     let onValidationChangeMock: Partial<Subject<boolean>>;
 
     let artifactModel = new ArtifactModel();
 
+    artifactConfigService = {
+        findAllTypeBy: jest.fn()
+    };
 
     beforeEach(
         async(() => {
 
             onValidationChangeMock = {
                 next: jest.fn()
-            }
+            };
 
             cacheServiceMock = {
                 contains: jest.fn(),
                 remove: jest.fn(),
                 set: jest.fn(),
                 get: jest.fn()
-            }
+            };
 
             const configure: ConfigureFn = testBed => {
                 testBed.configureTestingModule({
@@ -41,6 +46,7 @@ describe('artifact form component', () => {
                     schemas: [NO_ERRORS_SCHEMA],
                     providers: [
                         {provide: CacheService, useValue: cacheServiceMock},
+                        {provide: ArtifactConfigService, useValue: artifactConfigService},
                         {provide: TranslateService, useValue: {}}
                     ],
                 });
@@ -55,91 +61,73 @@ describe('artifact form component', () => {
 
     it('should verify initArtifactTypes for DEPLOYMENT and ArtifactType = HEAT_ENV', () =>{
 
-        cacheServiceMock.get.mockImplementation(() =>{
-            return {
-                artifacts: {
-                    deployment:{
-                        resourceInstanceDeploymentArtifacts: [{name: "Dummy Value Returned from ui api"}],
-                    }
-                }
+        artifactConfigService.findAllTypeBy.mockImplementation((artifactType, componentType, resourceType) => {
+            if (artifactType == 'DEPLOYMENT' && componentType == ComponentType.RESOURCE_INSTANCE && resourceType == 'VF') {
+                return ['Val1', 'Val2', 'Val3', ArtifactType.HEAT_ENV];
             }
         });
 
         fixture.componentInstance.artifactType = 'DEPLOYMENT';
+        fixture.componentInstance.resourceType = 'VF';
         fixture.componentInstance.artifact = artifactModel;
-        fixture.componentInstance.artifact.artifactType = 'HEAT_ENV';
+        fixture.componentInstance.artifact.artifactType = ArtifactType.HEAT_ENV;
 
         fixture.componentInstance.initArtifactTypes();
 
-        expect(fixture.componentInstance.selectedFileType).toEqual(undefined);
+        expect(fixture.componentInstance.selectedFileType).toEqual({"label": ArtifactType.HEAT_ENV, "value": ArtifactType.HEAT_ENV});
 
     });
 
-    it('should verify initArtifactTypes for DEPLOYMENT and ComponentType = RESOURCE', () =>{
+    it('should verify initArtifactTypes for DEPLOYMENT and ComponentType = RESOURCE', () => {
 
-        cacheServiceMock.get.mockImplementation(() =>{
-            return {
-                artifacts: {
-                    deployment:{
-                        resourceDeploymentArtifacts: [{name: "Dummy Value Returned from ui api"}],
-                    }
-                }
+        const expectedSelectedValue = 'Val3';
+        const artifactType = 'DEPLOYMENT';
+        const resourceType = 'VF';
+        artifactConfigService.findAllTypeBy.mockImplementation((artifactType1, componentType1, resourceType1) => {
+            if (artifactType1 == artifactType && componentType1 == ComponentType.RESOURCE && resourceType1 == resourceType) {
+                return ['Val1', 'Val2', expectedSelectedValue, 'Val4'];
             }
-        });
-
-        fixture.componentInstance.artifactType = 'DEPLOYMENT';
-        fixture.componentInstance.artifact = artifactModel;
-        fixture.componentInstance.componentType = 'RESOURCE';
-
-        fixture.componentInstance.initArtifactTypes();
-
-        expect(fixture.componentInstance.selectedFileType).toEqual(undefined);
-
-    });
-
-    it('should verify initArtifactTypes for DEPLOYMENT and NOT ComponentType = RESOURCE OR NOT ArtifactType = HEAT_ENV', () =>{
 
-        cacheServiceMock.get.mockImplementation(() =>{
-            return {
-                artifacts: {
-                    deployment:{
-                        serviceDeploymentArtifacts: [{name: "Dummy Value Returned from ui api"}],
-                    }
-                }
-            }
+            return [];
         });
 
-        fixture.componentInstance.artifactType = 'DEPLOYMENT';
+        fixture.componentInstance.artifactType = artifactType;
         fixture.componentInstance.artifact = artifactModel;
-        // fixture.componentInstance.componentType = 'RESOURCE';
+        fixture.componentInstance.resourceType = resourceType;
+        fixture.componentInstance.componentType = ComponentType.RESOURCE;
+        fixture.componentInstance.artifact.artifactType = expectedSelectedValue;
 
         fixture.componentInstance.initArtifactTypes();
 
-        expect(fixture.componentInstance.selectedFileType).toEqual(undefined);
+        expect(fixture.componentInstance.selectedFileType).toEqual({'label': expectedSelectedValue, 'value': expectedSelectedValue});
 
     });
 
-    it('should verify initArtifactTypes for INFORMATION', () =>{
+    it('should verify initArtifactTypes for INFORMATIONAL', () => {
 
-        cacheServiceMock.get.mockImplementation(() =>{
-            return {
-                artifacts: {
-                    other: [{name: "Val1"}, {name: "ExpectedValToBeSelected"}, {name: "Val3"}]
-                }
+        const expectedSelectedValue = 'Val3';
+        const artifactType = 'INFORMATIONAL';
+        const resourceType = null;
+        artifactConfigService.findAllTypeBy.mockImplementation((artifactType1, componentType1, resourceType1) => {
+            if (artifactType1 == artifactType && componentType1 == ComponentType.SERVICE && resourceType1 == resourceType) {
+                return ['Val1', 'Val2', expectedSelectedValue, 'Val4'];
             }
+
+            return [];
         });
 
-        fixture.componentInstance.artifactType = 'INFORMATIONAL';
+        fixture.componentInstance.artifactType = artifactType;
         fixture.componentInstance.artifact = artifactModel;
-        fixture.componentInstance.artifact.artifactType = 'ExpectedValToBeSelected';
+        fixture.componentInstance.resourceType = resourceType;
+        fixture.componentInstance.componentType = ComponentType.SERVICE;
+        fixture.componentInstance.artifact.artifactType = expectedSelectedValue;
 
         fixture.componentInstance.initArtifactTypes();
 
-        expect(fixture.componentInstance.selectedFileType).toEqual({"label": "ExpectedValToBeSelected", "value": "ExpectedValToBeSelected"});
+        expect(fixture.componentInstance.selectedFileType).toEqual({'label': expectedSelectedValue, 'value': expectedSelectedValue});
 
     });
 
-
     it('should match current snapshot of artifact form component', () => {
         expect(fixture).toMatchSnapshot();
     });
@@ -147,7 +135,7 @@ describe('artifact form component', () => {
     it('should verify onUploadFile -> file gets file name', () => {
         let file = {
             filename:'dummyFileName'
-        }
+        };
 
         fixture.componentInstance.verifyTypeAndFileWereFilled = jest.fn();
         fixture.componentInstance.artifact = artifactModel;
diff --git a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.ts b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.ts
index 905d1a25ad..f7dbf09e3f 100644
--- a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.ts
+++ b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifact-form.component.ts
@@ -9,6 +9,7 @@ import { ArtifactModel } from '../../../../models';
 import { ArtifactType, ComponentType } from '../../../../utils';
 import { Dictionary } from '../../../../utils/dictionary/dictionary';
 import { CacheService } from '../../../services/cache.service';
+import { ArtifactConfigService } from '../../../services/artifact-config.service';
 
 @Component({
     selector: 'artifact-form',
@@ -20,6 +21,7 @@ export class ArtifactFormComponent {
     @Input() artifact: ArtifactModel;
     @Input() artifactType: ArtifactType;
     @Input() componentType: string;
+    @Input() resourceType: string;
     @Input() instanceId: string;
     @Input() isViewOnly: boolean;
 
@@ -31,7 +33,8 @@ export class ArtifactFormComponent {
     private descriptionIsValid: boolean;
     private labelIsValid: boolean;
 
-    constructor(private cacheService: CacheService) {
+    constructor(private cacheService: CacheService,
+                private artifactConfigService: ArtifactConfigService) {
     }
 
     ngOnInit(): void {
@@ -44,7 +47,7 @@ export class ArtifactFormComponent {
     public onTypeChange = (selectedFileType: IDropDownOption) => {
         this.artifact.artifactType = selectedFileType.value;
         this.verifyTypeAndFileWereFilled();
-    }
+    };
 
     public onUploadFile = (file) => {
         if (file) {
@@ -55,34 +58,24 @@ export class ArtifactFormComponent {
             this.artifact.artifactName = null;
         }
         this.verifyTypeAndFileWereFilled();
-    }
+    };
 
     private initArtifactTypes = (): void => {
-        const artifactTypes: any = this.cacheService.get('UIConfiguration');
-        let validExtensions: string[];
         let artifactTypesList: string[];
-
         switch (this.artifactType) {
             case ArtifactType.DEPLOYMENT:
                 if (this.artifact.artifactType === ArtifactType.HEAT_ENV || this.instanceId) {
-                    validExtensions = artifactTypes.artifacts.deployment.resourceInstanceDeploymentArtifacts;
-                } else if (this.componentType === ComponentType.RESOURCE) {
-                    validExtensions = artifactTypes.artifacts.deployment.resourceDeploymentArtifacts;
+                    artifactTypesList = this.artifactConfigService.findAllTypeBy(this.artifactType, ComponentType.RESOURCE_INSTANCE, this.resourceType);
                 } else {
-                    validExtensions = artifactTypes.artifacts.deployment.serviceDeploymentArtifacts;
-                }
-                if (validExtensions) {
-                    artifactTypesList = Object.keys(validExtensions);
+                    artifactTypesList = this.artifactConfigService.findAllTypeBy(this.artifactType, this.componentType, this.resourceType);
                 }
                 break;
             case ArtifactType.INFORMATION:
-                artifactTypesList = artifactTypes.artifacts.other.map((element: any) => {
-                    return element.name;
-                });
-                _.remove(artifactTypesList, (item: string) => {
-                    return _.has(ArtifactType.THIRD_PARTY_RESERVED_TYPES, item) ||
-                        _.has(ArtifactType.TOSCA, item);
-                });
+                if (this.instanceId) {
+                    artifactTypesList = this.artifactConfigService.findAllTypeBy(this.artifactType, ComponentType.RESOURCE_INSTANCE, this.resourceType);
+                } else {
+                    artifactTypesList = this.artifactConfigService.findAllTypeBy(this.artifactType, this.componentType, this.resourceType);
+                }
                 break;
         }
 
@@ -94,7 +87,7 @@ export class ArtifactFormComponent {
             return artifactType.value === this.artifact.artifactType;
         });
 
-    }
+    };
 
     // Verify that the Type and the Name (file) are filled in the Modal
     // For Description and Label - I used this.descriptionIsValid:boolean & this.labelIsValid:boolean as part of the sdc-validation Element
@@ -116,17 +109,17 @@ export class ArtifactFormComponent {
                 this.onValidationChange.next(false);
             }
         }
-    }
+    };
 
     // sdc-validation for Description
     private onDescriptionChange = (isValid: boolean): void => {
         this.descriptionIsValid = isValid;
         this.onValidationChange.next(isValid) && this.verifyTypeAndFileWereFilled();
-    }
+    };
 
     // sdc-validation for Label
     private onLabelChange = (isValid: boolean): void => {
         this.labelIsValid = isValid;
         this.onValidationChange.next(isValid) && this.verifyTypeAndFileWereFilled();
-    }
+    };
 }
diff --git a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifacts.service.ts b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifacts.service.ts
index f9400e9d18..ead85a6afa 100644
--- a/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifacts.service.ts
+++ b/catalog-ui/src/app/ng2/components/forms/artifacts-form/artifacts.service.ts
@@ -25,12 +25,13 @@ export class ArtifactsService {
                 private store: Store) {
     }
 
-    public dispatchArtifactAction = (componentId: string, componentType: string, artifact: ArtifactModel, artifactType: ArtifactGroupType, instanceId: string) => {
+    public dispatchArtifactAction = (componentId: string, componentType: string, artifact: ArtifactModel, artifactType: ArtifactGroupType, instanceId: string, resourceType?: string) => {
         const artifactObj = {
             componentType,
             componentId,
             instanceId,
-            artifact
+            artifact,
+            resourceType
         };
 
         // Create or update instance artifact
@@ -48,14 +49,14 @@ export class ArtifactsService {
         }
     }
 
-    public openArtifactModal = (componentId: string, componentType: string, artifact: ArtifactModel, artifactType: ArtifactGroupType, isViewOnly?: boolean, instanceId?: string) => {
+    public openArtifactModal = (componentId: string, componentType: string, artifact: ArtifactModel, artifactType: ArtifactGroupType, isViewOnly?: boolean, instanceId?: string, resourceType?: string) => {
 
         let modalInstance;
 
         const onOkPressed = () => {
             const updatedArtifact = modalInstance.innerModalContent.instance.artifact;
             this.serviceLoader.activate();
-            this.dispatchArtifactAction(componentId, componentType, updatedArtifact, artifactType, instanceId)
+            this.dispatchArtifactAction(componentId, componentType, updatedArtifact, artifactType, instanceId, resourceType)
                     .subscribe().add(() => this.serviceLoader.deactivate());
         };
 
@@ -82,6 +83,7 @@ export class ArtifactsService {
             artifactType,
             instanceId,
             componentType,
+            resourceType: resourceType,
             isViewOnly
         });
 
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifact-tab.component.spec.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifact-tab.component.spec.ts
index 258f2295ab..9df3e38eb2 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifact-tab.component.spec.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifact-tab.component.spec.ts
@@ -220,7 +220,7 @@ describe('artifact-tab component', () => {
         fixture.componentInstance.addOrUpdate(artifact);
 
 
-        expect(artifactsServiceMockService.openArtifactModal).toHaveBeenCalledWith(topologyTemplateId, topologyTemplateType, artifact, type, isViewOnly, component.uniqueId);
+        expect(artifactsServiceMockService.openArtifactModal).toHaveBeenCalledWith(topologyTemplateId, topologyTemplateType, artifact, type, isViewOnly, component.uniqueId, undefined);
     });
 
     it ('on addOrUpdate -> openArtifactModal is being called from artifactService when isComponentInstanceSelected = false', () => {
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifacts-tab.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifacts-tab.component.ts
index 53a6c267e2..91664ce8e8 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifacts-tab.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/artifacts-tab/artifacts-tab.component.ts
@@ -64,7 +64,7 @@ export class ArtifactsTabComponent {
 
     public addOrUpdate = (artifact: ArtifactModel): void => {
         if (this.isComponentInstanceSelected) {
-            this.artifactService.openArtifactModal(this.topologyTemplateId, this.topologyTemplateType, artifact, this.type, this.isViewOnly, this.component.uniqueId);
+            this.artifactService.openArtifactModal(this.topologyTemplateId, this.topologyTemplateType, artifact, this.type, this.isViewOnly, this.component.uniqueId, this.resourceType);
         } else {
             this.artifactService.openArtifactModal(this.topologyTemplateId, this.topologyTemplateType, artifact, this.type, this.isViewOnly);
         }
diff --git a/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.html b/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.html
index 1df318e4a5..3ed2173b15 100644
--- a/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.html
+++ b/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.html
@@ -16,11 +16,16 @@
                      <div class="env-artifact"></div>
                 </div>
                 <span sdc-tooltip [tooltip-text]="row.artifactDisplayName" [tooltip-placement]="3" [attr.data-tests-id]="'artifactDisplayName_' + row.artifactDisplayName">{{row.artifactDisplayName}}</span>
-                <span *ngIf="row.description.length > 0" class="info">
+                <span *ngIf="row.description && row.description.length > 0" class="info">
                     <svg-icon [clickable]="true" [name]="'comment'" [mode]="'primary2'" (click)="openPopOver('Description',row.description,{x:$event.pageX , y:$event.pageY },'bottom')"></svg-icon>
                 </span>
             </ng-template>
         </ngx-datatable-column>
+        <ngx-datatable-column [resizeable]="false" name="Filename" [flexGrow]="1">
+            <ng-template ngx-datatable-cell-template let-row="row">
+                <span sdc-tooltip [tooltip-text]="row.artifactName" [tooltip-placement]="3" [attr.data-tests-id]="'artifactName_' + row.artifactName">{{row.artifactName}}</span>
+            </ng-template>
+        </ngx-datatable-column>
         <ngx-datatable-column [resizeable]="false" name="Type" [flexGrow]="0.6">
             <ng-template ngx-datatable-cell-template let-row="row">
                 <span sdc-tooltip [tooltip-text]="row.artifactType" [tooltip-placement]="3" [attr.data-tests-id]="'artifactType_' + row.artifactDisplayName">{{row.artifactType}}</span>
diff --git a/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.ts b/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.ts
index 53b21b34b6..ec30cd15aa 100644
--- a/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/workspace/deployment-artifacts/deployment-artifacts-page.component.ts
@@ -1,23 +1,22 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
-import { Select, Store } from '@ngxs/store';
-import { ArtifactModel } from 'app/models';
+import {Component, OnInit, ViewChild} from '@angular/core';
+import {Select, Store} from '@ngxs/store';
+import {ArtifactModel} from 'app/models';
 import * as _ from 'lodash';
-import { SdcUiCommon, SdcUiComponents, SdcUiServices } from 'onap-ui-angular';
-import { Observable } from 'rxjs/index';
-import { map } from 'rxjs/operators';
-import { GabConfig } from '../../../../models/gab-config';
-import { PathsAndNamesDefinition } from '../../../../models/paths-and-names';
-import { GenericArtifactBrowserComponent } from '../../../../ng2/components/logic/generic-artifact-browser/generic-artifact-browser.component';
-import { ArtifactGroupType, ArtifactType } from '../../../../utils/constants';
-import { ArtifactsService } from '../../../components/forms/artifacts-form/artifacts.service';
-import { PopoverContentComponent } from '../../../components/ui/popover/popover-content.component';
-import { CacheService } from '../../../services/cache.service';
-import { TranslateService } from '../../../shared/translator/translate.service';
-import { GetArtifactsByTypeAction } from '../../../store/actions/artifacts.action';
-import { ArtifactsState } from '../../../store/states/artifacts.state';
-import { WorkspaceState, WorkspaceStateModel } from '../../../store/states/workspace.state';
-import { WorkspaceService } from '../workspace.service';
-import { ModalService } from 'app/ng2/services/modal.service';
+import {SdcUiCommon, SdcUiServices} from 'onap-ui-angular';
+import {Observable} from 'rxjs';
+import {map} from 'rxjs/operators';
+import {GabConfig} from '../../../../models/gab-config';
+import {PathsAndNamesDefinition} from '../../../../models/paths-and-names';
+import {GenericArtifactBrowserComponent} from '../../../components/logic/generic-artifact-browser/generic-artifact-browser.component';
+import {ArtifactGroupType, ArtifactType} from '../../../../utils/constants';
+import {ArtifactsService} from '../../../components/forms/artifacts-form/artifacts.service';
+import {PopoverContentComponent} from '../../../components/ui/popover/popover-content.component';
+import {CacheService} from '../../../services/cache.service';
+import {TranslateService} from '../../../shared/translator/translate.service';
+import {GetArtifactsByTypeAction} from '../../../store/actions/artifacts.action';
+import {ArtifactsState} from '../../../store/states/artifacts.state';
+import {WorkspaceState, WorkspaceStateModel} from '../../../store/states/workspace.state';
+import {WorkspaceService} from '../workspace.service';
 
 export interface IPoint {
     x: number;
@@ -33,6 +32,7 @@ export class DeploymentArtifactsPageComponent implements OnInit {
 
     public componentId: string;
     public componentType: string;
+    public resourceType: string;
     public deploymentArtifacts$: Observable<ArtifactModel[]>;
     public isComponentInstanceSelected: boolean;
 
@@ -68,11 +68,12 @@ export class DeploymentArtifactsPageComponent implements OnInit {
             }
         });
         return sortedArtifacts;
-    })
+    });
 
     ngOnInit(): void {
         this.componentId = this.workspaceService.metadata.uniqueId;
         this.componentType = this.workspaceService.metadata.componentType;
+        this.resourceType = this.workspaceService.metadata.resourceType;
 
         this.store.dispatch(new GetArtifactsByTypeAction({
             componentType: this.componentType,
@@ -91,8 +92,8 @@ export class DeploymentArtifactsPageComponent implements OnInit {
     }
 
     public addOrUpdateArtifact = (artifact: ArtifactModel, isViewOnly: boolean) => {
-        this.artifactsService.openArtifactModal(this.componentId, this.componentType, artifact, ArtifactGroupType.DEPLOYMENT, isViewOnly);
-    }
+        this.artifactsService.openArtifactModal(this.componentId, this.componentType, artifact, ArtifactGroupType.DEPLOYMENT, isViewOnly, null, this.resourceType);
+    };
 
     public deleteArtifact = (artifactToDelete) => {
         this.artifactsService.deleteArtifact(this.componentType, this.componentId, artifactToDelete);
diff --git a/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.html b/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.html
index cff33258ae..b1f610a653 100644
--- a/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.html
+++ b/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.html
@@ -28,6 +28,11 @@
                 </div>
             </ng-template>
         </ngx-datatable-column>
+        <ngx-datatable-column [resizeable]="false" name="Filename" [flexGrow]="1">
+            <ng-template ngx-datatable-cell-template let-row="row">
+                <span sdc-tooltip [tooltip-text]="row.artifactName" [tooltip-placement]="3" [attr.data-tests-id]="'artifactName_' + row.artifactName">{{row.artifactName}}</span>
+            </ng-template>
+        </ngx-datatable-column>
         <ngx-datatable-column [resizeable]="false" name="Type" [flexGrow]="1">
             <ng-template ngx-datatable-cell-template let-row="row">
                 {{row.artifactType}}
diff --git a/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.ts b/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.ts
index a6804a43c6..981e00bf40 100644
--- a/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.ts
+++ b/catalog-ui/src/app/ng2/pages/workspace/information-artifact/information-artifact-page.component.ts
@@ -1,13 +1,11 @@
 import {Component, OnInit, ViewChild} from "@angular/core";
 import {WorkspaceService} from "../workspace.service";
-import {SdcUiCommon, SdcUiComponents, SdcUiServices} from "onap-ui-angular";
-import {TopologyTemplateService} from "../../../services/component-services/topology-template.service";
 import * as _ from "lodash";
 import {ArtifactGroupType, ArtifactType} from "../../../../utils/constants";
 import {ArtifactsService} from "../../../components/forms/artifacts-form/artifacts.service";
-import {DeleteArtifactAction, GetArtifactsByTypeAction} from "../../../store/actions/artifacts.action";
+import {GetArtifactsByTypeAction} from "../../../store/actions/artifacts.action";
 import {Select, Store} from "@ngxs/store";
-import {Observable} from "rxjs/index";
+import {Observable} from "rxjs";
 import {ArtifactsState} from "../../../store/states/artifacts.state";
 import {map} from "rxjs/operators";
 import {WorkspaceState} from "../../../store/states/workspace.state";
@@ -22,6 +20,7 @@ export class InformationArtifactPageComponent implements OnInit {
 
     public componentId: string;
     public componentType: string;
+    public resourceType: string;
     public informationArtifacts$: Observable<ArtifactModel[]>;
     public informationArtifactsAsButtons$: Observable<ArtifactModel[]>;
     @Select(WorkspaceState.isViewOnly) isViewOnly$: boolean;
@@ -35,6 +34,7 @@ export class InformationArtifactPageComponent implements OnInit {
     ngOnInit(): void {
         this.componentId = this.workspaceService.metadata.uniqueId;
         this.componentType = this.workspaceService.metadata.componentType;
+        this.resourceType = this.workspaceService.metadata.resourceType;
 
         this.store.dispatch(new GetArtifactsByTypeAction({
             componentType: this.componentType,
@@ -59,11 +59,11 @@ export class InformationArtifactPageComponent implements OnInit {
     }
 
     public addOrUpdateArtifact = (artifact: ArtifactModel, isViewOnly?: boolean) => {
-        this.artifactsService.openArtifactModal(this.componentId, this.componentType, artifact, ArtifactGroupType.INFORMATION, isViewOnly);
-    }
+        this.artifactsService.openArtifactModal(this.componentId, this.componentType, artifact, ArtifactGroupType.INFORMATION, isViewOnly, null, this.resourceType);
+    };
 
     public deleteArtifact = (artifactToDelete) => {
       this.artifactsService.deleteArtifact(this.componentType, this.componentId, artifactToDelete)
-    }
+    };
 
 }
\ No newline at end of file
diff --git a/catalog-ui/src/app/ng2/services/artifact-config.service.spec.ts b/catalog-ui/src/app/ng2/services/artifact-config.service.spec.ts
new file mode 100644
index 0000000000..bbbd387b4e
--- /dev/null
+++ b/catalog-ui/src/app/ng2/services/artifact-config.service.spec.ts
@@ -0,0 +1,23 @@
+import { TestBed, inject } from '@angular/core/testing';
+
+import { ArtifactConfigService } from './artifact-config.service';
+import {CacheService} from "./cache.service";
+
+describe('ArtifactConfigService', () => {
+  beforeEach(() => {
+    const cacheServiceMock = {
+      get: jest.fn(() => {
+        return {
+          artifact: null
+        }
+      })
+    };
+    TestBed.configureTestingModule({
+      providers: [ArtifactConfigService, {provide: CacheService, useValue: cacheServiceMock}]
+    });
+  });
+
+  it('should be created', inject([ArtifactConfigService], (service: ArtifactConfigService) => {
+    expect(service).toBeTruthy();
+  }));
+});
diff --git a/catalog-ui/src/app/ng2/services/artifact-config.service.ts b/catalog-ui/src/app/ng2/services/artifact-config.service.ts
new file mode 100644
index 0000000000..e3f914fa29
--- /dev/null
+++ b/catalog-ui/src/app/ng2/services/artifact-config.service.ts
@@ -0,0 +1,50 @@
+import {Injectable} from '@angular/core';
+import {CacheService} from './cache.service';
+import {ArtifactType} from "../../utils/constants";
+
+@Injectable()
+export class ArtifactConfigService {
+
+  artifactConfigList:Array<object>;
+
+  constructor(private cacheService: CacheService) {
+    const uiConfiguration = cacheService.get('UIConfiguration');
+    this.artifactConfigList = uiConfiguration.artifact;
+  }
+
+  public getConfig() {
+    return this.artifactConfigList;
+  }
+
+  public findAllBy(artifactType?:ArtifactType, componentType?:string, resourceType?:string):Array<object> {
+    return this.artifactConfigList.filter((artifactConfig:any) => {
+      let hasCategory = true;
+      if (artifactType) {
+        hasCategory = artifactConfig.categories && artifactConfig.categories.some(value => value == artifactType);
+      }
+      let hasComponentType = true;
+      if (componentType) {
+        hasComponentType = artifactConfig.componentTypes && artifactConfig.componentTypes.some(value => value == componentType);
+      }
+      let hasResourceType = true;
+      //resourceTypes are not restrictive, if it was not configured all resources are accepted.
+      if (resourceType && artifactConfig.resourceTypes) {
+        hasResourceType = artifactConfig.resourceTypes.some(value => value == resourceType);
+      }
+      return hasCategory && hasComponentType && hasResourceType;
+    });
+  }
+
+
+  public findAllTypeBy(artifactType?:ArtifactType, componentType?:string, resourceType?:string):Array<string> {
+    const artifactConfigList = this.findAllBy(artifactType, componentType, resourceType);
+    if (artifactConfigList) {
+      return artifactConfigList.map((element: any) => {
+        return element.type;
+      });
+    }
+
+    return [];
+  }
+
+}
diff --git a/catalog-ui/src/app/ng2/store/actions/instance-artifacts.actions.ts b/catalog-ui/src/app/ng2/store/actions/instance-artifacts.actions.ts
index 0f1df78352..d762b171ce 100644
--- a/catalog-ui/src/app/ng2/store/actions/instance-artifacts.actions.ts
+++ b/catalog-ui/src/app/ng2/store/actions/instance-artifacts.actions.ts
@@ -13,14 +13,14 @@ export class GetInstanceArtifactsByTypeAction {
 export class CreateInstanceArtifactAction {
     static readonly type = '[INSTANCE_ARTIFACTS] CreateInstanceArtifactAction';
 
-    constructor(public payload: { componentType: string, componentId: string, instanceId: string, artifact: ArtifactModel }) {
+    constructor(public payload: { componentType: string, componentId: string, instanceId: string, artifact: ArtifactModel, resourceType: string }) {
     }
 }
 
 export class UpdateInstanceArtifactAction {
     static readonly type = '[INSTANCE_ARTIFACTS] UpdateInstanceArtifactAction';
 
-    constructor(public payload: { componentType: string, componentId: string, instanceId: string, artifact: ArtifactModel }) {
+    constructor(public payload: { componentType: string, componentId: string, instanceId: string, artifact: ArtifactModel, resourceType: string }) {
     }
 }