diff --git a/frontend/src/components/instance-item/index.js b/frontend/src/components/instance-item/index.js
index 5638f110..c874ee1f 100644
--- a/frontend/src/components/instance-item/index.js
+++ b/frontend/src/components/instance-item/index.js
@@ -1,6 +1,6 @@
const React = require('react');
-const DatasetsRow = require('@components/metrics-row');
+const MetricsOutlet = require('@components/metrics-outlet');
const PropTypes = require('@root/prop-types');
const List = require('@ui/components/list');
@@ -9,8 +9,7 @@ const {
ListItemView,
ListItemMeta,
ListItemTitle,
- ListItemOptions,
- ListItemOutlet
+ ListItemOptions
} = List;
const InstanceItem = ({
@@ -22,9 +21,7 @@ const InstanceItem = ({
{instance.name}
-
-
-
+
…
diff --git a/frontend/src/components/metrics-row/index.js b/frontend/src/components/metrics-outlet/index.js
similarity index 70%
rename from frontend/src/components/metrics-row/index.js
rename to frontend/src/components/metrics-outlet/index.js
index ff842e52..807f7a92 100644
--- a/frontend/src/components/metrics-row/index.js
+++ b/frontend/src/components/metrics-outlet/index.js
@@ -2,6 +2,7 @@ const React = require('react');
const Styled = require('styled-components');
const Column = require('@ui/components/column');
+const List = require('@ui/components/list');
const MiniMetric = require('@ui/components/mini-metric');
const PropTypes = require('@root/prop-types');
const Row = require('@ui/components/row');
@@ -18,6 +19,15 @@ const {
MiniMetricView
} = MiniMetric;
+const {
+ ListItemOutlet
+} = List;
+
+const StyledOutlet = styled(ListItemOutlet)`
+ padding-left: 0;
+ padding-right: 0;
+`;
+
const StyledRow = styled(Row)`
margin: 0;
@@ -27,9 +37,11 @@ const StyledRow = styled(Row)`
}
`;
-const MetricsRow = ({
- datasets = []
-}) => {
+const MetricsOutlet = (props) => {
+ const {
+ datasets = []
+ } = props;
+
const _datasets = datasets.map((metric, i) => (
@@ -43,14 +55,16 @@ const MetricsRow = ({
));
return (
-
- {_datasets}
-
+
+
+ {_datasets}
+
+
);
};
-MetricsRow.propTypes = {
+MetricsOutlet.propTypes = {
datasets: React.PropTypes.arrayOf(PropTypes.dataset)
};
-module.exports = MetricsRow;
+module.exports = MetricsOutlet;
diff --git a/frontend/src/components/service-item/index.js b/frontend/src/components/service-item/index.js
index 7453afa4..6adb37c4 100644
--- a/frontend/src/components/service-item/index.js
+++ b/frontend/src/components/service-item/index.js
@@ -4,7 +4,7 @@ const ReactRouter = require('react-router');
const Anchor = require('@ui/components/anchor');
const List = require('@ui/components/list');
-const MetricsRow = require('@components/metrics-row');
+const MetricsOutlet = require('@components/metrics-outlet');
const PropTypes = require('@root/prop-types');
const {
@@ -19,7 +19,6 @@ const {
ListItemSubTitle,
ListItemDescription,
ListItemGroupView,
- ListItemOutlet,
ListItemOptions,
ListItemHeader
} = List;
@@ -86,9 +85,7 @@ const ServiceItem = ({
{isChild && subtitle}
{description}
-
-
-
+
);