diff --git a/Client/src/Components/MonitorTable/index.jsx b/Client/src/Components/MonitorTable/index.jsx index 338ebb793..6904978c8 100644 --- a/Client/src/Components/MonitorTable/index.jsx +++ b/Client/src/Components/MonitorTable/index.jsx @@ -3,6 +3,7 @@ import PropTypes from "prop-types"; import ResponseTimeChart from "../Charts/ResponseTimeChart"; import BasicTable from "../BasicTable"; import OpenInNewPage from "../../assets/icons/open-in-new-page.svg?react"; +import { useNavigate } from "react-router-dom"; /** * Host component. @@ -80,6 +81,8 @@ const Status = ({ params }) => { * @returns {React.Component} Returns a table with the monitor data. */ const MonitorTable = ({ monitors = [] }) => { + const navigate = useNavigate(); + const headers = [ { id: 1, name: "Host" }, { id: 2, name: "Status" }, @@ -106,8 +109,17 @@ const MonitorTable = ({ monitors = [] }) => { ? "var(--env-var-color-17)" : "var(--env-var-color-19)", }; - data.push({ id: data.length + 1, data: }); - data.push({ id: data.length + 1, data: }); + data.push({ + id: data.length + 1, + data: , + handleClick: () => { + navigate(`/monitors/${monitor._id}`); + }, + }); + data.push({ + id: data.length + 1, + data: , + }); data.push({ id: data.length + 1, data: ,