fix container net chart totals when filter is active

This commit is contained in:
henrygd
2026-01-31 18:51:51 -05:00
parent db007176fd
commit 201d16af05

View File

@@ -38,6 +38,23 @@ export default memo(function ContainerChart({
const isNetChart = chartType === ChartType.Network const isNetChart = chartType === ChartType.Network
// Filter with set lookup
const filteredKeys = useMemo(() => {
if (!filter) {
return new Set<string>()
}
const filterTerms = filter
.toLowerCase()
.split(" ")
.filter((term) => term.length > 0)
return new Set(
Object.keys(chartConfig).filter((key) => {
const keyLower = key.toLowerCase()
return !filterTerms.some((term) => keyLower.includes(term))
})
)
}, [chartConfig, filter])
// biome-ignore lint/correctness/useExhaustiveDependencies: not necessary // biome-ignore lint/correctness/useExhaustiveDependencies: not necessary
const { toolTipFormatter, dataFunction, tickFormatter } = useMemo(() => { const { toolTipFormatter, dataFunction, tickFormatter } = useMemo(() => {
const obj = {} as { const obj = {} as {
@@ -85,10 +102,14 @@ export default memo(function ContainerChart({
let totalSent = 0 let totalSent = 0
let totalRecv = 0 let totalRecv = 0
const payloadData = item?.payload && typeof item.payload === "object" ? item.payload : {} const payloadData = item?.payload && typeof item.payload === "object" ? item.payload : {}
for (const value of Object.values(payloadData)) { for (const [containerKey, value] of Object.entries(payloadData)) {
if (!value || typeof value !== "object") { if (!value || typeof value !== "object") {
continue continue
} }
// Skip filtered out containers
if (filteredKeys.has(containerKey)) {
continue
}
const [sent, recv] = getRxTxBytes(value as { b?: [number, number]; ns?: number; nr?: number }) const [sent, recv] = getRxTxBytes(value as { b?: [number, number]; ns?: number; nr?: number })
totalSent += sent totalSent += sent
totalRecv += recv totalRecv += recv
@@ -124,24 +145,7 @@ export default memo(function ContainerChart({
obj.dataFunction = (key: string, data: any) => data[key]?.[dataKey] ?? null obj.dataFunction = (key: string, data: any) => data[key]?.[dataKey] ?? null
} }
return obj return obj
}, []) }, [filteredKeys])
// Filter with set lookup
const filteredKeys = useMemo(() => {
if (!filter) {
return new Set<string>()
}
const filterTerms = filter
.toLowerCase()
.split(" ")
.filter((term) => term.length > 0)
return new Set(
Object.keys(chartConfig).filter((key) => {
const keyLower = key.toLowerCase()
return !filterTerms.some((term) => keyLower.includes(term))
})
)
}, [chartConfig, filter])
// console.log('rendered at', new Date()) // console.log('rendered at', new Date())