diff --git a/client/src/Pages/PageSpeed/Monitors/index.tsx b/client/src/Pages/PageSpeed/Monitors/index.tsx
index 64b39dbce..33a04bb6b 100644
--- a/client/src/Pages/PageSpeed/Monitors/index.tsx
+++ b/client/src/Pages/PageSpeed/Monitors/index.tsx
@@ -1,15 +1,16 @@
import {
MonitorBasePageWithStates,
- // UpStatusBox,
- // DownStatusBox,
- // PausedStatusBox,
+ UpStatusBox,
+ DownStatusBox,
+ PausedStatusBox,
} from "@/Components/v2/design-elements";
import { Dialog } from "@/Components/v2/inputs";
import { HeaderCreate } from "@/Components/v2/common";
-// import Stack from "@mui/material/Stack";
+import Stack from "@mui/material/Stack";
import { PageSpeedMonitorsTable } from "@/Pages/PageSpeed/Monitors/Components/PageSpeedMonitorsTable";
import type { Monitor } from "@/Types/Monitor";
+import { useTheme } from "@mui/material";
import { useTranslation } from "react-i18next";
import { useState } from "react";
import { useIsAdmin } from "@/Hooks/useIsAdmin";
@@ -19,6 +20,7 @@ import type { AppSettingsResponse } from "@/Types/Settings";
const PageSpeedMonitorsPage = () => {
const { t } = useTranslation();
+ const theme = useTheme();
const isAdmin = useIsAdmin();
const { deleteFn, loading: isDeleting } = useDelete();
@@ -46,7 +48,7 @@ const PageSpeedMonitorsPage = () => {
const monitors = monitorsData?.monitors;
const monitorsCount = monitorsData?.count;
- // const summary = monitorsData?.summary;
+ const summary = monitorsData?.summary;
const isLoading = monitorsIsLoading || settingsIsLoading;
@@ -74,14 +76,14 @@ const PageSpeedMonitorsPage = () => {
isLoading={isLoading}
isAdmin={isAdmin}
/>
- {/*
- */}
+
void;
sortField: string;
setSortField: (field: string) => void;
sortOrder: "asc" | "desc";
@@ -126,9 +128,7 @@ export const MonitorTable = ({
{t("pages.common.monitors.actions.delete")}
),
- action: () => {
- // setSelectedMonitor(monitor);
- },
+ action: () => setSelectedMonitor(monitor),
closeMenu: true,
},
];
diff --git a/client/src/Pages/Uptime/Monitors/index.tsx b/client/src/Pages/Uptime/Monitors/index.tsx
index 061fb9454..5c3828d07 100644
--- a/client/src/Pages/Uptime/Monitors/index.tsx
+++ b/client/src/Pages/Uptime/Monitors/index.tsx
@@ -5,14 +5,14 @@ import {
DownStatusBox,
PausedStatusBox,
} from "@/Components/v2/design-elements";
-import { TextField } from "@/Components/v2/inputs";
+import { TextField, Dialog } from "@/Components/v2/inputs";
import Stack from "@mui/material/Stack";
import { MonitorTable } from "@/Pages/Uptime/Monitors/Components/UptimeMonitorsTable";
import { HeaderCreate } from "@/Components/v2/common";
import { useTranslation } from "react-i18next";
import useMediaQuery from "@mui/material/useMediaQuery";
-import { useGet } from "@/Hooks/UseApi";
+import { useGet, useDelete } from "@/Hooks/UseApi";
import type { Monitor, MonitorType, MonitorsWithChecksResponse } from "@/Types/Monitor";
import { useState, useMemo, useCallback } from "react";
import { useSelector, useDispatch } from "react-redux";
@@ -40,6 +40,8 @@ const UptimeMonitorsPage = () => {
const [search, setSearch] = useState("");
const [sortField, setSortField] = useState("");
const [sortOrder, setSortOrder] = useState<"asc" | "desc">("asc");
+ const [selectedMonitor, setSelectedMonitor] = useState(null);
+ const isDialogOpen = Boolean(selectedMonitor);
// Convert filter selections to API filter values
// Status: "up" -> true, "down" -> false
@@ -88,6 +90,7 @@ const UptimeMonitorsPage = () => {
data: monitors,
isLoading: monitorsLoading,
error,
+ refetch: refetchMonitorsAndSummary,
} = useGet(
"/monitors/team?type=http&type=ping&type=port&type=docker",
{},
@@ -107,6 +110,9 @@ const UptimeMonitorsPage = () => {
const { monitors: monitorsWithChecks, summary, count } = monitorsWithChecksData ?? {};
+ // Delete hook
+ const { deleteFn, loading: isDeleting } = useDelete();
+
// Handlers
const handleClearFilters = useCallback(() => {
setSelectedTypes([]);
@@ -115,6 +121,18 @@ const UptimeMonitorsPage = () => {
setSearch("");
}, []);
+ const handleConfirm = async () => {
+ if (!selectedMonitor) return;
+ await deleteFn(`/monitors/${selectedMonitor.id}`);
+ setSelectedMonitor(null);
+ refetch();
+ refetchMonitorsAndSummary();
+ };
+
+ const handleCancel = () => {
+ setSelectedMonitor(null);
+ };
+
const isLoading = monitorsLoading || monitorsWithChecksLoading;
return (
@@ -164,6 +182,7 @@ const UptimeMonitorsPage = () => {
{
setPage(0);
}}
/>
+
);
};