From 6e5d596e2fcd08f36d43207c00fc6fac788309a8 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ivana=20=C5=A0tef=C3=A1nikov=C3=A1=C3=A1=C5=A0=C3=A1?= Date: Sat, 12 Oct 2024 10:21:11 +0200 Subject: [PATCH 1/3] adds pause to action menu --- .../src/Pages/Monitors/Home/actionsMenu.jsx | 41 ++++++++++++++++++- 1 file changed, 40 insertions(+), 1 deletion(-) diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx index abb1af243..315f850f4 100644 --- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx +++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx @@ -14,6 +14,7 @@ import { } from "@mui/material"; import { deleteUptimeMonitor, + pauseUptimeMonitor, getUptimeMonitorsByTeamId, } from "../../../Features/UptimeMonitors/uptimeMonitorsSlice"; import Settings from "../../../assets/icons/settings-bold.svg?react"; @@ -26,6 +27,8 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { const dispatch = useDispatch(); const theme = useTheme(); const authState = useSelector((state) => state.auth); + const authToken = authState.authToken; + const handleRemove = async (event) => { event.preventDefault(); @@ -44,6 +47,28 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { } }; + const handlePause = async (event) => { + try { + const action = await dispatch( + pauseUptimeMonitor({ authToken, monitorId: monitor._id }) + ); + if (pauseUptimeMonitor.fulfilled.match(action)) { + updateCallback(); + //window.location.reload(); + if (monitor?.isActive){ + createToast({ body: "Monitor paused successfully." }); + }else{ + createToast({ body: "Monitor resume successfully." }); + } + } else { + throw new Error(action.error.message); + } + } catch (error) { + console.error("Error pausing monitor:", monitor._id, error); + createToast({ body: "Failed to pause monitor." }); + } + }; + const openMenu = (event, id, url) => { event.preventDefault(); event.stopPropagation(); @@ -155,6 +180,20 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { Clone )} + {isAdmin && ( + { + e.stopPropagation(); + handlePause(e); + }} + > + {monitor?.isActive ? ( + "Pause" + ) : ( + "Resume" + )} + + )} {isAdmin && ( { @@ -164,7 +203,7 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { > Remove - )} + )} Date: Sat, 12 Oct 2024 10:51:15 +0200 Subject: [PATCH 2/3] edits based on the comments --- Client/src/Pages/Monitors/Home/actionsMenu.jsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx index 315f850f4..db57f44df 100644 --- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx +++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx @@ -55,10 +55,10 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { if (pauseUptimeMonitor.fulfilled.match(action)) { updateCallback(); //window.location.reload(); - if (monitor?.isActive){ + if (action.payload?.isActive === false){ createToast({ body: "Monitor paused successfully." }); }else{ - createToast({ body: "Monitor resume successfully." }); + createToast({ body: "Monitor resumed successfully." }); } } else { throw new Error(action.error.message); @@ -277,6 +277,7 @@ ActionsMenu.propTypes = { _id: PropTypes.string, url: PropTypes.string, type: PropTypes.string, + isActive: PropTypes.bool, }).isRequired, isAdmin: PropTypes.bool, updateCallback: PropTypes.func, From b191cf36a73fae71221bd9acb29a089048096ab4 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Ivana=20=C5=A0tef=C3=A1nikov=C3=A1=C3=A1=C5=A0=C3=A1?= Date: Sat, 12 Oct 2024 14:32:15 +0200 Subject: [PATCH 3/3] Changes based on review --- .../src/Pages/Monitors/Home/actionsMenu.jsx | 22 +++++++------------ 1 file changed, 8 insertions(+), 14 deletions(-) diff --git a/Client/src/Pages/Monitors/Home/actionsMenu.jsx b/Client/src/Pages/Monitors/Home/actionsMenu.jsx index db57f44df..d2ccc0b88 100644 --- a/Client/src/Pages/Monitors/Home/actionsMenu.jsx +++ b/Client/src/Pages/Monitors/Home/actionsMenu.jsx @@ -3,6 +3,7 @@ import { useSelector, useDispatch } from "react-redux"; import { useTheme } from "@emotion/react"; import { useNavigate } from "react-router-dom"; import { createToast } from "../../../Utils/toastUtils"; +import { logger } from "../../../Utils/Logger"; import { Button, IconButton, @@ -47,24 +48,20 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { } }; - const handlePause = async (event) => { + const handlePause = async () => { try { const action = await dispatch( pauseUptimeMonitor({ authToken, monitorId: monitor._id }) ); if (pauseUptimeMonitor.fulfilled.match(action)) { updateCallback(); - //window.location.reload(); - if (action.payload?.isActive === false){ - createToast({ body: "Monitor paused successfully." }); - }else{ - createToast({ body: "Monitor resumed successfully." }); - } + const state = action?.payload?.data.isActive === false ? "paused" : "resumed"; + createToast({ body: `Monitor ${state} successfully.` }); } else { - throw new Error(action.error.message); + throw new Error(action?.error?.message ?? "Failed to pause monitor."); } } catch (error) { - console.error("Error pausing monitor:", monitor._id, error); + logger.error("Error pausing monitor:", monitor._id, error); createToast({ body: "Failed to pause monitor." }); } }; @@ -187,11 +184,8 @@ const ActionsMenu = ({ monitor, isAdmin, updateCallback }) => { handlePause(e); }} > - {monitor?.isActive ? ( - "Pause" - ) : ( - "Resume" - )} + {monitor?.isActive === true ? "Pause" : "Resume"} + )} {isAdmin && (