From b2095670ff59b5e9c6a3a4065b4c5145bd414de5 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Mon, 27 Jan 2025 14:58:37 -0800
Subject: [PATCH] Add missing prop validation, cleanup

---
 .../Uptime/Details/Components/Charts/ChartBox.jsx |  1 +
 .../Components/Charts/ResponseTimeChart.jsx       |  8 ++++++++
 .../Details/Components/ConfigButton/index.jsx     |  7 ++++++-
 .../Details/Components/ResponseTable/index.jsx    |  1 +
 .../Details/Components/StatusBoxes/index.jsx      | 15 +++++++++++----
 .../Details/Components/TimeFramePicker/index.jsx  |  7 +++++++
 6 files changed, 34 insertions(+), 5 deletions(-)

diff --git a/Client/src/Pages/Uptime/Details/Components/Charts/ChartBox.jsx b/Client/src/Pages/Uptime/Details/Components/Charts/ChartBox.jsx
index 672134781..3d4d73421 100644
--- a/Client/src/Pages/Uptime/Details/Components/Charts/ChartBox.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/Charts/ChartBox.jsx
@@ -71,4 +71,5 @@ ChartBox.propTypes = {
 	children: PropTypes.node,
 	icon: PropTypes.node.isRequired,
 	header: PropTypes.string.isRequired,
+	height: PropTypes.string,
 };
diff --git a/Client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx b/Client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx
index 73ffc035e..79e9473ef 100644
--- a/Client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/Charts/ResponseTimeChart.jsx
@@ -2,6 +2,8 @@ import ChartBox from "./ChartBox";
 import MonitorDetailsAreaChart from "../../../../../Components/Charts/MonitorDetailsAreaChart";
 import ResponseTimeIcon from "../../../../../assets/icons/response-time-icon.svg?react";
 import SkeletonLayout from "./ResponseTimeChartSkeleton";
+import PropTypes from "prop-types";
+
 const ResponseTImeChart = ({ shouldRender = true, monitor, dateRange }) => {
 	if (!shouldRender) {
 		return <SkeletonLayout />;
@@ -20,4 +22,10 @@ const ResponseTImeChart = ({ shouldRender = true, monitor, dateRange }) => {
 	);
 };
 
+ResponseTImeChart.propTypes = {
+	shouldRender: PropTypes.bool,
+	monitor: PropTypes.object,
+	dateRange: PropTypes.string,
+};
+
 export default ResponseTImeChart;
diff --git a/Client/src/Pages/Uptime/Details/Components/ConfigButton/index.jsx b/Client/src/Pages/Uptime/Details/Components/ConfigButton/index.jsx
index 9981b4e1c..467655abf 100644
--- a/Client/src/Pages/Uptime/Details/Components/ConfigButton/index.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/ConfigButton/index.jsx
@@ -2,7 +2,7 @@ import { Button, Box } from "@mui/material";
 import { useTheme } from "@emotion/react";
 import { useNavigate } from "react-router-dom";
 import SettingsIcon from "../../../../../assets/icons/settings-bold.svg?react";
-
+import PropTypes from "prop-types";
 const ConfigButton = ({ shouldRender, monitorId }) => {
 	const theme = useTheme();
 	const navigate = useNavigate();
@@ -32,4 +32,9 @@ const ConfigButton = ({ shouldRender, monitorId }) => {
 	);
 };
 
+ConfigButton.propTypes = {
+	shouldRender: PropTypes.bool,
+	monitorId: PropTypes.string,
+};
+
 export default ConfigButton;
diff --git a/Client/src/Pages/Uptime/Details/Components/ResponseTable/index.jsx b/Client/src/Pages/Uptime/Details/Components/ResponseTable/index.jsx
index a510b9bf1..56ea8eca7 100644
--- a/Client/src/Pages/Uptime/Details/Components/ResponseTable/index.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/ResponseTable/index.jsx
@@ -76,6 +76,7 @@ const ResponseTable = ({
 };
 
 ResponseTable.propTypes = {
+	shouldRender: PropTypes.bool,
 	checks: PropTypes.array.isRequired,
 	checksCount: PropTypes.number.isRequired,
 	uiTimezone: PropTypes.string.isRequired,
diff --git a/Client/src/Pages/Uptime/Details/Components/StatusBoxes/index.jsx b/Client/src/Pages/Uptime/Details/Components/StatusBoxes/index.jsx
index 55bcf34da..21922537f 100644
--- a/Client/src/Pages/Uptime/Details/Components/StatusBoxes/index.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/StatusBoxes/index.jsx
@@ -6,12 +6,15 @@ import SkeletonLayout from "./skeleton";
 import { useTheme } from "@mui/material/styles";
 import useUtils from "../../../Home/Hooks/useUtils";
 import { getHumanReadableDuration } from "../../../../../Utils/timeUtils";
-
+import PropTypes from "prop-types";
 const StatusBoxes = ({ shouldRender, monitor, certificateExpiry }) => {
+	// Utils
+	const theme = useTheme();
+	const { determineState } = useUtils();
+
 	if (!shouldRender) {
 		return <SkeletonLayout />;
 	}
-	const theme = useTheme();
 	const { time: streakTime, units: streakUnits } = getHumanReadableDuration(
 		monitor?.uptimeStreak
 	);
@@ -20,8 +23,6 @@ const StatusBoxes = ({ shouldRender, monitor, certificateExpiry }) => {
 		monitor?.timeSinceLastCheck
 	);
 
-	const { determineState } = useUtils();
-
 	return (
 		<Stack
 			direction="row"
@@ -73,4 +74,10 @@ const StatusBoxes = ({ shouldRender, monitor, certificateExpiry }) => {
 	);
 };
 
+StatusBoxes.propTypes = {
+	shouldRender: PropTypes.bool,
+	monitor: PropTypes.object,
+	certificateExpiry: PropTypes.string,
+};
+
 export default StatusBoxes;
diff --git a/Client/src/Pages/Uptime/Details/Components/TimeFramePicker/index.jsx b/Client/src/Pages/Uptime/Details/Components/TimeFramePicker/index.jsx
index ade677604..789030282 100644
--- a/Client/src/Pages/Uptime/Details/Components/TimeFramePicker/index.jsx
+++ b/Client/src/Pages/Uptime/Details/Components/TimeFramePicker/index.jsx
@@ -1,6 +1,7 @@
 import { Stack, Typography, Button, ButtonGroup } from "@mui/material";
 import { useTheme } from "@emotion/react";
 import SkeletonLayout from "./skeleton";
+import PropTypes from "prop-types";
 
 const TimeFramePicker = ({ shouldRender = true, dateRange, setDateRange }) => {
 	const theme = useTheme();
@@ -48,4 +49,10 @@ const TimeFramePicker = ({ shouldRender = true, dateRange, setDateRange }) => {
 	);
 };
 
+TimeFramePicker.propTypes = {
+	shouldRender: PropTypes.bool,
+	dateRange: PropTypes.string,
+	setDateRange: PropTypes.func,
+};
+
 export default TimeFramePicker;