Merge pull request #3130 from bluewave-labs/fix/monitor-service

Fix/monitor service

client/src/Components/v1/MonitorDetailsControlHeader/index.jsx

@@ -66,7 +66,7 @@ const MonitorDetailsControlHeader = ({
 				gap={theme.spacing(2)}
 			>
 				<Tooltip
-					key={monitor?._id}
+					key={monitor?.id}
 					placement="bottom"
 					title={tooltipTitle}
 				>
@@ -78,7 +78,7 @@ const MonitorDetailsControlHeader = ({
 							startIcon={<EmailIcon />}
 							disabled={isTestNotificationsDisabled}
 							onClick={() => {
-								testAllNotifications({ monitorId: monitor?._id });
+								testAllNotifications({ monitorId: monitor?.id });
 							}}
 							sx={{
 								whiteSpace: "nowrap",
@@ -92,7 +92,7 @@ const MonitorDetailsControlHeader = ({
 					variant="contained"
 					color="secondary"
 					onClick={(e) => {
-						navigate(`/incidents/${monitor?._id}`);
+						navigate(`/incidents/${monitor?.id}`);
 					}}
 				>
 					{t("menu.incidents")}
@@ -107,7 +107,7 @@ const MonitorDetailsControlHeader = ({
 						}
 						onClick={() => {
 							pauseMonitor({
-								monitorId: monitor?._id,
+								monitorId: monitor?.id,
 								triggerUpdate,
 							});
 						}}
@@ -120,7 +120,7 @@ const MonitorDetailsControlHeader = ({
 						variant="contained"
 						color="secondary"
 						startIcon={<SettingsOutlinedIcon />}
-						onClick={() => navigate(`/${path}/configure/${monitor._id}`)}
+						onClick={() => navigate(`/${path}/configure/${monitor.id}`)}
 					>
 						Configure
 					</Button>

client/src/Hooks/monitorHooks.js

@@ -50,6 +50,7 @@ export const useFetchMonitorsWithChecks = ({
 	const [isLoading, setIsLoading] = useState(false);
 	const [count, setCount] = useState(undefined);
 	const [monitors, setMonitors] = useState(undefined);
+	const [summary, setSummary] = useState(undefined);
 	const [networkError, setNetworkError] = useState(false);
 
 	const theme = useTheme();
@@ -68,10 +69,11 @@ export const useFetchMonitorsWithChecks = ({
 					order,
 				});
 
-				const { count, monitors } = res?.data?.data ?? {};
+				const { count, monitors, summary } = res?.data?.data ?? {};
 				const mappedMonitors = monitors.map((monitor) =>
 					getMonitorWithPercentage(monitor, theme)
 				);
+				setSummary(summary);
 				setMonitors(mappedMonitors);
 				setCount(count || 0);
 			} catch (error) {
@@ -97,7 +99,7 @@ export const useFetchMonitorsWithChecks = ({
 		types,
 		monitorUpdateTrigger,
 	]);
-	return [monitors, count, isLoading, networkError];
+	return [summary, monitors, count, isLoading, networkError];
 };
 
 export const useFetchMonitorsByTeamId = ({ types, filter, updateTrigger }) => {
@@ -385,7 +387,7 @@ export const useUpdateMonitor = () => {
 				}),
 			};
 			await networkService.updateMonitor({
-				monitorId: monitor._id,
+				monitorId: monitor.id,
 				updatedFields,
 			});
 

client/src/Pages/Infrastructure/Monitors/index.jsx

@@ -71,7 +71,7 @@ const InfrastructureMonitors = () => {
 
 	const field = toFilterStatus !== undefined ? "status" : undefined;
 
-	const [monitors, count, isLoading, networkError] = useFetchMonitorsWithChecks({
+	const [summary, monitors, count, isLoading, networkError] = useFetchMonitorsWithChecks({
 		types: TYPES,
 		limit: 1,
 		page: page,

client/src/Pages/PageSpeed/Monitors/Components/MonitorGrid/index.jsx

@@ -2,6 +2,7 @@ import { Grid, Grid2 } from "@mui/material";
 import Card from "../Card/index.jsx";
 
 const MonitorGrid = ({ shouldRender, monitors }) => {
+	console.log(monitors);
 	return (
 		<Grid
 			container

client/src/Pages/PageSpeed/Monitors/index.jsx

@@ -21,6 +21,7 @@ const PageSpeed = () => {
 	const isAdmin = useIsAdmin();
 
 	const [
+		summary,
 		monitorsWithChecks,
 		monitorsWithChecksCount,
 		monitorsWithChecksIsLoading,

client/src/Pages/Uptime/Create/index.jsx

@@ -199,7 +199,7 @@ const UptimeCreate = ({ isClone = false }) => {
 			};
 		} else {
 			form = {
-				_id: monitor._id,
+				id: monitor.id,
 				url: monitor.url,
 				name: monitor.name || monitor.url.substring(0, 50),
 				statusWindowSize: monitor.statusWindowSize,
@@ -292,7 +292,7 @@ const UptimeCreate = ({ isClone = false }) => {
 
 	const handleRemove = async (event) => {
 		event.preventDefault();
-		const TEMP_MONITOR = { id: monitor._id };
+		const TEMP_MONITOR = { id: monitor.id };
 		await deleteMonitor({ monitor: TEMP_MONITOR, redirect: "/uptime" });
 	};
 

client/src/Pages/Uptime/Monitors/index.jsx

@@ -27,8 +27,8 @@ import { useSelector, useDispatch } from "react-redux";
 import { setRowsPerPage } from "../../../Features/UI/uiSlice.js";
 import PropTypes from "prop-types";
 import {
-	useFetchMonitorsWithSummary,
 	useFetchMonitorsWithChecks,
+	useFetchMonitorsByTeamId,
 } from "@/Hooks/monitorHooks.js";
 import { useTranslation } from "react-i18next";
 
@@ -103,12 +103,6 @@ const UptimeMonitors = () => {
 		setMonitorUpdateTrigger((prev) => !prev);
 	}, []);
 
-	const [monitors, monitorsSummary, monitorsWithSummaryIsLoading, networkError] =
-		useFetchMonitorsWithSummary({
-			types: TYPES,
-			monitorUpdateTrigger,
-		});
-
 	const handleReset = () => {
 		setSelectedState(undefined);
 		setSelectedTypes(undefined);
@@ -123,16 +117,17 @@ const UptimeMonitors = () => {
 	]);
 
 	const activeFilter = [...filterLookup].find(([key]) => key !== undefined);
-	const field = activeFilter?.[1] || sort?.field;
+	const field = activeFilter?.[1] || (search ? "name" : sort?.field);
 	const filter = activeFilter?.[0] || search;
 
 	const effectiveTypes = selectedTypes?.length ? selectedTypes : TYPES;
 
 	const [
+		summary,
 		monitorsWithChecks,
 		monitorsWithChecksCount,
 		monitorsWithChecksIsLoading,
-		monitorsWithChecksNetworkError,
+		networkError,
 	] = useFetchMonitorsWithChecks({
 		types: effectiveTypes,
 		limit: 25,
@@ -144,13 +139,18 @@ const UptimeMonitors = () => {
 		monitorUpdateTrigger,
 	});
 
+	const [monitors, listIsLoading, listNetworkError] = useFetchMonitorsByTeamId({
+		type: ["http", "ping", "docker", "port", "game"],
+	});
+
+	console.log(monitors);
 	useEffect(() => {
 		if (isSearching) {
 			setPage(undefined);
 		}
 	}, [isSearching]);
 
-	const isLoading = monitorsWithSummaryIsLoading || monitorsWithChecksIsLoading;
+	const isLoading = monitorsWithChecksIsLoading;
 
 	return (
 		<>
@@ -174,14 +174,14 @@ const UptimeMonitors = () => {
 					/>
 					<Greeting type="uptime" />
 					<StatusBoxes
-						monitorsSummary={monitorsSummary}
-						shouldRender={!monitorsWithSummaryIsLoading}
+						monitorsSummary={summary}
+						shouldRender={!monitorsWithChecksIsLoading}
 					/>
 
 					<Stack direction={"row"}>
 						<MonitorCountHeader
-							isLoading={monitorsWithSummaryIsLoading}
-							monitorCount={monitorsSummary?.totalMonitors}
+							isLoading={monitorsWithChecksIsLoading}
+							monitorCount={summary?.totalMonitors}
 						/>
 						<Filter
 							selectedTypes={selectedTypes}

client/src/Validation/validation.js

@@ -112,7 +112,7 @@ const loginCredentials = joi.object({
 });
 
 const monitorValidation = joi.object({
-	_id: joi.string(),
+	id: joi.string(),
 	userId: joi.string(),
 	teamId: joi.string(),
 	statusWindowSize: joi.number().min(1).max(20).default(5).messages({