diff --git a/src/extensions/registries/kube-object-status-registry.ts b/src/extensions/registries/kube-object-status-registry.ts index 5f7aab8d5d..3ca20f569a 100644 --- a/src/extensions/registries/kube-object-status-registry.ts +++ b/src/extensions/registries/kube-object-status-registry.ts @@ -9,9 +9,17 @@ export interface KubeObjectStatusRegistration { export class KubeObjectStatusRegistry extends BaseRegistry { getItemsForKind(kind: string, apiVersion: string) { - return this.getItems().filter((item) => { - return item.kind === kind && item.apiVersions.includes(apiVersion); - }); + return this.getItems() + .filter((item) => ( + item.kind === kind + && item.apiVersions.includes(apiVersion) + )); + } + + getItemsForObject(src: KubeObject) { + return this.getItemsForKind(src.kind, src.apiVersion) + .map(item => item.resolve(src)) + .filter(Boolean); } } diff --git a/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx b/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx index 386255d1eb..49748c605f 100644 --- a/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx +++ b/src/renderer/components/kube-object-status-icon/kube-object-status-icon.tsx @@ -2,105 +2,125 @@ import "./kube-object-status-icon.scss"; import React from "react"; import { Icon } from "../icon"; -import { KubeObject } from "../../api/kube-object"; import { cssNames, formatDuration } from "../../utils"; -import { KubeObjectStatusRegistration, kubeObjectStatusRegistry } from "../../../extensions/registries/kube-object-status-registry"; -import { KubeObjectStatus, KubeObjectStatusLevel } from "../../..//extensions/renderer-api/k8s-api"; -import { computed } from "mobx"; +import { KubeObject, KubeObjectStatus, KubeObjectStatusLevel } from "../../..//extensions/renderer-api/k8s-api"; +import { kubeObjectStatusRegistry } from "../../../extensions/registries"; -interface Props { +interface BaseProps { + statuses?: KubeObjectStatus[]; + object?: KubeObject; +} + +interface StatusProps extends BaseProps { + statuses: KubeObjectStatus[]; + object?: undefined; +} + +interface ObjectProps extends BaseProps { + statuses?: undefined; object: KubeObject; } -export class KubeObjectStatusIcon extends React.Component { - @computed get objectStatuses() { - const { object } = this.props; - const registrations = kubeObjectStatusRegistry.getItemsForKind(object.kind, object.apiVersion); - - return registrations.map((item: KubeObjectStatusRegistration) => { return item.resolve(object); }).filter((item: KubeObjectStatus) => !!item); +function statusClassName(level: number): string { + switch (level) { + case KubeObjectStatusLevel.INFO: + return "info"; + case KubeObjectStatusLevel.WARNING: + return "warning"; + case KubeObjectStatusLevel.CRITICAL: + return "error"; } +} - statusClassName(level: number): string { - switch (level) { - case KubeObjectStatusLevel.INFO: - return "info"; - case KubeObjectStatusLevel.WARNING: - return "warning"; - case KubeObjectStatusLevel.CRITICAL: - return "error"; - default: - return ""; - } +function statusTitle(level: KubeObjectStatusLevel): string { + switch (level) { + case KubeObjectStatusLevel.INFO: + return "Info"; + case KubeObjectStatusLevel.WARNING: + return "Warning"; + case KubeObjectStatusLevel.CRITICAL: + return "Critical"; } +} - statusTitle(level: number): string { - switch (level) { - case KubeObjectStatusLevel.INFO: - return "Info"; - case KubeObjectStatusLevel.WARNING: - return "Warning"; - case KubeObjectStatusLevel.CRITICAL: - return "Critical"; - default: - return ""; - } - } +function getAge(timestamp: string) { + return timestamp + ? formatDuration(Date.now() - new Date(timestamp).getTime(), true) + : ""; +} - getAge(timestamp: string) { - if (!timestamp) return ""; - const diff = Date.now() - new Date(timestamp).getTime(); +interface SplitStatusesByLevel { + maxLevel: string, + criticals: KubeObjectStatus[]; + warnings: KubeObjectStatus[]; + infos: KubeObjectStatus[]; +} - return formatDuration(diff, true); - } +/** + * This fuction returns the class level for corresponding to the highest status level + * and the statuses split by their levels. + * @param src a list of status items + */ +function splitByLevel(src: KubeObjectStatus[]): SplitStatusesByLevel { + const parts = new Map(Object.values(KubeObjectStatusLevel).map(v => [v, []])); + src.forEach(status => parts.get(status.level).push(status)); + + const criticals = parts.get(KubeObjectStatusLevel.CRITICAL); + const warnings = parts.get(KubeObjectStatusLevel.WARNING); + const infos = parts.get(KubeObjectStatusLevel.INFO); + const maxLevel = statusClassName(criticals[0]?.level ?? warnings[0]?.level ?? infos[0].level); + + return { maxLevel, criticals, warnings, infos }; +} + +export class KubeObjectStatusIcon extends React.Component { renderStatuses(statuses: KubeObjectStatus[], level: number) { const filteredStatuses = statuses.filter((item) => item.level == level); return filteredStatuses.length > 0 && ( -
+
- {this.statusTitle(level)} + {statusTitle(level)} - { filteredStatuses.map((status, index) =>{ - return ( + { + filteredStatuses.map((status, index) => (
- - {status.text} · { this.getAge(status.timestamp) } + - {status.text} · {getAge(status.timestamp)}
- ); - })} + )) + }
); } + resolveStatusesFromProps() { + if (this.props.statuses) { + return this.props.statuses; + } + + return kubeObjectStatusRegistry.getItemsForObject(this.props.object); + } + render() { - const { objectStatuses} = this; + const statuses = this.resolveStatusesFromProps(); - if (!objectStatuses.length) return null; + if (statuses.length === 0) { + return null; + } - const sortedStatuses = objectStatuses.sort((a: KubeObjectStatus, b: KubeObjectStatus) => { - if (a.level < b.level ) { - return 1; - } - - if (a.level > b.level ) { - return -1; - } - - return 0; - }); - - const level = this.statusClassName(sortedStatuses[0].level); + const { maxLevel, criticals, warnings, infos } = splitByLevel(statuses); return ( - {this.renderStatuses(sortedStatuses, KubeObjectStatusLevel.CRITICAL)} - {this.renderStatuses(sortedStatuses, KubeObjectStatusLevel.WARNING)} - {this.renderStatuses(sortedStatuses, KubeObjectStatusLevel.INFO)} + {this.renderStatuses(criticals, KubeObjectStatusLevel.CRITICAL)} + {this.renderStatuses(warnings, KubeObjectStatusLevel.WARNING)} + {this.renderStatuses(infos, KubeObjectStatusLevel.INFO)}
) }} diff --git a/src/renderer/components/kube-object/kube-object-meta.tsx b/src/renderer/components/kube-object/kube-object-meta.tsx index 3403a6a48e..535500855a 100644 --- a/src/renderer/components/kube-object/kube-object-meta.tsx +++ b/src/renderer/components/kube-object/kube-object-meta.tsx @@ -5,6 +5,7 @@ import { lookupApiLink } from "../../api/kube-api"; import { Link } from "react-router-dom"; import { KubeObjectStatusIcon } from "../kube-object-status-icon"; import { getDetailsUrl } from "./kube-object-details"; +import { kubeObjectStatusRegistry } from "../../../extensions/registries"; export interface KubeObjectMetaProps { object: KubeObject; @@ -22,10 +23,21 @@ export class KubeObjectMeta extends React.Component { return hideFields.includes(field); } + renderObjectName() { + const { object } = this.props; + const statuses = kubeObjectStatusRegistry.getItemsForObject(object); + + if (statuses.length === 0) { + return object.getName(); + } + + return <>{object.getName()} ; + } + render() { - const object = this.props.object; + const { object } = this.props; const { - getName, getNs, getLabels, getResourceVersion, selfLink, + getNs, getLabels, getResourceVersion, selfLink, getAnnotations, getFinalizers, getId, getAge, metadata: { creationTimestamp }, } = object; @@ -38,7 +50,7 @@ export class KubeObjectMeta extends React.Component { {getAge(true, false)} ago ({creationTimestamp})