feat: revive "app" and "tier" columns from deprecated kubectl tree view

This PR requires adding an optional metadata attribute to the core Table.Row model

Fixes #6591

Author: starpit

packages/core/src/models/entity.ts

@@ -49,6 +49,7 @@ export interface MetadataNamedResource {
     namespace?: string
     generation?: string
     creationTimestamp?: string
+    labels?: Record<string, string>
   }
 }
 

packages/core/src/webapp/models/table.ts

@@ -18,14 +18,23 @@
 
 import { ReactElement } from 'react'
 import { Breadcrumb } from '../../models/NavResponse'
-import { MetadataBearing, Entity } from '../../models/entity'
+import { MetadataBearing, MetadataNamedResource, Entity } from '../../models/entity'
 
 export class Row {
   attributes?: Cell[]
 
   /** uniquely identifies this row in a given table; if not defined, we will use the name field as the row key */
   rowKey?: string
 
+  /** optional associated metadata for the corresponding resource */
+  object?: Pick<MetadataNamedResource, 'metadata'> & {
+    spec?: {
+      selector?: {
+        matchLabels?: Record<string, string>
+      }
+    }
+  }
+
   /** the key-value pair for the first column */
   key?: string
   name: string

plugins/plugin-client-common/src/components/Content/Table/LivePaginatedTable.tsx

@@ -17,7 +17,7 @@
 import { Table as KuiTable, Row as KuiRow, Watchable } from '@kui-shell/core'
 
 import PaginatedTable, { Props, State } from './PaginatedTable'
-import { kuiHeader2carbonHeader, kuiRow2carbonRow, NamedDataTableRow } from './kui2carbon'
+import { kuiHeaderFromBody, kuiHeader2carbonHeader, kuiRow2carbonRow, NamedDataTableRow } from './kui2carbon'
 
 type LiveProps = Props<KuiTable & Watchable> & { onRender: (hasContent: boolean) => void }
 
@@ -132,6 +132,13 @@ export default class LivePaginatedTable extends PaginatedTable<LiveProps, LiveSt
    *
    */
   private update(newKuiRow: KuiRow, batch = false, justUpdated = true) {
+    if (!this.props.response.header) {
+      const header = kuiHeaderFromBody([newKuiRow])
+      if (header) {
+        this.header(header)
+      }
+    }
+
     const existingRows = this._deferredUpdate || this.state.rows
     const nRowsBefore = existingRows.length
 

plugins/plugin-client-common/src/components/Content/Table/kui2carbon.ts

@@ -23,16 +23,26 @@ export interface NamedDataTableRow extends DataTableRow {
   justUpdated: boolean
 }
 
+export function kuiHeaderFromBody(body: KuiTable['body']): KuiTable['header'] {
+  if (body.length > 0) {
+    const attributes = (body[0].attributes || []).map(({ key, value }) => ({
+      key: key || value,
+      value: key || value
+    }))
+    return { key: body[0].key, name: body[0].name, attributes }
+  }
+}
+
 /** attempt to infer header model from body model */
 function headerFromBody(table: KuiTable) {
   if (table.body.length > 0) {
     const attrs = (table.body[0].attributes || []).map(({ key, value }) => ({
       key: key || value,
       header: key || value
     }))
-    const headers = [{ key: 'NAME', header: 'NAME' }, ...attrs]
+    const headers = [{ key: 'Name', header: 'Name' }, ...attrs]
     table.header = {
-      name: 'NAME',
+      name: 'Name',
       attributes: attrs.map(({ key }) => ({ key, value: key }))
     }
     return headers
@@ -70,12 +80,11 @@ export function kuiRow2carbonRow(headers: DataTableHeader[], justUpdated = false
 
     if (!row.attributes) row.attributes = []
     row.attributes.forEach((attr, cidx) => {
-      const { key, value } = attr
-      const kkey = headers[cidx + 1].key
-      if (!key) {
+      const kkey = attr.key || headers[cidx + 1] ? headers[cidx + 1].key : undefined
+      if (!attr.key && kkey) {
         attr.key = kkey
       }
-      rowData[kkey] = value
+      rowData[kkey] = attr.value
     })
 
     if (!rowData.NAME) {

plugins/plugin-kubectl/src/controller/client/direct/status.ts

@@ -21,7 +21,7 @@ import { Abortable, Arguments, CodedError, Row, Table, Watchable, Watcher, Watch
 import { getTable } from './get'
 import fabricate404Table from './404'
 import URLFormatter, { urlFormatterFor } from './url'
-import { unifyHeaders, unifyRow, unifyRows } from './unify'
+import { unifyRow, unifyRows } from './unify'
 import makeWatchable, { DirectWatcher, SingleKindDirectWatcher } from './watch'
 
 import { Explained } from '../../kubectl/explain'
@@ -113,8 +113,10 @@ class MultiKindWatcher implements Abortable, Watcher {
 
   private myPusher(idx: number): WatchPusher {
     const overrides: Pick<WatchPusher, 'header' | 'update' | 'done'> = {
-      header: (header: Row) => {
-        this.pusher.header(unifyHeaders([header]))
+      header: () => {
+        // instead: have the view infer headers from the body; this
+        // allows for more schema flexibility across rows
+        // this.pusher.header(unifyHeaders([header]))
       },
       update: (row: Row, batch?: boolean, changed?: boolean) => {
         debug('update of unified row', row.rowKey, this.kind[idx].kind, row.attributes[1].value)
@@ -236,7 +238,9 @@ export default async function watchMulti(
       : undefined
 
     // header and body
-    const header = unifyHeaders([].concat(...tables.map(_ => _.table.header)))
+    // re: header, have the view infer headers from the body; this
+    // allows for more schema flexibility across rows
+    const header = undefined // unifyHeaders([].concat(...tables.map(_ => _.table.header)))
     const body = unifyRows(
       [].concat(...tables.map(_ => _.table.body)),
       flatten(

plugins/plugin-kubectl/src/controller/client/direct/unify.ts

@@ -14,7 +14,7 @@
  * limitations under the License.
  */
 
-import { Table, Row } from '@kui-shell/core'
+import { Cell, Row, Table } from '@kui-shell/core'
 import TrafficLight, { toTrafficLight } from '../../../lib/model/traffic-light'
 
 /** Do not i18n! */
@@ -40,11 +40,12 @@ export function rowWith(
   kind: string,
   status: string,
   trafficLight: TrafficLight,
-  originalRow?: Row
+  originalRow?: Row,
+  extraAttrs: Cell[] = []
 ): Row {
   const overlay: Row = {
     name,
-    attributes: [
+    attributes: extraAttrs.concat([
       {
         key: Kind,
         value: kind
@@ -55,7 +56,7 @@ export function rowWith(
         tag: 'badge',
         css: trafficLight
       }
-    ]
+    ])
   }
 
   if (originalRow) {
@@ -70,14 +71,43 @@ export function unifyHeaders(headers: Table['header'][]): Table['header'] {
   return standardStatusHeader
 }
 
+function getFromLabel(object: Row['object'], field: string): string {
+  return object.metadata.labels[field]
+}
+
+function getFromSelector(object: Row['object'], field: string) {
+  if (object.spec && object.spec.selector && object.spec.selector.matchLabels) {
+    return object.spec.selector.matchLabels[field]
+  }
+}
+
 export function unifyRow(row: Row, kind: string): Row {
   const name = row.name
 
   const badgeColumnIdx = row.attributes.findIndex(_ => _.tag === 'badge')
   const status = badgeColumnIdx >= 0 ? row.attributes[badgeColumnIdx].value : 'Unknown'
   const trafficLight = badgeColumnIdx >= 0 ? toTrafficLight(row.attributes[badgeColumnIdx].css) : TrafficLight.Gray
 
-  return rowWith(name, kind, status, trafficLight, row)
+  const extraAttrs: Cell[] = []
+  if (row.object) {
+    const tier =
+      getFromLabel(row.object, 'tier') ||
+      getFromLabel(row.object, 'app.kubernetes.io/component') ||
+      getFromSelector(row.object, 'tier')
+    if (tier) {
+      extraAttrs.push({ key: 'Tier', value: tier })
+    }
+
+    const app =
+      getFromLabel(row.object, 'app') ||
+      getFromLabel(row.object, 'app.kubernetes.io/name') ||
+      getFromSelector(row.object, 'app')
+    if (app) {
+      extraAttrs.push({ key: 'Application', value: app })
+    }
+  }
+
+  return rowWith(name, kind, status, trafficLight, row, extraAttrs)
 }
 
 export function unifyRows(rows: Table['body'], kinds: string | string[]): Table['body'] {

plugins/plugin-kubectl/src/lib/view/formatTable.ts

@@ -700,6 +700,7 @@ export async function toKuiTable(
     const onclick = onclickFor(row, name)
 
     return {
+      object: row.object,
       key: forAllNamespaces ? row.object.metadata.namespace : columnDefinitions[0].name,
       rowKey,
       name: forAllNamespaces ? row.object.metadata.namespace : name,

plugins/plugin-kubectl/tests/data/k8s/application/guestbook/frontend-deployment.yaml

@@ -4,6 +4,7 @@ metadata:
   name: frontend
   labels:
     app: guestbook
+    tier: frontend
 spec:
   selector:
     matchLabels:

plugins/plugin-kubectl/tests/data/k8s/application/guestbook/redis-master-deployment.yaml

@@ -4,6 +4,7 @@ metadata:
   name: redis-master
   labels:
     app: redis
+    tier: backend
 spec:
   selector:
     matchLabels:

plugins/plugin-kubectl/tests/data/k8s/application/guestbook/redis-slave-deployment.yaml

@@ -4,6 +4,7 @@ metadata:
   name: redis-slave
   labels:
     app: redis
+    tier: backend
 spec:
   selector:
     matchLabels: