mirror of https://github.com/portainer/portainer
feat(ui): improve Kubernetes node view [r8s-47] (#84)
parent
81322664ea
commit
8ed7cd80cb
|
@ -0,0 +1,53 @@
|
||||||
|
import { NodeCondition } from 'kubernetes-types/core/v1';
|
||||||
|
import { CellContext } from '@tanstack/react-table';
|
||||||
|
|
||||||
|
import { Badge } from '@@/Badge';
|
||||||
|
import { Tooltip } from '@@/Tip/Tooltip';
|
||||||
|
|
||||||
|
import { NodeRowData } from '../types';
|
||||||
|
|
||||||
|
import { columnHelper } from './helper';
|
||||||
|
|
||||||
|
export const conditions = columnHelper.accessor((row) => getConditions(row), {
|
||||||
|
header: () => (
|
||||||
|
<>
|
||||||
|
Conditions
|
||||||
|
<Tooltip
|
||||||
|
position="top"
|
||||||
|
message="Green indicates the node is healthy. Orange indicates the node is experiencing MemoryPressure, DiskPressure, or PIDPressure."
|
||||||
|
/>
|
||||||
|
</>
|
||||||
|
),
|
||||||
|
id: 'conditions',
|
||||||
|
cell: ConditionsCell,
|
||||||
|
});
|
||||||
|
|
||||||
|
function ConditionsCell({
|
||||||
|
row: { original: node },
|
||||||
|
}: CellContext<NodeRowData, NodeCondition[]>) {
|
||||||
|
const conditions = getConditions(node);
|
||||||
|
|
||||||
|
return (
|
||||||
|
<div className="flex flex-wrap gap-1">
|
||||||
|
{conditions.length > 0
|
||||||
|
? conditions.map((condition) => (
|
||||||
|
<Badge
|
||||||
|
key={condition.type?.toString()}
|
||||||
|
type={condition.status === 'True' ? 'warn' : 'success'}
|
||||||
|
>
|
||||||
|
{condition.type}
|
||||||
|
</Badge>
|
||||||
|
))
|
||||||
|
: '-'}
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
function getConditions(node: NodeRowData) {
|
||||||
|
return (
|
||||||
|
// exclude the Ready condition as it is already being utilised in the Status column
|
||||||
|
node.status?.conditions?.filter(
|
||||||
|
(condition) => condition.type !== 'Ready'
|
||||||
|
) ?? []
|
||||||
|
);
|
||||||
|
}
|
|
@ -1,6 +1,7 @@
|
||||||
import { name } from './name';
|
import { name } from './name';
|
||||||
import { role } from './role';
|
import { role } from './role';
|
||||||
import { status } from './status';
|
import { status } from './status';
|
||||||
|
import { conditions } from './conditions';
|
||||||
import { cpu } from './cpu';
|
import { cpu } from './cpu';
|
||||||
import { memory } from './memory';
|
import { memory } from './memory';
|
||||||
import { version } from './version';
|
import { version } from './version';
|
||||||
|
@ -9,13 +10,14 @@ import { getActions } from './actions';
|
||||||
|
|
||||||
export function getColumns(isServerMetricsEnabled: boolean) {
|
export function getColumns(isServerMetricsEnabled: boolean) {
|
||||||
if (!isServerMetricsEnabled) {
|
if (!isServerMetricsEnabled) {
|
||||||
return [name, role, status, cpu, memory, version, ip];
|
return [name, role, status, conditions, cpu, memory, version, ip];
|
||||||
}
|
}
|
||||||
|
|
||||||
return [
|
return [
|
||||||
name,
|
name,
|
||||||
role,
|
role,
|
||||||
status,
|
status,
|
||||||
|
conditions,
|
||||||
cpu,
|
cpu,
|
||||||
memory,
|
memory,
|
||||||
version,
|
version,
|
||||||
|
|
Loading…
Reference in New Issue