diff --git a/client/app/scripts/components/node-details/node-details-table-row.js b/client/app/scripts/components/node-details/node-details-table-row.js
index 5b48831ab..2f17cd33c 100644
--- a/client/app/scripts/components/node-details/node-details-table-row.js
+++ b/client/app/scripts/components/node-details/node-details-table-row.js
@@ -1,12 +1,15 @@
import React from 'react';
import classNames from 'classnames';
+import { groupBy, mapValues } from 'lodash';
+import { intersperse } from '../../utils/array-utils';
+
import NodeDetailsTableNodeLink from './node-details-table-node-link';
import NodeDetailsTableNodeMetric from './node-details-table-node-metric';
import { formatDataType } from '../../utils/string-utils';
function getValuesForNode(node) {
- const values = {};
+ let values = {};
['metrics', 'metadata'].forEach((collection) => {
if (node[collection]) {
node[collection].forEach((field) => {
@@ -17,22 +20,29 @@ function getValuesForNode(node) {
}
});
- (node.parents || []).forEach((p) => {
- values[p.topologyId] = {
- id: p.topologyId,
- label: p.topologyId,
- value: p.label,
- relative: p,
+ if (node.parents) {
+ const byTopologyId = groupBy(node.parents, parent => parent.topologyId);
+ const relativesByTopologyId = mapValues(byTopologyId, (relatives, topologyId) => ({
+ id: topologyId,
+ label: topologyId,
+ value: relatives.map(relative => relative.label).join(', '),
valueType: 'relatives',
+ relatives,
+ }));
+
+ values = {
+ ...values,
+ ...relativesByTopologyId,
};
- });
+ }
return values;
}
+
function renderValues(node, columns = [], columnStyles = [], timestamp = null) {
const fields = getValuesForNode(node);
- return columns.map(({id}, i) => {
+ return columns.map(({ id }, i) => {
const field = fields[id];
const style = columnStyles[i];
if (field) {
@@ -55,18 +65,28 @@ function renderValues(node, columns = [], columnStyles = [], timestamp = null) {
title={field.value}
style={style}
key={field.id}>
- {