aboutsummaryrefslogtreecommitdiffstats
path: root/catalog-ui/src/app/ng2/pages/composition/panel
diff options
context:
space:
mode:
Diffstat (limited to 'catalog-ui/src/app/ng2/pages/composition/panel')
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/__snapshots__/composition-panel.component.spec.ts.snap1
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html23
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less1
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.ts8
-rw-r--r--catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tabs.less2
5 files changed, 26 insertions, 9 deletions
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/__snapshots__/composition-panel.component.spec.ts.snap b/catalog-ui/src/app/ng2/pages/composition/panel/__snapshots__/composition-panel.component.spec.ts.snap
index 5f10806315..fdede9d09e 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/__snapshots__/composition-panel.component.spec.ts.snap
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/__snapshots__/composition-panel.component.spec.ts.snap
@@ -9,6 +9,7 @@ exports[`composition-panel component should match current snapshot of compositio
isConfiguration={[Function Function]}
isPNF={[Function Function]}
selectedComponentIsServiceProxyInstance={[Function Function]}
+ selectedComponentIsVfcInstance={[Function Function]}
setActive={[Function Function]}
store={[Function Store]}
toggleSidebarDisplay={[Function Function]}
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
index bd90b9a814..5511dc0ea8 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.html
@@ -1,17 +1,26 @@
<panel-wrapper-component *ngIf="compositionState$ | async as state"> <!-- HEADER -->
- <ng2-composition-panel-header [isViewOnly]="state.isViewOnly"
- [selectedComponent]="state.selectedComponent"></ng2-composition-panel-header>
+ <ng2-composition-panel-header
+ [isViewOnly]="state.isViewOnly"
+ [selectedComponent]="state.selectedComponent">
+ </ng2-composition-panel-header>
<!-- TABS -->
<div class="component-details-panel-tabs">
<sdc-loader [global]="false" name="panel" testId="panel-loader" [active]="state.panelLoading"></sdc-loader>
<sdc-tabs (selectedTab)="setActive($event)" [iconsSize]="'large'">
- <sdc-tab *ngFor="let tab of tabs" [titleIcon]="tab.titleIcon" [active]="tab.isActive"
- [tooltipText]="tab.tooltipText">
- <panel-tab [isActive]="tab.isActive" [component]="selectedComponent"
- [componentType]="state.selectedComponentType" [isViewOnly]="isViewOnly$ | async"
- [input]="tab.input" [panelTabType]="tab.component"></panel-tab>
+ <sdc-tab *ngFor="let tab of tabs"
+ [titleIcon]="tab.titleIcon"
+ [active]="tab.isActive"
+ [tooltipText]="tab.tooltipText">
+
+ <panel-tab [isActive]="tab.isActive"
+ [component]="selectedComponent"
+ [componentType]="state.selectedComponentType"
+ [isViewOnly]="isViewOnly$ | async"
+ [input]="tab.input"
+ [panelTabType]="tab.component">
+ </panel-tab>
</sdc-tab>
</sdc-tabs>
</div>
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less
index 776ef68944..124d606079 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/composition-panel.component.less
@@ -14,6 +14,7 @@
.component-details-panel-tabs /deep/ sdc-tabs {
display:flex;
flex-direction:column;
+ width: 100%;
/deep/ sdc-tab {
display: flex;
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 c5ea41bcd1..348dc9f8c1 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
@@ -53,7 +53,7 @@ const tabs = {
inputs: {titleIcon: 'inputs-o', component: PropertiesTabComponent, input: {title: 'Inputs'}, isActive: false, tooltipText: 'Inputs'},
settings: {titleIcon: 'settings-o', component: PropertiesTabComponent, input: {}, isActive: false, tooltipText: 'Settings'},
consumption: {titleIcon: 'api-o', component: ServiceConsumptionTabComponent, input: {title: 'OPERATION CONSUMPTION'}, isActive: false, tooltipText: 'Service Consumption'},
- dependencies: {titleIcon: 'archive', component: ServiceDependenciesTabComponent, input: {title: 'SERVICE DEPENDENCIES'}, isActive: false, tooltipText: 'Service Dependencies'}
+ dependencies: {titleIcon: 'archive', component: ServiceDependenciesTabComponent, input: {title: 'DIRECTIVES AND NODE FILTER'}, isActive: false, tooltipText: 'Service Dependencies'}
};
@Component({
@@ -144,6 +144,8 @@ export class CompositionPanelComponent {
if (component.isService() && this.selectedComponentIsServiceProxyInstance()) {
this.tabs.push(tabs.consumption);
this.tabs.push(tabs.dependencies);
+ } else if (component.isResource() && this.selectedComponentIsVfcInstance()) {
+ this.tabs.push(tabs.dependencies);
}
}
@@ -168,4 +170,8 @@ export class CompositionPanelComponent {
private selectedComponentIsServiceProxyInstance = (): boolean => {
return this.isComponentInstanceSelected() && this.selectedComponent.isServiceProxy();
}
+
+ private selectedComponentIsVfcInstance = (): boolean => {
+ return this.isComponentInstanceSelected() && this.selectedComponent.isVFC();
+ }
}
diff --git a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tabs.less b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tabs.less
index b3c03f85c5..16767c2211 100644
--- a/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tabs.less
+++ b/catalog-ui/src/app/ng2/pages/composition/panel/panel-tabs/panel-tabs.less
@@ -20,7 +20,7 @@
border-left: none;
border-bottom: none;
height: 36px;
- width: 60px;
+ width: 100%;
display: flex;
align-content: center;
justify-content: center;