From e4947b6e194019b8eff69c198fc3a6b62968557a Mon Sep 17 00:00:00 2001
From: Alexander Zobnin <alexanderzobnin@gmail.com>
Date: Mon, 4 Mar 2019 16:44:38 +0300
Subject: [PATCH] problems: fix acknowledged event color, closes #676, #681

---
 .../components/AlertList/AlertCard.tsx              | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/src/panel-triggers/components/AlertList/AlertCard.tsx b/src/panel-triggers/components/AlertList/AlertCard.tsx
index 3ac2c4b59..d0977ad64 100644
--- a/src/panel-triggers/components/AlertList/AlertCard.tsx
+++ b/src/panel-triggers/components/AlertList/AlertCard.tsx
@@ -65,14 +65,23 @@ export default class AlertCard extends PureComponent<AlertCardProps, AlertCardSt
     }
     const blink = panelOptions.highlightNewEvents && newProblem;
 
+    let problemColor: string;
+    if (problem.value === '0') {
+      problemColor = panelOptions.okEventColor;
+    } else if (panelOptions.markAckEvents && problem.acknowledges && problem.acknowledges.length) {
+      problemColor = panelOptions.ackEventColor;
+    } else {
+      problemColor = severityDesc.color;
+    }
+
     const cardStyle: CSSProperties = {};
     if (panelOptions.highlightBackground) {
-      cardStyle.backgroundColor = severityDesc.color;
+      cardStyle.backgroundColor = problemColor;
     }
 
     return (
       <li className={cardClass} style={cardStyle}>
-        <AlertIcon problem={problem} color={severityDesc.color} highlightBackground={panelOptions.highlightBackground} blink={blink} />
+        <AlertIcon problem={problem} color={problemColor} highlightBackground={panelOptions.highlightBackground} blink={blink} />
 
         <div className="alert-rule-item__body">
           <div className="alert-rule-item__header">