Show active (paging) alerts

src/dashboard.js

@@ -8,6 +8,20 @@ const prom = new PrometheusDriver({
 
 const accountsQuery = "sum(max(accounts_count) by (shard,type,status)) by (type)";
 
+const alertsURL = "https://alerts.autistici.org/alerts.json";
+
+const alertsQuery = {
+    filters: ["@state=active", "severity=page"],
+    gridLabel: "",
+    gridSortReverse: false,
+    gridLimits: {},
+    sortOrder: "",
+    sortLabel: "",
+    sortReverse: false,
+    defaultGroupLimit: 5,
+    groupLimits: {}
+};
+
 const accountNiceNames = {
     mail: "email accounts",
     web: "websites",
@@ -33,16 +47,52 @@ function queryAccounts(el) {
         .catch((err) => {
             dashboardError('Failed to fetch account metrics', err);
         });
-};
+}
+
+function queryAlerts(el) {
+    fetch(alertsURL, {
+        method: 'POST',
+        body: JSON.stringify(alertsQuery),
+        credentials: 'include'
+    })
+        .then((resp) => {
+            if (!resp.ok) {
+                throw new Error('HTTP request failed');
+            }
+            return resp.json();
+        })
+        .then((result) => {
+            if (result.status != "success") {
+                throw new Error('JSON API request failed');
+            }
+            var numFiring = result.totalAlerts;
+
+            var txt = 'No active alerts.';
+            if (numFiring > 0) {
+                txt = '' + numFiring + ' active alerts!';
+            }
+            var p = document.createElement('p');
+            p.appendChild(document.createTextNode(txt));
+            el.append(p);            
+        })
+        .catch((err) => {
+            dashboardError('Failed to fetch active alerts', err);
+        });
+}
 
 function dashboardError(msg, err) {
     var p = document.createElement('p');
-    p.appendChild(document.createTextNode(msg + ': ' + err.error));
+    var errmsg = err.error;
+    if (!errmsg) {
+        errmsg = err.message;
+    }
+    p.appendChild(document.createTextNode(msg + ': ' + errmsg));
     document.getElementById('errors').append(p);
-};
+}
 
 window.addEventListener('load', () => {
     console.log('Populating data items...');
 
     queryAccounts(document.getElementById('accountInfo'));
+    queryAlerts(document.getElementById('alertInfo'));
 });

src/index.html

@@ -72,7 +72,7 @@ body {
 
       <h3>System information</h3>
 
-      <div id="sysInfo"></div>
+      <div id="alertInfo"></div>
 
       <ul>
         <li><a href="https://admin.autistici.org/">service-dashboard</a> - map of services and hosts</li>