add config box for thresholds

This commit is contained in:
Alex Holliday
2026-02-14 00:40:59 +00:00
parent 8719efab5d
commit c319738048
2 changed files with 130 additions and 1 deletions
+108
View File
@@ -486,6 +486,114 @@ const CreateMonitorPage = () => {
}
/>
{/* Alert Thresholds - only for hardware type */}
{generalSettingsConfig.showSecret && (
<ConfigBox
title={t("pages.createMonitor.form.thresholds.title")}
subtitle={t("pages.createMonitor.form.thresholds.description")}
rightContent={
<Stack spacing={theme.spacing(8)}>
<Controller
name="cpuAlertThreshold"
control={control}
render={({ field, fieldState }) => (
<TextField
{...field}
value={field.value === 0 ? "" : field.value}
onChange={(e) => {
const val = e.target.value;
field.onChange(val === "" ? 0 : Number(val));
}}
type="number"
fieldLabel={t(
"pages.createMonitor.form.thresholds.option.cpuThreshold.label"
)}
placeholder={t(
"pages.createMonitor.form.thresholds.option.cpuThreshold.placeholder"
)}
fullWidth
error={!!fieldState.error}
helperText={fieldState.error?.message ?? ""}
/>
)}
/>
<Controller
name="memoryAlertThreshold"
control={control}
render={({ field, fieldState }) => (
<TextField
{...field}
value={field.value === 0 ? "" : field.value}
onChange={(e) => {
const val = e.target.value;
field.onChange(val === "" ? 0 : Number(val));
}}
type="number"
fieldLabel={t(
"pages.createMonitor.form.thresholds.option.memoryThreshold.label"
)}
placeholder={t(
"pages.createMonitor.form.thresholds.option.memoryThreshold.placeholder"
)}
fullWidth
error={!!fieldState.error}
helperText={fieldState.error?.message ?? ""}
/>
)}
/>
<Controller
name="diskAlertThreshold"
control={control}
render={({ field, fieldState }) => (
<TextField
{...field}
value={field.value === 0 ? "" : field.value}
onChange={(e) => {
const val = e.target.value;
field.onChange(val === "" ? 0 : Number(val));
}}
type="number"
fieldLabel={t(
"pages.createMonitor.form.thresholds.option.diskThreshold.label"
)}
placeholder={t(
"pages.createMonitor.form.thresholds.option.diskThreshold.placeholder"
)}
fullWidth
error={!!fieldState.error}
helperText={fieldState.error?.message ?? ""}
/>
)}
/>
<Controller
name="tempAlertThreshold"
control={control}
render={({ field, fieldState }) => (
<TextField
{...field}
value={field.value === 0 ? "" : field.value}
onChange={(e) => {
const val = e.target.value;
field.onChange(val === "" ? 0 : Number(val));
}}
type="number"
fieldLabel={t(
"pages.createMonitor.form.thresholds.option.tempThreshold.label"
)}
placeholder={t(
"pages.createMonitor.form.thresholds.option.tempThreshold.placeholder"
)}
fullWidth
error={!!fieldState.error}
helperText={fieldState.error?.message ?? ""}
/>
)}
/>
</Stack>
}
/>
)}
<ConfigBox
title={t("pages.createMonitor.form.incidents.title")}
subtitle={t("pages.createMonitor.form.incidents.description")}
+22 -1
View File
@@ -187,7 +187,6 @@
"description": "See the latest releases and help grow the community on GitHub"
}
},
"pages": {
"notFound": {
"title": "Oh no! You dropped your sushi!",
@@ -521,6 +520,28 @@
"optionPort": "Port",
"optionPortDescription": "Monitor if a specific port on a server is open.",
"title": "Type"
},
"thresholds": {
"title": "Alert thresholds",
"description": "Define the thresholds at which alerts should be triggered for this hardware monitor.",
"option": {
"cpuThreshold": {
"label": "CPU alert threshold (%)",
"placeholder": "80"
},
"memoryThreshold": {
"label": "Memory alert threshold (%)",
"placeholder": "80"
},
"diskThreshold": {
"label": "Disk alert threshold (%)",
"placeholder": "80"
},
"tempThreshold": {
"label": "Temperature alert threshold (°C)",
"placeholder": "80"
}
}
}
}
},