From 1251aff8230cd3739a2828c9af16738c3263a80a Mon Sep 17 00:00:00 2001
From: Marek Libra <mlibra@redhat.com>
Date: Thu, 4 Apr 2019 14:08:35 +0200
Subject: [PATCH] ClusterOverview: Improve prometheus query for CPU Capacity

and fix Capacity tests.
---
 .../ClusterOverview/Capacity/Capacity.js      | 11 ++++-----
 .../Capacity/fixtures/Capacity.fixture.js     |  3 +--
 .../tests/__snapshots__/Capacity.test.js.snap | 24 ++++---------------
 src/utils/utils.js                            |  1 +
 4 files changed, 10 insertions(+), 29 deletions(-)

diff --git a/src/components/ClusterOverview/Capacity/Capacity.js b/src/components/ClusterOverview/Capacity/Capacity.js
index b8f91045d..896f61ebd 100644
--- a/src/components/ClusterOverview/Capacity/Capacity.js
+++ b/src/components/ClusterOverview/Capacity/Capacity.js
@@ -11,12 +11,11 @@ import {
 } from '../../Dashboard/DashboardCard';
 import { ClusterOverviewContext } from '../ClusterOverviewContext';
 import { CapacityItem } from '../../Dashboard/Capacity/CapacityItem';
-import { formatBytes, formatCores, formatNetTraffic } from '../../../utils';
+import { formatBytes, formatPercents, formatNetTraffic } from '../../../utils';
 import { getCapacityStats } from '../../../selectors';
 import { CapacityBody } from '../../Dashboard/Capacity/CapacityBody';
 
 export const Capacity = ({
-  cpuTotal,
   cpuUsed,
   memoryTotal,
   memoryUsed,
@@ -36,10 +35,10 @@ export const Capacity = ({
           id="cpu"
           title="CPU"
           used={getCapacityStats(cpuUsed)}
-          total={getCapacityStats(cpuTotal)}
-          formatValue={formatCores}
+          total={100}
+          formatValue={formatPercents}
           LoadingComponent={LoadingComponent}
-          isLoading={!(cpuUsed && cpuTotal)}
+          isLoading={!cpuUsed}
         />
         <CapacityItem
           id="memory"
@@ -74,7 +73,6 @@ export const Capacity = ({
 );
 
 Capacity.defaultProps = {
-  cpuTotal: null,
   cpuUsed: null,
   memoryTotal: null,
   memoryUsed: null,
@@ -86,7 +84,6 @@ Capacity.defaultProps = {
 };
 
 Capacity.propTypes = {
-  cpuTotal: PropTypes.object,
   cpuUsed: PropTypes.object,
   memoryTotal: PropTypes.object,
   memoryUsed: PropTypes.object,
diff --git a/src/components/ClusterOverview/Capacity/fixtures/Capacity.fixture.js b/src/components/ClusterOverview/Capacity/fixtures/Capacity.fixture.js
index bb713cd2b..355800a0c 100644
--- a/src/components/ClusterOverview/Capacity/fixtures/Capacity.fixture.js
+++ b/src/components/ClusterOverview/Capacity/fixtures/Capacity.fixture.js
@@ -11,7 +11,6 @@ const getPromResponse = value => ({
 });
 
 export const capacityStats = {
-  cpuTotal: getPromResponse(10),
   cpuUsed: getPromResponse(5),
   memoryTotal: getPromResponse(10),
   memoryUsed: getPromResponse(5),
@@ -23,5 +22,5 @@ export const capacityStats = {
 
 export default {
   component: Capacity,
-  props: { capacityStats },
+  props: capacityStats,
 };
diff --git a/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap b/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap
index 31b001ae5..62266829c 100644
--- a/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap
+++ b/src/components/ClusterOverview/Capacity/tests/__snapshots__/Capacity.test.js.snap
@@ -28,11 +28,7 @@ exports[`<Capacity /> renders correctly 1`] = `
           CPU
         </h2>
         <h6>
-          <div>
-            <div
-              class="spinner spinner-md blank-slate-pf-icon"
-            />
-          </div>
+          95 % available out of 100 %
         </h6>
         <div>
           <div
@@ -49,11 +45,7 @@ exports[`<Capacity /> renders correctly 1`] = `
           Memory
         </h2>
         <h6>
-          <div>
-            <div
-              class="spinner spinner-md blank-slate-pf-icon"
-            />
-          </div>
+          5 B available out of 10 B
         </h6>
         <div>
           <div
@@ -70,11 +62,7 @@ exports[`<Capacity /> renders correctly 1`] = `
           Storage
         </h2>
         <h6>
-          <div>
-            <div
-              class="spinner spinner-md blank-slate-pf-icon"
-            />
-          </div>
+          5 B available out of 10 B
         </h6>
         <div>
           <div
@@ -91,11 +79,7 @@ exports[`<Capacity /> renders correctly 1`] = `
           Network
         </h2>
         <h6>
-          <div>
-            <div
-              class="spinner spinner-md blank-slate-pf-icon"
-            />
-          </div>
+          5 Bps available out of 10 Bps
         </h6>
         <div>
           <div
diff --git a/src/utils/utils.js b/src/utils/utils.js
index e302cfc20..6eeb5446d 100644
--- a/src/utils/utils.js
+++ b/src/utils/utils.js
@@ -97,6 +97,7 @@ export const formatBytes = (bytes, unit, fixed = 2) => {
 };
 
 export const formatCores = cores => ({ value: cores, unit: 'cores' });
+export const formatPercents = percents => ({ value: percents, unit: '%' });
 
 export const formatNetTraffic = (bytesPerSecond, preferredUnit, fixed = 2) => {
   preferredUnit =