add bandwidth alerts

beszel/site/src/components/command-palette.tsx

@@ -143,7 +143,7 @@ export default function CommandPalette() {
 								}}
 							>
 								<DatabaseBackupIcon className="mr-2 h-4 w-4" />
-								<span>Database backups</span>
+								<span>Backups</span>
 								<CommandShortcut>Admin</CommandShortcut>
 							</CommandItem>
 							<CommandItem

beszel/site/src/components/systems-table/systems-table.tsx

@@ -164,12 +164,13 @@ export default function SystemsTable({ filter }: { filter?: string }) {
 			},
 			{
 				accessorKey: 'info.b',
-				size: 80,
+				size: 115,
 				header: ({ column }) => sortableHeader(column, 'Net', EthernetIcon),
 				cell: (info) => {
+					const val = (info.getValue() as number) || 0
 					return (
 						<span className="tabular-nums whitespace-nowrap pl-1">
-							{decimalString((info.getValue() as number) || 0, 2)} MB/s
+							{decimalString(val, val >= 100 ? 1 : 2)} MB/s
 						</span>
 					)
 				},

beszel/site/src/components/table-alerts.tsx

@@ -48,7 +48,7 @@ export default function AlertsButton({ system }: { system: SystemRecord }) {
 					/>
 				</Button>
 			</DialogTrigger>
-			<DialogContent className="max-h-full overflow-auto">
+			<DialogContent className="max-h-full overflow-auto max-w-[35rem]">
 				<DialogHeader>
 					<DialogTitle className="text-xl">{system.name} alerts</DialogTitle>
 					<DialogDescription className="mb-1">
@@ -82,6 +82,14 @@ export default function AlertsButton({ system }: { system: SystemRecord }) {
 						title="Disk Usage"
 						description="Triggers when root usage exceeds a threshold."
 					/>
+					<AlertWithSlider
+						system={system}
+						alerts={systemAlerts}
+						name="Bandwidth"
+						title="Bandwidth"
+						description="Triggers when combined up/down exceeds a threshold."
+						unit=" MB/s"
+					/>
 					<AlertWithSlider
 						system={system}
 						alerts={systemAlerts}
@@ -152,6 +160,7 @@ function AlertWithSlider({
 	title,
 	description,
 	unit = '%',
+	max = 99,
 }: {
 	system: SystemRecord
 	alerts: AlertRecord[]
@@ -159,6 +168,7 @@ function AlertWithSlider({
 	title: string
 	description: string
 	unit?: string
+	max?: number
 }) {
 	const [pendingChange, setPendingChange] = useState(false)
 	const [liveValue, setLiveValue] = useState(80)
@@ -226,7 +236,7 @@ function AlertWithSlider({
 								setLiveValue(val[0])
 							}}
 							min={1}
-							max={99}
+							max={max}
 							// step={1}
 						/>
 					</Suspense>