diff --git a/ui/src/pages/ThreatFeed.tsx b/ui/src/pages/ThreatFeed.tsx index c184540..5a6538e 100644 --- a/ui/src/pages/ThreatFeed.tsx +++ b/ui/src/pages/ThreatFeed.tsx @@ -47,6 +47,77 @@ const NODES = [ { name: 'k3s-worker2', ip: '192.168.139.45' }, ] +type PodStatus = 'threat' | 'risk' | 'safe' | 'isolated' +type NodeStatus = 'threat' | 'risk' | 'safe' + +function PodStatusIcon({ status }: { status: PodStatus }) { + if (status === 'threat') { + return ( + + ) + } + + if (status === 'risk') { + return ( + + ) + } + + if (status === 'isolated') { + return ( + + ) + } + + return ( + + ) +} + +function NodeStatusIcon({ status }: { status: NodeStatus }) { + if (status === 'threat') { + return ( + + ) + } + + if (status === 'risk') { + return ( + + ) + } + + return ( + + ) +} + function ImpactDiagram({ incident }: { incident: any }) { const [scanPos, setScanPos] = React.useState(0) const [barsAnimated, setBarsAnimated] = React.useState(false) @@ -102,7 +173,9 @@ function ImpactDiagram({ incident }: { incident: any }) { return (
-
+
+ +
{node.name} {nodeLabels[status]} {node.ip} @@ -110,30 +183,30 @@ function ImpactDiagram({ incident }: { incident: any }) {
{isThreat && threatPod && ( - + {threatPod} {threatNs && {threatNs}} )} {isThreat && ( <> - isolated api-gateway - backend-svc - falco-agent + isolated api-gateway + backend-svc + falco-agent )} {status === 'risk' && ( <> - postgres-0 - auth-service - prometheus + postgres-0 + auth-service + prometheus )} {status === 'safe' && ( <> - argus-agent - kyverno - cilium + argus-agent + kyverno + cilium )}