[Feature] Add Alerts History page (#973)

* Add alert history

* refactor

* fix one colunm

* update migration

* add retention

beszel/internal/alerts/alerts_history.go

@@ -0,0 +1,96 @@
+package alerts
+
+import (
+	"time"
+
+	"github.com/pocketbase/dbx"
+	"github.com/pocketbase/pocketbase/core"
+)
+
+func (am *AlertManager) RecordAlertHistory(alert SystemAlertData) {
+	// Get alert, user, system, name, value
+	alertId := alert.alertRecord.Id
+	userId := ""
+	if errs := am.hub.ExpandRecord(alert.alertRecord, []string{"user"}, nil); len(errs) == 0 {
+		if user := alert.alertRecord.ExpandedOne("user"); user != nil {
+			userId = user.Id
+		}
+	}
+	systemId := alert.systemRecord.Id
+	name := alert.name
+	value := alert.val
+	now := time.Now().UTC()
+
+	if alert.triggered {
+		// Create new alerts_history record
+		collection, err := am.hub.FindCollectionByNameOrId("alerts_history")
+		if err == nil {
+			history := core.NewRecord(collection)
+			history.Set("alert", alertId)
+			history.Set("user", userId)
+			history.Set("system", systemId)
+			history.Set("name", name)
+			history.Set("value", value)
+			history.Set("state", "active")
+			history.Set("created_date", now)
+			history.Set("solved_date", nil)
+			_ = am.hub.Save(history)
+		}
+	} else {
+		// Find latest active alerts_history record for this alert and set to solved
+		record, err := am.hub.FindFirstRecordByFilter(
+			"alerts_history",
+			"alert={:alert} && state='active'",
+			dbx.Params{"alert": alertId},
+		)
+		if err == nil && record != nil {
+			record.Set("state", "solved")
+			record.Set("solved_date", now)
+			_ = am.hub.Save(record)
+		}
+	}
+}
+
+// DeleteOldAlertHistory deletes alerts_history records older than the given retention duration
+func (am *AlertManager) DeleteOldAlertHistory(retention time.Duration) {
+	now := time.Now().UTC()
+	cutoff := now.Add(-retention)
+	_, err := am.hub.DB().NewQuery(
+		"DELETE FROM alerts_history WHERE solved_date IS NOT NULL AND solved_date < {:cutoff}",
+	).Bind(dbx.Params{"cutoff": cutoff}).Execute()
+	if err != nil {
+		am.hub.Logger().Error("failed to delete old alerts_history records", "error", err)
+	}
+}
+
+// Helper to get retention duration from user settings
+func getAlertHistoryRetention(settings map[string]interface{}) time.Duration {
+	retStr, _ := settings["alertHistoryRetention"].(string)
+	switch retStr {
+	case "1m":
+		return 30 * 24 * time.Hour
+	case "3m":
+		return 90 * 24 * time.Hour
+	case "6m":
+		return 180 * 24 * time.Hour
+	case "1y":
+		return 365 * 24 * time.Hour
+	default:
+		return 90 * 24 * time.Hour // default 3 months
+	}
+}
+
+// CleanUpAllAlertHistory deletes old alerts_history records for each user based on their retention setting
+func (am *AlertManager) CleanUpAllAlertHistory() {
+	records, err := am.hub.FindAllRecords("user_settings")
+	if err != nil {
+		return
+	}
+	for _, record := range records {
+		var settings map[string]interface{}
+		if err := record.UnmarshalJSONField("settings", &settings); err != nil {
+			continue
+		}
+		am.DeleteOldAlertHistory(getAlertHistoryRetention(settings))
+	}
+}

beszel/internal/alerts/alerts_system.go

@@ -293,6 +293,10 @@ func (am *AlertManager) sendSystemAlert(alert SystemAlertData) {
 		// app.Logger().Error("failed to save alert record", "err", err)
 		return
 	}
+
+	//  Create Alert History
+	am.RecordAlertHistory(alert)
+
 	// expand the user relation and send the alert
 	if errs := am.hub.ExpandRecord(alert.alertRecord, []string{"user"}, nil); len(errs) > 0 {
 		// app.Logger().Error("failed to expand user relation", "errs", errs)

beszel/internal/hub/hub.go

@@ -219,6 +219,9 @@ func (h *Hub) registerCronJobs(_ *core.ServeEvent) error {
 	h.Cron().MustAdd("delete old records", "8 * * * *", h.rm.DeleteOldRecords)
 	// create longer records every 10 minutes
 	h.Cron().MustAdd("create longer records", "*/10 * * * *", h.rm.CreateLongerRecords)
+	// delete old alert history records for each user based on their retention setting
+	h.Cron().MustAdd("delete old alerts_history", "5 */1 * * *", h.AlertManager.CleanUpAllAlertHistory)
+
 	return nil
 }
 

beszel/internal/users/users.go

@@ -20,6 +20,9 @@ type UserSettings struct {
 	// UnitTemp             uint8    `json:"unitTemp"` // 0 for Celsius, 1 for Fahrenheit
 	// UnitNet              uint8    `json:"unitNet"`  // 0 for bytes, 1 for bits
 	// UnitDisk             uint8    `json:"unitDisk"` // 0 for bytes, 1 for bits
+
+	// New field for alert history retention (e.g., "1m", "3m", "6m", "1y")
+	AlertHistoryRetention string `json:"alertHistoryRetention,omitempty"`
 }
 
 func NewUserManager(app core.App) *UserManager {

beszel/migrations/1_create_alerts_history.go

@@ -0,0 +1,74 @@
+package migrations
+
+import (
+	"github.com/pocketbase/pocketbase/core"
+	m "github.com/pocketbase/pocketbase/migrations"
+)
+
+func init() {
+	m.Register(func(app core.App) error {
+		jsonData := `[
+		{
+			"name": "alerts_history",
+			"type": "base",
+			"system": false,
+			"listRule": "",
+			"deleteRule": "",
+			"viewRule": ""
+			"fields": [
+				{
+					"name": "alert",
+					"type": "relation",
+					"required": true,
+					"collectionId": "elngm8x1l60zi2v",
+					"cascadeDelete": true,
+					"maxSelect": 1
+				},
+				{
+					"name": "user",
+					"type": "relation",
+					"required": true,
+					"collectionId": "_pb_users_auth_",
+					"cascadeDelete": true,
+					"maxSelect": 1
+				},
+				{
+					"name": "system",
+					"type": "relation",
+					"required": true,
+					"collectionId": "2hz5ncl8tizk5nx",
+					"cascadeDelete": true,
+					"maxSelect": 1
+				},
+				{
+					"name": "name",
+					"type": "text",
+					"required": true
+				},
+				{
+					"name": "value",
+					"type": "number",
+					"required": true
+				},
+				{
+					"name": "state",
+					"type": "select",
+					"required": true,
+					"values": ["active", "solved"]
+				},
+				{
+					"name": "created_date",
+					"type": "date",
+					"required": true
+				},
+				{
+					"name": "solved_date",
+					"type": "date",
+					"required": false
+				}
+			]
+		}
+	]`
+		return app.ImportCollectionsByMarshaledJSON([]byte(jsonData), false)
+	}, nil)
+}

beszel/site/package.json

@@ -43,6 +43,7 @@
 		"react": "^18.3.1",
 		"react-dom": "^18.3.1",
 		"recharts": "^2.15.3",
+		"sonner": "^2.0.6",
 		"tailwind-merge": "^2.6.0",
 		"tailwindcss-animate": "^1.0.7",
 		"valibot": "^0.42.1"
@@ -70,4 +71,4 @@
 	"optionalDependencies": {
 		"@esbuild/linux-arm64": "^0.21.5"
 	}
-}
+}

beszel/site/src/components/alerts-history-columns.tsx

@@ -0,0 +1,146 @@
+import { ColumnDef } from "@tanstack/react-table"
+import { AlertsHistoryRecord } from "@/types"
+import { Button } from "@/components/ui/button"
+import { ArrowUpDown } from "lucide-react"
+import { Badge } from "@/components/ui/badge"
+
+export const alertsHistoryColumns: ColumnDef<AlertsHistoryRecord>[] = [
+  {
+    accessorKey: "system",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+      >
+        System <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => <span className="text-center block">{row.original.expand?.system?.name || row.original.system}</span>,
+    enableSorting: true,
+    filterFn: (row, _, filterValue) => {
+      const display = row.original.expand?.system?.name || row.original.system || ""
+      return display.toLowerCase().includes(filterValue.toLowerCase())
+    },
+  },
+  {
+    accessorKey: "name",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+      >
+        Name <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => <span className="text-center block">{row.getValue("name")}</span>,
+    enableSorting: true,
+    filterFn: (row, _, filterValue) => {
+      const value = row.getValue("name") || ""
+      return String(value).toLowerCase().includes(filterValue.toLowerCase())
+    },
+  },
+  {
+    accessorKey: "value",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+        className="text-right w-full justify-end"
+      >
+        Value <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => <span className="text-center block">{Math.round(Number(row.getValue("value")))}</span>,
+    enableSorting: true,
+  },
+  {
+    accessorKey: "state",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+        className="text-center w-full justify-start"
+      >
+        State <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => {
+      const state = row.getValue("state") as string
+      let color = ""
+      if (state === "solved") color = "bg-green-100 text-green-800 border-green-200"
+      else if (state === "active") color = "bg-yellow-100 text-yellow-800 border-yellow-200"
+      return (
+        <span className="text-center block">
+          <Badge className={`capitalize ${color}`}>{state}</Badge>
+        </span>
+      )
+    },
+    enableSorting: true,
+  },
+  {
+    accessorKey: "create_date",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+      >
+        Created <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => (
+      <span className="text-center block">
+        {row.original.created_date ? new Date(row.original.created_date).toLocaleString() : ""}
+      </span>
+    ),
+    enableSorting: true,
+  },
+  {
+    accessorKey: "solved_date",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+      >
+        Solved <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => (
+      <span className="text-center block">
+        {row.original.solved_date ? new Date(row.original.solved_date).toLocaleString() : ""}
+      </span>
+    ),
+    enableSorting: true,
+  },
+  {
+    accessorKey: "duration",
+    header: ({ column }) => (
+      <Button
+        variant="ghost"
+        onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}
+      >
+        Duration <ArrowUpDown className="ml-2 h-4 w-4" />
+      </Button>
+    ),
+    cell: ({ row }) => {
+      const created = row.original.created_date ? new Date(row.original.created_date) : null
+      const solved = row.original.solved_date ? new Date(row.original.solved_date) : null
+      if (!created || !solved) return <span className="text-center block"></span>
+      const diffMs = solved.getTime() - created.getTime()
+      if (diffMs < 0) return <span className="text-center block"></span>
+      const totalSeconds = Math.floor(diffMs / 1000)
+      const hours = Math.floor(totalSeconds / 3600)
+      const minutes = Math.floor((totalSeconds % 3600) / 60)
+      const seconds = totalSeconds % 60
+      return (
+        <span className="text-center block">
+          {[
+            hours ? `${hours}h` : null,
+            minutes ? `${minutes}m` : null,
+            `${seconds}s`
+          ].filter(Boolean).join(" ")}
+        </span>
+      )
+    },
+    enableSorting: true,
+  },
+] 

beszel/site/src/components/routes/settings/alerts-history-data-table.tsx

@@ -0,0 +1,247 @@
+"use client"
+
+import * as React from "react"
+import { useStore } from "@nanostores/react"
+import { $alertsHistory, pb } from "@/lib/stores"
+import { AlertsHistoryRecord } from "@/types"
+import {
+  getCoreRowModel,
+  getPaginationRowModel,
+  getSortedRowModel,
+  getFilteredRowModel,
+  useReactTable,
+  flexRender,
+  ColumnFiltersState,
+  SortingState,
+  VisibilityState,
+} from "@tanstack/react-table"
+import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "@/components/ui/table"
+import { Button } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { alertsHistoryColumns } from "../../alerts-history-columns"
+import { Checkbox } from "@/components/ui/checkbox"
+import { toast } from "sonner"
+
+export default function AlertsHistoryDataTable() {
+  const alertsHistory = useStore($alertsHistory)
+
+  React.useEffect(() => {
+    pb.collection<AlertsHistoryRecord>("alerts_history")
+      .getFullList({
+        sort: "-created_date",
+        expand: "system,user,alert"
+      })
+      .then(records => {
+        $alertsHistory.set(records)
+      })
+  }, [])
+
+  const [sorting, setSorting] = React.useState<SortingState>([])
+  const [columnFilters, setColumnFilters] = React.useState<ColumnFiltersState>([])
+  const [columnVisibility, setColumnVisibility] = React.useState<VisibilityState>({})
+  const [rowSelection, setRowSelection] = React.useState({})
+  const [combinedFilter, setCombinedFilter] = React.useState("")
+  const [globalFilter, setGlobalFilter] = React.useState("")
+
+  const table = useReactTable({
+    data: alertsHistory,
+    columns: [
+      {
+        id: "select",
+        header: ({ table }) => (
+          <Checkbox
+            checked={
+              table.getIsAllPageRowsSelected() ||
+              (table.getIsSomePageRowsSelected() && "indeterminate")
+            }
+            onCheckedChange={value => table.toggleAllPageRowsSelected(!!value)}
+            aria-label="Select all"
+          />
+        ),
+        cell: ({ row }) => (
+          <Checkbox
+            checked={row.getIsSelected()}
+            onCheckedChange={value => row.toggleSelected(!!value)}
+            aria-label="Select row"
+          />
+        ),
+        enableSorting: false,
+        enableHiding: false,
+      },
+      ...alertsHistoryColumns,
+    ],
+    getCoreRowModel: getCoreRowModel(),
+    getPaginationRowModel: getPaginationRowModel(),
+    getSortedRowModel: getSortedRowModel(),
+    getFilteredRowModel: getFilteredRowModel(),
+    onSortingChange: setSorting,
+    onColumnFiltersChange: setColumnFilters,
+    onColumnVisibilityChange: setColumnVisibility,
+    onRowSelectionChange: setRowSelection,
+    globalFilterFn: (row, _columnId, filterValue) => {
+      const system = row.original.expand?.system?.name || row.original.system || ""
+      const name = row.getValue("name") || ""
+      const search = String(filterValue).toLowerCase()
+      return (
+        system.toLowerCase().includes(search) ||
+        String(name).toLowerCase().includes(search)
+      )
+    },
+    state: {
+      sorting,
+      columnFilters,
+      columnVisibility,
+      rowSelection,
+      globalFilter,
+    },
+    onGlobalFilterChange: setGlobalFilter,
+  })
+
+  // Bulk delete handler
+  const handleBulkDelete = async () => {
+    if (!window.confirm("Are you sure you want to delete the selected records?")) return
+    const selectedIds = table.getSelectedRowModel().rows.map(row => row.original.id)
+    try {
+      await Promise.all(selectedIds.map(id => pb.collection("alerts_history").delete(id)))
+      $alertsHistory.set(alertsHistory.filter(r => !selectedIds.includes(r.id)))
+      toast.success("Deleted selected records.")
+    } catch (e) {
+      toast.error("Failed to delete some records.")
+    }
+  }
+
+  // Export to CSV handler
+  const handleExportCSV = () => {
+    const selectedRows = table.getSelectedRowModel().rows
+    if (!selectedRows.length) return
+    const headers = ["system", "name", "value", "state", "created_date", "solved_date", "duration"]
+    const csvRows = [headers.join(",")]
+    for (const row of selectedRows) {
+      const r = row.original
+      csvRows.push([
+        r.expand?.system?.name || r.system,
+        r.name,
+        r.value,
+        r.state,
+        r.created_date,
+        r.solved_date,
+        (() => {
+          const created = r.created_date ? new Date(r.created_date) : null
+          const solved = r.solved_date ? new Date(r.solved_date) : null
+          if (!created || !solved) return ""
+          const diffMs = solved.getTime() - created.getTime()
+          if (diffMs < 0) return ""
+          const totalSeconds = Math.floor(diffMs / 1000)
+          const hours = Math.floor(totalSeconds / 3600)
+          const minutes = Math.floor((totalSeconds % 3600) / 60)
+          const seconds = totalSeconds % 60
+          return [
+            hours ? `${hours}h` : null,
+            minutes ? `${minutes}m` : null,
+            `${seconds}s`
+          ].filter(Boolean).join(" ")
+        })()
+      ].map(v => `"${v ?? ""}"`).join(","))
+    }
+    const blob = new Blob([csvRows.join("\n")], { type: "text/csv" })
+    const url = URL.createObjectURL(blob)
+    const a = document.createElement("a")
+    a.href = url
+    a.download = "alerts_history.csv"
+    a.click()
+    URL.revokeObjectURL(url)
+  }
+
+  return (
+    <div className="w-full">
+      <div className="flex items-center py-4 gap-4">
+        <Input
+          placeholder="Filter system or name..."
+          value={globalFilter}
+          onChange={e => setGlobalFilter(e.target.value)}
+          className="max-w-sm"
+        />
+        {table.getFilteredSelectedRowModel().rows.length > 0 && (
+          <>
+            <Button
+              variant="destructive"
+              onClick={handleBulkDelete}
+              size="sm"
+            >
+              Delete Selected
+            </Button>
+            <Button
+              variant="outline"
+              onClick={handleExportCSV}
+              size="sm"
+            >
+              Export Selected
+            </Button>
+          </>
+        )}
+      </div>
+      <div className="rounded-md border overflow-x-auto">
+        <Table>
+          <TableHeader>
+            {table.getHeaderGroups().map(headerGroup => (
+              <TableRow key={headerGroup.id}>
+                {headerGroup.headers.map(header => (
+                  <TableHead key={header.id}>
+                    {header.isPlaceholder
+                      ? null
+                      : flexRender(header.column.columnDef.header, header.getContext())}
+                  </TableHead>
+                ))}
+              </TableRow>
+            ))}
+          </TableHeader>
+          <TableBody>
+            {table.getRowModel().rows.length ? (
+              table.getRowModel().rows.map(row => (
+                <TableRow
+                  key={row.id}
+                  data-state={row.getIsSelected() && "selected"}
+                >
+                  {row.getVisibleCells().map(cell => (
+                    <TableCell key={cell.id}>
+                      {flexRender(cell.column.columnDef.cell, cell.getContext())}
+                    </TableCell>
+                  ))}
+                </TableRow>
+              ))
+            ) : (
+              <TableRow>
+                <TableCell colSpan={table.getAllColumns().length} className="h-24 text-center">
+                  No results.
+                </TableCell>
+              </TableRow>
+            )}
+          </TableBody>
+        </Table>
+      </div>
+      <div className="flex items-center justify-end space-x-2 py-4">
+        <div className="text-muted-foreground flex-1 text-sm">
+          {table.getFilteredSelectedRowModel().rows.length} of {table.getFilteredRowModel().rows.length} row(s) selected.
+        </div>
+        <div className="space-x-2">
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => table.previousPage()}
+            disabled={!table.getCanPreviousPage()}
+          >
+            Previous
+          </Button>
+          <Button
+            variant="outline"
+            size="sm"
+            onClick={() => table.nextPage()}
+            disabled={!table.getCanNextPage()}
+          >
+            Next
+          </Button>
+        </div>
+      </div>
+    </div>
+  )
+} 

beszel/site/src/components/routes/settings/general.tsx

@@ -17,11 +17,16 @@ export default function SettingsProfilePage({ userSettings }: { userSettings: Us
 	const [isLoading, setIsLoading] = useState(false)
 	const { i18n } = useLingui()
 
+	// Add state for alert history retention
+	const [alertHistoryRetention, setAlertHistoryRetention] = useState(userSettings.alertHistoryRetention || "3m")
+
 	async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
 		e.preventDefault()
 		setIsLoading(true)
 		const formData = new FormData(e.target as HTMLFormElement)
 		const data = Object.fromEntries(formData) as Partial<UserSettings>
+		// Add alertHistoryRetention to data
+		data.alertHistoryRetention = alertHistoryRetention
 		await saveSettings(data)
 		setIsLoading(false)
 	}
@@ -182,6 +187,27 @@ export default function SettingsProfilePage({ userSettings }: { userSettings: Us
 					</div>
 				</div>
 				<Separator />
+				<div>
+					<Label htmlFor="alertHistoryRetention">
+						<Trans>Alert History Retention</Trans>
+					</Label>
+					<Select
+						name="alertHistoryRetention"
+						value={alertHistoryRetention}
+						onValueChange={setAlertHistoryRetention}
+					>
+						<SelectTrigger className="w-64 mt-1">
+							<SelectValue />
+						</SelectTrigger>
+						<SelectContent>
+							<SelectItem value="1m">1 month</SelectItem>
+							<SelectItem value="3m">3 months</SelectItem>
+							<SelectItem value="6m">6 months</SelectItem>
+							<SelectItem value="1y">1 year</SelectItem>
+						</SelectContent>
+					</Select>
+				</div>
+				<Separator />
 				<Button type="submit" className="flex items-center gap-1.5 disabled:opacity-100" disabled={isLoading}>
 					{isLoading ? <LoaderCircleIcon className="h-4 w-4 animate-spin" /> : <SaveIcon className="h-4 w-4" />}
 					<Trans>Save Settings</Trans>

beszel/site/src/components/routes/settings/layout.tsx

@@ -7,7 +7,7 @@ import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/com
 import { useStore } from "@nanostores/react"
 import { $router } from "@/components/router.tsx"
 import { getPagePath, redirectPage } from "@nanostores/router"
-import { BellIcon, FileSlidersIcon, FingerprintIcon, SettingsIcon } from "lucide-react"
+import { BellIcon, FileSlidersIcon, FingerprintIcon, SettingsIcon, LogsIcon } from "lucide-react"
 import { $userSettings, pb } from "@/lib/stores.ts"
 import { toast } from "@/components/ui/use-toast.ts"
 import { UserSettings } from "@/types.js"
@@ -16,6 +16,7 @@ import Notifications from "./notifications.tsx"
 import ConfigYaml from "./config-yaml.tsx"
 import { useLingui } from "@lingui/react/macro"
 import Fingerprints from "./tokens-fingerprints.tsx"
+import AlertsHistoryDataTable from "./alerts-history-data-table"
 
 export async function saveSettings(newSettings: Partial<UserSettings>) {
 	try {
@@ -71,6 +72,11 @@ export default function SettingsLayout() {
 			icon: FileSlidersIcon,
 			admin: true,
 		},
+		{
+			title: t`Alerts History`,
+			href: getPagePath($router, "settings", { name: "alerts-history" }),
+			icon: LogsIcon,
+		},
 	]
 
 	const page = useStore($router)
@@ -121,5 +127,7 @@ function SettingsContent({ name }: { name: string }) {
 			return <ConfigYaml />
 		case "tokens":
 			return <Fingerprints />
+		case "alerts-history":
+			return <AlertsHistoryDataTable />
 	}
 }

beszel/site/src/lib/stores.ts

@@ -15,6 +15,9 @@ export const $systems = atom([] as SystemRecord[])
 /** List of alert records */
 export const $alerts = atom([] as AlertRecord[])
 
+/** List of alerts history records */
+export const $alertsHistory = atom([] as AlertsHistoryRecord[])
+
 /** SSH public key */
 export const $publicKey = atom("")
 

beszel/site/src/types.d.ts

@@ -189,6 +189,17 @@ export interface AlertRecord extends RecordModel {
 	// user: string
 }
 
+export interface AlertsHistoryRecord extends RecordModel {
+  alert: string;
+  user: string;
+  system: string;
+  name: string;
+  value: number;
+  state: "active" | "solved";
+  created_date: string;
+  solved_date?: string | null;
+}
+
 export type ChartTimes = "1h" | "12h" | "24h" | "1w" | "30d"
 
 export interface ChartTimeData {
@@ -202,7 +213,7 @@ export interface ChartTimeData {
 	}
 }
 
-export type UserSettings = {
+export interface UserSettings {
 	// lang?: string
 	chartTime: ChartTimes
 	emails?: string[]
@@ -210,6 +221,9 @@ export type UserSettings = {
 	unitTemp?: Unit
 	unitNet?: Unit
 	unitDisk?: Unit
+
+	// New field for alert history retention (e.g., '1m', '3m', '6m', '1y')
+	alertHistoryRetention?: string
 }
 
 type ChartDataContainer = {