diff --git a/client/src/Pages/Incidents/Components/IncidentTable.tsx b/client/src/Pages/Incidents/Components/IncidentTable.tsx
index df82764d9..46352c6f7 100644
--- a/client/src/Pages/Incidents/Components/IncidentTable.tsx
+++ b/client/src/Pages/Incidents/Components/IncidentTable.tsx
@@ -18,7 +18,6 @@ import { useTheme } from "@mui/material/styles";
import Box from "@mui/material/Box";
interface IncidentsTableProps {
- title?: string;
incidents?: Incident[];
monitors?: Monitor[];
incidentsCount: number;
@@ -103,7 +102,11 @@ export const IncidentsTable = ({
return (
);
},
@@ -112,11 +115,7 @@ export const IncidentsTable = ({
id: "startTime",
content: t("pages.incidents.table.headers.startTime"),
render: (row) => {
- return formatDateWithTz(
- row.createdAt,
- "YYYY-MM-DD HH:mm:ss A",
- uiTimezone
- );
+ return formatDateWithTz(row.createdAt, "YYYY-MM-DD HH:mm:ss A", uiTimezone);
},
},
{
@@ -124,11 +123,7 @@ export const IncidentsTable = ({
content: t("pages.incidents.table.headers.endTime"),
render: (row) => {
if (row.endTime) {
- return formatDateWithTz(
- row.endTime,
- "YYYY-MM-DD HH:mm:ss A",
- uiTimezone
- );
+ return formatDateWithTz(row.endTime, "YYYY-MM-DD HH:mm:ss A", uiTimezone);
}
return "-";
},
@@ -165,7 +160,12 @@ export const IncidentsTable = ({
let value: ValueType = "neutral";
if (code < 300) value = "positive";
else if (code >= 400) value = "negative";
- return ;
+ return (
+
+ );
},
},
{
@@ -202,14 +202,6 @@ export const IncidentsTable = ({
return (
- {title && (
-
- {title}
-
- )}
{
const incidentsUrl = useMemo(() => {
const params = new URLSearchParams();
if (selectedMonitor !== "0") params.append("monitorId", selectedMonitor);
- if (filter === "active") params.append("status", "true");
- else if (filter === "resolved") params.append("status", "false");
- else if (filter === "manual" || filter === "automatic")
+ // Always show only resolved incidents (active ones are in the separate table above)
+ params.append("status", "false");
+ if (filter === "manual" || filter === "automatic")
params.append("resolutionType", filter);
params.append("sortOrder", "desc");
if (dateRange !== "all") params.append("dateRange", dateRange);
@@ -89,14 +91,12 @@ const IncidentsPage = () => {
}, [selectedMonitor, activeIncidentsPage, activeIncidentsRowsPerPage]);
// Fetch active incidents
- const {
- data: activeIncidentsData,
- refetch: refetchActiveIncidents,
- } = useGet(
- activeIncidentsUrl,
- {},
- { keepPreviousData: true, refreshInterval: 10000 }
- );
+ const { data: activeIncidentsData, refetch: refetchActiveIncidents } =
+ useGet(
+ activeIncidentsUrl,
+ {},
+ { keepPreviousData: true, refreshInterval: 10000 }
+ );
// Fetch incident summary
const {
@@ -129,7 +129,10 @@ const IncidentsPage = () => {
void networkError;
const handleOpenDetails = (incidentId: string) => {
- const incident = incidents.find((i) => i.id === incidentId) ?? activeIncidents.find((i) => i.id === incidentId) ?? null;
+ const incident =
+ incidents.find((i) => i.id === incidentId) ??
+ activeIncidents.find((i) => i.id === incidentId) ??
+ null;
const monitor = monitorsData?.find((m) => m.id === incident?.monitorId) ?? null;
setIsDetailsDialogOpen(true);
setSelectedIncident(incident);
@@ -173,27 +176,42 @@ const IncidentsPage = () => {
+
+ {t("pages.incidents.table.activeIncidents")}
+
+
+ {activeIncidentsCount > 0 && (
+ <>
+
+
+ >
+ )}
+
+
+ {t("pages.incidents.table.resolvedIncidents")}
+
- {activeIncidentsCount > 0 && (
-
- )}