v2

client/src/Pages/Notifications/components/NotificationsTable.tsx

@@ -27,7 +27,7 @@ export const NotificationsTable = ({
 				id: 1,
 				label: t("pages.common.monitors.actions.configure"),
 				action: () => {
-					navigate(`/notification-channels/${channel.id}/configure`);
+					navigate(`/notifications/${channel.id}`);
 				},
 				closeMenu: true,
 			},
@@ -89,7 +89,7 @@ export const NotificationsTable = ({
 			headers={headers}
 			data={notifications}
 			onRowClick={(row) => {
-				navigate(`/notification-channels/${row.id}/configure`);
+				navigate(`/notifications/${row.id}`);
 			}}
 		/>
 	);

client/src/Pages/Notifications/index.tsx

@@ -1,8 +1,9 @@
 import { BasePageWithStates } from "@/Components/v2/design-elements";
 import { NotificationsTable } from "@/Pages/Notifications/components/NotificationsTable";
+import { Dialog } from "@/Components/v2/inputs";
 
 import { useState } from "react";
-import { useGet } from "@/Hooks/UseApi";
+import { useGet, useDelete } from "@/Hooks/UseApi";
 import { useTranslation } from "react-i18next";
 import type { Notification } from "@/Types/Notification";
 
@@ -10,6 +11,7 @@ const NotificationsPage = () => {
 	const { t } = useTranslation();
 
 	const [selectedChannel, setSelectedChannel] = useState<Notification | null>(null);
+	const isDialogOpen = Boolean(selectedChannel);
 
 	const {
 		data: notifications,
@@ -17,7 +19,20 @@ const NotificationsPage = () => {
 		isValidating,
 		error,
 		refetch,
-	} = useGet<Notification[]>("/notifications/team");
+	} = useGet<Notification[]>("/notifications/team", {}, { keepPreviousData: true });
+
+	const { deleteFn, loading: isDeleting } = useDelete();
+
+	const handleConfirm = async () => {
+		if (!selectedChannel) return;
+		await deleteFn(`/notifications/${selectedChannel.id}`);
+		setSelectedChannel(null);
+		refetch();
+	};
+
+	const handleCancel = () => {
+		setSelectedChannel(null);
+	};
 
 	return (
 		<BasePageWithStates
@@ -35,6 +50,14 @@ const NotificationsPage = () => {
 				notifications={notifications ?? []}
 				setSelectedChannel={setSelectedChannel}
 			/>
+			<Dialog
+				open={isDialogOpen}
+				title={t("common.dialogs.delete.title")}
+				content={t("common.dialogs.delete.description")}
+				onConfirm={handleConfirm}
+				onCancel={handleCancel}
+				loading={isDeleting}
+			/>
 		</BasePageWithStates>
 	);
 };