fix(alert-dashboard): move change last and name it "Alert Description"

chaos-genius · Sep 26, 2022 · 80773e4 · 80773e4
1 parent a3fd4e5
commit 80773e4
Showing 1 changed file with 17 additions and 16 deletions.
diff --git a/chaos_genius/templates/alert_dashboard.html b/chaos_genius/templates/alert_dashboard.html
@@ -104,9 +104,6 @@ <h1 class="header-text">Alerts Dashboard</h1>
                                         <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider align-middle">
                                             Channel
                                         </th>
-                                        <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider align-middle">
-                                            Change
-                                        </th>
                                         <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider align-middle">
                                             Date
                                         </th>
@@ -116,6 +113,9 @@ <h1 class="header-text">Alerts Dashboard</h1>
                                         <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider align-middle desc">
                                             Severity Score
                                         </th>
+                                        <th scope="col" class="px-6 py-3 text-left text-xs font-medium text-white uppercase tracking-wider align-middle">
+                                            Alert Description
+                                        </th>
                                     </tr>
                                 </thead>
                                 <tbody>
@@ -362,15 +362,6 @@ <h1 class="header-text">Alerts Dashboard</h1>
                       {% endfor %}
                   ],
                   "{{ point.alert_channel }}",
-                  {% if point.percent_change is string %}
-                    "{{ point.percent_change_formatted }}",
-                  {% else %}
-                    {% if point.percent_change >= 0 %}
-                        "<span style=\"color: rgb(96, 202, 154); font-weight: 600;\">{{ point.percent_change_formatted }} higher</span> than expected",
-                    {% else %}
-                        "<span style=\"color: #FF2C1F; font-weight: 600;\">{{ point.percent_change_formatted }} lower</span> than expected",
-                    {% endif %}
-                  {% endif %}
                   "{{ point.date_only }}",
                   "{{ point.expected_range }}",
                   `{% if point.severity >= 65 %}
@@ -386,7 +377,16 @@ <h1 class="header-text">Alerts Dashboard</h1>
   <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4m0 4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z" />
 </svg>
                     {% endif %}
-                        {{ point.severity }}</span>`,
+                  {{ point.severity }}</span>`,
+                  {% if point.percent_change is string %}
+                    "{{ point.percent_change_formatted }}",
+                  {% else %}
+                    {% if point.percent_change >= 0 %}
+                        "<span style=\"color: rgb(96, 202, 154); font-weight: 600;\">{{ point.percent_change_formatted }} higher</span> than expected",
+                    {% else %}
+                        "<span style=\"color: #FF2C1F; font-weight: 600;\">{{ point.percent_change_formatted }} lower</span> than expected",
+                    {% endif %}
+                  {% endif %}
                 ],
             {% endfor %}
         ];
@@ -406,14 +406,15 @@ <h1 class="header-text">Alerts Dashboard</h1>
         dataTableAnomaly.kpiIdColIndex = 3;
         dataTableAnomaly.emailColIndex = 9;
         dataTableAnomaly.channelColIndex = 10;
-        dataTableAnomaly.dateOnlyColIndex = 12;
+        dataTableAnomaly.dateOnlyColIndex = 11;
         dataTableAnomaly.valueColIndex = 6;
         dataTableAnomaly.previousValueColIndex = 7;
         dataTableAnomaly.expectedValueColIndex = 8;
         dataTableAnomaly.dimensionColIndex = 4;
         dataTableAnomaly.timeStampColIndex = 5;
-        dataTableAnomaly.expectedRangeColIndex = 13;
-        dataTableAnomaly.severityColIndex = 14;
+        dataTableAnomaly.expectedRangeColIndex = 12;
+        dataTableAnomaly.severityColIndex = 13;
+        dataTableAnomaly.alertDescColIndex = 14;
 
         dataTableAnomaly.on('datatable.init', function(args) {
             dataTableAnomaly.head.getElementsByTagName('th')[dataTableAnomaly.valueColIndex].getElementsByTagName('a')[0].classList.add('desc');