From 7bb1245e52a5eb6c659c6a6d1c0061526462860e Mon Sep 17 00:00:00 2001
From: Br0wnHammer <kumararyaman26@gmail.com>
Date: Mon, 5 May 2025 14:41:32 +0530
Subject: [PATCH 1/2] Fix: Re-render of unrelated UI Components

---
 client/src/Pages/Uptime/Monitors/index.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/src/Pages/Uptime/Monitors/index.jsx b/client/src/Pages/Uptime/Monitors/index.jsx
index 74883c909..e3e5718c3 100644
--- a/client/src/Pages/Uptime/Monitors/index.jsx
+++ b/client/src/Pages/Uptime/Monitors/index.jsx
@@ -146,7 +146,7 @@ const UptimeMonitors = () => {
 		monitorUpdateTrigger,
 	});
 
-	const isLoading = monitorsWithSummaryIsLoading || monitorsWithChecksIsLoading;
+	const isLoading = monitorsWithSummaryIsLoading;
 	if (networkError) {
 		return (
 			<GenericFallback>

From 673022120f867245c5fca5059bfb8c28c0f4c671 Mon Sep 17 00:00:00 2001
From: Br0wnHammer <kumararyaman26@gmail.com>
Date: Tue, 6 May 2025 00:41:40 +0530
Subject: [PATCH 2/2] Fix: Re-render of unrelated UI Components

---
 client/src/Components/MonitorCreateHeader/index.jsx | 8 ++++----
 client/src/Pages/Uptime/Monitors/index.jsx          | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/client/src/Components/MonitorCreateHeader/index.jsx b/client/src/Components/MonitorCreateHeader/index.jsx
index 382345379..05a9b7f9b 100644
--- a/client/src/Components/MonitorCreateHeader/index.jsx
+++ b/client/src/Components/MonitorCreateHeader/index.jsx
@@ -1,14 +1,13 @@
 import { Stack, Button } from "@mui/material";
 import { useNavigate } from "react-router-dom";
 import PropTypes from "prop-types";
-import SkeletonLayout from "./skeleton";
 import { useTranslation } from "react-i18next";
 import { useTheme } from "@emotion/react";
 
 const CreateMonitorHeader = ({
 	isAdmin,
 	label = "Create new",
-	shouldRender = true,
+	isLoading = true,
 	path,
 	bulkPath,
 }) => {
@@ -17,7 +16,6 @@ const CreateMonitorHeader = ({
 	const theme = useTheme();
 
 	if (!isAdmin) return null;
-	if (!shouldRender) return <SkeletonLayout />;
 
 	return (
 		<Stack
@@ -27,6 +25,7 @@ const CreateMonitorHeader = ({
 			gap={theme.spacing(6)}
 		>
 			<Button
+				loading={isLoading}
 				variant="contained"
 				color="accent"
 				onClick={() => navigate(path)}
@@ -35,6 +34,7 @@ const CreateMonitorHeader = ({
 			</Button>
 			{bulkPath && (
 				<Button
+					loading={isLoading}
 					variant="contained"
 					color="accent"
 					onClick={() => {
@@ -52,7 +52,7 @@ export default CreateMonitorHeader;
 
 CreateMonitorHeader.propTypes = {
 	isAdmin: PropTypes.bool.isRequired,
-	shouldRender: PropTypes.bool,
+	isLoading: PropTypes.bool,
 	path: PropTypes.string.isRequired,
 	label: PropTypes.string,
 	bulkPath: PropTypes.string,
diff --git a/client/src/Pages/Uptime/Monitors/index.jsx b/client/src/Pages/Uptime/Monitors/index.jsx
index e3e5718c3..60a308141 100644
--- a/client/src/Pages/Uptime/Monitors/index.jsx
+++ b/client/src/Pages/Uptime/Monitors/index.jsx
@@ -146,7 +146,7 @@ const UptimeMonitors = () => {
 		monitorUpdateTrigger,
 	});
 
-	const isLoading = monitorsWithSummaryIsLoading;
+	const isLoading = monitorsWithSummaryIsLoading || monitorsWithChecksIsLoading;
 	if (networkError) {
 		return (
 			<GenericFallback>
@@ -189,7 +189,7 @@ const UptimeMonitors = () => {
 			<Breadcrumbs list={BREADCRUMBS} />
 			<CreateMonitorHeader
 				isAdmin={isAdmin}
-				shouldRender={!isLoading}
+				isLoading={isLoading}
 				path="/uptime/create"
 				bulkPath="/uptime/bulk-import"
 			/>