diff --git a/Client/src/Features/PageSpeedMonitor/pageSpeedMonitorSlice.js b/Client/src/Features/PageSpeedMonitor/pageSpeedMonitorSlice.js index 130883d4a..8b2beceb7 100644 --- a/Client/src/Features/PageSpeedMonitor/pageSpeedMonitorSlice.js +++ b/Client/src/Features/PageSpeedMonitor/pageSpeedMonitorSlice.js @@ -68,8 +68,39 @@ export const getPageSpeedByUserId = createAsyncThunk( } ); -export const deletePageSpeedMonitor = createAsyncThunk( - "monitors/deleteMonitor", +export const updatePageSpeed = createAsyncThunk( + "pageSpeedMonitors/updatePageSpeed", + async (data, thunkApi) => { + try { + const { authToken, monitor } = data; + const updatedFields = { + name: monitor.name, + description: monitor.description, + interval: monitor.interval, + // notifications: monitor.notifications, + }; + const res = await axiosInstance.put( + `/monitors/edit/${monitor._id}`, + updatedFields, + { + headers: { + Authorization: `Bearer ${authToken}`, + "Content-Type": "application/json", + }, + } + ); + return res.data; + } catch (error) { + if (error.response && error.response.data) { + return thunkApi.rejectWithValue(error.response.data); + } + return thunkApi.rejectWithValue(error.message); + } + } +); + +export const deletePageSpeed = createAsyncThunk( + "pageSpeedMonitors/deletePageSpeed", async (data, thunkApi) => { try { const { authToken, monitor } = data; @@ -161,17 +192,36 @@ const pageSpeedMonitorSlice = createSlice({ }) // ***************************************************** - // Delete Monitor + // Create Monitor // ***************************************************** - .addCase(deletePageSpeedMonitor.pending, (state) => { + .addCase(updatePageSpeed.pending, (state) => { state.isLoading = true; }) - .addCase(deletePageSpeedMonitor.fulfilled, (state, action) => { + .addCase(updatePageSpeed.fulfilled, (state, action) => { state.isLoading = false; state.success = action.payload.success; state.msg = action.payload.msg; }) - .addCase(deletePageSpeedMonitor.rejected, (state, action) => { + .addCase(updatePageSpeed.rejected, (state, action) => { + state.isLoading = false; + state.success = false; + state.msg = action.payload + ? action.payload.msg + : "Failed to update page speed monitor"; + }) + + // ***************************************************** + // Delete Monitor + // ***************************************************** + .addCase(deletePageSpeed.pending, (state) => { + state.isLoading = true; + }) + .addCase(deletePageSpeed.fulfilled, (state, action) => { + state.isLoading = false; + state.success = action.payload.success; + state.msg = action.payload.msg; + }) + .addCase(deletePageSpeed.rejected, (state, action) => { state.isLoading = false; state.success = false; state.msg = action.payload diff --git a/Client/src/Pages/PageSpeed/Configure/index.jsx b/Client/src/Pages/PageSpeed/Configure/index.jsx index cc3171699..9cd016cf7 100644 --- a/Client/src/Pages/PageSpeed/Configure/index.jsx +++ b/Client/src/Pages/PageSpeed/Configure/index.jsx @@ -3,7 +3,12 @@ import { useTheme } from "@emotion/react"; import { Box, Modal, Stack, Typography } from "@mui/material"; import { useDispatch, useSelector } from "react-redux"; import { useNavigate, useParams } from "react-router"; -import { deletePageSpeedMonitor } from "../../../Features/PageSpeedMonitor/pageSpeedMonitorSlice"; +import { + deletePageSpeed, + getPageSpeedByUserId, + updatePageSpeed, +} from "../../../Features/PageSpeedMonitor/pageSpeedMonitorSlice"; +import { monitorValidation } from "../../../Validation/validation"; import { createToast } from "../../../Utils/toastUtils"; import Button from "../../../Components/Button"; import Field from "../../../Components/Inputs/Field"; @@ -49,8 +54,11 @@ const PageSpeedConfigure = () => { }, [monitorId]); const handleChange = (event, id) => { - const { value } = event.target; - setForm((prev) => ({ ...prev, [id]: value })); + let { value } = event.target; + if ((id = "interval")) { + value = value * MS_PER_MINUTE; + } + setMonitor((prev) => ({ ...prev, [id]: value })); const { error } = monitorValidation.validate( { [id]: value }, @@ -65,12 +73,23 @@ const PageSpeedConfigure = () => { }); }; + const handleSave = async (event) => { + event.preventDefault(); + const action = await dispatch( + updatePageSpeed({ authToken, monitor: monitor }) + ); + if (action.meta.requestStatus === "fulfilled") { + createToast({ body: "Monitor updated successfully!" }); + dispatch(getPageSpeedByUserId(authToken)); + } else { + createToast({ body: "Failed to update monitor." }); + } + }; + const [isOpen, setIsOpen] = useState(false); const handleRemove = async (event) => { event.preventDefault(); - const action = await dispatch( - deletePageSpeedMonitor({ authToken, monitor }) - ); + const action = await dispatch(deletePageSpeed({ authToken, monitor })); if (action.meta.requestStatus === "fulfilled") { navigate("/pagespeed"); } else { @@ -99,7 +118,7 @@ const PageSpeedConfigure = () => {