Fix for substitution filter properties

Issue-ID: SDC-3325
Change-Id: If26bf895a0a2f914fb9c2b36e53466df9b7999fe
Signed-off-by: KrupaNagabhushan <krupa.nagabhushan@est.tech>

4 files changed, 16 insertions, 29 deletions

diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
index 305086e8f3..75fab9abe7 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.spec.ts
@@ -108,7 +108,7 @@ describe('composition-panel component', () => {
         fixture.componentInstance.ngOnInit();
 
         // Expect that
-        expect (fixture.componentInstance.tabs.length).toBe(5);
+        expect (fixture.componentInstance.tabs.length).toBe(6);
         expect (fixture.componentInstance.tabs[0]).toEqual(tabs.infoTab);
         expect (fixture.componentInstance.tabs[1]).toEqual(tabs.deploymentArtifacts);
         expect (fixture.componentInstance.tabs[2]).toEqual(tabs.inputs);
@@ -157,7 +157,7 @@ describe('composition-panel component', () => {
         fixture.componentInstance.ngOnInit();
 
         // Expect that
-        expect (fixture.componentInstance.tabs.length).toBe(6);
+        expect (fixture.componentInstance.tabs.length).toBe(5);
         expect (fixture.componentInstance.tabs[0]).toEqual(tabs.infoTab);
         expect (fixture.componentInstance.tabs[1]).toEqual(tabs.properties);
         expect (fixture.componentInstance.tabs[2]).toEqual(tabs.reqAndCapabilities);
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
index 89634ef000..53c569be11 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts
@@ -142,11 +142,11 @@ export class CompositionPanelComponent {
 
         if (component.isService() && !this.selectedComponentIsServiceProxyInstance() && !this.selectedComponentIsServiceSubstitutionInstance()) {
             this.tabs.push(tabs.apiArtifacts);
+            this.tabs.push(tabs.substitutionFilter);
         }
         if (component.isService() && (this.selectedComponentIsServiceProxyInstance() || this.selectedComponentIsServiceSubstitutionInstance())) {
             this.tabs.push(tabs.consumption);
             this.tabs.push(tabs.dependencies);
-            this.tabs.push(tabs.substitutionFilter)
         } else if (component.isResource() && this.selectedComponentIsVfcInstance()) {
             this.tabs.push(tabs.dependencies);
         }
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.html b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.html
index d0656959f8..c8845deece 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.html
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.html
@@ -20,19 +20,15 @@
 
 <ng2-expand-collapse state="0">
     <header sdc-tooltip tooltip-text="{{input.title}}">{{input.title}}</header>
-    <content>
-        <div *ngIf="isComponentInstanceSelected">
-                <substitution-filter
-                    [compositeService]="metaData"
-                    [currentServiceInstance]="component"
-                    [selectedInstanceProperties]="selectedInstanceProperties"
-                    [selectedInstanceSiblings]="selectedInstanceSiblings"
-                    [selectedInstanceConstraints]="selectedInstanceConstraints"
-                    [readonly]="isViewOnly"
-                    (hasSubstitutionFilter)="notifyDependencyEventsObserver($event)"
-                    (updateConstraintListEvent)="updateSelectedInstanceConstraints($event)"
-                    (loadConstraintListEvent)="loadConstraints()">
-                </substitution-filter>
-        </div>
-    </content>
+    <substitution-filter
+            [compositeService]="metaData"
+            [currentServiceInstance]="component"
+            [selectedInstanceProperties]="selectedInstanceProperties"
+            [selectedInstanceSiblings]="selectedInstanceSiblings"
+            [selectedInstanceConstraints]="selectedInstanceConstraints"
+            [readonly]="isViewOnly"
+            (hasSubstitutionFilter)="notifyDependencyEventsObserver($event)"
+            (updateConstraintListEvent)="updateSelectedInstanceConstraints($event)"
+            (loadConstraintListEvent)="loadConstraints()">
+    </substitution-filter>
 </ng2-expand-collapse>
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.ts b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.ts
index 20868e388b..2b5648c27f 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.ts
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/substitution-filter-tab/substitution-filter-tab.component.ts
@@ -20,14 +20,8 @@
 import { Component, Input } from '@angular/core';
 import { Store } from '@ngxs/store';
 import {
-    CapabilitiesGroup,
-    Capability,
     Component as TopologyTemplate,
-    ComponentInstance,
     FullComponentInstance,
-    InputBEModel,
-    InputsGroup,
-    InterfaceModel,
     PropertiesGroup,
     PropertyBEModel,
 } from 'app/models';
@@ -73,8 +67,6 @@ export class SubstitutionFilterTabComponent {
         this.metaData = this.workspaceService.metadata;
         this.isComponentInstanceSelected = this.componentType === SelectedComponentType.COMPONENT_INSTANCE;
         this.initInstancesWithProperties();
-        this.loadConstraints();
-        this.initInstancesWithProperties();
     }
 
     public loadConstraints = (): void => {
@@ -93,13 +85,12 @@ export class SubstitutionFilterTabComponent {
     }
 
     private initInstancesWithProperties = (): void => {
-        this.topologyTemplateService.getComponentInstanceProperties(this.metaData.componentType, this.metaData.uniqueId).subscribe((genericResponse: ComponentGenericResponse) => {
-            this.componentInstanceProperties = genericResponse.componentInstancesProperties;
+        this.topologyTemplateService.getComponentPropertiesSubstitutionFilter(this.metaData.componentType, this.metaData.uniqueId).subscribe((genericResponse: ComponentGenericResponse) => {
+            this.selectedInstanceProperties = genericResponse.properties;
             this.updateInstanceAttributes();
         });
     }
 
-
     private updateInstanceAttributes = (): void => {
         if (this.isComponentInstanceSelected && this.componentInstanceProperties) {
             const instancesMappedList = this.compositionService.componentInstances.map((coInstance) => new ServiceInstanceObject({