From 4f90bee9f5f7f8d1b84075835e70552b8bf795fd Mon Sep 17 00:00:00 2001
From: Ankush Behl <cloudbehl@gmail.com>
Date: Mon, 8 Jul 2019 17:18:25 +0530
Subject: [PATCH] Added alerts for ceph-storage-tab

Signed-off-by: Ankush Behl <cloudbehl@gmail.com>
---
 .../storage-dashboard/health-card.tsx         | 28 ++++++++++++++++++-
 .../src/selectors/index.ts                    |  5 ++++
 2 files changed, 32 insertions(+), 1 deletion(-)
 create mode 100644 frontend/packages/ceph-storage-plugin/src/selectors/index.ts

diff --git a/frontend/packages/ceph-storage-plugin/src/components/dashboard-page/storage-dashboard/health-card.tsx b/frontend/packages/ceph-storage-plugin/src/components/dashboard-page/storage-dashboard/health-card.tsx
index 2ecaf71a8e1..0f6f78ffd68 100644
--- a/frontend/packages/ceph-storage-plugin/src/components/dashboard-page/storage-dashboard/health-card.tsx
+++ b/frontend/packages/ceph-storage-plugin/src/components/dashboard-page/storage-dashboard/health-card.tsx
@@ -1,6 +1,11 @@
 import * as React from 'react';
 import * as _ from 'lodash';
 
+import {
+  AlertsBody,
+  AlertItem,
+  getAlerts,
+} from '@console/internal/components/dashboard/health-card';
 import { DashboardCard } from '@console/internal/components/dashboard/dashboard-card/card';
 import { DashboardCardBody } from '@console/internal/components/dashboard/dashboard-card/card-body';
 import { DashboardCardHeader } from '@console/internal/components/dashboard/dashboard-card/card-header';
@@ -14,6 +19,7 @@ import { HealthItem } from '@console/internal/components/dashboard/health-card/h
 import { HealthState } from '@console/internal/components/dashboard/health-card/states';
 import { STORAGE_HEALTH_QUERIES } from '../../../constants/queries';
 import { CEPH_HEALTHY, CEPH_DEGRADED, CEPH_ERROR, CEPH_UNKNOWN } from '../../../constants';
+import { filterCephAlerts } from '../../../selectors';
 
 const CephHealthStatus = [
   {
@@ -46,17 +52,23 @@ const HealthCard: React.FC<DashboardItemProps> = ({
   watchPrometheus,
   stopWatchPrometheusQuery,
   prometheusResults,
+  watchAlerts,
+  stopWatchAlerts,
+  alertsResults,
 }) => {
   React.useEffect(() => {
+    watchAlerts();
     watchPrometheus(STORAGE_HEALTH_QUERIES.CEPH_STATUS_QUERY);
     return () => {
+      stopWatchAlerts();
       stopWatchPrometheusQuery(STORAGE_HEALTH_QUERIES.CEPH_STATUS_QUERY);
     };
-  }, [watchPrometheus, stopWatchPrometheusQuery]);
+  }, [watchPrometheus, stopWatchPrometheusQuery, watchAlerts, stopWatchAlerts]);
 
   const queryResult = prometheusResults.getIn([STORAGE_HEALTH_QUERIES.CEPH_STATUS_QUERY, 'result']);
 
   const cephHealthState = getCephHealthState(queryResult);
+  const alerts = filterCephAlerts(getAlerts(alertsResults));
 
   return (
     <DashboardCard>
@@ -68,6 +80,20 @@ const HealthCard: React.FC<DashboardItemProps> = ({
           <HealthItem state={cephHealthState.state} message={cephHealthState.message} />
         </HealthBody>
       </DashboardCardBody>
+      {alerts.length > 0 && (
+        <React.Fragment>
+          <DashboardCardHeader className="co-alerts-card__border">
+            <DashboardCardTitle>Alerts</DashboardCardTitle>
+          </DashboardCardHeader>
+          <DashboardCardBody>
+            <AlertsBody>
+              {alerts.map((alert) => (
+                <AlertItem key={alert.fingerprint} alert={alert} />
+              ))}
+            </AlertsBody>
+          </DashboardCardBody>
+        </React.Fragment>
+      )}
     </DashboardCard>
   );
 };
diff --git a/frontend/packages/ceph-storage-plugin/src/selectors/index.ts b/frontend/packages/ceph-storage-plugin/src/selectors/index.ts
new file mode 100644
index 00000000000..a93d10690e3
--- /dev/null
+++ b/frontend/packages/ceph-storage-plugin/src/selectors/index.ts
@@ -0,0 +1,5 @@
+import * as _ from 'lodash';
+import { Alert } from '@console/internal/components/monitoring';
+
+export const filterCephAlerts = (alerts: Alert[]): Alert[] =>
+  alerts.filter((alert) => _.get(alert, 'annotations.storage_type') === 'ceph');