diff --git a/Client/src/Pages/Monitors/Home/MonitorTable/index.jsx b/Client/src/Pages/Monitors/Home/MonitorTable/index.jsx
index 669624025..dae082379 100644
--- a/Client/src/Pages/Monitors/Home/MonitorTable/index.jsx
+++ b/Client/src/Pages/Monitors/Home/MonitorTable/index.jsx
@@ -36,6 +36,11 @@ const MonitorTable = ({ isAdmin }) => {
const [monitors, setMonitors] = useState([]);
const [monitorCount, setMonitorCount] = useState(0);
const authState = useSelector((state) => state.auth);
+ const [updateTrigger, setUpdateTrigger] = useState(false);
+
+ const handleActionMenuDelete = () => {
+ setUpdateTrigger((prev) => !prev);
+ };
const handlePageChange = (_, newPage) => {
setPaginationController({
@@ -60,15 +65,19 @@ const MonitorTable = ({ isAdmin }) => {
paginationController.page,
paginationController.rowsPerPage
);
- console.log(res.data.data);
- setMonitors(res?.data?.data ?? []);
- setMonitorCount(0);
+ setMonitors(res?.data?.data?.monitors ?? []);
+ setMonitorCount(res?.data?.data?.monitorCount ?? 0);
} catch (error) {
logger.error(error);
}
};
fetchPage();
- }, []);
+ }, [
+ updateTrigger,
+ authState,
+ paginationController.page,
+ paginationController.rowsPerPage,
+ ]);
let paginationComponent = <>>;
if (monitorCount > paginationController.rowsPerPage) {
@@ -168,7 +177,11 @@ const MonitorTable = ({ isAdmin }) => {
-
+
);
@@ -181,4 +194,8 @@ const MonitorTable = ({ isAdmin }) => {
);
};
+MonitorTable.propTypes = {
+ isAdmin: PropTypes.bool,
+};
+
export default MonitorTable;
diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
index 7d342f5d7..efb29402d 100644
--- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx
+++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx
@@ -19,7 +19,7 @@ import {
import Settings from "../../../assets/icons/settings-bold.svg?react";
import PropTypes from "prop-types";
-const ActionsMenu = ({ monitor, isAdmin }) => {
+const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => {
const [anchorEl, setAnchorEl] = useState(null);
const [actions, setActions] = useState({});
const [isOpen, setIsOpen] = useState(false);
@@ -37,6 +37,7 @@ const ActionsMenu = ({ monitor, isAdmin }) => {
if (action.meta.requestStatus === "fulfilled") {
setIsOpen(false); // close modal
dispatch(getUptimeMonitorsByTeamId(authState.authToken));
+ updateCallback();
createToast({ body: "Monitor deleted successfully." });
} else {
createToast({ body: "Failed to delete monitor." });
@@ -222,6 +223,7 @@ ActionsMenu.propTypes = {
type: PropTypes.string,
}).isRequired,
isAdmin: PropTypes.bool,
+ updateCallback: PropTypes.func,
};
export default ActionsMenu;
diff --git a/Client/src/Pages/Monitors/Home/index.jsx b/Client/src/Pages/Monitors/Home/index.jsx
index af4e9faef..43ed7f94c 100644
--- a/Client/src/Pages/Monitors/Home/index.jsx
+++ b/Client/src/Pages/Monitors/Home/index.jsx
@@ -9,7 +9,6 @@ import PropTypes from "prop-types";
import SkeletonLayout from "./skeleton";
import Fallback from "./fallback";
import StatusBox from "./StatusBox";
-import { buildData } from "./monitorData";
import Breadcrumbs from "../../../Components/Breadcrumbs";
import Greeting from "../../../Utils/greeting";
import MonitorTable from "./MonitorTable";
@@ -25,7 +24,7 @@ const Monitors = ({ isAdmin }) => {
dispatch(getUptimeMonitorsByTeamId(authState.authToken));
}, [authState.authToken, dispatch]);
- const monitorStats = monitorState.monitors.reduce(
+ const monitorStats = monitorState.monitors.monitors.reduce(
(acc, monitor) => {
if (monitor.isActive === false) {
acc["paused"] += 1;
@@ -39,8 +38,6 @@ const Monitors = ({ isAdmin }) => {
{ paused: 0, up: 0, down: 0 }
);
- const data = buildData(monitorState.monitors, isAdmin, navigate);
-
let loading = monitorState.isLoading && monitorState.monitors.length === 0;
return (
@@ -119,8 +116,7 @@ const Monitors = ({ isAdmin }) => {
{/* TODO - add search bar */}
-
- {/* */}
+
>
)}
diff --git a/Server/db/mongo/modules/monitorModule.js b/Server/db/mongo/modules/monitorModule.js
index 2aba60c73..4d312dd2c 100644
--- a/Server/db/mongo/modules/monitorModule.js
+++ b/Server/db/mongo/modules/monitorModule.js
@@ -396,6 +396,7 @@ const getMonitorsByTeamId = async (req, res) => {
let { limit, type, status, sortOrder, normalize, page, rowsPerPage } =
req.query || {};
const monitorQuery = { teamId: req.params.teamId };
+ const monitorsCount = await Monitor.countDocuments(monitorQuery);
// Pagination
let skip = 0;
@@ -449,7 +450,7 @@ const getMonitorsByTeamId = async (req, res) => {
return { ...monitor.toObject(), checks };
})
);
- return monitorsWithChecks;
+ return { monitors: monitorsWithChecks, monitorCount: monitorsCount };
} catch (error) {
throw error;
}