feat(alerting): show execution errors in alert list

public/app/features/alerting/alert_def.ts

@@ -61,28 +61,36 @@ function getStateDisplayModel(state) {
         iconClass: 'icon-gf icon-gf-critical',
         stateClass: 'alert-state-critical'
       };
-     }
-     case 'warning': {
+    }
+    case 'warning': {
       return {
         text: 'WARNING',
         iconClass: 'icon-gf icon-gf-warning',
         stateClass: 'alert-state-warning'
       };
-     }
-     case 'pending': {
+    }
+    case 'pending': {
       return {
         text: 'PENDING',
         iconClass: "fa fa-question",
         stateClass: 'alert-state-warning'
       };
-     }
-     case 'paused': {
+    }
+    case 'execution_error': {
+      return {
+        text: 'EXECUTION ERROR',
+        iconClass: 'icon-gf icon-gf-critical',
+        stateClass: 'alert-state-critical'
+      };
+    }
+
+    case 'paused': {
       return {
         text: 'paused',
         iconClass: "fa fa-pause",
         stateClass: 'alert-state-paused'
       };
-     }
+    }
   }
 }
 

public/app/features/alerting/partials/alert_list.html

@@ -33,9 +33,6 @@
                 <i class="icon-gf icon-gf-settings"></i>
               </a>
             </div>
-            <div class="card-item-notice" ng-show="alert.executionError">
-              <span>Execution Error</span>
-            </div>
           </div>
           <div class="card-item-body">
             <div class="card-item-details">
@@ -49,7 +46,9 @@
                   <i class="{{alert.stateModel.iconClass}}"></i>
                   {{alert.stateModel.text}}
                 </span> for {{alert.newStateDateAgo}}
-                </div>
+              </div>
+              <div class="small muted" ng-show="alert.executionError">
+                {{alert.executionError}}
               </div>
             </div>
           </div>