From 3eab0cde70021d2b7c421e81ca2146cce9108b2f Mon Sep 17 00:00:00 2001
From: bergquist <carl.bergquist@gmail.com>
Date: Mon, 2 May 2016 15:20:58 +0200
Subject: [PATCH] feat(alerting): add gf icons for alert state page

---
 public/app/features/alerts/alert_def.ts       | 19 +++++++++++++++++++
 public/app/features/alerts/alert_log_ctrl.ts  |  7 +++++++
 .../features/alerts/partials/alert_log.html   |  6 +++---
 3 files changed, 29 insertions(+), 3 deletions(-)
 create mode 100644 public/app/features/alerts/alert_def.ts

diff --git a/public/app/features/alerts/alert_def.ts b/public/app/features/alerts/alert_def.ts
new file mode 100644
index 00000000000..382d4dc43b7
--- /dev/null
+++ b/public/app/features/alerts/alert_def.ts
@@ -0,0 +1,19 @@
+///<reference path="../../headers/common.d.ts" />
+
+//import _ from 'lodash';
+
+var alertStateToCssMap = {
+  "OK": "icon-gf-online",
+  "WARN": "icon-gf-warn",
+  "CRITICAL": "icon-gf-critical",
+  "ACKNOWLEDGED": "icon-gf-alert-disabled"
+
+};
+
+function getCssForState(alertState) {
+  return alertStateToCssMap[alertState];
+}
+
+export default {
+  getCssForState
+};
diff --git a/public/app/features/alerts/alert_log_ctrl.ts b/public/app/features/alerts/alert_log_ctrl.ts
index 191f6337e99..4b6490ffa83 100644
--- a/public/app/features/alerts/alert_log_ctrl.ts
+++ b/public/app/features/alerts/alert_log_ctrl.ts
@@ -4,6 +4,8 @@ import angular from 'angular';
 import _ from 'lodash';
 import coreModule from '../../core/core_module';
 import config from 'app/core/config';
+import alertDef from './alert_def';
+import moment from 'moment';
 
 export class AlertLogCtrl {
 
@@ -22,6 +24,11 @@ export class AlertLogCtrl {
   loadAlertLogs() {
     this.backendSrv.get('/api/alerts/events/' + this.alertId).then(result => {
       this.alertLogs = result;
+
+      _.each(this.alertLogs, log => {
+        log.iconCss = alertDef.getCssForState(log.newState);
+        log.humanTime = moment(log.created).format("YYYY-MM-DD HH:mm:ss");
+      });
     });
 
     this.backendSrv.get('/api/alerts/' + this.alertId).then(result => {
diff --git a/public/app/features/alerts/partials/alert_log.html b/public/app/features/alerts/partials/alert_log.html
index 028b9bfc638..512432267c4 100644
--- a/public/app/features/alerts/partials/alert_log.html
+++ b/public/app/features/alerts/partials/alert_log.html
@@ -9,15 +9,15 @@
   <table class="filter-table">
     <thead>
       <th style="width: 68px">Status</th>
-      <th><strong>Time</strong></th>
+      <th style="width: 160px">Time</th>
       <th>Description</th>
     </thead>
     <tr ng-repeat="alertLog in ctrl.alertLogs">
       <td>
-        {{alertLog.newState}}
+        <i class="icon-gf {{alertLog.iconCss}}"></i>
       </td>
       <td>
-        {{alertLog.created}}
+        {{alertLog.humanTime}}
       </td>
       <td>
         {{alertLog.info}}