feat: collect response metrics from cron locations

src/components/monitorHistogram.js

@@ -16,14 +16,17 @@ export default function MonitorHistogram({ monitorId, kvMonitor }) {
         let bg = ''
         let dayInHistogramLabel = config.settings.dayInHistogramNoData
 
-        // filter all dates before first check, check the rest
+        // filter all dates before first check, then check the rest
         if (kvMonitor && kvMonitor.firstCheck <= dayInHistogram) {
-          if (!kvMonitor.failedDays.includes(dayInHistogram)) {
+          if (
+            kvMonitor.checks.hasOwnProperty(dayInHistogram) &&
+            kvMonitor.checks[dayInHistogram].fails > 0
+          ) {
+            bg = 'yellow'
+            dayInHistogramLabel = `${kvMonitor.checks[dayInHistogram].fails} ${config.settings.dayInHistogramNotOperational}`
+          } else {
             bg = 'green'
             dayInHistogramLabel = config.settings.dayInHistogramOperational
-          } else {
-            bg = 'yellow'
-            dayInHistogramLabel = config.settings.dayInHistogramNotOperational
           }
         }
 
@@ -36,6 +39,15 @@ export default function MonitorHistogram({ monitorId, kvMonitor }) {
               <span className="font-semibold text-sm">
                 {dayInHistogramLabel}
               </span>
+              {kvMonitor.checks.hasOwnProperty(dayInHistogram) &&
+                Object.keys(kvMonitor.checks[dayInHistogram].res).map((key) => {
+                  return (
+                    <>
+                      <br />
+                      {key}: {kvMonitor.checks[dayInHistogram].res[key].a}ms
+                    </>
+                  )
+                })}
             </div>
           </div>
         )

src/components/monitorStatusHeader.js

@@ -7,11 +7,11 @@ const classes = {
     'bg-yellow-200 text-yellow-700 dark:bg-yellow-700 dark:text-yellow-200 border-yellow-300 dark:border-yellow-600',
 }
 
-export default function MonitorStatusHeader({ kvMonitorsMetadata }) {
+export default function MonitorStatusHeader({ kvMonitorsLastUpdate }) {
   let color = 'green'
   let text = config.settings.allmonitorsOperational
 
-  if (!kvMonitorsMetadata.monitorsOperational) {
+  if (!kvMonitorsLastUpdate.allOperational) {
     color = 'yellow'
     text = config.settings.notAllmonitorsOperational
   }
@@ -20,13 +20,11 @@ export default function MonitorStatusHeader({ kvMonitorsMetadata }) {
     <div className={`card mb-4 font-semibold ${classes[color]}`}>
       <div className="flex flex-row justify-between items-center">
         <div>{text}</div>
-        {kvMonitorsMetadata.lastUpdate && typeof window !== 'undefined' && (
+        {kvMonitorsLastUpdate.time && typeof window !== 'undefined' && (
           <div className="text-xs font-light">
             checked{' '}
-            {Math.round(
-              (Date.now() - kvMonitorsMetadata.lastUpdate.time) / 1000,
-            )}{' '}
-            sec ago (from {kvMonitorsMetadata.lastUpdate.loc})
+            {Math.round((Date.now() - kvMonitorsLastUpdate.time) / 1000)} sec
+            ago (from {kvMonitorsLastUpdate.loc})
           </div>
         )}
       </div>

src/components/monitorStatusLabel.js

@@ -12,7 +12,7 @@ export default function MonitorStatusLabel({ kvMonitor }) {
   let text = 'No data'
 
   if (typeof kvMonitor !== 'undefined') {
-    if (kvMonitor.operational) {
+    if (kvMonitor.lastCheck.operational) {
       color = 'green'
       text = config.settings.monitorLabelOperational
     } else {