hendrik/lens
1
0
Fork 0
mirror of https://github.com/lensapp/lens.git synced 2025-05-20 05:10:56 +00:00
Code Issues Projects Releases Wiki Activity

Fix not displaying any pie charts when missing only some data (#6671)

Browse Source 
Signed-off-by: Sebastian Malton <sebastian@malton.name>

Signed-off-by: Sebastian Malton <sebastian@malton.name>
This commit is contained in:
Sebastian Malton 2022-11-30 04:31:11 -08:00 committed by GitHub
parent b77044a8f9
commit 261aa2935a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 11 additions and 9 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/renderer/components/+cluster/cluster-pie-charts.tsx
View File

@ -29,6 +29,12 @@ function createLabels(rawLabelData: [string, number | undefined][]): string[] {
return rawLabelData.map(([key, value]) => `${key}: ${value?.toFixed(2) || "N/A"}`); return rawLabelData.map(([key, value]) => `${key}: ${value?.toFixed(2) || "N/A"}`);
} }
const checkedBytesToUnits = (value: number | undefined) => (
typeof value === "number"
? bytesToUnits(value)
: "N/A"
);
interface Dependencies { interface Dependencies {
clusterOverviewStore: ClusterOverviewStore; clusterOverviewStore: ClusterOverviewStore;
nodeStore: NodeStore; nodeStore: NodeStore;
@ -59,20 +65,16 @@ const NonInjectedClusterPieCharts = observer(({
if ( if (
typeof cpuCapacity !== "number" || typeof cpuCapacity !== "number" ||
typeof cpuAllocatableCapacity !== "number" || typeof cpuAllocatableCapacity !== "number" ||
typeof cpuLimits !== "number" ||
typeof podCapacity !== "number" || typeof podCapacity !== "number" ||
typeof podAllocatableCapacity !== "number" || typeof podAllocatableCapacity !== "number" ||
typeof memoryAllocatableCapacity !== "number" || typeof memoryAllocatableCapacity !== "number" ||
typeof memoryCapacity !== "number" || typeof memoryCapacity !== "number" ||
typeof memoryLimits !== "number" ||
typeof memoryUsage !== "number" || typeof memoryUsage !== "number" ||
typeof memoryRequests !== "number" typeof memoryRequests !== "number"
) { ) {
return null; return null;
} }
const cpuLimitsOverload = cpuLimits > cpuAllocatableCapacity;
const memoryLimitsOverload = memoryLimits > memoryAllocatableCapacity;
const defaultColor = activeTheme.get().colors.pieChartDefaultColor; const defaultColor = activeTheme.get().colors.pieChartDefaultColor;
const cpuData: PieChartData = { const cpuData: PieChartData = {
@ -104,7 +106,7 @@ const NonInjectedClusterPieCharts = observer(({
{ {
data: [ data: [
cpuLimits, cpuLimits,
cpuLimitsOverload ? 0 : cpuAllocatableCapacity - cpuLimits, Math.max(0, cpuAllocatableCapacity - (cpuLimits ?? cpuAllocatableCapacity)),
], ],
backgroundColor: [ backgroundColor: [
"#3d90ce", "#3d90ce",
@ -151,7 +153,7 @@ const NonInjectedClusterPieCharts = observer(({
{ {
data: [ data: [
memoryLimits, memoryLimits,
memoryLimitsOverload ? 0 : memoryAllocatableCapacity - memoryLimits, Math.max(0, memoryAllocatableCapacity - (memoryLimits ?? memoryAllocatableCapacity)),
], ],
backgroundColor: [ backgroundColor: [
"#3d90ce", "#3d90ce",
@ -164,7 +166,7 @@ const NonInjectedClusterPieCharts = observer(({
labels: [ labels: [
`Usage: ${bytesToUnits(memoryUsage)}`, `Usage: ${bytesToUnits(memoryUsage)}`,
`Requests: ${bytesToUnits(memoryRequests)}`, `Requests: ${bytesToUnits(memoryRequests)}`,
`Limits: ${bytesToUnits(memoryLimits)}`, `Limits: ${checkedBytesToUnits(memoryLimits)}`,
`Allocatable Capacity: ${bytesToUnits(memoryAllocatableCapacity)}`, `Allocatable Capacity: ${bytesToUnits(memoryAllocatableCapacity)}`,
`Capacity: ${bytesToUnits(memoryCapacity)}`, `Capacity: ${bytesToUnits(memoryCapacity)}`,
], ],
@ -208,7 +210,7 @@ const NonInjectedClusterPieCharts = observer(({
defaultColor, defaultColor,
]} ]}
/> />
{cpuLimitsOverload && renderLimitWarning()} {((cpuLimits ?? cpuAllocatableCapacity) > cpuAllocatableCapacity) && renderLimitWarning()}
</div> </div>
<div className={cssNames(styles.chart, "flex column align-center box grow")}> <div className={cssNames(styles.chart, "flex column align-center box grow")}>
<PieChart <PieChart
@ -222,7 +224,7 @@ const NonInjectedClusterPieCharts = observer(({
defaultColor, defaultColor,
]} ]}
/> />
{memoryLimitsOverload && renderLimitWarning()} {((memoryLimits ?? memoryAllocatableCapacity) > memoryAllocatableCapacity) && renderLimitWarning()}
</div> </div>
<div className={cssNames(styles.chart, "flex column align-center box grow")}> <div className={cssNames(styles.chart, "flex column align-center box grow")}>
<PieChart <PieChart