Refactor TopConsumers and add Workload and Infrastructure metrics #289

rawagner · 2019-03-25T12:18:39Z

No description provided.

coveralls · 2019-03-25T12:28:59Z

Pull Request Test Coverage Report for Build 1055

46 of 65 (70.77%) changed or added relevant lines in 8 files are covered.
1 unchanged line in 1 file lost coverage.
Overall coverage decreased (-0.3%) to 87.321%

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
src/components/Dashboard/TopConsumers/ConsumersResults.js	8	9	88.89%
src/components/ClusterOverview/TopConsumers/utils.js	3	5	60.0%
src/components/ClusterOverview/TopConsumers/TopConsumers.js	10	26	38.46%

Files with Coverage Reduction	New Missed Lines	%
src/selectors/prometheus/selectors.js	1	87.5%

Totals
Change from base Build 1052:	-0.3%
Covered Lines:	3133
Relevant Lines:	3440

💛 - Coveralls

coveralls · 2019-03-25T12:28:59Z

Pull Request Test Coverage Report for Build 890

33 of 35 (94.29%) changed or added relevant lines in 2 files are covered.
1 unchanged line in 1 file lost coverage.
Overall coverage increased (+0.03%) to 87.232%

Changes Missing Coverage	Covered Lines	Changed/Added Lines	%
src/components/ClusterOverview/TopConsumers/ClusterTopConsumers.js	16	17	94.12%
src/components/ClusterOverview/TopConsumers/TopConsumers.js	17	18	94.44%

Files with Coverage Reduction	New Missed Lines	%
src/components/ClusterOverview/TopConsumers/TopConsumers.js	1	86.11%

Totals
Change from base Build 875:	0.03%
Covered Lines:	2857
Relevant Lines:	3135

💛 - Coveralls

sass/components/ClusterOverview/consumers.scss

atiratree · 2019-03-26T12:41:44Z

src/components/ClusterOverview/TopConsumers/ClusterTopConsumers.js

+  return `${bytes.value} ${bytes.unit}`;
+};
+
+const getConsumers = (kind, results, nameLabel, formatLabel) => {


maybe this would better fit to selectors

moved to selectors/prometheus/selectors

atiratree · 2019-03-26T12:56:22Z

src/components/ClusterOverview/TopConsumers/TopConsumers.js

+};
+
+const getConsumers = metric => {
+  const max = Math.max(...metric.consumers.map(c => c.usage));


now value will be always relative to the highest consumers, which I don't think is very useful.

after discussion with @jelkosz this is what we want. The first consumer bar is 100% and others are relative to the first one.

I talked to @jelkosz and we concluded that it would be good to include some icon with a popover that would explain what is happening. E.g. something something, The value xy is relative to the current higest value (100% bar). It could also include something about the query.

created a followup #313 - I will ask UXD for help

atiratree · 2019-03-29T10:30:54Z

sass/components/ClusterOverview/consumers.scss

@@ -1,10 +1,51 @@
-.kubevirt-consumers__bar .progress {
+.kubevirt-consumers__bar {
+  height: 20px;


the em units are preferable in other places as well. We should probably convert the whole dashboard to be consistent with this.

rawagner · 2019-04-05T08:41:38Z

@suomiy @mareklibra can you please review ?

atiratree · 2019-04-05T11:02:25Z

src/components/ClusterOverview/TopConsumers/TopConsumers.js

+        </DashboardCardHeader>
+        <DashboardCardBody>
+          <ConsumersFilter>
+            {getFormElement(typeDropdown)}


would be maybe good to add some margin between them

atiratree · 2019-04-05T11:05:49Z

src/components/ClusterOverview/TopConsumers/TopConsumers.js

+      <DashboardCard>
+        <DashboardCardHeader>
+          <DashboardCardTitle>Top Consumers</DashboardCardTitle>
+          <DashboardCardTitleHelp>help for top consumers</DashboardCardTitleHelp>


re: #313. For now all the metrics behave the same, so we could add the explanation text here until #313 is resolved.

Added Consumption bar is relative to biggest consumer which is always 100% Not sure if that is good enough

atiratree · 2019-04-05T11:17:43Z

src/components/ClusterOverview/TopConsumers/TopConsumers.js

-    filter !== 'All' ? metrics[metricKey].consumers.filter(c => c.kind === filter) : metrics[metricKey].consumers;
-  const max = Math.max(...filteredConsumers.map(c => c.usage));
-  return filteredConsumers
+const getMetricConsumers = ({ consumers }) => {


this should probably go to selectors or some util class (Dashboard/TopConsumers/utils or some other utils?)

getMetricConsumers moved to Dashboard/TopConsumers/utils. The other two methods were moved to ClusterOverview/TopConsumers/utils

atiratree · 2019-04-05T14:25:46Z

sass/components/ClusterOverview/consumers.scss

-  padding-bottom: 10px;
-  border-bottom: 1px solid #d1d1d1;
+.kubevirt-consumers__dropdown-filter {
+  width: 49%;


I think margin should be more descriptive/generic than width

Im using Columns + padding as I had some issues on firefox when not using width.

src/components/ClusterOverview/TopConsumers/strings.js

src/components/ClusterOverview/TopConsumers/utils.js

- add Loading state - add Workload and Infrastructure metrics

kubevirt-bot added do-not-merge/work-in-progress size/XXL labels Mar 25, 2019

rawagner mentioned this pull request Mar 25, 2019

Connect TopConsumers to prometheus kubevirt/web-ui#240

Merged

rawagner force-pushed the consumers branch from 0d5c9ac to 35ba2a1 Compare March 25, 2019 12:25

rawagner changed the title ~~WIP: Refactor TopConsumers and add new ClusterTopConsumers component~~ Refactor TopConsumers and add new ClusterTopConsumers component Mar 25, 2019

kubevirt-bot removed the do-not-merge/work-in-progress label Mar 25, 2019

atiratree suggested changes Mar 26, 2019

View reviewed changes

rawagner force-pushed the consumers branch 3 times, most recently from 3912d61 to dd78fa2 Compare March 29, 2019 09:23

atiratree suggested changes Mar 29, 2019

View reviewed changes

rawagner force-pushed the consumers branch 5 times, most recently from 1185d99 to dc84b25 Compare March 29, 2019 14:10

rawagner changed the title ~~Refactor TopConsumers and add new ClusterTopConsumers component~~ Refactor TopConsumers Mar 29, 2019

rawagner changed the title ~~Refactor TopConsumers~~ Refactor TopConsumers and add Workload and Infrastructure metrics Mar 29, 2019

rawagner changed the title ~~Refactor TopConsumers and add Workload and Infrastructure metrics~~ WIP: Refactor TopConsumers and add Workload and Infrastructure metrics Apr 1, 2019

kubevirt-bot added the do-not-merge/work-in-progress label Apr 1, 2019

rawagner force-pushed the consumers branch 8 times, most recently from 310e20d to d74ba77 Compare April 5, 2019 08:38

rawagner changed the title ~~WIP: Refactor TopConsumers and add Workload and Infrastructure metrics~~ Refactor TopConsumers and add Workload and Infrastructure metrics Apr 5, 2019

kubevirt-bot removed the do-not-merge/work-in-progress label Apr 5, 2019

rawagner mentioned this pull request Apr 5, 2019

Add popover to consumer item explaining the query and result presentation #313

Closed

atiratree suggested changes Apr 5, 2019

View reviewed changes

rawagner force-pushed the consumers branch from d74ba77 to 036e80d Compare April 5, 2019 12:24

atiratree suggested changes Apr 5, 2019

View reviewed changes

atiratree reviewed Apr 5, 2019

View reviewed changes

src/components/ClusterOverview/TopConsumers/utils.js Outdated Show resolved Hide resolved

Refactor TopConsumers

3660658

- add Loading state - add Workload and Infrastructure metrics

rawagner force-pushed the consumers branch from 036e80d to 3660658 Compare April 8, 2019 08:12

atiratree merged commit 05a95ea into kubevirt:master Apr 8, 2019

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Refactor TopConsumers and add Workload and Infrastructure metrics #289

Refactor TopConsumers and add Workload and Infrastructure metrics #289

rawagner commented Mar 25, 2019

coveralls commented Mar 25, 2019 •

edited

Loading

coveralls commented Mar 25, 2019

atiratree Mar 26, 2019

rawagner Mar 29, 2019 •

edited

Loading

atiratree Mar 26, 2019

rawagner Mar 26, 2019

atiratree Apr 2, 2019

rawagner Apr 5, 2019

atiratree Mar 29, 2019

rawagner Apr 5, 2019

rawagner commented Apr 5, 2019

atiratree Apr 5, 2019

rawagner Apr 5, 2019

atiratree Apr 5, 2019

rawagner Apr 5, 2019

atiratree Apr 5, 2019

rawagner Apr 5, 2019

atiratree Apr 5, 2019

rawagner Apr 8, 2019

Refactor TopConsumers and add Workload and Infrastructure metrics #289

Refactor TopConsumers and add Workload and Infrastructure metrics #289

Conversation

rawagner commented Mar 25, 2019

coveralls commented Mar 25, 2019 • edited Loading

Pull Request Test Coverage Report for Build 1055

💛 - Coveralls

coveralls commented Mar 25, 2019

Pull Request Test Coverage Report for Build 890

💛 - Coveralls

Choose a reason for hiding this comment

rawagner Mar 29, 2019 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

rawagner commented Apr 5, 2019

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

coveralls commented Mar 25, 2019 •

edited

Loading

rawagner Mar 29, 2019 •

edited

Loading