diff --git a/Client/src/Pages/Monitors/Configure/index.jsx b/Client/src/Pages/Monitors/Configure/index.jsx
index c34be3a2f..12f97ab1e 100644
--- a/Client/src/Pages/Monitors/Configure/index.jsx
+++ b/Client/src/Pages/Monitors/Configure/index.jsx
@@ -62,6 +62,10 @@ const Configure = () => {
useEffect(() => {
const data = monitors.find((monitor) => monitor._id === monitorId);
+ if (!data) {
+ console.error("Error fetching monitor of id: " + monitorId);
+ navigate("/not-found");
+ }
setMonitor({
...data,
});
diff --git a/Client/src/Pages/Monitors/Details/index.jsx b/Client/src/Pages/Monitors/Details/index.jsx
index 852f602e7..bbfba0b43 100644
--- a/Client/src/Pages/Monitors/Details/index.jsx
+++ b/Client/src/Pages/Monitors/Details/index.jsx
@@ -12,7 +12,7 @@ import Button from "../../../Components/Button";
import WestRoundedIcon from "@mui/icons-material/WestRounded";
import GreenCheck from "../../../assets/icons/checkbox-green.svg?react";
import RedCheck from "../../../assets/icons/checkbox-red.svg?react";
-import SettingsIcon from "../../../assets/icons/settings.svg?react";
+import SettingsIcon from "../../../assets/icons/settings-bold.svg?react";
import {
formatDuration,
formatDurationRounded,
@@ -43,45 +43,53 @@ const DetailsPage = () => {
useEffect(() => {
const fetchMonitor = async () => {
- const res = await axiosInstance.get(
- `/monitors/${monitorId}?sortOrder=asc`,
- {
- headers: {
- Authorization: `Bearer ${authToken}`,
- },
- }
- );
- setMonitor(res.data.data);
- const data = {
- cols: [
- { id: 1, name: "Status" },
- { id: 2, name: "Date & Time" },
- { id: 3, name: "Message" },
- ],
- rows: res.data.data.checks.map((check, idx) => {
- const status = check.status === true ? "up" : "down";
+ try {
+ const res = await axiosInstance.get(
+ `/monitors/${monitorId}?sortOrder=asc`,
+ {
+ headers: {
+ Authorization: `Bearer ${authToken}`,
+ },
+ }
+ );
+ setMonitor(res.data.data);
+ const data = {
+ cols: [
+ { id: 1, name: "Status" },
+ { id: 2, name: "Date & Time" },
+ { id: 3, name: "Message" },
+ ],
+ rows: res.data.data.checks.map((check, idx) => {
+ const status = check.status === true ? "up" : "down";
- return {
- id: check._id,
- data: [
- {
- id: idx,
- data: (
-
- ),
- },
- { id: idx + 1, data: new Date(check.createdAt).toLocaleString() },
- { id: idx + 2, data: check.statusCode },
- ],
- };
- }),
- };
+ return {
+ id: check._id,
+ data: [
+ {
+ id: idx,
+ data: (
+
+ ),
+ },
+ {
+ id: idx + 1,
+ data: new Date(check.createdAt).toLocaleString(),
+ },
+ { id: idx + 2, data: check.statusCode },
+ ],
+ };
+ }),
+ };
- setData(data);
+ setData(data);
+ } catch (error) {
+ console.error("Error fetching monitor of id: " + monitorId);
+ navigate("/not-found");
+ }
};
fetchMonitor();
}, [monitorId, authToken]);
@@ -195,7 +203,11 @@ const DetailsPage = () => {
level="tertiary"
label="Configure"
animate="rotate90"
- img={}
+ img={
+
+ }
onClick={() => navigate(`/monitors/configure/${monitorId}`)}
sx={{
ml: "auto",
diff --git a/Client/src/Pages/Monitors/index.css b/Client/src/Pages/Monitors/index.css
index a9317d5da..180bac0b8 100644
--- a/Client/src/Pages/Monitors/index.css
+++ b/Client/src/Pages/Monitors/index.css
@@ -9,7 +9,7 @@
.monitors h2.MuiTypography-root {
font-size: var(--env-var-font-size-large);
}
-.monitors .MuiStack-root > button {
+.monitors .MuiStack-root > button:not(.MuiIconButton-root) {
font-size: var(--env-var-font-size-medium);
height: var(--env-var-height-2);
min-width: fit-content;
diff --git a/Client/src/Pages/Monitors/index.jsx b/Client/src/Pages/Monitors/index.jsx
index 145faaec3..3c1d7bc64 100644
--- a/Client/src/Pages/Monitors/index.jsx
+++ b/Client/src/Pages/Monitors/index.jsx
@@ -41,16 +41,26 @@ import {
const Host = ({ params }) => {
return (
- {
event.stopPropagation();
+ window.open(params.url, "_blank", "noreferrer");
+ }}
+ sx={{
+ "&:focus": {
+ outline: "none",
+ },
+ mr: "3px",
}}
>
-
-
+
+
{params.title}
diff --git a/Client/src/assets/icons/open-in-new-page.svg b/Client/src/assets/icons/open-in-new-page.svg
index 2bcb21c43..70599f390 100644
--- a/Client/src/assets/icons/open-in-new-page.svg
+++ b/Client/src/assets/icons/open-in-new-page.svg
@@ -1,3 +1,3 @@
-