diff --git a/frontend/public/components/graphs/gauge.jsx b/frontend/public/components/graphs/gauge.jsx index 1c083a9e9cc7..b5b75afac3fe 100644 --- a/frontend/public/components/graphs/gauge.jsx +++ b/frontend/public/components/graphs/gauge.jsx @@ -175,8 +175,15 @@ class Gauge_ extends BaseGraph { } else { data = Math.round(data); } - this.layout.annotations[0].text = `${data}%`; - this.layout.annotations[0].font.color = fontColor; + + if (this.props.centerText){ + this.layout.annotations[0].text = this.props.centerText; + this.layout.annotations[0].font.size = 16; + } else { + this.layout.annotations[0].text = `${data}%`; + this.layout.annotations[0].font.color = fontColor; + } + relayout(this.node, this.layout); } } diff --git a/frontend/public/components/resource-quota.jsx b/frontend/public/components/resource-quota.jsx index ea6ab35f26d6..d46152ced299 100644 --- a/frontend/public/components/resource-quota.jsx +++ b/frontend/public/components/resource-quota.jsx @@ -15,7 +15,8 @@ const { common } = Kebab.factory; const menuActions = [...common]; const quotaKind = quota => quota.metadata.namespace ? referenceForModel(ResourceQuotaModel) : referenceForModel(ClusterResourceQuotaModel); -const gaugeChartThresholds = {warn: 90,error: 101}; +const gaugeChartThresholds = {warn: 90, error: 101}; +const gaugeChartNoThresholds = {warn: 100, error: 100}; const quotaScopes = Object.freeze({ 'Terminating': {label: 'Terminating', description: 'Affects pods that have an active deadline. These pods usually include builds, deployers, and jobs.'}, @@ -86,26 +87,46 @@ const ResourceUsageRow = ({quota, resourceType}) => { export const QuotaGaugeCharts = ({quota, resourceTypes}) => { const resourceTypesSet = new Set(resourceTypes); return
- {(resourceTypesSet.has('requests.cpu') || resourceTypesSet.has('cpu')) && -
- -
} - {resourceTypesSet.has('limits.cpu') && -
- -
} - {(resourceTypesSet.has('requests.memory') || resourceTypesSet.has('memory')) && -
- -
} - {resourceTypesSet.has('limits.memory') && -
- -
} + {(resourceTypesSet.has('requests.cpu') || resourceTypesSet.has('cpu')) ? +
+ +
+ : +
+ +
+ } + {resourceTypesSet.has('limits.cpu') ? +
+ +
+ : +
+ +
+ } + {(resourceTypesSet.has('requests.memory') || resourceTypesSet.has('memory')) ? +
+ +
+ : +
+ +
+ } + {resourceTypesSet.has('limits.memory') ? +
+ +
+ : +
+ +
+ }
; };