From f47d3c2cd6acabad48b414ad2750f97f8812a144 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Mon, 16 Jun 2025 12:56:08 +0530 Subject: [PATCH 1/9] Feat: useFetchChecksByMonitor --- client/src/Hooks/checkHooksMonitor.js | 58 +++++++++++++++++++++++++++ 1 file changed, 58 insertions(+) create mode 100644 client/src/Hooks/checkHooksMonitor.js diff --git a/client/src/Hooks/checkHooksMonitor.js b/client/src/Hooks/checkHooksMonitor.js new file mode 100644 index 000000000..00f1c9671 --- /dev/null +++ b/client/src/Hooks/checkHooksMonitor.js @@ -0,0 +1,58 @@ +import { useState, useEffect } from "react"; +import { networkService } from "../main"; +import { createToast } from "../Utils/toastUtils"; + +const useFetchChecksByMonitor = ({ + monitorId, + type, + status, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, +}) => { + const [checks, setChecks] = useState(undefined); + const [checksCount, setChecksCount] = useState(undefined); + const [isLoading, setIsLoading] = useState(false); + const [networkError, setNetworkError] = useState(false); + + useEffect(() => { + const fetchChecks = async () => { + if (!type) { + return; + } + + const config = { + monitorId, + type, + status, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, + } + + try { + setIsLoading(true); + const res = await networkService.getChecksByMonitor(config); + setChecks(res.data.data.checks); + setChecksCount(res.data.data.checksCount); + } catch (error) { + setNetworkError(true); + createToast({ body: error.message }); + } finally { + setIsLoading(false); + } + }; + + fetchChecks(); + }, [monitorId, type, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); + + return [checks, checksCount, isLoading, networkError]; +}; + +export { useFetchChecksByMonitor }; \ No newline at end of file From bebbe5896d395cb91090be5de5e991b059d8fd43 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Mon, 16 Jun 2025 12:57:00 +0530 Subject: [PATCH 2/9] Uptime useFetchChecksByMonitor Integration --- client/src/Pages/Uptime/Details/index.jsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/client/src/Pages/Uptime/Details/index.jsx b/client/src/Pages/Uptime/Details/index.jsx index 79762e0c3..8c1dbe562 100644 --- a/client/src/Pages/Uptime/Details/index.jsx +++ b/client/src/Pages/Uptime/Details/index.jsx @@ -18,7 +18,7 @@ import { useTheme } from "@emotion/react"; import { useIsAdmin } from "../../../Hooks/useIsAdmin"; import { useFetchUptimeMonitorById } from "../../../Hooks/monitorHooks"; import useCertificateFetch from "./Hooks/useCertificateFetch"; -import { useFetchChecks } from "../../../Hooks/checkHooks"; +import { useFetchChecksByMonitor } from "../../../Hooks/checkHooksMonitor"; import { useTranslation } from "react-i18next"; // Constants @@ -66,7 +66,7 @@ const UptimeDetails = () => { const monitorType = monitor?.type; - const [checks, checksCount, checksAreLoading, checksNetworkError] = useFetchChecks({ + const [checks, checksCount, checksAreLoading, checksNetworkError] = useFetchChecksByMonitor({ monitorId, type: monitorType, sortOrder: "desc", From 37406484fcb86419a6496fc4a95049cee742c43a Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Mon, 16 Jun 2025 13:00:23 +0530 Subject: [PATCH 3/9] useFetchChecksTeam Hook --- .../{checkHooks.js => checkHooksTeam.js} | 48 ++++++------------- .../Components/IncidentTable/index.jsx | 4 +- 2 files changed, 16 insertions(+), 36 deletions(-) rename client/src/Hooks/{checkHooks.js => checkHooksTeam.js} (62%) diff --git a/client/src/Hooks/checkHooks.js b/client/src/Hooks/checkHooksTeam.js similarity index 62% rename from client/src/Hooks/checkHooks.js rename to client/src/Hooks/checkHooksTeam.js index dac2be671..fedd88d52 100644 --- a/client/src/Hooks/checkHooks.js +++ b/client/src/Hooks/checkHooksTeam.js @@ -2,10 +2,8 @@ import { useState, useEffect } from "react"; import { networkService } from "../main"; import { createToast } from "../Utils/toastUtils"; -const useFetchChecks = ({ +const useFetchChecksTeam = ({ teamId, - monitorId, - type, status, sortOrder, limit, @@ -21,40 +19,24 @@ const useFetchChecks = ({ useEffect(() => { const fetchChecks = async () => { - if (!type && !teamId) { + if (!teamId) { return; } - const method = monitorId - ? networkService.getChecksByMonitor - : networkService.getChecksByTeam; - - const config = monitorId - ? { - monitorId, - type, - status, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, - } - : { - status, - teamId, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, - }; + const config = { + status, + teamId, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, + }; try { setIsLoading(true); - const res = await method(config); + const res = await networkService.getChecksByTeam(config); setChecks(res.data.data.checks); setChecksCount(res.data.data.checksCount); } catch (error) { @@ -67,9 +49,7 @@ const useFetchChecks = ({ fetchChecks(); }, [ - monitorId, teamId, - type, status, sortOrder, limit, @@ -82,4 +62,4 @@ const useFetchChecks = ({ return [checks, checksCount, isLoading, networkError]; }; -export { useFetchChecks }; +export { useFetchChecksTeam }; diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index cf6fbb49d..98f0c3d8f 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -13,7 +13,7 @@ import { useSelector } from "react-redux"; import { useState, useEffect } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; -import { useFetchChecks } from "../../../../Hooks/checkHooks"; +import { useFetchChecksTeam } from "../../../../Hooks/checkHooksTeam"; const IncidentTable = ({ shouldRender, @@ -34,7 +34,7 @@ const IncidentTable = ({ const selectedMonitorDetails = monitors?.[selectedMonitor]; const selectedMonitorType = selectedMonitorDetails?.type; - const [checks, checksCount, isLoading, networkError] = useFetchChecks({ + const [checks, checksCount, isLoading, networkError] = useFetchChecksTeam({ status: false, monitorId, teamId, From 638fcb3b9bc43351f7e250f27656ddf3868026a5 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Mon, 16 Jun 2025 13:08:39 +0530 Subject: [PATCH 4/9] Incidents useFetchChecksMonitor Integration --- .../Pages/Incidents/Components/IncidentTable/index.jsx | 8 ++------ 1 file changed, 2 insertions(+), 6 deletions(-) diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index 98f0c3d8f..05c776367 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -13,7 +13,7 @@ import { useSelector } from "react-redux"; import { useState, useEffect } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; -import { useFetchChecksTeam } from "../../../../Hooks/checkHooksTeam"; +import { useFetchChecksByMonitor } from "../../../../Hooks/checkHooksMonitor"; const IncidentTable = ({ shouldRender, @@ -26,7 +26,6 @@ const IncidentTable = ({ const uiTimezone = useSelector((state) => state.ui.timezone); //Local state - const [teamId, setTeamId] = useState(undefined); const [monitorId, setMonitorId] = useState(undefined); const [page, setPage] = useState(0); @@ -34,10 +33,9 @@ const IncidentTable = ({ const selectedMonitorDetails = monitors?.[selectedMonitor]; const selectedMonitorType = selectedMonitorDetails?.type; - const [checks, checksCount, isLoading, networkError] = useFetchChecksTeam({ + const [checks, checksCount, isLoading, networkError] = useFetchChecksByMonitor({ status: false, monitorId, - teamId, type: selectedMonitorType, sortOrder: "desc", limit: null, @@ -60,11 +58,9 @@ const IncidentTable = ({ useEffect(() => { if (selectedMonitor === "0") { - setTeamId("placeholder"); // TODO this isn't needed any longer, fix hook setMonitorId(undefined); } else { setMonitorId(selectedMonitor); - setTeamId(undefined); } }, [selectedMonitor]); From c981b25ef91da0c418eb9ef456d67197ba157e10 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Mon, 16 Jun 2025 13:51:15 +0530 Subject: [PATCH 5/9] Hooks integration in Incidents Table --- client/src/Hooks/checkHooksMonitor.js | 66 +++++++++---------- client/src/Hooks/checkHooksTeam.js | 11 +--- .../Components/IncidentTable/index.jsx | 53 ++++++++------- client/src/Pages/Uptime/Details/index.jsx | 21 +++--- 4 files changed, 76 insertions(+), 75 deletions(-) diff --git a/client/src/Hooks/checkHooksMonitor.js b/client/src/Hooks/checkHooksMonitor.js index 00f1c9671..e46adfa98 100644 --- a/client/src/Hooks/checkHooksMonitor.js +++ b/client/src/Hooks/checkHooksMonitor.js @@ -13,46 +13,46 @@ const useFetchChecksByMonitor = ({ page, rowsPerPage, }) => { - const [checks, setChecks] = useState(undefined); + const [checks, setChecks] = useState(undefined); const [checksCount, setChecksCount] = useState(undefined); const [isLoading, setIsLoading] = useState(false); const [networkError, setNetworkError] = useState(false); - useEffect(() => { - const fetchChecks = async () => { - if (!type) { - return; - } + useEffect(() => { + const fetchChecks = async () => { + if (!type) { + return; + } - const config = { - monitorId, - type, - status, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, - } + const config = { + monitorId, + type, + status, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, + }; - try { - setIsLoading(true); - const res = await networkService.getChecksByMonitor(config); - setChecks(res.data.data.checks); - setChecksCount(res.data.data.checksCount); - } catch (error) { - setNetworkError(true); - createToast({ body: error.message }); - } finally { - setIsLoading(false); - } - }; + try { + setIsLoading(true); + const res = await networkService.getChecksByMonitor(config); + setChecks(res.data.data.checks); + setChecksCount(res.data.data.checksCount); + } catch (error) { + setNetworkError(true); + createToast({ body: error.message }); + } finally { + setIsLoading(false); + } + }; - fetchChecks(); - }, [monitorId, type, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); + fetchChecks(); + }, [monitorId, type, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); - return [checks, checksCount, isLoading, networkError]; + return [checks, checksCount, isLoading, networkError]; }; -export { useFetchChecksByMonitor }; \ No newline at end of file +export { useFetchChecksByMonitor }; diff --git a/client/src/Hooks/checkHooksTeam.js b/client/src/Hooks/checkHooksTeam.js index fedd88d52..05f8b67e5 100644 --- a/client/src/Hooks/checkHooksTeam.js +++ b/client/src/Hooks/checkHooksTeam.js @@ -48,16 +48,7 @@ const useFetchChecksTeam = ({ }; fetchChecks(); - }, [ - teamId, - status, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, - ]); + }, [teamId, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); return [checks, checksCount, isLoading, networkError]; }; diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index 05c776367..97a006884 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -10,9 +10,10 @@ import NetworkError from "../../../../Components/GenericFallback/NetworkError"; //Utils import { formatDateWithTz } from "../../../../Utils/timeUtils"; import { useSelector } from "react-redux"; -import { useState, useEffect } from "react"; +import { useState } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; +import { useFetchChecksTeam } from "../../../../Hooks/checkHooksTeam"; import { useFetchChecksByMonitor } from "../../../../Hooks/checkHooksMonitor"; const IncidentTable = ({ @@ -26,24 +27,40 @@ const IncidentTable = ({ const uiTimezone = useSelector((state) => state.ui.timezone); //Local state - const [monitorId, setMonitorId] = useState(undefined); - const [page, setPage] = useState(0); const [rowsPerPage, setRowsPerPage] = useState(10); const selectedMonitorDetails = monitors?.[selectedMonitor]; const selectedMonitorType = selectedMonitorDetails?.type; - const [checks, checksCount, isLoading, networkError] = useFetchChecksByMonitor({ - status: false, - monitorId, - type: selectedMonitorType, - sortOrder: "desc", - limit: null, - dateRange, - filter: filter, - page: page, - rowsPerPage: rowsPerPage, - }); + const [checksMonitor, checksCountMonitor, isLoadingMonitor, networkErrorMonitor] = + useFetchChecksByMonitor({ + monitorId: selectedMonitor === "0" ? undefined : selectedMonitor, + type: selectedMonitorType, + status: false, + sortOrder: "desc", + limit: null, + dateRange, + filter: filter, + page: page, + rowsPerPage: rowsPerPage, + }); + + const [checksTeam, checksCountTeam, isLoadingTeam, networkErrorTeam] = + useFetchChecksTeam({ + teamId: "placeholder", + status: false, + sortOrder: "desc", + limit: null, + dateRange, + filter: filter, + page: page, + rowsPerPage: rowsPerPage, + }); + + const checks = selectedMonitor === "0" ? checksTeam : checksMonitor; + const checksCount = selectedMonitor === "0" ? checksCountTeam : checksCountMonitor; + const isLoading = selectedMonitor === "0" ? isLoadingTeam : isLoadingMonitor; + const networkError = selectedMonitor === "0" ? networkErrorTeam : networkErrorMonitor; const { t } = useTranslation(); @@ -56,14 +73,6 @@ const IncidentTable = ({ setRowsPerPage(event.target.value); }; - useEffect(() => { - if (selectedMonitor === "0") { - setMonitorId(undefined); - } else { - setMonitorId(selectedMonitor); - } - }, [selectedMonitor]); - const headers = [ { id: "monitorName", diff --git a/client/src/Pages/Uptime/Details/index.jsx b/client/src/Pages/Uptime/Details/index.jsx index 8c1dbe562..1d6b9c392 100644 --- a/client/src/Pages/Uptime/Details/index.jsx +++ b/client/src/Pages/Uptime/Details/index.jsx @@ -66,16 +66,17 @@ const UptimeDetails = () => { const monitorType = monitor?.type; - const [checks, checksCount, checksAreLoading, checksNetworkError] = useFetchChecksByMonitor({ - monitorId, - type: monitorType, - sortOrder: "desc", - limit: null, - dateRange, - filter: null, - page, - rowsPerPage, - }); + const [checks, checksCount, checksAreLoading, checksNetworkError] = + useFetchChecksByMonitor({ + monitorId, + type: monitorType, + sortOrder: "desc", + limit: null, + dateRange, + filter: null, + page, + rowsPerPage, + }); // Handlers const triggerUpdate = () => { From bcf883223b4bd9369b038ce060b34ee658a3e30e Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Tue, 17 Jun 2025 13:13:21 +0530 Subject: [PATCH 6/9] Exporting Hooks from One File --- .../{checkHooksMonitor.js => checkHooks.js} | 53 +++++++++++++++++- client/src/Hooks/checkHooksTeam.js | 56 ------------------- .../Components/IncidentTable/index.jsx | 12 ++-- client/src/Pages/Uptime/Details/index.jsx | 2 +- 4 files changed, 59 insertions(+), 64 deletions(-) rename client/src/Hooks/{checkHooksMonitor.js => checkHooks.js} (52%) delete mode 100644 client/src/Hooks/checkHooksTeam.js diff --git a/client/src/Hooks/checkHooksMonitor.js b/client/src/Hooks/checkHooks.js similarity index 52% rename from client/src/Hooks/checkHooksMonitor.js rename to client/src/Hooks/checkHooks.js index e46adfa98..ed4cffe3f 100644 --- a/client/src/Hooks/checkHooksMonitor.js +++ b/client/src/Hooks/checkHooks.js @@ -2,6 +2,57 @@ import { useState, useEffect } from "react"; import { networkService } from "../main"; import { createToast } from "../Utils/toastUtils"; +const useFetchChecksTeam = ({ + teamId, + status, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, +}) => { + const [checks, setChecks] = useState(undefined); + const [checksCount, setChecksCount] = useState(undefined); + const [isLoading, setIsLoading] = useState(false); + const [networkError, setNetworkError] = useState(false); + + useEffect(() => { + const fetchChecks = async () => { + if (!teamId) { + return; + } + + const config = { + status, + teamId, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, + }; + + try { + setIsLoading(true); + const res = await networkService.getChecksByTeam(config); + setChecks(res.data.data.checks); + setChecksCount(res.data.data.checksCount); + } catch (error) { + setNetworkError(true); + createToast({ body: error.message }); + } finally { + setIsLoading(false); + } + }; + + fetchChecks(); + }, [teamId, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); + + return [checks, checksCount, isLoading, networkError]; +}; + const useFetchChecksByMonitor = ({ monitorId, type, @@ -55,4 +106,4 @@ const useFetchChecksByMonitor = ({ return [checks, checksCount, isLoading, networkError]; }; -export { useFetchChecksByMonitor }; +export { useFetchChecksByMonitor, useFetchChecksTeam }; diff --git a/client/src/Hooks/checkHooksTeam.js b/client/src/Hooks/checkHooksTeam.js deleted file mode 100644 index 05f8b67e5..000000000 --- a/client/src/Hooks/checkHooksTeam.js +++ /dev/null @@ -1,56 +0,0 @@ -import { useState, useEffect } from "react"; -import { networkService } from "../main"; -import { createToast } from "../Utils/toastUtils"; - -const useFetchChecksTeam = ({ - teamId, - status, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, -}) => { - const [checks, setChecks] = useState(undefined); - const [checksCount, setChecksCount] = useState(undefined); - const [isLoading, setIsLoading] = useState(false); - const [networkError, setNetworkError] = useState(false); - - useEffect(() => { - const fetchChecks = async () => { - if (!teamId) { - return; - } - - const config = { - status, - teamId, - sortOrder, - limit, - dateRange, - filter, - page, - rowsPerPage, - }; - - try { - setIsLoading(true); - const res = await networkService.getChecksByTeam(config); - setChecks(res.data.data.checks); - setChecksCount(res.data.data.checksCount); - } catch (error) { - setNetworkError(true); - createToast({ body: error.message }); - } finally { - setIsLoading(false); - } - }; - - fetchChecks(); - }, [teamId, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); - - return [checks, checksCount, isLoading, networkError]; -}; - -export { useFetchChecksTeam }; diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index 97a006884..b36abad70 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -13,8 +13,8 @@ import { useSelector } from "react-redux"; import { useState } from "react"; import PropTypes from "prop-types"; import { useTranslation } from "react-i18next"; -import { useFetchChecksTeam } from "../../../../Hooks/checkHooksTeam"; -import { useFetchChecksByMonitor } from "../../../../Hooks/checkHooksMonitor"; +import { useFetchChecksTeam } from "../../../../Hooks/checkHooks"; +import { useFetchChecksByMonitor } from "../../../../Hooks/checkHooks"; const IncidentTable = ({ shouldRender, @@ -57,10 +57,10 @@ const IncidentTable = ({ rowsPerPage: rowsPerPage, }); - const checks = selectedMonitor === "0" ? checksTeam : checksMonitor; - const checksCount = selectedMonitor === "0" ? checksCountTeam : checksCountMonitor; - const isLoading = selectedMonitor === "0" ? isLoadingTeam : isLoadingMonitor; - const networkError = selectedMonitor === "0" ? networkErrorTeam : networkErrorMonitor; + const checks = checksTeam || checksMonitor; + const checksCount = checksCountTeam || checksCountMonitor; + const isLoading = isLoadingTeam || isLoadingMonitor; + const networkError = networkErrorTeam || networkErrorMonitor; const { t } = useTranslation(); diff --git a/client/src/Pages/Uptime/Details/index.jsx b/client/src/Pages/Uptime/Details/index.jsx index 1d6b9c392..5f36ee7e5 100644 --- a/client/src/Pages/Uptime/Details/index.jsx +++ b/client/src/Pages/Uptime/Details/index.jsx @@ -18,7 +18,7 @@ import { useTheme } from "@emotion/react"; import { useIsAdmin } from "../../../Hooks/useIsAdmin"; import { useFetchUptimeMonitorById } from "../../../Hooks/monitorHooks"; import useCertificateFetch from "./Hooks/useCertificateFetch"; -import { useFetchChecksByMonitor } from "../../../Hooks/checkHooksMonitor"; +import { useFetchChecksByMonitor } from "../../../Hooks/checkHooks"; import { useTranslation } from "react-i18next"; // Constants From 287ea3e5a6638bbd3b677abe77eb3989213b2962 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Tue, 17 Jun 2025 13:27:51 +0530 Subject: [PATCH 7/9] Updated params --- client/src/Hooks/checkHooks.js | 23 ++++++++++++++----- .../Components/IncidentTable/index.jsx | 11 +++++---- 2 files changed, 23 insertions(+), 11 deletions(-) diff --git a/client/src/Hooks/checkHooks.js b/client/src/Hooks/checkHooks.js index ed4cffe3f..2f05d3538 100644 --- a/client/src/Hooks/checkHooks.js +++ b/client/src/Hooks/checkHooks.js @@ -3,7 +3,6 @@ import { networkService } from "../main"; import { createToast } from "../Utils/toastUtils"; const useFetchChecksTeam = ({ - teamId, status, sortOrder, limit, @@ -11,6 +10,7 @@ const useFetchChecksTeam = ({ filter, page, rowsPerPage, + enabled = true, }) => { const [checks, setChecks] = useState(undefined); const [checksCount, setChecksCount] = useState(undefined); @@ -19,13 +19,12 @@ const useFetchChecksTeam = ({ useEffect(() => { const fetchChecks = async () => { - if (!teamId) { + if (!enabled) { return; } const config = { status, - teamId, sortOrder, limit, dateRange, @@ -48,7 +47,7 @@ const useFetchChecksTeam = ({ }; fetchChecks(); - }, [teamId, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); + }, [status, sortOrder, limit, dateRange, filter, page, rowsPerPage, enabled]); return [checks, checksCount, isLoading, networkError]; }; @@ -63,6 +62,7 @@ const useFetchChecksByMonitor = ({ filter, page, rowsPerPage, + enabled = true, }) => { const [checks, setChecks] = useState(undefined); const [checksCount, setChecksCount] = useState(undefined); @@ -71,7 +71,7 @@ const useFetchChecksByMonitor = ({ useEffect(() => { const fetchChecks = async () => { - if (!type) { + if (!enabled) { return; } @@ -101,7 +101,18 @@ const useFetchChecksByMonitor = ({ }; fetchChecks(); - }, [monitorId, type, status, sortOrder, limit, dateRange, filter, page, rowsPerPage]); + }, [ + monitorId, + type, + status, + sortOrder, + limit, + dateRange, + filter, + page, + rowsPerPage, + enabled, + ]); return [checks, checksCount, isLoading, networkError]; }; diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index b36abad70..71abf842c 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -43,11 +43,11 @@ const IncidentTable = ({ filter: filter, page: page, rowsPerPage: rowsPerPage, + enabled: selectedMonitor !== "0", }); const [checksTeam, checksCountTeam, isLoadingTeam, networkErrorTeam] = useFetchChecksTeam({ - teamId: "placeholder", status: false, sortOrder: "desc", limit: null, @@ -55,12 +55,13 @@ const IncidentTable = ({ filter: filter, page: page, rowsPerPage: rowsPerPage, + enabled: selectedMonitor === "0", }); - const checks = checksTeam || checksMonitor; - const checksCount = checksCountTeam || checksCountMonitor; - const isLoading = isLoadingTeam || isLoadingMonitor; - const networkError = networkErrorTeam || networkErrorMonitor; + const checks = selectedMonitor === "0" ? checksTeam : checksMonitor; + const checksCount = selectedMonitor === "0" ? checksCountTeam : checksCountMonitor; + const isLoading = selectedMonitor === "0" ? isLoadingTeam : isLoadingMonitor; + const networkError = selectedMonitor === "0" ? networkErrorTeam : networkErrorMonitor; const { t } = useTranslation(); From acd5dc982eecb144aa4bf361ddaf4762e3ba40c8 Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Wed, 18 Jun 2025 11:13:42 +0530 Subject: [PATCH 8/9] Fix: Type Check in useFetchChecksMonitor --- client/src/Hooks/checkHooks.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/Hooks/checkHooks.js b/client/src/Hooks/checkHooks.js index 2f05d3538..683b89b20 100644 --- a/client/src/Hooks/checkHooks.js +++ b/client/src/Hooks/checkHooks.js @@ -71,7 +71,7 @@ const useFetchChecksByMonitor = ({ useEffect(() => { const fetchChecks = async () => { - if (!enabled) { + if (!enabled || !type) { return; } From a091bf23b701b3b201571e25541dc1206363f9ee Mon Sep 17 00:00:00 2001 From: Br0wnHammer Date: Wed, 18 Jun 2025 11:32:33 +0530 Subject: [PATCH 9/9] isLoading Check --- client/src/Pages/Incidents/Components/IncidentTable/index.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx index 71abf842c..3b2e07238 100644 --- a/client/src/Pages/Incidents/Components/IncidentTable/index.jsx +++ b/client/src/Pages/Incidents/Components/IncidentTable/index.jsx @@ -60,7 +60,7 @@ const IncidentTable = ({ const checks = selectedMonitor === "0" ? checksTeam : checksMonitor; const checksCount = selectedMonitor === "0" ? checksCountTeam : checksCountMonitor; - const isLoading = selectedMonitor === "0" ? isLoadingTeam : isLoadingMonitor; + const isLoading = isLoadingTeam || isLoadingMonitor; const networkError = selectedMonitor === "0" ? networkErrorTeam : networkErrorMonitor; const { t } = useTranslation();