soo-rnd
/
infra-report
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add Istio card to SummaryCards
CI/CD / build-and-push (push) Successful in 1m29s Details

This commit is contained in:
Cloud User 2026-03-16 13:24:53 +09:00
parent 82635e0335
commit a76af584cb
2 changed files with 17 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/app/page.tsx
View File

@ -121,6 +121,7 @@ export default function Home() {
memory={data.metrics.memory} memory={data.metrics.memory}
disk={data.metrics.disk} disk={data.metrics.disk}
ingress={data.metrics.ingress} ingress={data.metrics.ingress}
istio={data.metrics.istio}
/> />
</ErrorBoundary> </ErrorBoundary>

22
src/components/report/SummaryCards.tsx
View File

@ -8,6 +8,7 @@ interface SummaryCardsProps {
memory: MetricInstance[]; memory: MetricInstance[];
disk: MetricInstance[]; disk: MetricInstance[];
ingress: NetworkMetrics; ingress: NetworkMetrics;
istio: NetworkMetrics;
} }
interface CardData { interface CardData {
@ -26,13 +27,15 @@ function getClusterStats(instances: MetricInstance[]): { avg: number; max: numbe
return { avg, max, min }; return { avg, max, min };
} }
export default function SummaryCards({ cpu, memory, disk, ingress }: SummaryCardsProps) { export default function SummaryCards({ cpu, memory, disk, ingress, istio }: SummaryCardsProps) {
const cpuStats = getClusterStats(cpu); const cpuStats = getClusterStats(cpu);
const memStats = getClusterStats(memory); const memStats = getClusterStats(memory);
const diskStats = getClusterStats(disk); const diskStats = getClusterStats(disk);
const netRxAvg = ingress.receive.reduce((sum, i) => sum + i.stats.avg, 0); const ingressRxAvg = ingress.receive.reduce((sum, i) => sum + i.stats.avg, 0);
const netTxAvg = ingress.transmit.reduce((sum, i) => sum + i.stats.avg, 0); const ingressTxAvg = ingress.transmit.reduce((sum, i) => sum + i.stats.avg, 0);
const istioRxAvg = istio.receive.reduce((sum, i) => sum + i.stats.avg, 0);
const istioTxAvg = istio.transmit.reduce((sum, i) => sum + i.stats.avg, 0);
const cards: CardData[] = [ const cards: CardData[] = [
{ {
@ -58,15 +61,22 @@ export default function SummaryCards({ cpu, memory, disk, ingress }: SummaryCard
}, },
{ {
label: 'Ingress', label: 'Ingress',
avg: `RX ${formatBytesPerSec(netRxAvg)}`, avg: `RX ${formatBytesPerSec(ingressRxAvg)}`,
max: `TX ${formatBytesPerSec(netTxAvg)}`, max: `TX ${formatBytesPerSec(ingressTxAvg)}`,
min: '', min: '',
color: 'border-blue-500', color: 'border-blue-500',
}, },
{
label: 'Istio',
avg: `RX ${formatBytesPerSec(istioRxAvg)}`,
max: `TX ${formatBytesPerSec(istioTxAvg)}`,
min: '',
color: 'border-purple-500',
},
]; ];
return ( return (
<div className="grid grid-cols-2 lg:grid-cols-4 gap-4"> <div className="grid grid-cols-2 lg:grid-cols-5 gap-4">
{cards.map((card) => ( {cards.map((card) => (
<div key={card.label} className={`bg-white rounded-lg shadow p-4 border-l-4 ${card.color}`}> <div key={card.label} className={`bg-white rounded-lg shadow p-4 border-l-4 ${card.color}`}>
<h3 className="text-sm font-medium text-gray-500">{card.label}</h3> <h3 className="text-sm font-medium text-gray-500">{card.label}</h3>