Add containers table in pods list pod row drop down

custom-src/frontend/app/custom/helm/list-types/monocular-repository-list-config.service.ts

@@ -1,38 +1,37 @@
+import { HttpClient } from '@angular/common/http';
 import { Injectable, NgZone } from '@angular/core';
+import { MatSnackBar } from '@angular/material';
 import { ActivatedRoute } from '@angular/router';
 import { Store } from '@ngrx/store';
+import { UnregisterEndpoint } from 'frontend/packages/store/src/actions/endpoint.actions';
+import { entityCatalog } from 'frontend/packages/store/src/entity-catalog/entity-catalog.service';
+import { endpointSchemaKey } from 'frontend/packages/store/src/helpers/entity-factory';
+import { selectDeletionInfo } from 'frontend/packages/store/src/selectors/api.selectors';
 import { of as observableOf } from 'rxjs';
+import { pairwise } from 'rxjs/operators';
 
 import { AppState } from '../../../../../store/src/app-state';
 import { EntityMonitorFactory } from '../../../../../store/src/monitors/entity-monitor.factory.service';
 import { InternalEventMonitorFactory } from '../../../../../store/src/monitors/internal-event-monitor.factory';
 import { PaginationMonitorFactory } from '../../../../../store/src/monitors/pagination-monitor.factory';
 import { EndpointModel } from '../../../../../store/src/types/endpoint.types';
+import { STRATOS_ENDPOINT_TYPE } from '../../../base-entity-schemas';
+import { CurrentUserPermissions } from '../../../core/current-user-permissions.config';
+import { CurrentUserPermissionsService } from '../../../core/current-user-permissions.service';
+import { environment } from '../../../environments/environment';
 import { getFullEndpointApiUrl } from '../../../features/endpoints/endpoint-helpers';
+import { ConfirmationDialogConfig } from '../../../shared/components/confirmation-dialog.config';
+import { ConfirmationDialogService } from '../../../shared/components/confirmation-dialog.service';
 import { ITableColumn } from '../../../shared/components/list/list-table/table.types';
 import {
   EndpointCardComponent,
 } from '../../../shared/components/list/list-types/endpoint/endpoint-card/endpoint-card.component';
 import {
   TableCellEndpointStatusComponent,
 } from '../../../shared/components/list/list-types/endpoint/table-cell-endpoint-status/table-cell-endpoint-status.component';
-import { IListConfig, ListViewTypes, IListAction } from '../../../shared/components/list/list.component.types';
+import { IListAction, IListConfig, ListViewTypes } from '../../../shared/components/list/list.component.types';
 import { defaultHelmKubeListPageSize } from '../../kubernetes/list-types/kube-helm-list-types';
 import { MonocularRepositoryDataSource } from './monocular-repository-list-source';
-import { HttpClient } from '@angular/common/http';
-import { environment } from '../../../environments/environment';
-import { map, pairwise } from 'rxjs/operators';
-import { MatSnackBar } from '@angular/material';
-import { SendClearEventAction } from 'frontend/packages/store/src/actions/internal-events.actions';
-import { DisconnectEndpoint, UnregisterEndpoint } from 'frontend/packages/store/src/actions/endpoint.actions';
-import { entityCatalog } from 'frontend/packages/store/src/entity-catalog/entity-catalog.service';
-import { selectDeletionInfo } from 'frontend/packages/store/src/selectors/api.selectors';
-import { STRATOS_ENDPOINT_TYPE } from '../../../base-entity-schemas';
-import { endpointSchemaKey } from 'frontend/packages/store/src/helpers/entity-factory';
-import { ConfirmationDialogService } from '../../../shared/components/confirmation-dialog.service';
-import { ConfirmationDialogConfig } from '../../../shared/components/confirmation-dialog.config';
-import { CurrentUserPermissionsService } from '../../../core/current-user-permissions.service';
-import { CurrentUserPermissions } from '../../../core/current-user-permissions.config';
 
 @Injectable()
 export class MonocularRepositoryListConfig implements IListConfig<EndpointModel> {
@@ -47,7 +46,6 @@ export class MonocularRepositoryListConfig implements IListConfig<EndpointModel>
   };
   pageSizeOptions = defaultHelmKubeListPageSize;
   enableTextFilter = true;
-  tableFixedRowHeight = true;
   columns: ITableColumn<EndpointModel>[] = [
     {
       columnId: 'name',

custom-src/frontend/app/custom/kubernetes/kubernetes.module.ts

@@ -5,6 +5,9 @@ import { NgxChartsModule } from '@swimlane/ngx-charts';
 
 import { CoreModule } from '../../core/core.module';
 import { SharedModule } from '../../shared/shared.module';
+import {
+  KubedashConfigurationComponent,
+} from './kubernetes-dashboard/kubedash-configuration/kubedash-configuration.component';
 import { KubernetesDashboardTabComponent } from './kubernetes-dashboard/kubernetes-dashboard.component';
 import {
   KubernetesNamespacePodsComponent,
@@ -70,6 +73,9 @@ import {
   KubernetesNodeTagsCardComponent,
 } from './list-types/kubernetes-nodes/kubernetes-node-summary/kubernetes-node-tags-card/kubernetes-node-tags-card.component';
 import { NodePodCountComponent } from './list-types/kubernetes-nodes/node-pod-count/node-pod-count.component';
+import {
+  KubernetesPodContainersComponent,
+} from './list-types/kubernetes-pods/kubernetes-pod-containers/kubernetes-pod-containers.component';
 import {
   KubernetesPodStatusComponent,
 } from './list-types/kubernetes-pods/kubernetes-pod-status/kubernetes-pod-status.component';
@@ -86,7 +92,6 @@ import { KubernetesNamespacesTabComponent } from './tabs/kubernetes-namespaces-t
 import { KubernetesNodesTabComponent } from './tabs/kubernetes-nodes-tab/kubernetes-nodes-tab.component';
 import { KubernetesPodsTabComponent } from './tabs/kubernetes-pods-tab/kubernetes-pods-tab.component';
 import { KubernetesSummaryTabComponent } from './tabs/kubernetes-summary-tab/kubernetes-summary.component';
-import { KubedashConfigurationComponent } from './kubernetes-dashboard/kubedash-configuration/kubedash-configuration.component';
 
 
 /* tslint:enable */
@@ -141,6 +146,7 @@ import { KubedashConfigurationComponent } from './kubernetes-dashboard/kubedash-
     KubernetesResourceViewerComponent,
     KubeServiceCardComponent,
     KubedashConfigurationComponent,
+    KubernetesPodContainersComponent
   ],
   providers: [
     KubernetesService,
@@ -163,7 +169,8 @@ import { KubedashConfigurationComponent } from './kubernetes-dashboard/kubedash-
     KubernetesServicePortsComponent,
     KubernetesPodStatusComponent,
     KubeServiceCardComponent,
-    KubernetesResourceViewerComponent
+    KubernetesResourceViewerComponent,
+    KubernetesPodContainersComponent
   ],
   exports: [
     KubernetesResourceViewerComponent

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-endpoints/kubernetes-endpoints-list-config.service.ts

@@ -30,7 +30,6 @@ export class KubernetesEndpointsListConfigService implements IListConfig<Endpoin
     noEntries: 'There are no endpoints'
   };
   enableTextFilter = true;
-  tableFixedRowHeight = true;
 
 
   constructor(

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-nodes/kubernetes-node-summary/kubernetes-node-condition-card/kubernetes-node-condition-card.component.spec.ts

@@ -7,7 +7,6 @@ import { KubernetesNodeService } from '../../../../services/kubernetes-node.serv
 import { KubernetesNodeConditionCardComponent } from './kubernetes-node-condition-card.component';
 import { KubernetesNodeConditionComponent } from './kubernetes-node-condition/kubernetes-node-condition.component';
 
-// TODO: RC xdescribed
 describe('KubernetesNodeConditionCardComponent', () => {
   let component: KubernetesNodeConditionCardComponent;
   let fixture: ComponentFixture<KubernetesNodeConditionCardComponent>;

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pod-containers/kubernetes-pod-containers.component.html

@@ -0,0 +1,4 @@
+<div class="pod-containers">
+  <app-table [dataSource]="containerDataSource" [columns]="columns" [inExpandedRow]="true">
+  </app-table>
+</div>

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pod-containers/kubernetes-pod-containers.component.scss

@@ -0,0 +1,8 @@
+.pod-containers {
+  display: flex;
+  app-table {
+    flex: 1;
+    padding-bottom: 10px;
+    padding-left: 57px;
+  }
+}

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pod-containers/kubernetes-pod-containers.component.spec.ts

@@ -0,0 +1,36 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { KubernetesBaseTestModules } from '../../../kubernetes.testing.module';
+import { KubernetesPod } from '../../../store/kube.types';
+import { KubernetesPodContainersComponent } from './kubernetes-pod-containers.component';
+
+describe('KubernetesPodContainersComponent', () => {
+  let component: KubernetesPodContainersComponent;
+  let fixture: ComponentFixture<KubernetesPodContainersComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [KubernetesPodContainersComponent],
+      imports: KubernetesBaseTestModules
+    })
+      .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(KubernetesPodContainersComponent);
+    component = fixture.componentInstance;
+    component.row = {
+      metadata: {
+        uid: ''
+      },
+      status: {
+
+      }
+    } as KubernetesPod;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pod-containers/kubernetes-pod-containers.component.ts

@@ -0,0 +1,194 @@
+import { TitleCasePipe } from '@angular/common';
+import { Component, Input } from '@angular/core';
+import { Store } from '@ngrx/store';
+import * as moment from 'moment';
+import { of } from 'rxjs';
+import { filter, map } from 'rxjs/operators';
+
+import { AppState } from '../../../../../../../store/src/app-state';
+import { entityCatalog } from '../../../../../../../store/src/entity-catalog/entity-catalog.service';
+import { selectEntity } from '../../../../../../../store/src/selectors/api.selectors';
+import { BooleanIndicatorType } from '../../../../../shared/components/boolean-indicator/boolean-indicator.component';
+import { ITableListDataSource } from '../../../../../shared/components/list/data-sources-controllers/list-data-source-types';
+import {
+  TableCellBooleanIndicatorComponent,
+  TableCellBooleanIndicatorComponentConfig,
+} from '../../../../../shared/components/list/list-table/table-cell-boolean-indicator/table-cell-boolean-indicator.component';
+import {
+  TableCellIconComponent,
+  TableCellIconComponentConfig,
+} from '../../../../../shared/components/list/list-table/table-cell-icon/table-cell-icon.component';
+import { ITableColumn } from '../../../../../shared/components/list/list-table/table.types';
+import { CardCell } from '../../../../../shared/components/list/list.types';
+import { KUBERNETES_ENDPOINT_TYPE, kubernetesPodsEntityType } from '../../../kubernetes-entity-factory';
+import { Container, ContainerState, ContainerStatus, InitContainer, KubernetesPod } from '../../../store/kube.types';
+
+export interface ContainerForTable {
+  isInit: boolean;
+  container: Container | InitContainer;
+  containerStatus: ContainerStatus;
+}
+
+@Component({
+  selector: 'app-kubernetes-pod-containers',
+  templateUrl: './kubernetes-pod-containers.component.html',
+  styleUrls: ['./kubernetes-pod-containers.component.scss'],
+  providers: [
+    TitleCasePipe
+  ]
+})
+export class KubernetesPodContainersComponent extends CardCell<KubernetesPod> {
+
+  private entityConfig = entityCatalog.getEntity(KUBERNETES_ENDPOINT_TYPE, kubernetesPodsEntityType);
+
+  @Input()
+  set row(row: KubernetesPod) {
+    if (!row || !!this.containerDataSource) {
+      return;
+    }
+    this.containerDataSource = {
+      isTableLoading$: of(false),
+      connect: () => this.store.select<KubernetesPod>(selectEntity(this.entityConfig.entityKey, row.metadata.uid)).pipe(
+        filter(pod => !!pod),
+        map(pod => this.map(pod)),
+      ),
+      disconnect: () => { },
+      trackBy: (index, container: ContainerForTable) => container.container.name,
+    };
+  }
+
+  constructor(
+    private store: Store<AppState>,
+    private titleCase: TitleCasePipe,
+  ) {
+    super();
+  }
+
+  private readyBoolConfig: TableCellBooleanIndicatorComponentConfig<ContainerForTable> = {
+    isEnabled: (row: ContainerForTable) => row.containerStatus.ready,
+    type: BooleanIndicatorType.yesNo,
+    subtle: false,
+    showText: false
+  };
+
+  private iconConfig: TableCellIconComponentConfig<ContainerForTable> = {
+    getIcon: (row: ContainerForTable) => row.isInit ?
+      {
+        icon: 'border_clear',
+        font: '',
+        tooltip: 'Init Container'
+      } : {
+        icon: 'border_outer',
+        font: '',
+        tooltip: 'Container'
+      },
+  };
+
+  public containerDataSource: ITableListDataSource<ContainerForTable>;
+  public columns: ITableColumn<ContainerForTable>[] = [
+    {
+      columnId: 'icon',
+      headerCell: () => '',
+      cellComponent: TableCellIconComponent,
+      cellConfig: this.iconConfig,
+      cellFlex: '0 0 53px',
+    },
+    {
+      columnId: 'name',
+      headerCell: () => 'Container Name',
+      cellDefinition: {
+        valuePath: 'container.name'
+      },
+      cellFlex: '2',
+    },
+    {
+      columnId: 'image',
+      headerCell: () => 'Image',
+      cellDefinition: {
+        valuePath: 'container.image'
+      },
+      cellFlex: '3',
+    },
+    {
+      columnId: 'ready',
+      headerCell: () => 'Ready',
+      cellComponent: TableCellBooleanIndicatorComponent,
+      cellConfig: this.readyBoolConfig,
+      cellFlex: '1',
+    },
+    {
+      columnId: 'status',
+      headerCell: () => 'State',
+      cellDefinition: {
+        getValue: cft => {
+          if (!cft.containerStatus.state) {
+            return 'Unknown';
+          }
+          const entries = Object.entries(cft.containerStatus.state);
+          if (!entries.length) {
+            return 'Unknown';
+          }
+          const sorted = entries.sort((a, b) => {
+            const aStarted = moment(a[1].startedAt);
+            const bStarted = moment(b[1].startedAt);
+
+            return aStarted.isBefore(bStarted) ? -1 :
+              aStarted.isAfter(bStarted) ? 1 : 0;
+
+          });
+          return this.containerStatusToString(sorted[0][0], sorted[0][1]);
+        }
+      },
+      cellFlex: '2'
+    },
+    {
+      columnId: 'restarts',
+      headerCell: () => 'Restarts',
+      cellDefinition: {
+        getValue: cft => cft.containerStatus.restartCount.toString()
+      },
+      cellFlex: '1',
+    },
+    {
+      columnId: 'probes',
+      headerCell: () => 'Probes (L:R)',
+      cellDefinition: {
+        getValue: cft => {
+          if (cft.isInit) {
+            return '';
+          }
+          const container: Container = cft.container as Container;
+          return cft.isInit ? '' : `${container.livenessProbe ? 'on' : 'off'}:${container.readinessProbe ? 'on' : 'off'}`;
+        }
+      },
+      cellFlex: '1',
+    },
+  ];
+
+  private map(row: KubernetesPod): ContainerForTable[] {
+    const containerStatus = row.status.containerStatuses || [];
+    const initContainerStatuses = row.status.initContainerStatuses || [];
+    const containerStatusWithContainers: ContainerForTable[] = [
+      ...containerStatus.map(c => this.createContainerForTable(c, row.spec.containers)),
+      ...initContainerStatuses.map(c => this.createContainerForTable(c, row.spec.initContainers, true))
+    ];
+    return containerStatusWithContainers.sort((a, b) => a.container.name.localeCompare(b.container.name));
+  }
+
+  private createContainerForTable(containerStatus: ContainerStatus, containers: (Container | InitContainer)[], isInit = false):
+    ContainerForTable {
+    const containerForTable: ContainerForTable = {
+      isInit,
+      containerStatus,
+      container: containers.find(c => c.name === containerStatus.name)
+    };
+    return containerForTable;
+  }
+
+  private containerStatusToString(state: string, status: ContainerState): string {
+    const exitCode = status.exitCode ? `:${status.exitCode}` : '';
+    const signal = status.signal ? `:${status.signal}` : '';
+    const reason = status.reason ? ` (${status.reason}${exitCode || signal})` : '';
+    return `${this.titleCase.transform(state)}${reason}`;
+  }
+}

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pod-status/kubernetes-pod-status.component.spec.ts

@@ -9,7 +9,9 @@ describe('KubernetesPodStatusComponent', () => {
 
   beforeEach(async(() => {
     TestBed.configureTestingModule({
-      declarations: [KubernetesPodStatusComponent]
+      declarations: [
+        KubernetesPodStatusComponent
+      ]
     })
       .compileComponents();
   }));

custom-src/frontend/app/custom/kubernetes/list-types/kubernetes-pods/kubernetes-pods-list-config.service.ts

@@ -20,6 +20,7 @@ import {
 import { KubernetesPod } from '../../store/kube.types';
 import { defaultHelmKubeListPageSize } from '../kube-helm-list-types';
 import { createKubeAgeColumn } from '../kube-list.helper';
+import { KubernetesPodContainersComponent } from './kubernetes-pod-containers/kubernetes-pod-containers.component';
 import { KubernetesPodStatusComponent } from './kubernetes-pod-status/kubernetes-pod-status.component';
 import { KubernetesPodsDataSource } from './kubernetes-pods-data-source';
 
@@ -139,6 +140,7 @@ export abstract class BaseKubernetesPodsListConfigService implements IListConfig
     noEntries: 'There are no pods'
   };
   abstract getDataSource: () => IListDataSource<KubernetesPod>;
+  expandComponent = KubernetesPodContainersComponent;
 
   getGlobalActions = () => null;
   getMultiActions = () => [];