diff --git a/web/app/js/components/ServiceMesh.jsx b/web/app/js/components/ServiceMesh.jsx
index 5fe59e33c..09ff6da8a 100644
--- a/web/app/js/components/ServiceMesh.jsx
+++ b/web/app/js/components/ServiceMesh.jsx
@@ -11,6 +11,7 @@ import { rowGutter } from './util/Utils.js';
 import StatusTable from './StatusTable.jsx';
 import { Col, Row, Table } from 'antd';
 import {
+  getComponentPods,
   getPodsByDeployment,
   processRollupMetrics,
   processTimeseriesMetrics
@@ -178,10 +179,7 @@ export default class ServiceMesh extends React.Component {
     return _(componentNames)
       .map((name, id) => {
         let componentPods = _.get(podIndex, _.get(componentDeploys, id), []);
-        let podStatuses = _.map(componentPods, p => {
-          return { name: p.name, value: p.status === "Running" ? "good" : "bad" };
-        });
-        return { name: name, pods: _.sortBy(podStatuses, "name") };
+        return { name: name, pods: getComponentPods(componentPods) };
       })
       .sortBy("name")
       .value();
diff --git a/web/app/js/components/util/MetricUtils.js b/web/app/js/components/util/MetricUtils.js
index 7777bbb9c..d43c2f825 100644
--- a/web/app/js/components/util/MetricUtils.js
+++ b/web/app/js/components/util/MetricUtils.js
@@ -60,6 +60,16 @@ export const getPodsByDeployment = pods => {
     .value();
 };
 
+export const getComponentPods = componentPods => {
+  return _.chain(componentPods)
+    .map( p => {
+      return { name: p.name, value: getPodCategorization(p) };
+    })
+    .reject(p => _.isEmpty(p.value))
+    .sortBy("name")
+    .value();
+};
+
 export const processTimeseriesMetrics = (rawTs, targetEntity) => {
   let tsbyEntity = _.groupBy(rawTs, "metadata." + targetEntity);
   return _.reduce(tsbyEntity, (mem, metrics, entity) => {