From 084eed85bf4d2e21926915c03cd7a293b90c33a6 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Thu, 29 Jan 2026 23:39:14 +0000
Subject: [PATCH] add incidents config box

---
 client/src/Pages/CreateMonitor/index.tsx | 48 ++++++++++++++++++++++++
 client/src/Validation/monitor.ts         |  6 +--
 client/src/locales/en.json               | 12 ++++++
 3 files changed, 63 insertions(+), 3 deletions(-)

diff --git a/client/src/Pages/CreateMonitor/index.tsx b/client/src/Pages/CreateMonitor/index.tsx
index 591f423fa..c0740393b 100644
--- a/client/src/Pages/CreateMonitor/index.tsx
+++ b/client/src/Pages/CreateMonitor/index.tsx
@@ -359,6 +359,54 @@ const CreateMonitorPage = () => {
 				}
 			/>
 
+			{/* Incidents ConfigBox */}
+			<ConfigBox
+				title={t("pages.createMonitor.form.incidents.title")}
+				subtitle={t("pages.createMonitor.form.incidents.description")}
+				rightContent={
+					<Stack spacing={theme.spacing(8)}>
+						<Controller
+							name="statusWindowSize"
+							control={control}
+							render={({ field, fieldState }) => (
+								<TextField
+									value={field.value ?? ""}
+									onChange={(e) => {
+										const val = e.target.value;
+										field.onChange(val === "" ? undefined : Number(val));
+									}}
+									onBlur={field.onBlur}
+									type="number"
+									fieldLabel={t("pages.createMonitor.form.incidents.option.checks.label")}
+									fullWidth
+									error={!!fieldState.error}
+									helperText={fieldState.error?.message ?? ""}
+								/>
+							)}
+						/>
+						<Controller
+							name="statusWindowThreshold"
+							control={control}
+							render={({ field, fieldState }) => (
+								<TextField
+									value={field.value ?? ""}
+									onChange={(e) => {
+										const val = e.target.value;
+										field.onChange(val === "" ? undefined : Number(val));
+									}}
+									onBlur={field.onBlur}
+									type="number"
+									fieldLabel={t("pages.createMonitor.form.incidents.option.percentage.label")}
+									fullWidth
+									error={!!fieldState.error}
+									helperText={fieldState.error?.message ?? ""}
+								/>
+							)}
+						/>
+					</Stack>
+				}
+			/>
+
 			{/* Notifications ConfigBox */}
 			<ConfigBox
 				title={t("pages.createMonitor.form.notifications.title")}
diff --git a/client/src/Validation/monitor.ts b/client/src/Validation/monitor.ts
index 3112ca706..c3cbc4adb 100644
--- a/client/src/Validation/monitor.ts
+++ b/client/src/Validation/monitor.ts
@@ -9,11 +9,11 @@ const baseSchema = z.object({
 	interval: z.number().min(15000, "Interval must be at least 15 seconds"),
 	notifications: z.array(z.string()),
 	statusWindowSize: z
-		.number()
+		.number({ message: "Status window size is required" })
 		.min(1, "Status window size must be at least 1")
-		.max(20, "Status window size must be at most 20"),
+		.max(25, "Status window size must be at most 25"),
 	statusWindowThreshold: z
-		.number()
+		.number({ message: "Threshold percentage is required" })
 		.min(1, "Incident percentage must be at least 1")
 		.max(100, "Incident percentage must be at most 100"),
 });
diff --git a/client/src/locales/en.json b/client/src/locales/en.json
index 7331ed944..31497a980 100644
--- a/client/src/locales/en.json
+++ b/client/src/locales/en.json
@@ -284,6 +284,18 @@
 						}
 					}
 				},
+				"incidents": {
+					"title": "Incidents",
+					"description": "A sliding window is used to determine when a monitor goes down. The status of a monitor will only change when the percentage of checks in the sliding window meet the specified value.",
+					"option": {
+						"checks": {
+							"label": "Number of checks in sliding window"
+						},
+						"percentage": {
+							"label": "What percentage of checks in the sliding window fail/succeed before monitor status changes?"
+						}
+					}
+				},
 				"notifications": {
 					"title": "Notifications",
 					"description": "Select the notification channels you want to use"