From e0073aa36ed245739be383b3bc08343c700235de Mon Sep 17 00:00:00 2001 From: Alex Holliday Date: Mon, 12 Aug 2024 13:47:02 -0700 Subject: [PATCH] Refactor pagespeed details to use stats endpoint --- Client/src/Pages/Monitors/Details/index.jsx | 3 +- Client/src/Pages/PageSpeed/Details/index.jsx | 25 +++--- Server/db/mongo/modules/monitorModule.js | 86 ++++++++++---------- 3 files changed, 55 insertions(+), 59 deletions(-) diff --git a/Client/src/Pages/Monitors/Details/index.jsx b/Client/src/Pages/Monitors/Details/index.jsx index 128a85e89..918077a91 100644 --- a/Client/src/Pages/Monitors/Details/index.jsx +++ b/Client/src/Pages/Monitors/Details/index.jsx @@ -5,7 +5,6 @@ import { useSelector } from "react-redux"; import { useNavigate, useParams } from "react-router-dom"; import axiosInstance from "../../../Utils/axiosConfig"; import MonitorDetailsAreaChart from "../../../Components/Charts/MonitorDetailsAreaChart"; -import { StatusLabel } from "../../../Components/Label"; import ButtonGroup from "@mui/material/ButtonGroup"; import Button from "../../../Components/Button"; import WestRoundedIcon from "@mui/icons-material/WestRounded"; @@ -267,7 +266,7 @@ const DetailsPage = () => { - + diff --git a/Client/src/Pages/PageSpeed/Details/index.jsx b/Client/src/Pages/PageSpeed/Details/index.jsx index 45a031da1..04e08d122 100644 --- a/Client/src/Pages/PageSpeed/Details/index.jsx +++ b/Client/src/Pages/PageSpeed/Details/index.jsx @@ -5,7 +5,11 @@ import { useEffect, useState } from "react"; import { useTheme } from "@emotion/react"; import { useNavigate, useParams } from "react-router-dom"; import { useSelector } from "react-redux"; -import { formatDate, formatDurationRounded } from "../../../Utils/timeUtils"; +import { + formatDate, + formatDuration, + formatDurationRounded, +} from "../../../Utils/timeUtils"; import { getLastChecked } from "../../../Utils/monitorUtils"; import axiosInstance from "../../../Utils/axiosConfig"; import Button from "../../../Components/Button"; @@ -185,7 +189,7 @@ const PageSpeedDetails = () => { const fetchMonitor = async () => { try { const res = await axiosInstance.get( - `/monitors/${monitorId}?sortOrder=desc`, + `/monitors/stats/${monitorId}?sortOrder=desc&limit=50`, { headers: { Authorization: `Bearer ${authToken}`, @@ -369,14 +373,13 @@ const PageSpeedDetails = () => { title="Last checked" value={ <> - {formatDate(getLastChecked(monitor?.checks, false))}{" "} + {formatDuration(monitor?.lastChecked)}{" "} - ({formatDurationRounded(getLastChecked(monitor?.checks))}{" "} - ago) + ago } @@ -386,17 +389,13 @@ const PageSpeedDetails = () => { title="Checks since" value={ <> - {formatDate(new Date(monitor?.createdAt))}{" "} + {formatDuration(monitor?.uptimeDuration)}{" "} - ( - {formatDurationRounded( - new Date() - new Date(monitor?.createdAt) - )}{" "} - ago) + ago } @@ -409,9 +408,7 @@ const PageSpeedDetails = () => { Score history - + Performance report diff --git a/Server/db/mongo/modules/monitorModule.js b/Server/db/mongo/modules/monitorModule.js index 3885132f2..a79e5a5be 100644 --- a/Server/db/mongo/modules/monitorModule.js +++ b/Server/db/mongo/modules/monitorModule.js @@ -140,6 +140,13 @@ const getStatusBarValues = (checks) => { * @throws {Error} */ const getMonitorStatsById = async (req) => { + const filterLookup = { + hour: new Date(new Date().getTime() - 60 * 60 * 1000), + day: new Date(new Date().setDate(new Date().getDate() - 1)), + week: new Date(new Date().setDate(new Date().getDate() - 7)), + month: new Date(new Date().setMonth(new Date().getMonth() - 1)), + }; + try { const { monitorId } = req.params; let { status, limit, sortOrder, filter, numToDisplay, normalize } = @@ -154,39 +161,45 @@ const getMonitorStatsById = async (req) => { // Get monitor const monitor = await Monitor.findById(monitorId); - // Get all checks to calculate stats - const checksQuery = { monitorId: monitor._id }; let model = monitor.type === "http" || monitor.type === "ping" ? Check : PageSpeedCheck; - const filterLookup = { - hour: new Date(new Date().getTime() - 60 * 60 * 1000), - day: new Date(new Date().setDate(new Date().getDate() - 1)), - week: new Date(new Date().setDate(new Date().getDate() - 7)), - month: new Date(new Date().setMonth(new Date().getMonth() - 1)), + const monitorStats = { + ...monitor.toObject(), }; - + // Get all checks to calculate stats + const checksQuery = { monitorId: monitor._id }; // Get all checks const checksAll = await model.find(checksQuery).sort({ createdAt: sortOrder, }); - // Get checks in 24 hours - checksQuery.createdAt = { $gte: filterLookup.day }; - const checks24Hours = await model.find(checksQuery).sort({ - createdAt: sortOrder, - }); - // Get checks in 30 days - checksQuery.createdAt = { $gte: filterLookup.month }; - const checks30Days = await model.find(checksQuery).sort({ - createdAt: sortOrder, - }); - // Get checks in 60 mins - checksQuery.createdAt = { $gte: filterLookup.hour }; - const checks60Mins = await model - .find(checksQuery) - .sort({ createdAt: sortOrder }); + + if (monitor.type === "http" || monitor.type === "ping") { + // Get checks in 24 hours + checksQuery.createdAt = { $gte: filterLookup.day }; + const checks24Hours = await model.find(checksQuery).sort({ + createdAt: sortOrder, + }); + // Get checks in 30 days + checksQuery.createdAt = { $gte: filterLookup.month }; + const checks30Days = await model.find(checksQuery).sort({ + createdAt: sortOrder, + }); + // Get checks in 60 mins + checksQuery.createdAt = { $gte: filterLookup.hour }; + const checks60Mins = await model + .find(checksQuery) + .sort({ createdAt: sortOrder }); + + // HTTP/PING Specific stats + monitorStats.avgResponseTime24hours = + getAverageResponseTime24Hours(checks24Hours); + monitorStats.uptime24Hours = getUptimePercentage(checks24Hours); + monitorStats.uptime30Days = getUptimePercentage(checks30Days); + monitorStats.statusBar = getStatusBarValues(checks60Mins); + } //Get checks for dateRange @@ -205,7 +218,6 @@ const getMonitorStatsById = async (req) => { createdAt: sortOrder, }) .limit(limit); - const incidents = getIncidents(dateRangeChecks); // If more than numToDisplay checks, pick every nth check if ( @@ -222,25 +234,13 @@ const getMonitorStatsById = async (req) => { dateRangeChecks = NormalizeData(dateRangeChecks, 1, 100); } - const uptimeDuration = caluclteUptimeDuration(checksAll); - const lastChecked = getLastChecked(checksAll); - const latestResponseTime = getLatestResponseTime(checksAll); - const avgResponseTime24hours = getAverageResponseTime24Hours(checks24Hours); - const uptime24Hours = getUptimePercentage(checks24Hours); - const uptime30Days = getUptimePercentage(checks30Days); - const statusBar = getStatusBarValues(checks60Mins); - const monitorStats = { - ...monitor.toObject(), - uptimeDuration, - lastChecked, - latestResponseTime, - avgResponseTime24hours, - uptime24Hours, - uptime30Days, - statusBar, - incidents, - dateRangeChecks, - }; + // Add common stats + const incidents = getIncidents(dateRangeChecks); + monitorStats.uptimeDuration = caluclteUptimeDuration(checksAll); + monitorStats.lastChecked = getLastChecked(checksAll); + monitorStats.latestResponseTime = getLatestResponseTime(checksAll); + monitorStats.incidents = incidents; + monitorStats.checks = dateRangeChecks; return monitorStats; } catch (error) {