feat(alerting): show execution errors in alert list

pkg/models/alert.go

@@ -11,7 +11,7 @@ type AlertSeverityType string
 
 const (
 	AlertStatePending        AlertStateType = "pending"
-	AlertStateExeuctionError AlertStateType = "exeuction_error"
+	AlertStateExeuctionError AlertStateType = "execution_error"
 	AlertStatePaused         AlertStateType = "paused"
 	AlertStateCritical       AlertStateType = "critical"
 	AlertStateWarning        AlertStateType = "warning"

pkg/services/alerting/result_handler.go

@@ -29,7 +29,7 @@ func NewResultHandler() *DefaultResultHandler {
 func (handler *DefaultResultHandler) Handle(ctx *EvalContext) {
 	oldState := ctx.Rule.State
 
-	exeuctionError := " "
+	exeuctionError := ""
 	if ctx.Error != nil {
 		handler.log.Error("Alert Rule Result Error", "ruleId", ctx.Rule.Id, "error", ctx.Error)
 		ctx.Rule.State = m.AlertStateExeuctionError

public/app/features/alerting/alert_def.ts

@@ -76,6 +76,14 @@ function getStateDisplayModel(state) {
         stateClass: 'alert-state-warning'
       };
     }
+    case 'execution_error': {
+      return {
+        text: 'EXECUTION ERROR',
+        iconClass: 'icon-gf icon-gf-critical',
+        stateClass: 'alert-state-critical'
+      };
+    }
+
     case 'paused': {
       return {
         text: '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">
@@ -50,6 +47,8 @@
                   {{alert.stateModel.text}}
                 </span> for {{alert.newStateDateAgo}}
               </div>
+              <div class="small muted" ng-show="alert.executionError">
+                {{alert.executionError}}
               </div>
             </div>
           </div>