update go dependencies

Alert history updates
[Feature] Add Alerts History page (#973 )
2026-03-23 22:16:18 +01:00 · 2025-07-21 20:14:31 -04:00 · 2025-07-21 20:07:52 -04:00 · 2025-07-20 19:20:51 -04:00 · 2025-07-16 21:24:42 -04:00 · 2025-07-16 16:03:26 -04:00
53 changed files with 2354 additions and 489 deletions
--- a/.github/ISSUE_TEMPLATE/bug_report.yml
+++ b/.github/ISSUE_TEMPLATE/bug_report.yml
@@ -1,8 +1,19 @@
 name: 🐛 Bug report
 description: Report a new bug or issue.
 title: '[Bug]: '
-labels: ['bug']
+labels: ['bug', "needs confirmation"]
 body:
+  - type: dropdown
+    id: component
+    attributes:
+      label: Component
+      description: Which part of Beszel is this about?
+      options:
+        - Hub
+        - Agent
+        - Hub & Agent
+    validations:
+      required: true
  - type: markdown
    attributes:
      value: |
@@ -43,6 +54,39 @@ body:
        3. Pour it into a cup.
    validations:
      required: true
+  - type: dropdown
+    id: category
+    attributes:
+      label: Category
+      description: Which category does this relate to most?
+      options:
+        - Metrics
+        - Charts & Visualization
+        - Settings & Configuration
+        - Notifications & Alerts
+        - Authentication
+        - Installation
+        - Performance
+        - UI / UX
+        - Other
+    validations:
+      required: true
+  - type: dropdown
+    id: metrics
+    attributes:
+      label: Affected Metrics
+      description: If applicable, which specific metric does this relate to most?
+      options:
+        - CPU
+        - Memory
+        - Storage
+        - Network
+        - Containers
+        - GPU
+        - Sensors
+        - Other
+    validations:
+      required: true
  - type: input
    id: system
    attributes:
@@ -61,7 +105,6 @@ body:
    id: install-method
    attributes:
      label: Installation method
-      default: 0
      options:
        - Docker
        - Binary
--- a/.github/ISSUE_TEMPLATE/feature_request.yml
+++ b/.github/ISSUE_TEMPLATE/feature_request.yml
@@ -1,8 +1,19 @@
 name: 🚀 Feature request
 description: Request a new feature or change.
 title: "[Feature]: "
-labels: ["enhancement"]
+labels: ["enhancement", "needs review"]
 body:
+  - type: dropdown
+    id: component
+    attributes:
+      label: Component
+      description: Which part of Beszel is this about?
+      options:
+        - Hub
+        - Agent
+        - Hub & Agent
+    validations:
+      required: true
  - type: markdown
    attributes:
      value: Before submitting, please search existing [issues](https://github.com/henrygd/beszel/issues) and [discussions](https://github.com/henrygd/beszel/discussions) (including closed).
@@ -11,8 +22,55 @@ body:
      label: Describe the feature you would like to see
    validations:
      required: true
+  - type: textarea
+    id: motivation
+    attributes:
+      label: Motivation / Use Case
+      description: Why do you want this feature? What problem does it solve?
+    validations:
+      required: true
  - type: textarea
    attributes:
      label: Describe how you would like to see this feature implemented
    validations:
      required: true
+  - type: textarea
+    id: logs
+    attributes:
+      label: Screenshots
+      description: Please attach any relevant screenshots, such as images from your current solution or similar implementations.
+    validations:
+      required: false
+  - type: dropdown
+    id: category
+    attributes:
+      label: Category
+      description: Which category does this relate to most?
+      options:
+        - Metrics
+        - Charts & Visualization
+        - Settings & Configuration
+        - Notifications & Alerts
+        - Authentication
+        - Installation
+        - Performance
+        - UI / UX
+        - Other
+    validations:
+      required: true
+  - type: dropdown
+    id: metrics
+    attributes:
+      label: Affected Metrics
+      description: If applicable, which specific metric does this relate to most?
+      options:
+        - CPU
+        - Memory
+        - Storage
+        - Network
+        - Containers
+        - GPU
+        - Sensors
+        - Other
+    validations:
+      required: true
--- a/.github/pull_request_template.md
+++ b/.github/pull_request_template.md
@@ -0,0 +1,33 @@
+## 📃 Description
+
+A short description of the pull request changes should go here and the sections below should list in detail all changes. You can remove the sections you don't need.
+
+## 📖 Documentation
+
+Add a link to the PR for [documentation](https://github.com/henrygd/beszel-docs) changes.
+
+## 🪵 Changelog
+
+### ➕ Added
+
+- one
+- two
+
+### ✏️ Changed
+
+- one
+- two
+
+### 🔧 Fixed
+
+- one
+- two
+
+### 🗑️ Removed
+
+- one
+- two
+
+## 📷 Screenshots
+
+If this PR has any UI/UX changes it's strongly suggested you add screenshots here.
--- a/.github/workflows/docker-images.yml
+++ b/.github/workflows/docker-images.yml
@@ -65,7 +65,7 @@ jobs:
        with:
          images: ${{ matrix.image }}
          tags: |
-            type=edge,enable=true
+            type=raw,value=edge
            type=semver,pattern={{version}}
            type=semver,pattern={{major}}.{{minor}}
            type=semver,pattern={{major}}
--- a/.github/workflows/inactivity-actions.yml
+++ b/.github/workflows/inactivity-actions.yml
@@ -0,0 +1,43 @@
+name: 'Issue and PR Maintenance'
+
+on:
+  schedule:
+    - cron: '0 0 * * *'   # runs at midnight UTC
+  workflow_dispatch:
+
+permissions:
+  issues: write
+  pull-requests: write
+
+jobs:
+  close-stale:
+    name: Close Stale Issues
+    runs-on: ubuntu-24.04
+    steps:
+      - name: Close Stale Issues
+        uses: actions/stale@v9
+        with:
+          repo-token: ${{ secrets.GITHUB_TOKEN }}
+
+          # Messaging
+          stale-issue-message: >
+            👋 This issue has been automatically marked as stale due to inactivity.
+            If this issue is still relevant, please comment to keep it open.
+            Without activity, it will be closed in 7 days.
+
+          close-issue-message: >
+            🔒 This issue has been automatically closed due to prolonged inactivity.
+            Feel free to open a new issue if you have further questions or concerns.
+
+          # Timing
+          days-before-issue-stale: 14
+          days-before-issue-close: 7
+
+          # Labels
+          stale-issue-label: 'stale'
+          remove-stale-when-updated: true
+          only-issue-labels: 'awaiting-requester'
+
+          # Exemptions
+          exempt-assignees: true
+          exempt-milestones: true
--- a/.github/workflows/label-from-dropdown.yml
+++ b/.github/workflows/label-from-dropdown.yml
@@ -0,0 +1,82 @@
+name: Label issues from dropdowns
+
+on:
+  issues:
+    types: [opened]
+
+jobs:
+  label_from_dropdown:
+    runs-on: ubuntu-latest
+    permissions:
+      issues: write
+    steps:
+      - name: Apply labels based on dropdown choices
+        uses: actions/github-script@v7
+        with:
+          script: |
+
+            const issueNumber = context.issue.number;
+            const owner = context.repo.owner;
+            const repo = context.repo.repo;
+
+            // Get the issue body
+            const body = context.payload.issue.body;
+
+            // Helper to find dropdown value in the body (assuming markdown format)
+            function extractSectionValue(heading) {
+              const regex = new RegExp(`### ${heading}\\s+([\\s\\S]*?)(?:\\n###|$)`, 'i');
+              const match = body.match(regex);
+              if (match) {
+                // Get the first non-empty line after the heading
+                const lines = match[1].split('\n').map(l => l.trim()).filter(Boolean);
+                return lines[0] || null;
+              }
+              return null;
+            }
+
+            // Extract dropdown selections
+            const category = extractSectionValue('Category');
+            const metrics = extractSectionValue('Affected Metrics');
+            const component = extractSectionValue('Component');
+
+            // Build labels to add
+            let labelsToAdd = [];
+            if (category) labelsToAdd.push(category);
+            if (metrics) labelsToAdd.push(metrics);
+            if (component) labelsToAdd.push(component);
+
+            // Get existing labels in the repo
+            const { data: existingLabels } = await github.rest.issues.listLabelsForRepo({
+              owner,
+              repo,
+              per_page: 100
+            });
+            const existingLabelNames = existingLabels.map(l => l.name);
+
+            // Find labels that need to be created
+            const labelsToCreate = labelsToAdd.filter(label => !existingLabelNames.includes(label));
+
+            // Create missing labels (with a default color)
+            for (const label of labelsToCreate) {
+              try {
+                await github.rest.issues.createLabel({
+                  owner,
+                  repo,
+                  name: label,
+                  color: 'ededed' // light gray, you can pick any hex color
+                });
+              } catch (e) {
+                // Ignore if label already exists (race condition), otherwise rethrow
+                if (!e || e.status !== 422) throw e;
+              }
+            }
+
+            // Now apply all labels (they all exist now)
+            if (labelsToAdd.length > 0) {
+              await github.rest.issues.addLabels({
+                owner,
+                repo,
+                issue_number: issueNumber,
+                labels: labelsToAdd
+              });
+            } 
--- a/beszel/Makefile
+++ b/beszel/Makefile
@@ -56,7 +56,7 @@ dev-hub: export ENV=dev
 dev-hub:
 	mkdir -p ./site/dist && touch ./site/dist/index.html
 	@if command -v entr >/dev/null 2>&1; then \
-		find ./cmd/hub ./internal/{alerts,hub,records,users} -name "*.go" | entr -r -s "cd ./cmd/hub && go run . serve"; \
+		find ./cmd/hub/*.go ./internal/{alerts,hub,records,users}/*.go | entr -r -s "cd ./cmd/hub && go run . serve --http 0.0.0.0:8090"; \
 	else \
 		cd ./cmd/hub && go run . serve --http 0.0.0.0:8090; \
 	fi
--- a/beszel/go.mod
+++ b/beszel/go.mod
@@ -7,20 +7,20 @@ replace github.com/nicholas-fedor/shoutrrr => github.com/nicholas-fedor/shoutrrr

 require (
 	github.com/blang/semver v3.5.1+incompatible
-	github.com/fxamacker/cbor/v2 v2.8.0
+	github.com/fxamacker/cbor/v2 v2.9.0
 	github.com/gliderlabs/ssh v0.3.8
 	github.com/google/uuid v1.6.0
 	github.com/lxzan/gws v1.8.9
 	github.com/nicholas-fedor/shoutrrr v0.8.15
 	github.com/pocketbase/dbx v1.11.0
-	github.com/pocketbase/pocketbase v0.28.4
+	github.com/pocketbase/pocketbase v0.29.0
 	github.com/rhysd/go-github-selfupdate v1.2.3
 	github.com/shirou/gopsutil/v4 v4.25.6
 	github.com/spf13/cast v1.9.2
 	github.com/spf13/cobra v1.9.1
 	github.com/stretchr/testify v1.10.0
-	golang.org/x/crypto v0.39.0
-	golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b
+	golang.org/x/crypto v0.40.0
+	golang.org/x/exp v0.0.0-20250718183923-645b1fa84792
 	gopkg.in/yaml.v3 v3.0.1
 )

@@ -39,7 +39,7 @@ require (
 	github.com/go-ole/go-ole v1.3.0 // indirect
 	github.com/go-ozzo/ozzo-validation/v4 v4.3.0 // indirect
 	github.com/go-sql-driver/mysql v1.9.1 // indirect
-	github.com/golang-jwt/jwt/v5 v5.2.2 // indirect
+	github.com/golang-jwt/jwt/v5 v5.2.3 // indirect
 	github.com/google/go-github/v30 v30.1.0 // indirect
 	github.com/google/go-querystring v1.1.0 // indirect
 	github.com/inconshreveable/go-update v0.0.0-20160112193335-8152e7eb6ccf // indirect
@@ -52,19 +52,19 @@ require (
 	github.com/pmezard/go-difflib v1.0.1-0.20181226105442-5d4384ee4fb2 // indirect
 	github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55 // indirect
 	github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec // indirect
-	github.com/spf13/pflag v1.0.6 // indirect
+	github.com/spf13/pflag v1.0.7 // indirect
 	github.com/tcnksm/go-gitconfig v0.1.2 // indirect
 	github.com/tklauser/go-sysconf v0.3.15 // indirect
 	github.com/tklauser/numcpus v0.10.0 // indirect
 	github.com/ulikunitz/xz v0.5.12 // indirect
 	github.com/x448/float16 v0.8.4 // indirect
 	github.com/yusufpapurcu/wmi v1.2.4 // indirect
-	golang.org/x/image v0.28.0 // indirect
-	golang.org/x/net v0.41.0 // indirect
+	golang.org/x/image v0.29.0 // indirect
+	golang.org/x/net v0.42.0 // indirect
 	golang.org/x/oauth2 v0.30.0 // indirect
-	golang.org/x/sync v0.15.0 // indirect
-	golang.org/x/sys v0.33.0 // indirect
-	golang.org/x/text v0.26.0 // indirect
+	golang.org/x/sync v0.16.0 // indirect
+	golang.org/x/sys v0.34.0 // indirect
+	golang.org/x/text v0.27.0 // indirect
 	modernc.org/libc v1.65.10 // indirect
 	modernc.org/mathutil v1.7.1 // indirect
 	modernc.org/memory v1.11.0 // indirect
--- a/beszel/go.sum
+++ b/beszel/go.sum
@@ -26,8 +26,8 @@ github.com/fatih/color v1.18.0/go.mod h1:4FelSpRwEGDpQ12mAdzqdOukCy4u8WUtOY6lkT/
 github.com/frankban/quicktest v1.14.6 h1:7Xjx+VpznH+oBnejlPUj8oUpdxnVs4f8XU8WnHkI4W8=
 github.com/frankban/quicktest v1.14.6/go.mod h1:4ptaffx2x8+WTWXmUCuVU6aPUX1/Mz7zb5vbUoiM6w0=
 github.com/fsnotify/fsnotify v1.4.7/go.mod h1:jwhsz4b93w/PPRr/qN1Yymfu8t87LnFCMoQvtojpjFo=
-github.com/fxamacker/cbor/v2 v2.8.0 h1:fFtUGXUzXPHTIUdne5+zzMPTfffl3RD5qYnkY40vtxU=
-github.com/fxamacker/cbor/v2 v2.8.0/go.mod h1:vM4b+DJCtHn+zz7h3FFp/hDAI9WNWCsZj23V5ytsSxQ=
+github.com/fxamacker/cbor/v2 v2.9.0 h1:NpKPmjDBgUfBms6tr6JZkTHtfFGcMKsw3eGcmD/sapM=
+github.com/fxamacker/cbor/v2 v2.9.0/go.mod h1:vM4b+DJCtHn+zz7h3FFp/hDAI9WNWCsZj23V5ytsSxQ=
 github.com/gabriel-vasile/mimetype v1.4.9 h1:5k+WDwEsD9eTLL8Tz3L0VnmVh9QxGjRmjBvAG7U/oYY=
 github.com/gabriel-vasile/mimetype v1.4.9/go.mod h1:WnSQhFKJuBlRyLiKohA/2DtIlPFAbguNaG7QCHcyGok=
 github.com/ganigeorgiev/fexpr v0.5.0 h1:XA9JxtTE/Xm+g/JFI6RfZEHSiQlk+1glLvRK1Lpv/Tk=
@@ -46,8 +46,8 @@ github.com/go-sql-driver/mysql v1.9.1 h1:FrjNGn/BsJQjVRuSa8CBrM5BWA9BWoXXat3KrtS
 github.com/go-sql-driver/mysql v1.9.1/go.mod h1:qn46aNg1333BRMNU69Lq93t8du/dwxI64Gl8i5p1WMU=
 github.com/go-task/slim-sprig/v3 v3.0.0 h1:sUs3vkvUymDpBKi3qH1YSqBQk9+9D/8M2mN1vB6EwHI=
 github.com/go-task/slim-sprig/v3 v3.0.0/go.mod h1:W848ghGpv3Qj3dhTPRyJypKRiqCdHZiAzKg9hl15HA8=
-github.com/golang-jwt/jwt/v5 v5.2.2 h1:Rl4B7itRWVtYIHFrSNd7vhTiz9UpLdi6gZhZ3wEeDy8=
-github.com/golang-jwt/jwt/v5 v5.2.2/go.mod h1:pqrtFR0X4osieyHYxtmOUWsAWrfe1Q5UVIyoH402zdk=
+github.com/golang-jwt/jwt/v5 v5.2.3 h1:kkGXqQOBSDDWRhWNXTFpqGSCMyh/PLnqUvMGJPDJDs0=
+github.com/golang-jwt/jwt/v5 v5.2.3/go.mod h1:pqrtFR0X4osieyHYxtmOUWsAWrfe1Q5UVIyoH402zdk=
 github.com/golang/protobuf v1.2.0/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
 github.com/golang/protobuf v1.3.1/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
 github.com/golang/protobuf v1.3.2/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
@@ -103,8 +103,8 @@ github.com/pmezard/go-difflib v1.0.1-0.20181226105442-5d4384ee4fb2 h1:Jamvg5psRI
 github.com/pmezard/go-difflib v1.0.1-0.20181226105442-5d4384ee4fb2/go.mod h1:iKH77koFhYxTK1pcRnkKkqfTogsbg7gZNVY4sRDYZ/4=
 github.com/pocketbase/dbx v1.11.0 h1:LpZezioMfT3K4tLrqA55wWFw1EtH1pM4tzSVa7kgszU=
 github.com/pocketbase/dbx v1.11.0/go.mod h1:xXRCIAKTHMgUCyCKZm55pUOdvFziJjQfXaWKhu2vhMs=
-github.com/pocketbase/pocketbase v0.28.4 h1:RmhWXDcfKrFM9/W0G0Zrlv4eKBM8/s/v4SQKytjgD20=
-github.com/pocketbase/pocketbase v0.28.4/go.mod h1:jSuN93vE/oeJVOz2D2ZxcYyr2bYNmDOMCUkM+JhyJQ0=
+github.com/pocketbase/pocketbase v0.29.0 h1:oL6qvkU2QSybClVtQdaq9Z1F3Wk59iKYCfIaf1R8KUs=
+github.com/pocketbase/pocketbase v0.29.0/go.mod h1:SqyH7o/3e+/uLySATlJqxH4S8gyU6R0adG56ZSV1vuU=
 github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55 h1:o4JXh1EVt9k/+g42oCprj/FisM4qX9L3sZB3upGN2ZU=
 github.com/power-devops/perfstat v0.0.0-20240221224432-82ca36839d55/go.mod h1:OmDBASR4679mdNQnz2pUhc2G8CO2JrUAVFDRBDP/hJE=
 github.com/remyoudompheng/bigfft v0.0.0-20230129092748-24d4a6f8daec h1:W09IVJc94icq4NjY3clb7Lk8O1qJ8BdBEF8z0ibU0rE=
@@ -120,8 +120,9 @@ github.com/spf13/cast v1.9.2 h1:SsGfm7M8QOFtEzumm7UZrZdLLquNdzFYfIbEXntcFbE=
 github.com/spf13/cast v1.9.2/go.mod h1:jNfB8QC9IA6ZuY2ZjDp0KtFO2LZZlg4S/7bzP6qqeHo=
 github.com/spf13/cobra v1.9.1 h1:CXSaggrXdbHK9CF+8ywj8Amf7PBRmPCOJugH954Nnlo=
 github.com/spf13/cobra v1.9.1/go.mod h1:nDyEzZ8ogv936Cinf6g1RU9MRY64Ir93oCnqb9wxYW0=
-github.com/spf13/pflag v1.0.6 h1:jFzHGLGAlb3ruxLB8MhbI6A8+AQX/2eW4qeyNZXNp2o=
 github.com/spf13/pflag v1.0.6/go.mod h1:McXfInJRrz4CZXVZOBLb0bTZqETkiAhM9Iw0y3An2Bg=
+github.com/spf13/pflag v1.0.7 h1:vN6T9TfwStFPFM5XzjsvmzZkLuaLX+HS+0SeFLRgU6M=
+github.com/spf13/pflag v1.0.7/go.mod h1:McXfInJRrz4CZXVZOBLb0bTZqETkiAhM9Iw0y3An2Bg=
 github.com/stretchr/objx v0.1.0/go.mod h1:HFkY916IF+rwdDfMAkV7OtwuqBVzrE8GR6GFx+wExME=
 github.com/stretchr/testify v1.4.0/go.mod h1:j7eGeouHqKxXV5pUuKE4zz7dFj8WfuZ+81PSLYec5m4=
 github.com/stretchr/testify v1.10.0 h1:Xv5erBjTwe/5IxqUQTdXv5kgmIvbHo3QQyRwhJsOfJA=
@@ -143,29 +144,29 @@ go.uber.org/automaxprocs v1.6.0 h1:O3y2/QNTOdbF+e/dpXNNW7Rx2hZ4sTIPyybbxyNqTUs=
 go.uber.org/automaxprocs v1.6.0/go.mod h1:ifeIMSnPZuznNm6jmdzmU3/bfk01Fe2fotchwEFJ8r8=
 golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACkg1iLfiJU5Ep61QUkGW8qpdssI0+w=
 golang.org/x/crypto v0.0.0-20201221181555-eec23a3978ad/go.mod h1:jdWPYTVW3xRLrWPugEBEK3UY2ZEsg3UU495nc5E+M+I=
-golang.org/x/crypto v0.39.0 h1:SHs+kF4LP+f+p14esP5jAoDpHU8Gu/v9lFRK6IT5imM=
-golang.org/x/crypto v0.39.0/go.mod h1:L+Xg3Wf6HoL4Bn4238Z6ft6KfEpN0tJGo53AAPC632U=
-golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b h1:M2rDM6z3Fhozi9O7NWsxAkg/yqS/lQJ6PmkyIV3YP+o=
-golang.org/x/exp v0.0.0-20250620022241-b7579e27df2b/go.mod h1:3//PLf8L/X+8b4vuAfHzxeRUl04Adcb341+IGKfnqS8=
+golang.org/x/crypto v0.40.0 h1:r4x+VvoG5Fm+eJcxMaY8CQM7Lb0l1lsmjGBQ6s8BfKM=
+golang.org/x/crypto v0.40.0/go.mod h1:Qr1vMER5WyS2dfPHAlsOj01wgLbsyWtFn/aY+5+ZdxY=
+golang.org/x/exp v0.0.0-20250718183923-645b1fa84792 h1:R9PFI6EUdfVKgwKjZef7QIwGcBKu86OEFpJ9nUEP2l4=
+golang.org/x/exp v0.0.0-20250718183923-645b1fa84792/go.mod h1:A+z0yzpGtvnG90cToK5n2tu8UJVP2XUATh+r+sfOOOc=
 golang.org/x/image v0.0.0-20191009234506-e7c1f5e7dbb8/go.mod h1:FeLwcggjj3mMvU+oOTbSwawSJRM1uh48EjtB4UJZlP0=
-golang.org/x/image v0.28.0 h1:gdem5JW1OLS4FbkWgLO+7ZeFzYtL3xClb97GaUzYMFE=
-golang.org/x/image v0.28.0/go.mod h1:GUJYXtnGKEUgggyzh+Vxt+AviiCcyiwpsl8iQ8MvwGY=
-golang.org/x/mod v0.25.0 h1:n7a+ZbQKQA/Ysbyb0/6IbB1H/X41mKgbhfv7AfG/44w=
-golang.org/x/mod v0.25.0/go.mod h1:IXM97Txy2VM4PJ3gI61r1YEk/gAj6zAHN3AdZt6S9Ww=
+golang.org/x/image v0.29.0 h1:HcdsyR4Gsuys/Axh0rDEmlBmB68rW1U9BUdB3UVHsas=
+golang.org/x/image v0.29.0/go.mod h1:RVJROnf3SLK8d26OW91j4FrIHGbsJ8QnbEocVTOWQDA=
+golang.org/x/mod v0.26.0 h1:EGMPT//Ezu+ylkCijjPc+f4Aih7sZvaAr+O3EHBxvZg=
+golang.org/x/mod v0.26.0/go.mod h1:/j6NAhSk8iQ723BGAUyoAcn7SlD7s15Dp9Nd/SfeaFQ=
 golang.org/x/net v0.0.0-20180724234803-3673e40ba225/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
 golang.org/x/net v0.0.0-20180906233101-161cd47e91fd/go.mod h1:mL1N/T3taQHkDXs73rZJwtUhF3w3ftmwwsq0BUmARs4=
 golang.org/x/net v0.0.0-20190311183353-d8887717615a/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg=
 golang.org/x/net v0.0.0-20190404232315-eb5bcb51f2a3/go.mod h1:t9HGtf8HONx5eT2rtn7q6eTqICYqUVnKs3thJo3Qplg=
 golang.org/x/net v0.0.0-20190603091049-60506f45cf65/go.mod h1:HSz+uSET+XFnRR8LxR5pz3Of3rY3CfYBVs4xY44aLks=
-golang.org/x/net v0.41.0 h1:vBTly1HeNPEn3wtREYfy4GZ/NECgw2Cnl+nK6Nz3uvw=
-golang.org/x/net v0.41.0/go.mod h1:B/K4NNqkfmg07DQYrbwvSluqCJOOXwUjeb/5lOisjbA=
+golang.org/x/net v0.42.0 h1:jzkYrhi3YQWD6MLBJcsklgQsoAcw89EcZbJw8Z614hs=
+golang.org/x/net v0.42.0/go.mod h1:FF1RA5d3u7nAYA4z2TkclSCKh68eSXtiFwcWQpPXdt8=
 golang.org/x/oauth2 v0.0.0-20180821212333-d2e6202438be/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.0.0-20181106182150-f42d05182288/go.mod h1:N/0e6XlmueqKjAGxoOufVs8QHGRruUQn6yWY3a++T0U=
 golang.org/x/oauth2 v0.30.0 h1:dnDm7JmhM45NNpd8FDDeLhK6FwqbOf4MLCM9zb1BOHI=
 golang.org/x/oauth2 v0.30.0/go.mod h1:B++QgG3ZKulg6sRPGD/mqlHQs5rB3Ml9erfeDY7xKlU=
 golang.org/x/sync v0.0.0-20180314180146-1d60e4601c6f/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
-golang.org/x/sync v0.15.0 h1:KWH3jNZsfyT6xfAfKiz6MRNmd46ByHDYaZ7KSkCtdW8=
-golang.org/x/sync v0.15.0/go.mod h1:1dzgHSNfp02xaA81J2MS99Qcpr2w7fw1gpm99rleRqA=
+golang.org/x/sync v0.16.0 h1:ycBJEhp9p4vXvUZNszeOq0kGTPghopOL8q0fq3vstxw=
+golang.org/x/sync v0.16.0/go.mod h1:1dzgHSNfp02xaA81J2MS99Qcpr2w7fw1gpm99rleRqA=
 golang.org/x/sys v0.0.0-20180909124046-d0be0721c37e/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
 golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
 golang.org/x/sys v0.0.0-20190916202348-b4ddaad3f8a3/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
@@ -173,19 +174,19 @@ golang.org/x/sys v0.0.0-20191026070338-33540a1f6037/go.mod h1:h1NjWce9XRLGQEsW7w
 golang.org/x/sys v0.0.0-20201204225414-ed752295db88/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.1.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.6.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
-golang.org/x/sys v0.33.0 h1:q3i8TbbEz+JRD9ywIRlyRAQbM0qF7hu24q3teo2hbuw=
-golang.org/x/sys v0.33.0/go.mod h1:BJP2sWEmIv4KK5OTEluFJCKSidICx8ciO85XgH3Ak8k=
+golang.org/x/sys v0.34.0 h1:H5Y5sJ2L2JRdyv7ROF1he/lPdvFsd0mJHFw2ThKHxLA=
+golang.org/x/sys v0.34.0/go.mod h1:BJP2sWEmIv4KK5OTEluFJCKSidICx8ciO85XgH3Ak8k=
 golang.org/x/term v0.0.0-20201117132131-f5c789dd3221/go.mod h1:Nr5EML6q2oocZ2LXRh80K7BxOlk5/8JxuGnuhpl+muw=
-golang.org/x/term v0.32.0 h1:DR4lr0TjUs3epypdhTOkMmuF5CDFJ/8pOnbzMZPQ7bg=
-golang.org/x/term v0.32.0/go.mod h1:uZG1FhGx848Sqfsq4/DlJr3xGGsYMu/L5GW4abiaEPQ=
+golang.org/x/term v0.33.0 h1:NuFncQrRcaRvVmgRkvM3j/F00gWIAlcmlB8ACEKmGIg=
+golang.org/x/term v0.33.0/go.mod h1:s18+ql9tYWp1IfpV9DmCtQDDSRBUjKaw9M1eAv5UeF0=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
 golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk=
 golang.org/x/text v0.3.5/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
-golang.org/x/text v0.26.0 h1:P42AVeLghgTYr4+xUnTRKDMqpar+PtX7KWuNQL21L8M=
-golang.org/x/text v0.26.0/go.mod h1:QK15LZJUUQVJxhz7wXgxSy/CJaTFjd0G+YLonydOVQA=
+golang.org/x/text v0.27.0 h1:4fGWRpyh641NLlecmyl4LOe6yDdfaYNrGb2zdfo4JV4=
+golang.org/x/text v0.27.0/go.mod h1:1D28KMCvyooCX9hBiosv5Tz/+YLxj0j7XhWjpSUF7CU=
 golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
-golang.org/x/tools v0.34.0 h1:qIpSLOxeCYGg9TrcJokLBG4KFA6d795g0xkBkiESGlo=
-golang.org/x/tools v0.34.0/go.mod h1:pAP9OwEaY1CAW3HOmg3hLZC5Z0CCmzjAF2UQMSqNARg=
+golang.org/x/tools v0.35.0 h1:mBffYraMEf7aa0sB+NuKnuCy8qI/9Bughn8dC2Gu5r0=
+golang.org/x/tools v0.35.0/go.mod h1:NKdj5HkL/73byiZSJjqJgKn3ep7KjFkBOkR/Hps3VPw=
 golang.org/x/xerrors v0.0.0-20191204190536-9bdfabe68543/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
 google.golang.org/appengine v1.1.0/go.mod h1:EbEs0AVv82hx2wNQdGPgUI5lhzA/G0D9YwlJXL52JkM=
 google.golang.org/appengine v1.3.0/go.mod h1:xpcJRLb0r/rnEns0DIKYYv+WjYCduHsrkT7/EB5XEv4=
@@ -201,16 +202,20 @@ gopkg.in/yaml.v2 v2.2.1/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
 gopkg.in/yaml.v2 v2.2.2/go.mod h1:hI93XBmqTisBFMUTm0b8Fm+jr3Dg1NNxqwp+5A1VGuI=
 gopkg.in/yaml.v3 v3.0.1 h1:fxVm/GzAzEWqLHuvctI91KS9hhNmmWOoWu0XTYJS7CA=
 gopkg.in/yaml.v3 v3.0.1/go.mod h1:K4uyk7z7BCEPqu6E+C64Yfv1cQ7kz7rIZviUmN+EgEM=
-modernc.org/cc/v4 v4.26.1 h1:+X5NtzVBn0KgsBCBe+xkDC7twLb/jNVj9FPgiwSQO3s=
-modernc.org/cc/v4 v4.26.1/go.mod h1:uVtb5OGqUKpoLWhqwNQo/8LwvoiEBLvZXIQ/SmO6mL0=
+modernc.org/cc/v4 v4.26.2 h1:991HMkLjJzYBIfha6ECZdjrIYz2/1ayr+FL8GN+CNzM=
+modernc.org/cc/v4 v4.26.2/go.mod h1:uVtb5OGqUKpoLWhqwNQo/8LwvoiEBLvZXIQ/SmO6mL0=
 modernc.org/ccgo/v4 v4.28.0 h1:rjznn6WWehKq7dG4JtLRKxb52Ecv8OUGah8+Z/SfpNU=
 modernc.org/ccgo/v4 v4.28.0/go.mod h1:JygV3+9AV6SmPhDasu4JgquwU81XAKLd3OKTUDNOiKE=
-modernc.org/fileutil v1.3.3 h1:3qaU+7f7xxTUmvU1pJTZiDLAIoJVdUSSauJNHg9yXoA=
-modernc.org/fileutil v1.3.3/go.mod h1:HxmghZSZVAz/LXcMNwZPA/DRrQZEVP9VX0V4LQGQFOc=
+modernc.org/fileutil v1.3.8 h1:qtzNm7ED75pd1C7WgAGcK4edm4fvhtBsEiI/0NQ54YM=
+modernc.org/fileutil v1.3.8/go.mod h1:HxmghZSZVAz/LXcMNwZPA/DRrQZEVP9VX0V4LQGQFOc=
 modernc.org/gc/v2 v2.6.5 h1:nyqdV8q46KvTpZlsw66kWqwXRHdjIlJOhG6kxiV/9xI=
 modernc.org/gc/v2 v2.6.5/go.mod h1:YgIahr1ypgfe7chRuJi2gD7DBQiKSLMPgBQe9oIiito=
+modernc.org/goabi0 v0.2.0 h1:HvEowk7LxcPd0eq6mVOAEMai46V+i7Jrj13t4AzuNks=
+modernc.org/goabi0 v0.2.0/go.mod h1:CEFRnnJhKvWT1c1JTI3Avm+tgOWbkOu5oPA8eH8LnMI=
 modernc.org/libc v1.65.10 h1:ZwEk8+jhW7qBjHIT+wd0d9VjitRyQef9BnzlzGwMODc=
 modernc.org/libc v1.65.10/go.mod h1:StFvYpx7i/mXtBAfVOjaU0PWZOvIRoZSgXhrwXzr8Po=
+modernc.org/libc v1.66.3 h1:cfCbjTUcdsKyyZZfEUKfoHcP3S0Wkvz3jgSzByEWVCQ=
+modernc.org/libc v1.66.3/go.mod h1:XD9zO8kt59cANKvHPXpx7yS2ELPheAey0vjIuZOhOU8=
 modernc.org/mathutil v1.7.1 h1:GCZVGXdaN8gTqB1Mf/usp1Y/hSqgI2vAGGP4jZMCxOU=
 modernc.org/mathutil v1.7.1/go.mod h1:4p5IwJITfppl0G4sUEDtCr4DthTaT47/N3aT6MhfgJg=
 modernc.org/memory v1.11.0 h1:o4QC8aMQzmcwCK3t3Ux/ZHmwFPzE6hf2Y5LbkRs+hbI=
--- a/beszel/internal/agent/sensors.go
+++ b/beszel/internal/agent/sensors.go
@@ -6,8 +6,10 @@ import (
 	"fmt"
 	"log/slog"
 	"path"
+	"runtime"
 	"strconv"
 	"strings"
+	"unicode/utf8"

 	"github.com/shirou/gopsutil/v4/common"
 	"github.com/shirou/gopsutil/v4/sensors"
@@ -103,6 +105,11 @@ func (a *Agent) updateTemperatures(systemStats *system.Stats) {

 	systemStats.Temperatures = make(map[string]float64, len(temps))
 	for i, sensor := range temps {
+		// check for malformed strings on darwin (gopsutil/issues/1832)
+		if runtime.GOOS == "darwin" && !utf8.ValidString(sensor.SensorKey) {
+			continue
+		}
+
 		// scale temperature
 		if sensor.Temperature != 0 && sensor.Temperature < 1 {
 			sensor.Temperature = scaleTemperature(sensor.Temperature)
--- a/beszel/internal/agent/system.go
+++ b/beszel/internal/agent/system.go
@@ -251,6 +251,7 @@ func (a *Agent) getSystemStats() system.Stats {

 	// update base system info
 	a.systemInfo.Cpu = systemStats.Cpu
+	a.systemInfo.LoadAvg1 = systemStats.LoadAvg1
 	a.systemInfo.LoadAvg5 = systemStats.LoadAvg5
 	a.systemInfo.LoadAvg15 = systemStats.LoadAvg15
 	a.systemInfo.MemPct = systemStats.MemPct
--- a/beszel/internal/alerts/alerts.go
+++ b/beszel/internal/alerts/alerts.go
@@ -47,6 +47,7 @@ type SystemAlertStats struct {
 	NetSent      float64            `json:"ns"`
 	NetRecv      float64            `json:"nr"`
 	Temperatures map[string]float32 `json:"t"`
+	LoadAvg1     float64            `json:"l1"`
 	LoadAvg5     float64            `json:"l5"`
 	LoadAvg15    float64            `json:"l15"`
 }
@@ -92,10 +93,18 @@ func NewAlertManager(app hubLike) *AlertManager {
 		alertQueue: make(chan alertTask),
 		stopChan:   make(chan struct{}),
 	}
+	am.bindEvents()
 	go am.startWorker()
 	return am
 }

+// Bind events to the alerts collection lifecycle
+func (am *AlertManager) bindEvents() {
+	am.hub.OnRecordAfterUpdateSuccess("alerts").BindFunc(updateHistoryOnAlertUpdate)
+	am.hub.OnRecordAfterDeleteSuccess("alerts").BindFunc(resolveHistoryOnAlertDelete)
+}
+
+// SendAlert sends an alert to the user
 func (am *AlertManager) SendAlert(data AlertMessageData) error {
 	// get user settings
 	record, err := am.hub.FindFirstRecordByFilter(
--- a/beszel/internal/alerts/alerts_history.go
+++ b/beszel/internal/alerts/alerts_history.go
@@ -0,0 +1,85 @@
+package alerts
+
+import (
+	"time"
+
+	"github.com/pocketbase/dbx"
+	"github.com/pocketbase/pocketbase/core"
+)
+
+// On triggered alert record delete, set matching alert history record to resolved
+func resolveHistoryOnAlertDelete(e *core.RecordEvent) error {
+	if !e.Record.GetBool("triggered") {
+		return e.Next()
+	}
+	_ = resolveAlertHistoryRecord(e.App, e.Record)
+	return e.Next()
+}
+
+// On alert record update, update alert history record
+func updateHistoryOnAlertUpdate(e *core.RecordEvent) error {
+	original := e.Record.Original()
+	new := e.Record
+
+	originalTriggered := original.GetBool("triggered")
+	newTriggered := new.GetBool("triggered")
+
+	// no need to update alert history if triggered state has not changed
+	if originalTriggered == newTriggered {
+		return e.Next()
+	}
+
+	// if new state is triggered, create new alert history record
+	if newTriggered {
+		_, _ = createAlertHistoryRecord(e.App, new)
+		return e.Next()
+	}
+
+	// if new state is not triggered, check for matching alert history record and set it to resolved
+	_ = resolveAlertHistoryRecord(e.App, new)
+	return e.Next()
+}
+
+// resolveAlertHistoryRecord sets the resolved field to the current time
+func resolveAlertHistoryRecord(app core.App, alertRecord *core.Record) error {
+	alertHistoryRecords, err := app.FindRecordsByFilter(
+		"alerts_history",
+		"alert_id={:alert_id} && resolved=null",
+		"-created",
+		1,
+		0,
+		dbx.Params{"alert_id": alertRecord.Id},
+	)
+	if err != nil {
+		return err
+	}
+	if len(alertHistoryRecords) == 0 {
+		return nil
+	}
+	alertHistoryRecord := alertHistoryRecords[0] // there should be only one record
+	alertHistoryRecord.Set("resolved", time.Now().UTC())
+	err = app.Save(alertHistoryRecord)
+	if err != nil {
+		app.Logger().Error("Failed to resolve alert history", "err", err)
+	}
+	return err
+}
+
+// createAlertHistoryRecord creates a new alert history record
+func createAlertHistoryRecord(app core.App, alertRecord *core.Record) (alertHistoryRecord *core.Record, err error) {
+	alertHistoryCollection, err := app.FindCachedCollectionByNameOrId("alerts_history")
+	if err != nil {
+		return nil, err
+	}
+	alertHistoryRecord = core.NewRecord(alertHistoryCollection)
+	alertHistoryRecord.Set("alert_id", alertRecord.Id)
+	alertHistoryRecord.Set("user", alertRecord.GetString("user"))
+	alertHistoryRecord.Set("system", alertRecord.GetString("system"))
+	alertHistoryRecord.Set("name", alertRecord.GetString("name"))
+	alertHistoryRecord.Set("value", alertRecord.GetFloat("value"))
+	err = app.Save(alertHistoryRecord)
+	if err != nil {
+		app.Logger().Error("Failed to save alert history", "err", err)
+	}
+	return alertHistoryRecord, err
+}
--- a/beszel/internal/alerts/alerts_status.go
+++ b/beszel/internal/alerts/alerts_status.go
@@ -136,6 +136,14 @@ func (am *AlertManager) handleSystemUp(systemName string, alertRecords []*core.R

 // sendStatusAlert sends a status alert ("up" or "down") to the users associated with the alert records.
 func (am *AlertManager) sendStatusAlert(alertStatus string, systemName string, alertRecord *core.Record) error {
+	switch alertStatus {
+	case "up":
+		alertRecord.Set("triggered", false)
+	case "down":
+		alertRecord.Set("triggered", true)
+	}
+	am.hub.Save(alertRecord)
+
 	var emoji string
 	if alertStatus == "up" {
 		emoji = "\u2705" // Green checkmark emoji
@@ -146,16 +154,16 @@ func (am *AlertManager) sendStatusAlert(alertStatus string, systemName string, a
 	title := fmt.Sprintf("Connection to %s is %s %v", systemName, alertStatus, emoji)
 	message := strings.TrimSuffix(title, emoji)

-	if errs := am.hub.ExpandRecord(alertRecord, []string{"user"}, nil); len(errs) > 0 {
-		return errs["user"]
-	}
-	user := alertRecord.ExpandedOne("user")
-	if user == nil {
-		return nil
-	}
+	// if errs := am.hub.ExpandRecord(alertRecord, []string{"user"}, nil); len(errs) > 0 {
+	// 	return errs["user"]
+	// }
+	// user := alertRecord.ExpandedOne("user")
+	// if user == nil {
+	// 	return nil
+	// }

 	return am.SendAlert(AlertMessageData{
-		UserID:   user.Id,
+		UserID:   alertRecord.GetString("user"),
 		Title:    title,
 		Message:  message,
 		Link:     am.hub.MakeLink("system", systemName),
--- a/beszel/internal/alerts/alerts_system.go
+++ b/beszel/internal/alerts/alerts_system.go
@@ -15,7 +15,7 @@ import (

 func (am *AlertManager) HandleSystemAlerts(systemRecord *core.Record, data *system.CombinedData) error {
 	alertRecords, err := am.hub.FindAllRecords("alerts",
-		dbx.NewExp("system={:system}", dbx.Params{"system": systemRecord.Id}),
+		dbx.NewExp("system={:system} AND name!='Status'", dbx.Params{"system": systemRecord.Id}),
 	)
 	if err != nil || len(alertRecords) == 0 {
 		// log.Println("no alerts found for system")
@@ -54,6 +54,9 @@ func (am *AlertManager) HandleSystemAlerts(systemRecord *core.Record, data *syst
 			}
 			val = data.Info.DashboardTemp
 			unit = "°C"
+		case "LoadAvg1":
+			val = data.Info.LoadAvg1
+			unit = ""
 		case "LoadAvg5":
 			val = data.Info.LoadAvg5
 			unit = ""
@@ -196,6 +199,8 @@ func (am *AlertManager) HandleSystemAlerts(systemRecord *core.Record, data *syst
 					}
 					alert.mapSums[key] += temp
 				}
+			case "LoadAvg1":
+				alert.val += stats.LoadAvg1
 			case "LoadAvg5":
 				alert.val += stats.LoadAvg5
 			case "LoadAvg15":
--- a/beszel/internal/entities/system/system.go
+++ b/beszel/internal/entities/system/system.go
@@ -92,8 +92,9 @@ type Info struct {
 	GpuPct        float64 `json:"g,omitempty" cbor:"12,keyasint,omitempty"`
 	DashboardTemp float64 `json:"dt,omitempty" cbor:"13,keyasint,omitempty"`
 	Os            Os      `json:"os" cbor:"14,keyasint"`
-	LoadAvg5      float64 `json:"l5,omitempty" cbor:"15,keyasint,omitempty,omitzero"`
-	LoadAvg15     float64 `json:"l15,omitempty" cbor:"16,keyasint,omitempty,omitzero"`
+	LoadAvg1      float64 `json:"l1,omitempty" cbor:"15,keyasint,omitempty"`
+	LoadAvg5      float64 `json:"l5,omitempty" cbor:"16,keyasint,omitempty"`
+	LoadAvg15     float64 `json:"l15,omitempty" cbor:"17,keyasint,omitempty"`
 }

 // Final data structure to return to the hub
--- a/beszel/internal/hub/hub.go
+++ b/beszel/internal/hub/hub.go
@@ -215,7 +215,7 @@ func (h *Hub) startServer(se *core.ServeEvent) error {

 // registerCronJobs sets up scheduled tasks
 func (h *Hub) registerCronJobs(_ *core.ServeEvent) error {
-	// delete old records once every hour
+	// delete old system_stats and alerts_history records once every hour
 	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)
--- a/beszel/internal/hub/systems/system_manager.go
+++ b/beszel/internal/hub/systems/system_manager.go
@@ -159,8 +159,10 @@ func (sm *SystemManager) onRecordUpdate(e *core.RecordEvent) error {
 // - down: Triggers status change alerts
 func (sm *SystemManager) onRecordAfterUpdateSuccess(e *core.RecordEvent) error {
 	newStatus := e.Record.GetString("status")
+	prevStatus := pending
 	system, ok := sm.systems.GetOk(e.Record.Id)
 	if ok {
+		prevStatus = system.Status
 		system.Status = newStatus
 	}

@@ -182,6 +184,7 @@ func (sm *SystemManager) onRecordAfterUpdateSuccess(e *core.RecordEvent) error {
 		if err := sm.AddRecord(e.Record, nil); err != nil {
 			e.App.Logger().Error("Error adding record", "err", err)
 		}
+		_ = deactivateAlerts(e.App, e.Record.Id)
 		return e.Next()
 	}

@@ -190,8 +193,6 @@ func (sm *SystemManager) onRecordAfterUpdateSuccess(e *core.RecordEvent) error {
 		return sm.AddRecord(e.Record, nil)
 	}

-	prevStatus := system.Status
-
 	// Trigger system alerts when system comes online
 	if newStatus == up {
 		if err := sm.hub.HandleSystemAlerts(e.Record, system.data); err != nil {
--- a/beszel/internal/records/records.go
+++ b/beszel/internal/records/records.go
@@ -203,6 +203,9 @@ func (rm *RecordManager) AverageSystemStats(db dbx.Builder, records RecordIds) *
 		sum.DiskWritePs += stats.DiskWritePs
 		sum.NetworkSent += stats.NetworkSent
 		sum.NetworkRecv += stats.NetworkRecv
+		sum.LoadAvg1 += stats.LoadAvg1
+		sum.LoadAvg5 += stats.LoadAvg5
+		sum.LoadAvg15 += stats.LoadAvg15
 		// Set peak values
 		sum.MaxCpu = max(sum.MaxCpu, stats.MaxCpu, stats.Cpu)
 		sum.MaxNetworkSent = max(sum.MaxNetworkSent, stats.MaxNetworkSent, stats.NetworkSent)
@@ -278,7 +281,9 @@ func (rm *RecordManager) AverageSystemStats(db dbx.Builder, records RecordIds) *
 		sum.DiskWritePs = twoDecimals(sum.DiskWritePs / count)
 		sum.NetworkSent = twoDecimals(sum.NetworkSent / count)
 		sum.NetworkRecv = twoDecimals(sum.NetworkRecv / count)
-
+		sum.LoadAvg1 = twoDecimals(sum.LoadAvg1 / count)
+		sum.LoadAvg5 = twoDecimals(sum.LoadAvg5 / count)
+		sum.LoadAvg15 = twoDecimals(sum.LoadAvg15 / count)
 		// Average temperatures
 		if sum.Temperatures != nil && tempCount > 0 {
 			for key := range sum.Temperatures {
@@ -361,12 +366,46 @@ func (rm *RecordManager) AverageContainerStats(db dbx.Builder, records RecordIds
 	return result
 }

-// Deletes records older than what is displayed in the UI
+// Delete old records
 func (rm *RecordManager) DeleteOldRecords() {
-	// Define the collections to process
+	rm.app.RunInTransaction(func(txApp core.App) error {
+		err := deleteOldSystemStats(txApp)
+		if err != nil {
+			return err
+		}
+		err = deleteOldAlertsHistory(txApp, 200, 250)
+		if err != nil {
+			return err
+		}
+		return nil
+	})
+}
+
+// Delete old alerts history records
+func deleteOldAlertsHistory(app core.App, countToKeep, countBeforeDeletion int) error {
+	db := app.DB()
+	var users []struct {
+		Id string `db:"user"`
+	}
+	err := db.NewQuery("SELECT user, COUNT(*) as count FROM alerts_history GROUP BY user HAVING count > {:countBeforeDeletion}").Bind(dbx.Params{"countBeforeDeletion": countBeforeDeletion}).All(&users)
+	if err != nil {
+		return err
+	}
+	for _, user := range users {
+		_, err = db.NewQuery("DELETE FROM alerts_history WHERE user = {:user} AND id NOT IN (SELECT id FROM alerts_history WHERE user = {:user} ORDER BY created DESC LIMIT {:countToKeep})").Bind(dbx.Params{"user": user.Id, "countToKeep": countToKeep}).Execute()
+		if err != nil {
+			return err
+		}
+	}
+	return nil
+}
+
+// Deletes system_stats records older than what is displayed in the UI
+func deleteOldSystemStats(app core.App) error {
+	// Collections to process
 	collections := [2]string{"system_stats", "container_stats"}

-	// Define record types and their retention periods
+	// Record types and their retention periods
 	type RecordDeletionData struct {
 		recordType string
 		retention  time.Duration
@@ -382,10 +421,9 @@ func (rm *RecordManager) DeleteOldRecords() {
 	now := time.Now().UTC()

 	for _, collection := range collections {
-		// Build the WHERE clause dynamically
+		// Build the WHERE clause
 		var conditionParts []string
 		var params dbx.Params = make(map[string]any)
-
 		for i := range recordData {
 			rd := recordData[i]
 			// Create parameterized condition for this record type
@@ -393,19 +431,15 @@ func (rm *RecordManager) DeleteOldRecords() {
 			conditionParts = append(conditionParts, fmt.Sprintf("(type = '%s' AND created < {:%s})", rd.recordType, dateParam))
 			params[dateParam] = now.Add(-rd.retention)
 		}
-
 		// Combine conditions with OR
 		conditionStr := strings.Join(conditionParts, " OR ")
-
-		// Construct the full raw query
+		// Construct and execute the full raw query
 		rawQuery := fmt.Sprintf("DELETE FROM %s WHERE %s", collection, conditionStr)
-
-		// Execute the query with parameters
-		if _, err := rm.app.DB().NewQuery(rawQuery).Bind(params).Execute(); err != nil {
-			// return fmt.Errorf("failed to delete from %s: %v", collection, err)
-			rm.app.Logger().Error("failed to delete", "collection", collection, "error", err)
+		if _, err := app.DB().NewQuery(rawQuery).Bind(params).Execute(); err != nil {
+			return fmt.Errorf("failed to delete from %s: %v", collection, err)
 		}
 	}
+	return nil
 }

 /* Round float to two decimals */
--- a/beszel/internal/records/records_test.go
+++ b/beszel/internal/records/records_test.go
@@ -0,0 +1,381 @@
+//go:build testing
+// +build testing
+
+package records_test
+
+import (
+	"beszel/internal/records"
+	"beszel/internal/tests"
+	"fmt"
+	"testing"
+	"time"
+
+	"github.com/pocketbase/dbx"
+	"github.com/pocketbase/pocketbase/core"
+	"github.com/pocketbase/pocketbase/tools/types"
+	"github.com/stretchr/testify/assert"
+	"github.com/stretchr/testify/require"
+)
+
+// TestDeleteOldRecords tests the main DeleteOldRecords function
+func TestDeleteOldRecords(t *testing.T) {
+	hub, err := tests.NewTestHub(t.TempDir())
+	require.NoError(t, err)
+	defer hub.Cleanup()
+
+	rm := records.NewRecordManager(hub)
+
+	// Create test user for alerts history
+	user, err := tests.CreateUser(hub, "test@example.com", "testtesttest")
+	require.NoError(t, err)
+
+	// Create test system
+	system, err := tests.CreateRecord(hub, "systems", map[string]any{
+		"name":   "test-system",
+		"host":   "localhost",
+		"port":   "45876",
+		"status": "up",
+		"users":  []string{user.Id},
+	})
+	require.NoError(t, err)
+
+	now := time.Now()
+
+	// Create old system_stats records that should be deleted
+	var record *core.Record
+	record, err = tests.CreateRecord(hub, "system_stats", map[string]any{
+		"system": system.Id,
+		"type":   "1m",
+		"stats":  `{"cpu": 50.0, "mem": 1024}`,
+	})
+	require.NoError(t, err)
+	// created is autodate field, so we need to set it manually
+	record.SetRaw("created", now.UTC().Add(-2*time.Hour).Format(types.DefaultDateLayout))
+	err = hub.SaveNoValidate(record)
+	require.NoError(t, err)
+	require.NotNil(t, record)
+	require.InDelta(t, record.GetDateTime("created").Time().UTC().Unix(), now.UTC().Add(-2*time.Hour).Unix(), 1)
+	require.Equal(t, record.Get("system"), system.Id)
+	require.Equal(t, record.Get("type"), "1m")
+
+	// Create recent system_stats record that should be kept
+	_, err = tests.CreateRecord(hub, "system_stats", map[string]any{
+		"system":  system.Id,
+		"type":    "1m",
+		"stats":   `{"cpu": 30.0, "mem": 512}`,
+		"created": now.Add(-30 * time.Minute), // 30 minutes old, should be kept
+	})
+	require.NoError(t, err)
+
+	// Create many alerts history records to trigger deletion
+	for i := range 260 { // More than countBeforeDeletion (250)
+		_, err = tests.CreateRecord(hub, "alerts_history", map[string]any{
+			"user":    user.Id,
+			"name":    "CPU",
+			"value":   i + 1,
+			"system":  system.Id,
+			"created": now.Add(-time.Duration(i) * time.Minute),
+		})
+		require.NoError(t, err)
+	}
+
+	// Count records before deletion
+	systemStatsCountBefore, err := hub.CountRecords("system_stats")
+	require.NoError(t, err)
+	alertsCountBefore, err := hub.CountRecords("alerts_history")
+	require.NoError(t, err)
+
+	// Run deletion
+	rm.DeleteOldRecords()
+
+	// Count records after deletion
+	systemStatsCountAfter, err := hub.CountRecords("system_stats")
+	require.NoError(t, err)
+	alertsCountAfter, err := hub.CountRecords("alerts_history")
+	require.NoError(t, err)
+
+	// Verify old system stats were deleted
+	assert.Less(t, systemStatsCountAfter, systemStatsCountBefore, "Old system stats should be deleted")
+
+	// Verify alerts history was trimmed
+	assert.Less(t, alertsCountAfter, alertsCountBefore, "Excessive alerts history should be deleted")
+	assert.Equal(t, alertsCountAfter, int64(200), "Alerts count should be equal to countToKeep (200)")
+}
+
+// TestDeleteOldSystemStats tests the deleteOldSystemStats function
+func TestDeleteOldSystemStats(t *testing.T) {
+	hub, err := tests.NewTestHub(t.TempDir())
+	require.NoError(t, err)
+	defer hub.Cleanup()
+
+	// Create test system
+	user, err := tests.CreateUser(hub, "test@example.com", "testtesttest")
+	require.NoError(t, err)
+
+	system, err := tests.CreateRecord(hub, "systems", map[string]any{
+		"name":   "test-system",
+		"host":   "localhost",
+		"port":   "45876",
+		"status": "up",
+		"users":  []string{user.Id},
+	})
+	require.NoError(t, err)
+
+	now := time.Now().UTC()
+
+	// Test data for different record types and their retention periods
+	testCases := []struct {
+		recordType   string
+		retention    time.Duration
+		shouldBeKept bool
+		ageFromNow   time.Duration
+		description  string
+	}{
+		{"1m", time.Hour, true, 30 * time.Minute, "1m record within 1 hour should be kept"},
+		{"1m", time.Hour, false, 2 * time.Hour, "1m record older than 1 hour should be deleted"},
+		{"10m", 12 * time.Hour, true, 6 * time.Hour, "10m record within 12 hours should be kept"},
+		{"10m", 12 * time.Hour, false, 24 * time.Hour, "10m record older than 12 hours should be deleted"},
+		{"20m", 24 * time.Hour, true, 12 * time.Hour, "20m record within 24 hours should be kept"},
+		{"20m", 24 * time.Hour, false, 48 * time.Hour, "20m record older than 24 hours should be deleted"},
+		{"120m", 7 * 24 * time.Hour, true, 3 * 24 * time.Hour, "120m record within 7 days should be kept"},
+		{"120m", 7 * 24 * time.Hour, false, 10 * 24 * time.Hour, "120m record older than 7 days should be deleted"},
+		{"480m", 30 * 24 * time.Hour, true, 15 * 24 * time.Hour, "480m record within 30 days should be kept"},
+		{"480m", 30 * 24 * time.Hour, false, 45 * 24 * time.Hour, "480m record older than 30 days should be deleted"},
+	}
+
+	// Create test records for both system_stats and container_stats
+	collections := []string{"system_stats", "container_stats"}
+	recordIds := make(map[string][]string)
+
+	for _, collection := range collections {
+		recordIds[collection] = make([]string, 0)
+
+		for i, tc := range testCases {
+			recordTime := now.Add(-tc.ageFromNow)
+
+			var stats string
+			if collection == "system_stats" {
+				stats = fmt.Sprintf(`{"cpu": %d.0, "mem": %d}`, i*10, i*100)
+			} else {
+				stats = fmt.Sprintf(`[{"name": "container%d", "cpu": %d.0, "mem": %d}]`, i, i*5, i*50)
+			}
+
+			record, err := tests.CreateRecord(hub, collection, map[string]any{
+				"system": system.Id,
+				"type":   tc.recordType,
+				"stats":  stats,
+			})
+			require.NoError(t, err)
+			record.SetRaw("created", recordTime.Format(types.DefaultDateLayout))
+			err = hub.SaveNoValidate(record)
+			require.NoError(t, err)
+			recordIds[collection] = append(recordIds[collection], record.Id)
+		}
+	}
+
+	// Run deletion
+	err = records.TestDeleteOldSystemStats(hub)
+	require.NoError(t, err)
+
+	// Verify results
+	for _, collection := range collections {
+		for i, tc := range testCases {
+			recordId := recordIds[collection][i]
+
+			// Try to find the record
+			_, err := hub.FindRecordById(collection, recordId)
+
+			if tc.shouldBeKept {
+				assert.NoError(t, err, "Record should exist: %s", tc.description)
+			} else {
+				assert.Error(t, err, "Record should be deleted: %s", tc.description)
+			}
+		}
+	}
+}
+
+// TestDeleteOldAlertsHistory tests the deleteOldAlertsHistory function
+func TestDeleteOldAlertsHistory(t *testing.T) {
+	hub, err := tests.NewTestHub(t.TempDir())
+	require.NoError(t, err)
+	defer hub.Cleanup()
+
+	// Create test users
+	user1, err := tests.CreateUser(hub, "user1@example.com", "testtesttest")
+	require.NoError(t, err)
+
+	user2, err := tests.CreateUser(hub, "user2@example.com", "testtesttest")
+	require.NoError(t, err)
+
+	system, err := tests.CreateRecord(hub, "systems", map[string]any{
+		"name":   "test-system",
+		"host":   "localhost",
+		"port":   "45876",
+		"status": "up",
+		"users":  []string{user1.Id, user2.Id},
+	})
+	require.NoError(t, err)
+	now := time.Now().UTC()
+
+	testCases := []struct {
+		name                  string
+		user                  *core.Record
+		alertCount            int
+		countToKeep           int
+		countBeforeDeletion   int
+		expectedAfterDeletion int
+		description           string
+	}{
+		{
+			name:                  "User with few alerts (below threshold)",
+			user:                  user1,
+			alertCount:            100,
+			countToKeep:           50,
+			countBeforeDeletion:   150,
+			expectedAfterDeletion: 100, // No deletion because below threshold
+			description:           "User with alerts below countBeforeDeletion should not have any deleted",
+		},
+		{
+			name:                  "User with many alerts (above threshold)",
+			user:                  user2,
+			alertCount:            300,
+			countToKeep:           100,
+			countBeforeDeletion:   200,
+			expectedAfterDeletion: 100, // Should be trimmed to countToKeep
+			description:           "User with alerts above countBeforeDeletion should be trimmed to countToKeep",
+		},
+	}
+
+	for _, tc := range testCases {
+		t.Run(tc.name, func(t *testing.T) {
+			// Create alerts for this user
+			for i := 0; i < tc.alertCount; i++ {
+				_, err := tests.CreateRecord(hub, "alerts_history", map[string]any{
+					"user":    tc.user.Id,
+					"name":    "CPU",
+					"value":   i + 1,
+					"system":  system.Id,
+					"created": now.Add(-time.Duration(i) * time.Minute),
+				})
+				require.NoError(t, err)
+			}
+
+			// Count before deletion
+			countBefore, err := hub.CountRecords("alerts_history",
+				dbx.NewExp("user = {:user}", dbx.Params{"user": tc.user.Id}))
+			require.NoError(t, err)
+			assert.Equal(t, int64(tc.alertCount), countBefore, "Initial count should match")
+
+			// Run deletion
+			err = records.TestDeleteOldAlertsHistory(hub, tc.countToKeep, tc.countBeforeDeletion)
+			require.NoError(t, err)
+
+			// Count after deletion
+			countAfter, err := hub.CountRecords("alerts_history",
+				dbx.NewExp("user = {:user}", dbx.Params{"user": tc.user.Id}))
+			require.NoError(t, err)
+
+			assert.Equal(t, int64(tc.expectedAfterDeletion), countAfter, tc.description)
+
+			// If deletion occurred, verify the most recent records were kept
+			if tc.expectedAfterDeletion < tc.alertCount {
+				records, err := hub.FindRecordsByFilter("alerts_history",
+					"user = {:user}",
+					"-created", // Order by created DESC
+					tc.countToKeep,
+					0,
+					map[string]any{"user": tc.user.Id})
+				require.NoError(t, err)
+				assert.Len(t, records, tc.expectedAfterDeletion, "Should have exactly countToKeep records")
+
+				// Verify records are in descending order by created time
+				for i := 1; i < len(records); i++ {
+					prev := records[i-1].GetDateTime("created").Time()
+					curr := records[i].GetDateTime("created").Time()
+					assert.True(t, prev.After(curr) || prev.Equal(curr),
+						"Records should be ordered by created time (newest first)")
+				}
+			}
+		})
+	}
+}
+
+// TestDeleteOldAlertsHistoryEdgeCases tests edge cases for alerts history deletion
+func TestDeleteOldAlertsHistoryEdgeCases(t *testing.T) {
+	hub, err := tests.NewTestHub(t.TempDir())
+	require.NoError(t, err)
+	defer hub.Cleanup()
+
+	t.Run("No users with excessive alerts", func(t *testing.T) {
+		// Create user with few alerts
+		user, err := tests.CreateUser(hub, "few@example.com", "testtesttest")
+		require.NoError(t, err)
+
+		system, err := tests.CreateRecord(hub, "systems", map[string]any{
+			"name":   "test-system",
+			"host":   "localhost",
+			"port":   "45876",
+			"status": "up",
+			"users":  []string{user.Id},
+		})
+
+		// Create only 5 alerts (well below threshold)
+		for i := range 5 {
+			_, err := tests.CreateRecord(hub, "alerts_history", map[string]any{
+				"user":   user.Id,
+				"name":   "CPU",
+				"value":  i + 1,
+				"system": system.Id,
+			})
+			require.NoError(t, err)
+		}
+
+		// Should not error and should not delete anything
+		err = records.TestDeleteOldAlertsHistory(hub, 10, 20)
+		require.NoError(t, err)
+
+		count, err := hub.CountRecords("alerts_history")
+		require.NoError(t, err)
+		assert.Equal(t, int64(5), count, "All alerts should remain")
+	})
+
+	t.Run("Empty alerts_history table", func(t *testing.T) {
+		// Clear any existing alerts
+		_, err := hub.DB().NewQuery("DELETE FROM alerts_history").Execute()
+		require.NoError(t, err)
+
+		// Should not error with empty table
+		err = records.TestDeleteOldAlertsHistory(hub, 10, 20)
+		require.NoError(t, err)
+	})
+}
+
+// TestRecordManagerCreation tests RecordManager creation
+func TestRecordManagerCreation(t *testing.T) {
+	hub, err := tests.NewTestHub(t.TempDir())
+	require.NoError(t, err)
+	defer hub.Cleanup()
+
+	rm := records.NewRecordManager(hub)
+	assert.NotNil(t, rm, "RecordManager should not be nil")
+}
+
+// TestTwoDecimals tests the twoDecimals helper function
+func TestTwoDecimals(t *testing.T) {
+	testCases := []struct {
+		input    float64
+		expected float64
+	}{
+		{1.234567, 1.23},
+		{1.235, 1.24}, // Should round up
+		{1.0, 1.0},
+		{0.0, 0.0},
+		{-1.234567, -1.23},
+		{-1.235, -1.23}, // Negative rounding
+	}
+
+	for _, tc := range testCases {
+		result := records.TestTwoDecimals(tc.input)
+		assert.InDelta(t, tc.expected, result, 0.02, "twoDecimals(%f) should equal %f", tc.input, tc.expected)
+	}
+}
--- a/beszel/internal/records/records_test_helpers.go
+++ b/beszel/internal/records/records_test_helpers.go
@@ -0,0 +1,23 @@
+//go:build testing
+// +build testing
+
+package records
+
+import (
+	"github.com/pocketbase/pocketbase/core"
+)
+
+// TestDeleteOldSystemStats exposes deleteOldSystemStats for testing
+func TestDeleteOldSystemStats(app core.App) error {
+	return deleteOldSystemStats(app)
+}
+
+// TestDeleteOldAlertsHistory exposes deleteOldAlertsHistory for testing
+func TestDeleteOldAlertsHistory(app core.App, countToKeep, countBeforeDeletion int) error {
+	return deleteOldAlertsHistory(app, countToKeep, countBeforeDeletion)
+}
+
+// TestTwoDecimals exposes twoDecimals for testing
+func TestTwoDecimals(value float64) float64 {
+	return twoDecimals(value)
+}
--- a/beszel/internal/users/users.go
+++ b/beszel/internal/users/users.go
@@ -17,7 +17,12 @@ type UserSettings struct {
 	ChartTime            string   `json:"chartTime"`
 	NotificationEmails   []string `json:"emails"`
 	NotificationWebhooks []string `json:"webhooks"`
-	// Language             string   `json:"lang"`
+	// 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 {
@@ -39,7 +44,6 @@ func (um *UserManager) InitializeUserSettings(e *core.RecordEvent) error {
 	record := e.Record
 	// intialize settings with defaults
 	settings := UserSettings{
-		// Language:             "en",
 		ChartTime:            "1h",
 		NotificationEmails:   []string{},
 		NotificationWebhooks: []string{},
--- a/beszel/migrations/0_collections_snapshot_0_12_0_6.go
+++ b/beszel/migrations/0_collections_snapshot_0_12_0_6.go
@@ -76,6 +76,7 @@ func init() {
 					"Disk",
 					"Temperature",
 					"Bandwidth",
+					"LoadAvg1",
 					"LoadAvg5",
 					"LoadAvg15"
 				]
@@ -139,6 +140,124 @@ func init() {
 		],
 		"system": false
 	},
+	{
+		"id": "pbc_1697146157",
+		"listRule": "@request.auth.id != \"\" && user.id = @request.auth.id",
+		"viewRule": "@request.auth.id != \"\" && user.id = @request.auth.id",
+		"createRule": null,
+		"updateRule": null,
+		"deleteRule": "@request.auth.id != \"\" && user.id = @request.auth.id",
+		"name": "alerts_history",
+		"type": "base",
+		"fields": [
+			{
+					"autogeneratePattern": "[a-z0-9]{15}",
+					"hidden": false,
+					"id": "text3208210256",
+					"max": 15,
+					"min": 15,
+					"name": "id",
+					"pattern": "^[a-z0-9]+$",
+					"presentable": false,
+					"primaryKey": true,
+					"required": true,
+					"system": true,
+					"type": "text"
+				},
+				{
+					"cascadeDelete": true,
+					"collectionId": "_pb_users_auth_",
+					"hidden": false,
+					"id": "relation2375276105",
+					"maxSelect": 1,
+					"minSelect": 0,
+					"name": "user",
+					"presentable": false,
+					"required": true,
+					"system": false,
+					"type": "relation"
+				},
+				{
+					"cascadeDelete": true,
+					"collectionId": "2hz5ncl8tizk5nx",
+					"hidden": false,
+					"id": "relation3377271179",
+					"maxSelect": 1,
+					"minSelect": 0,
+					"name": "system",
+					"presentable": false,
+					"required": true,
+					"system": false,
+					"type": "relation"
+				},
+				{
+					"autogeneratePattern": "",
+					"hidden": false,
+					"id": "text2466471794",
+					"max": 0,
+					"min": 0,
+					"name": "alert_id",
+					"pattern": "",
+					"presentable": false,
+					"primaryKey": false,
+					"required": false,
+					"system": false,
+					"type": "text"
+				},
+				{
+					"autogeneratePattern": "",
+					"hidden": false,
+					"id": "text1579384326",
+					"max": 0,
+					"min": 0,
+					"name": "name",
+					"pattern": "",
+					"presentable": false,
+					"primaryKey": false,
+					"required": true,
+					"system": false,
+					"type": "text"
+				},
+				{
+					"hidden": false,
+					"id": "number494360628",
+					"max": null,
+					"min": null,
+					"name": "value",
+					"onlyInt": false,
+					"presentable": false,
+					"required": false,
+					"system": false,
+					"type": "number"
+				},
+				{
+					"hidden": false,
+					"id": "autodate2990389176",
+					"name": "created",
+					"onCreate": true,
+					"onUpdate": false,
+					"presentable": false,
+					"system": false,
+					"type": "autodate"
+				},
+				{
+					"hidden": false,
+					"id": "date2276568630",
+					"max": "",
+					"min": "",
+					"name": "resolved",
+					"presentable": false,
+					"required": false,
+					"system": false,
+					"type": "date"
+				}
+		],
+		"indexes": [
+			"CREATE INDEX ` + "`" + `idx_YdGnup5aqB` + "`" + ` ON ` + "`" + `alerts_history` + "`" + ` (` + "`" + `user` + "`" + `)",
+			"CREATE INDEX ` + "`" + `idx_taLet9VdME` + "`" + ` ON ` + "`" + `alerts_history` + "`" + ` (` + "`" + `created` + "`" + `)"
+		],
+		"system": false
+	},
 	{
 		"id": "juohu4jipgc13v7",
 		"listRule": "@request.auth.id != \"\"",
@@ -756,7 +875,6 @@ func init() {
 			LEFT JOIN fingerprints f ON s.id = f.system
 			WHERE f.system IS NULL
 		`).Column(&systemIds)
-
 		if err != nil {
 			return err
 		}
--- a/beszel/site/bun.lockb
+++ b/beszel/site/bun.lockb
--- a/beszel/site/package-lock.json
+++ b/beszel/site/package-lock.json
--- a/beszel/site/package.json
+++ b/beszel/site/package.json
@@ -51,6 +51,7 @@
 		"@lingui/cli": "^5.3.2",
 		"@lingui/swc-plugin": "^5.5.2",
 		"@lingui/vite-plugin": "^5.3.2",
+		"@tailwindcss/container-queries": "^0.1.1",
 		"@types/bun": "^1.2.15",
 		"@types/react": "^18.3.23",
 		"@types/react-dom": "^18.3.7",
--- a/beszel/site/src/components/alerts-history-columns.tsx
+++ b/beszel/site/src/components/alerts-history-columns.tsx
@@ -0,0 +1,164 @@
+import { ColumnDef } from "@tanstack/react-table"
+import { AlertsHistoryRecord } from "@/types"
+import { Button } from "@/components/ui/button"
+import { Badge } from "@/components/ui/badge"
+import { alertInfo, formatShortDate, toFixedFloat, formatDuration, cn } from "@/lib/utils"
+import { Trans } from "@lingui/react/macro"
+import { t } from "@lingui/core/macro"
+
+export const alertsHistoryColumns: ColumnDef<AlertsHistoryRecord>[] = [
+	{
+		accessorKey: "system",
+		enableSorting: true,
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>System</Trans>
+			</Button>
+		),
+		cell: ({ row }) => <span className="ps-2">{row.original.expand?.system?.name || row.original.system}</span>,
+		filterFn: (row, _, filterValue) => {
+			const display = row.original.expand?.system?.name || row.original.system || ""
+			return display.toLowerCase().includes(filterValue.toLowerCase())
+		},
+	},
+	{
+		// accessorKey: "name",
+		id: "name",
+		accessorFn: (record) => {
+			const name = record.name
+			const info = alertInfo[name]
+			return info?.name().replace("cpu", "CPU") || name
+		},
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>Name</Trans>
+			</Button>
+		),
+		cell: ({ getValue, row }) => {
+			let name = getValue() as string
+			const info = alertInfo[row.original.name]
+			const Icon = info?.icon
+
+			return (
+				<span className="flex items-center gap-2 ps-1 min-w-40">
+					{Icon && <Icon className="size-3.5" />}
+					{name}
+				</span>
+			)
+		},
+	},
+	{
+		accessorKey: "value",
+		enableSorting: false,
+		header: () => (
+			<Button variant="ghost">
+				<Trans>Value</Trans>
+			</Button>
+		),
+		cell({ row, getValue }) {
+			const name = row.original.name
+			if (name === "Status") {
+				return <span className="ps-2">{t`Down`}</span>
+			}
+			const value = getValue() as number
+			const unit = alertInfo[name]?.unit
+			return (
+				<span className="tabular-nums ps-2.5">
+					{toFixedFloat(value, value < 10 ? 2 : 1)}
+					{unit}
+				</span>
+			)
+		},
+	},
+	{
+		accessorKey: "state",
+		enableSorting: true,
+		sortingFn: (rowA, rowB) => (rowA.original.resolved ? 1 : 0) - (rowB.original.resolved ? 1 : 0),
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>State</Trans>
+			</Button>
+		),
+		cell: ({ row }) => {
+			const resolved = row.original.resolved
+			return (
+				<Badge
+					className={cn(
+						"capitalize pointer-events-none",
+						resolved
+							? "bg-green-100 text-green-800 border-green-200 dark:opacity-80"
+							: "bg-yellow-100 text-yellow-800 border-yellow-200"
+					)}
+				>
+					{/* {resolved ? <CircleCheckIcon className="size-3 me-0.5" /> : <CircleAlertIcon className="size-3 me-0.5" />} */}
+					<Trans>{resolved ? "Resolved" : "Active"}</Trans>
+				</Badge>
+			)
+		},
+	},
+	{
+		accessorKey: "created",
+		accessorFn: (record) => formatShortDate(record.created),
+		enableSorting: true,
+		invertSorting: true,
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>Created</Trans>
+			</Button>
+		),
+		cell: ({ getValue, row }) => (
+			<span className="ps-1 tabular-nums tracking-tight" title={`${row.original.created} UTC`}>
+				{getValue() as string}
+			</span>
+		),
+	},
+	{
+		accessorKey: "resolved",
+		enableSorting: true,
+		invertSorting: true,
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>Resolved</Trans>
+			</Button>
+		),
+		cell: ({ row, getValue }) => {
+			const resolved = getValue() as string | null
+			if (!resolved) {
+				return null
+			}
+			return (
+				<span className="ps-1 tabular-nums tracking-tight" title={`${row.original.resolved} UTC`}>
+					{formatShortDate(resolved)}
+				</span>
+			)
+		},
+	},
+	{
+		accessorKey: "duration",
+		invertSorting: true,
+		enableSorting: true,
+		sortingFn: (rowA, rowB) => {
+			const aCreated = new Date(rowA.original.created)
+			const bCreated = new Date(rowB.original.created)
+			const aResolved = rowA.original.resolved ? new Date(rowA.original.resolved) : null
+			const bResolved = rowB.original.resolved ? new Date(rowB.original.resolved) : null
+			const aDuration = aResolved ? aResolved.getTime() - aCreated.getTime() : null
+			const bDuration = bResolved ? bResolved.getTime() - bCreated.getTime() : null
+			if (!aDuration && bDuration) return -1
+			if (aDuration && !bDuration) return 1
+			return (aDuration || 0) - (bDuration || 0)
+		},
+		header: ({ column }) => (
+			<Button variant="ghost" onClick={() => column.toggleSorting(column.getIsSorted() === "asc")}>
+				<Trans>Duration</Trans>
+			</Button>
+		),
+		cell: ({ row }) => {
+			const duration = formatDuration(row.original.created, row.original.resolved)
+			if (!duration) {
+				return null
+			}
+			return <span className="ps-2">{duration}</span>
+		},
+	},
+]
--- a/beszel/site/src/components/charts/area-chart.tsx
+++ b/beszel/site/src/components/charts/area-chart.tsx
@@ -2,14 +2,7 @@ import { t } from "@lingui/core/macro"

 import { Area, AreaChart, CartesianGrid, YAxis } from "recharts"
 import { ChartContainer, ChartTooltip, ChartTooltipContent, xAxis } from "@/components/ui/chart"
-import {
-	useYAxisWidth,
-	cn,
-	formatShortDate,
-	toFixedWithoutTrailingZeros,
-	decimalString,
-	chartMargin,
-} from "@/lib/utils"
+import { useYAxisWidth, cn, formatShortDate, chartMargin } from "@/lib/utils"
 // import Spinner from '../spinner'
 import { ChartData } from "@/types"
 import { memo, useMemo } from "react"
@@ -30,7 +23,6 @@ const getNestedValue = (path: string, max = false, data: any): number | null =>

 export default memo(function AreaChartDefault({
 	maxToggled = false,
-	unit = " MB/s",
 	chartName,
 	chartData,
 	max,
@@ -38,12 +30,11 @@ export default memo(function AreaChartDefault({
 	contentFormatter,
 }: {
 	maxToggled?: boolean
-	unit?: string
 	chartName: string
 	chartData: ChartData
 	max?: number
-	tickFormatter?: (value: number) => string
-	contentFormatter?: (value: number) => string
+	tickFormatter: (value: number) => string
+	contentFormatter: ({ value }: { value: number }) => string
 }) {
 	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()
 	const { i18n } = useLingui()
@@ -98,15 +89,7 @@ export default memo(function AreaChartDefault({
 						className="tracking-tighter"
 						width={yAxisWidth}
 						domain={[0, max ?? "auto"]}
-						tickFormatter={(value) => {
-							let val: string
-							if (tickFormatter) {
-								val = tickFormatter(value)
-							} else {
-								val = toFixedWithoutTrailingZeros(value, 2) + unit
-							}
-							return updateYAxisWidth(val)
-						}}
+						tickFormatter={(value) => updateYAxisWidth(tickFormatter(value))}
 						tickLine={false}
 						axisLine={false}
 					/>
@@ -117,12 +100,7 @@ export default memo(function AreaChartDefault({
 						content={
 							<ChartTooltipContent
 								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
-								contentFormatter={({ value }) => {
-									if (contentFormatter) {
-										return contentFormatter(value)
-									}
-									return decimalString(value) + unit
-								}}
+								contentFormatter={contentFormatter}
 								// indicator="line"
 							/>
 						}
--- a/beszel/site/src/components/charts/container-chart.tsx
+++ b/beszel/site/src/components/charts/container-chart.tsx
@@ -1,22 +1,13 @@
 import { Area, AreaChart, CartesianGrid, YAxis } from "recharts"
 import { ChartConfig, ChartContainer, ChartTooltip, ChartTooltipContent, xAxis } from "@/components/ui/chart"
 import { memo, useMemo } from "react"
-import {
-	useYAxisWidth,
-	cn,
-	formatShortDate,
-	decimalString,
-	chartMargin,
-	toFixedFloat,
-	getSizeAndUnit,
-	toFixedWithoutTrailingZeros,
-} from "@/lib/utils"
+import { useYAxisWidth, cn, formatShortDate, chartMargin, toFixedFloat, formatBytes, decimalString } from "@/lib/utils"
 // import Spinner from '../spinner'
 import { useStore } from "@nanostores/react"
-import { $containerFilter } from "@/lib/stores"
+import { $containerFilter, $userSettings } from "@/lib/stores"
 import { ChartData } from "@/types"
 import { Separator } from "../ui/separator"
-import { ChartType } from "@/lib/enums"
+import { ChartType, Unit } from "@/lib/enums"

 export default memo(function ContainerChart({
 	dataKey,
@@ -30,6 +21,7 @@ export default memo(function ContainerChart({
 	unit?: string
 }) {
 	const filter = useStore($containerFilter)
+	const userSettings = useStore($userSettings)
 	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()

 	const { containerData } = chartData
@@ -84,13 +76,14 @@ export default memo(function ContainerChart({
 		// tick formatter
 		if (chartType === ChartType.CPU) {
 			obj.tickFormatter = (value) => {
-				const val = toFixedWithoutTrailingZeros(value, 2) + unit
+				const val = toFixedFloat(value, 2) + unit
 				return updateYAxisWidth(val)
 			}
 		} else {
-			obj.tickFormatter = (value) => {
-				const { v, u } = getSizeAndUnit(value, false)
-				return updateYAxisWidth(`${toFixedFloat(v, 2)}${u}${isNetChart ? "/s" : ""}`)
+			const chartUnit = isNetChart ? userSettings.unitNet : Unit.Bytes
+			obj.tickFormatter = (val) => {
+				const { value, unit } = formatBytes(val, isNetChart, chartUnit, true)
+				return updateYAxisWidth(toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit)
 			}
 		}
 		// tooltip formatter
@@ -99,12 +92,14 @@ export default memo(function ContainerChart({
 				try {
 					const sent = item?.payload?.[key]?.ns ?? 0
 					const received = item?.payload?.[key]?.nr ?? 0
+					const { value: receivedValue, unit: receivedUnit } = formatBytes(received, true, userSettings.unitNet, true)
+					const { value: sentValue, unit: sentUnit } = formatBytes(sent, true, userSettings.unitNet, true)
 					return (
 						<span className="flex">
-							{decimalString(received)} MB/s
+							{decimalString(receivedValue)} {receivedUnit}
 							<span className="opacity-70 ms-0.5"> rx </span>
 							<Separator orientation="vertical" className="h-3 mx-1.5 bg-primary/40" />
-							{decimalString(sent)} MB/s
+							{decimalString(sentValue)} {sentUnit}
 							<span className="opacity-70 ms-0.5"> tx</span>
 						</span>
 					)
@@ -114,8 +109,8 @@ export default memo(function ContainerChart({
 			}
 		} else if (chartType === ChartType.Memory) {
 			obj.toolTipFormatter = (item: any) => {
-				const { v, u } = getSizeAndUnit(item.value, false)
-				return decimalString(v, 2) + u
+				const { value, unit } = formatBytes(item.value, false, Unit.Bytes, true)
+				return decimalString(value) + " " + unit
 			}
 		} else {
 			obj.toolTipFormatter = (item: any) => decimalString(item.value) + unit
--- a/beszel/site/src/components/charts/disk-chart.tsx
+++ b/beszel/site/src/components/charts/disk-chart.tsx
@@ -1,17 +1,10 @@
 import { Area, AreaChart, CartesianGrid, YAxis } from "recharts"
 import { ChartContainer, ChartTooltip, ChartTooltipContent, xAxis } from "@/components/ui/chart"
-import {
-	useYAxisWidth,
-	cn,
-	formatShortDate,
-	decimalString,
-	toFixedFloat,
-	chartMargin,
-	getSizeAndUnit,
-} from "@/lib/utils"
+import { useYAxisWidth, cn, formatShortDate, decimalString, chartMargin, formatBytes, toFixedFloat } from "@/lib/utils"
 import { ChartData } from "@/types"
 import { memo } from "react"
 import { useLingui } from "@lingui/react/macro"
+import { Unit } from "@/lib/enums"

 export default memo(function DiskChart({
 	dataKey,
@@ -53,9 +46,9 @@ export default memo(function DiskChart({
 						minTickGap={6}
 						tickLine={false}
 						axisLine={false}
-						tickFormatter={(value) => {
-							const { v, u } = getSizeAndUnit(value)
-							return updateYAxisWidth(toFixedFloat(v, 2) + u)
+						tickFormatter={(val) => {
+							const { value, unit } = formatBytes(val * 1024, false, Unit.Bytes, true)
+							return updateYAxisWidth(toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit)
 						}}
 					/>
 					{xAxis(chartData)}
@@ -66,8 +59,8 @@ export default memo(function DiskChart({
 							<ChartTooltipContent
 								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
 								contentFormatter={({ value }) => {
-									const { v, u } = getSizeAndUnit(value)
-									return decimalString(v) + u
+									const { value: convertedValue, unit } = formatBytes(value * 1024, false, Unit.Bytes, true)
+									return decimalString(convertedValue) + " " + unit
 								}}
 							/>
 						}
--- a/beszel/site/src/components/charts/gpu-power-chart.tsx
+++ b/beszel/site/src/components/charts/gpu-power-chart.tsx
@@ -8,14 +8,7 @@ import {
 	ChartTooltipContent,
 	xAxis,
 } from "@/components/ui/chart"
-import {
-	useYAxisWidth,
-	cn,
-	formatShortDate,
-	toFixedWithoutTrailingZeros,
-	decimalString,
-	chartMargin,
-} from "@/lib/utils"
+import { useYAxisWidth, cn, formatShortDate, toFixedFloat, decimalString, chartMargin } from "@/lib/utils"
 import { ChartData } from "@/types"
 import { memo, useMemo } from "react"

@@ -72,7 +65,7 @@ export default memo(function GpuPowerChart({ chartData }: { chartData: ChartData
 						domain={[0, "auto"]}
 						width={yAxisWidth}
 						tickFormatter={(value) => {
-							const val = toFixedWithoutTrailingZeros(value, 2)
+							const val = toFixedFloat(value, 2)
 							return updateYAxisWidth(val + "W")
 						}}
 						tickLine={false}
--- a/beszel/site/src/components/charts/load-average-chart.tsx
+++ b/beszel/site/src/components/charts/load-average-chart.tsx
@@ -0,0 +1,91 @@
+import { CartesianGrid, Line, LineChart, YAxis } from "recharts"
+
+import {
+	ChartContainer,
+	ChartLegend,
+	ChartLegendContent,
+	ChartTooltip,
+	ChartTooltipContent,
+	xAxis,
+} from "@/components/ui/chart"
+import { useYAxisWidth, cn, formatShortDate, toFixedFloat, decimalString, chartMargin } from "@/lib/utils"
+import { ChartData } from "@/types"
+import { memo } from "react"
+import { t } from "@lingui/core/macro"
+
+export default memo(function LoadAverageChart({ chartData }: { chartData: ChartData }) {
+	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()
+
+	if (chartData.systemStats.length === 0) {
+		return null
+	}
+
+	const keys = {
+		l1: {
+			color: "hsl(271, 81%, 60%)", // Purple
+			label: t`1 min`,
+		},
+		l5: {
+			color: "hsl(217, 91%, 60%)", // Blue
+			label: t`5 min`,
+		},
+		l15: {
+			color: "hsl(25, 95%, 53%)", // Orange
+			label: t`15 min`,
+		},
+	}
+
+	return (
+		<div>
+			<ChartContainer
+				className={cn("h-full w-full absolute aspect-auto bg-card opacity-0 transition-opacity", {
+					"opacity-100": yAxisWidth,
+				})}
+			>
+				<LineChart accessibilityLayer data={chartData.systemStats} margin={chartMargin}>
+					<CartesianGrid vertical={false} />
+					<YAxis
+						direction="ltr"
+						orientation={chartData.orientation}
+						className="tracking-tighter"
+						domain={[0, "auto"]}
+						width={yAxisWidth}
+						tickFormatter={(value) => {
+							return updateYAxisWidth(String(toFixedFloat(value, 2)))
+						}}
+						tickLine={false}
+						axisLine={false}
+					/>
+					{xAxis(chartData)}
+					<ChartTooltip
+						animationEasing="ease-out"
+						animationDuration={150}
+						// @ts-ignore
+						// itemSorter={(a, b) => b.value - a.value}
+						content={
+							<ChartTooltipContent
+								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
+								contentFormatter={(item) => decimalString(item.value)}
+							/>
+						}
+					/>
+					{Object.entries(keys).map(([key, value]: [string, { color: string; label: string }]) => {
+						return (
+							<Line
+								key={key}
+								dataKey={`stats.${key}`}
+								name={value.label}
+								type="monotoneX"
+								dot={false}
+								strokeWidth={1.5}
+								stroke={value.color}
+								isAnimationActive={false}
+							/>
+						)
+					})}
+					<ChartLegend content={<ChartLegendContent />} />
+				</LineChart>
+			</ChartContainer>
+		</div>
+	)
+})
--- a/beszel/site/src/components/charts/mem-chart.tsx
+++ b/beszel/site/src/components/charts/mem-chart.tsx
@@ -1,9 +1,10 @@
 import { Area, AreaChart, CartesianGrid, YAxis } from "recharts"
 import { ChartContainer, ChartTooltip, ChartTooltipContent, xAxis } from "@/components/ui/chart"
-import { useYAxisWidth, cn, toFixedFloat, decimalString, formatShortDate, chartMargin } from "@/lib/utils"
+import { useYAxisWidth, cn, decimalString, formatShortDate, chartMargin, formatBytes, toFixedFloat } from "@/lib/utils"
 import { memo } from "react"
 import { ChartData } from "@/types"
 import { useLingui } from "@lingui/react/macro"
+import { Unit } from "@/lib/enums"

 export default memo(function MemChart({ chartData }: { chartData: ChartData }) {
 	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()
@@ -39,8 +40,8 @@ export default memo(function MemChart({ chartData }: { chartData: ChartData }) {
 							tickLine={false}
 							axisLine={false}
 							tickFormatter={(value) => {
-								const val = toFixedFloat(value, 1)
-								return updateYAxisWidth(val + " GB")
+								const { value: convertedValue, unit } = formatBytes(value * 1024, false, Unit.Bytes, true)
+								return updateYAxisWidth(toFixedFloat(convertedValue, value >= 10 ? 0 : 1) + " " + unit)
 							}}
 						/>
 					)}
@@ -54,8 +55,11 @@ export default memo(function MemChart({ chartData }: { chartData: ChartData }) {
 								// @ts-ignore
 								itemSorter={(a, b) => a.order - b.order}
 								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
-								contentFormatter={(item) => decimalString(item.value) + " GB"}
-								// indicator="line"
+								contentFormatter={({ value }) => {
+									// mem values are supplied as GB
+									const { value: convertedValue, unit } = formatBytes(value * 1024, false, Unit.Bytes, true)
+									return decimalString(convertedValue, convertedValue >= 100 ? 1 : 2) + " " + unit
+								}}
 							/>
 						}
 					/>
--- a/beszel/site/src/components/charts/swap-chart.tsx
+++ b/beszel/site/src/components/charts/swap-chart.tsx
@@ -1,20 +1,16 @@
-import { t } from "@lingui/core/macro";
+import { t } from "@lingui/core/macro"

 import { Area, AreaChart, CartesianGrid, YAxis } from "recharts"
 import { ChartContainer, ChartTooltip, ChartTooltipContent, xAxis } from "@/components/ui/chart"
-import {
-	useYAxisWidth,
-	cn,
-	formatShortDate,
-	toFixedWithoutTrailingZeros,
-	decimalString,
-	chartMargin,
-} from "@/lib/utils"
+import { useYAxisWidth, cn, formatShortDate, decimalString, chartMargin, formatBytes, toFixedFloat } from "@/lib/utils"
 import { ChartData } from "@/types"
 import { memo } from "react"
+import { $userSettings } from "@/lib/stores"
+import { useStore } from "@nanostores/react"

 export default memo(function SwapChart({ chartData }: { chartData: ChartData }) {
 	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()
+	const userSettings = useStore($userSettings)

 	if (chartData.systemStats.length === 0) {
 		return null
@@ -33,11 +29,14 @@ export default memo(function SwapChart({ chartData }: { chartData: ChartData })
 						direction="ltr"
 						orientation={chartData.orientation}
 						className="tracking-tighter"
-						domain={[0, () => toFixedWithoutTrailingZeros(chartData.systemStats.at(-1)?.stats.s ?? 0.04, 2)]}
+						domain={[0, () => toFixedFloat(chartData.systemStats.at(-1)?.stats.s ?? 0.04, 2)]}
 						width={yAxisWidth}
 						tickLine={false}
 						axisLine={false}
-						tickFormatter={(value) => updateYAxisWidth(value + " GB")}
+						tickFormatter={(value) => {
+							const { value: convertedValue, unit } = formatBytes(value * 1024, false, userSettings.unitDisk, true)
+							return updateYAxisWidth(toFixedFloat(convertedValue, value >= 10 ? 0 : 1) + " " + unit)
+						}}
 					/>
 					{xAxis(chartData)}
 					<ChartTooltip
@@ -46,7 +45,11 @@ export default memo(function SwapChart({ chartData }: { chartData: ChartData })
 						content={
 							<ChartTooltipContent
 								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
-								contentFormatter={(item) => decimalString(item.value) + " GB"}
+								contentFormatter={({ value }) => {
+									// mem values are supplied as GB
+									const { value: convertedValue, unit } = formatBytes(value * 1024, false, userSettings.unitDisk, true)
+									return decimalString(convertedValue, convertedValue >= 100 ? 1 : 2) + " " + unit
+								}}
 								// indicator="line"
 							/>
 						}
--- a/beszel/site/src/components/charts/temperature-chart.tsx
+++ b/beszel/site/src/components/charts/temperature-chart.tsx
@@ -12,17 +12,19 @@ import {
 	useYAxisWidth,
 	cn,
 	formatShortDate,
-	toFixedWithoutTrailingZeros,
-	decimalString,
+	toFixedFloat,
 	chartMargin,
+	formatTemperature,
+	decimalString,
 } from "@/lib/utils"
 import { ChartData } from "@/types"
 import { memo, useMemo } from "react"
-import { $temperatureFilter } from "@/lib/stores"
+import { $temperatureFilter, $userSettings } from "@/lib/stores"
 import { useStore } from "@nanostores/react"

 export default memo(function TemperatureChart({ chartData }: { chartData: ChartData }) {
 	const filter = useStore($temperatureFilter)
+	const userSettings = useStore($userSettings)
 	const { yAxisWidth, updateYAxisWidth } = useYAxisWidth()

 	if (chartData.systemStats.length === 0) {
@@ -72,9 +74,9 @@ export default memo(function TemperatureChart({ chartData }: { chartData: ChartD
 						className="tracking-tighter"
 						domain={[0, "auto"]}
 						width={yAxisWidth}
-						tickFormatter={(value) => {
-							const val = toFixedWithoutTrailingZeros(value, 2)
-							return updateYAxisWidth(val + " °C")
+						tickFormatter={(val) => {
+							const { value, unit } = formatTemperature(val, userSettings.unitTemp)
+							return updateYAxisWidth(toFixedFloat(value, 2) + " " + unit)
 						}}
 						tickLine={false}
 						axisLine={false}
@@ -88,7 +90,10 @@ export default memo(function TemperatureChart({ chartData }: { chartData: ChartD
 						content={
 							<ChartTooltipContent
 								labelFormatter={(_, data) => formatShortDate(data[0].payload.created)}
-								contentFormatter={(item) => decimalString(item.value) + " °C"}
+								contentFormatter={(item) => {
+									const { value, unit } = formatTemperature(item.value, userSettings.unitTemp)
+									return decimalString(value) + " " + unit
+								}}
 								filter={filter}
 							/>
 						}
--- a/beszel/site/src/components/command-palette.tsx
+++ b/beszel/site/src/components/command-palette.tsx
@@ -69,7 +69,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 											setOpen(false)
 										}}
 									>
-										<Server className="me-2 h-4 w-4" />
+										<Server className="me-2 size-4" />
 										<span>{system.name}</span>
 										<CommandShortcut>{getHostDisplayValue(system)}</CommandShortcut>
 									</CommandItem>
@@ -86,7 +86,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 								setOpen(false)
 							}}
 						>
-							<LayoutDashboard className="me-2 h-4 w-4" />
+							<LayoutDashboard className="me-2 size-4" />
 							<span>
 								<Trans>Dashboard</Trans>
 							</span>
@@ -100,7 +100,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 								setOpen(false)
 							}}
 						>
-							<SettingsIcon className="me-2 h-4 w-4" />
+							<SettingsIcon className="me-2 size-4" />
 							<span>
 								<Trans>Settings</Trans>
 							</span>
@@ -113,7 +113,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 								setOpen(false)
 							}}
 						>
-							<MailIcon className="me-2 h-4 w-4" />
+							<MailIcon className="me-2 size-4" />
 							<span>
 								<Trans>Notifications</Trans>
 							</span>
@@ -125,19 +125,31 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 								setOpen(false)
 							}}
 						>
-							<FingerprintIcon className="me-2 h-4 w-4" />
+							<FingerprintIcon className="me-2 size-4" />
 							<span>
 								<Trans>Tokens & Fingerprints</Trans>
 							</span>
 							{SettingsShortcut}
 						</CommandItem>
+						<CommandItem
+							onSelect={() => {
+								navigate(getPagePath($router, "settings", { name: "alert-history" }))
+								setOpen(false)
+							}}
+						>
+							<LogsIcon className="me-2 size-4" />
+							<span>
+								<Trans>Alert History</Trans>
+							</span>
+							{SettingsShortcut}
+						</CommandItem>
 						<CommandItem
 							keywords={["help", "oauth", "oidc"]}
 							onSelect={() => {
 								window.location.href = "https://beszel.dev/guide/what-is-beszel"
 							}}
 						>
-							<BookIcon className="me-2 h-4 w-4" />
+							<BookIcon className="me-2 size-4" />
 							<span>
 								<Trans>Documentation</Trans>
 							</span>
@@ -155,7 +167,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 										window.open(prependBasePath("/_/"), "_blank")
 									}}
 								>
-									<UsersIcon className="me-2 h-4 w-4" />
+									<UsersIcon className="me-2 size-4" />
 									<span>
 										<Trans>Users</Trans>
 									</span>
@@ -167,7 +179,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 										window.open(prependBasePath("/_/#/logs"), "_blank")
 									}}
 								>
-									<LogsIcon className="me-2 h-4 w-4" />
+									<LogsIcon className="me-2 size-4" />
 									<span>
 										<Trans>Logs</Trans>
 									</span>
@@ -179,7 +191,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 										window.open(prependBasePath("/_/#/settings/backups"), "_blank")
 									}}
 								>
-									<DatabaseBackupIcon className="me-2 h-4 w-4" />
+									<DatabaseBackupIcon className="me-2 size-4" />
 									<span>
 										<Trans>Backups</Trans>
 									</span>
@@ -192,7 +204,7 @@ export default memo(function CommandPalette({ open, setOpen }: { open: boolean;
 										window.open(prependBasePath("/_/#/settings/mail"), "_blank")
 									}}
 								>
-									<MailIcon className="me-2 h-4 w-4" />
+									<MailIcon className="me-2 size-4" />
 									<span>
 										<Trans>SMTP settings</Trans>
 									</span>
--- a/beszel/site/src/components/routes/home.tsx
+++ b/beszel/site/src/components/routes/home.tsx
@@ -110,10 +110,14 @@ const ActiveAlerts = memo(({ activeAlerts }: { activeAlerts: AlertRecord[] }) =>
 										{alert.sysname} {info.name().toLowerCase().replace("cpu", "CPU")}
 									</AlertTitle>
 									<AlertDescription>
-										<Trans>
-											Exceeds {alert.value}
-											{info.unit} in last <Plural value={alert.min} one="# minute" other="# minutes" />
-										</Trans>
+										{alert.name === "Status" ? (
+											<Trans>Connection is down</Trans>
+										) : (
+											<Trans>
+												Exceeds {alert.value}
+												{info.unit} in last <Plural value={alert.min} one="# minute" other="# minutes" />
+											</Trans>
+										)}
 									</AlertDescription>
 									<Link
 										href={getPagePath($router, "system", { name: alert.sysname! })}
--- a/beszel/site/src/components/routes/settings/alerts-history-data-table.tsx
+++ b/beszel/site/src/components/routes/settings/alerts-history-data-table.tsx
@@ -0,0 +1,385 @@
+import { pb } from "@/lib/stores"
+import { alertInfo, cn, formatDuration, formatShortDate } from "@/lib/utils"
+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, buttonVariants } from "@/components/ui/button"
+import { Input } from "@/components/ui/input"
+import { alertsHistoryColumns } from "../../alerts-history-columns"
+import { Checkbox } from "@/components/ui/checkbox"
+import { memo, useEffect, useState } from "react"
+import { Label } from "@/components/ui/label"
+import { Select, SelectTrigger, SelectValue, SelectContent, SelectItem } from "@/components/ui/select"
+import {
+	ChevronLeftIcon,
+	ChevronRightIcon,
+	ChevronsLeftIcon,
+	ChevronsRightIcon,
+	DownloadIcon,
+	Trash2Icon,
+} from "lucide-react"
+import { Trans } from "@lingui/react/macro"
+import { t } from "@lingui/core/macro"
+import { useToast } from "@/components/ui/use-toast"
+import {
+	AlertDialog,
+	AlertDialogAction,
+	AlertDialogCancel,
+	AlertDialogContent,
+	AlertDialogDescription,
+	AlertDialogFooter,
+	AlertDialogHeader,
+	AlertDialogTitle,
+	AlertDialogTrigger,
+} from "@/components/ui/alert-dialog"
+
+const SectionIntro = memo(() => {
+	return (
+		<div>
+			<h3 className="text-xl font-medium mb-2">
+				<Trans>Alert History</Trans>
+			</h3>
+			<p className="text-sm text-muted-foreground leading-relaxed">
+				<Trans>View your 200 most recent alerts.</Trans>
+			</p>
+		</div>
+	)
+})
+
+export default function AlertsHistoryDataTable() {
+	const [data, setData] = useState<AlertsHistoryRecord[]>([])
+	const [sorting, setSorting] = useState<SortingState>([])
+	const [columnFilters, setColumnFilters] = useState<ColumnFiltersState>([])
+	const [columnVisibility, setColumnVisibility] = useState<VisibilityState>({})
+	const [rowSelection, setRowSelection] = useState({})
+	const [globalFilter, setGlobalFilter] = useState("")
+	const { toast } = useToast()
+	const [deleteOpen, setDeleteDialogOpen] = useState(false)
+
+	useEffect(() => {
+		let unsubscribe: (() => void) | undefined
+		const pbOptions = {
+			expand: "system",
+			fields: "id,name,value,state,created,resolved,expand.system.name",
+		}
+		// Initial load
+		pb.collection<AlertsHistoryRecord>("alerts_history")
+			.getFullList({
+				...pbOptions,
+				sort: "-created",
+			})
+			.then((records) => setData(records))
+
+		// Subscribe to changes
+		;(async () => {
+			unsubscribe = await pb.collection("alerts_history").subscribe(
+				"*",
+				(e) => {
+					if (e.action === "create") {
+						setData((current) => [e.record as AlertsHistoryRecord, ...current])
+					}
+					if (e.action === "update") {
+						setData((current) => current.map((r) => (r.id === e.record.id ? (e.record as AlertsHistoryRecord) : r)))
+					}
+					if (e.action === "delete") {
+						setData((current) => current.filter((r) => r.id !== e.record.id))
+					}
+				},
+				pbOptions
+			)
+		})()
+		// Unsubscribe on unmount
+		return () => unsubscribe?.()
+	}, [])
+
+	const table = useReactTable({
+		data,
+		columns: [
+			{
+				id: "select",
+				header: ({ table }) => (
+					<Checkbox
+						className="ms-2"
+						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,
+		state: {
+			sorting,
+			columnFilters,
+			columnVisibility,
+			rowSelection,
+			globalFilter,
+		},
+		onGlobalFilterChange: setGlobalFilter,
+		globalFilterFn: (row, _columnId, filterValue) => {
+			const system = row.original.expand?.system?.name ?? ""
+			const name = row.getValue("name") ?? ""
+			const created = row.getValue("created") ?? ""
+			const search = String(filterValue).toLowerCase()
+			return (
+				system.toLowerCase().includes(search) ||
+				(name as string).toLowerCase().includes(search) ||
+				(created as string).toLowerCase().includes(search)
+			)
+		},
+	})
+
+	// Bulk delete handler
+	const handleBulkDelete = async () => {
+		setDeleteDialogOpen(false)
+		const selectedIds = table.getSelectedRowModel().rows.map((row) => row.original.id)
+		try {
+			let batch = pb.createBatch()
+			let inBatch = 0
+			for (const id of selectedIds) {
+				batch.collection("alerts_history").delete(id)
+				inBatch++
+				if (inBatch > 20) {
+					await batch.send()
+					batch = pb.createBatch()
+					inBatch = 0
+				}
+			}
+			inBatch && (await batch.send())
+			table.resetRowSelection()
+		} catch (e) {
+			toast({
+				variant: "destructive",
+				title: t`Error`,
+				description: `Failed to delete records.`,
+			})
+		}
+	}
+
+	// Export to CSV handler
+	const handleExportCSV = () => {
+		const selectedRows = table.getSelectedRowModel().rows
+		if (!selectedRows.length) return
+		const cells: Record<string, (record: AlertsHistoryRecord) => string> = {
+			system: (record) => record.expand?.system?.name || record.system,
+			name: (record) => alertInfo[record.name]?.name() || record.name,
+			value: (record) => record.value + (alertInfo[record.name]?.unit ?? ""),
+			state: (record) => (record.resolved ? t`Resolved` : t`Active`),
+			created: (record) => formatShortDate(record.created),
+			resolved: (record) => (record.resolved ? formatShortDate(record.resolved) : ""),
+			duration: (record) => (record.resolved ? formatDuration(record.created, record.resolved) : ""),
+		}
+		const csvRows = [Object.keys(cells).join(",")]
+		for (const row of selectedRows) {
+			const r = row.original
+			csvRows.push(
+				Object.values(cells)
+					.map((val) => val(r))
+					.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="@container w-full">
+			<div className="@3xl:flex items-end mb-4 gap-4">
+				<SectionIntro />
+				<div className="flex items-center gap-2 ms-auto mt-3 @3xl:mt-0">
+					{table.getFilteredSelectedRowModel().rows.length > 0 && (
+						<div className="fixed bottom-0 left-0 w-full p-4 grid grid-cols-2 items-center gap-4 z-50 backdrop-blur-md shrink-0 @lg:static @lg:p-0 @lg:w-auto @lg:gap-3">
+							<AlertDialog open={deleteOpen} onOpenChange={(open) => setDeleteDialogOpen(open)}>
+								<AlertDialogTrigger asChild>
+									<Button variant="destructive" className="h-9 shrink-0">
+										<Trash2Icon className="size-4 shrink-0" />
+										<span className="ms-1">
+											<Trans>Delete</Trans>
+										</span>
+									</Button>
+								</AlertDialogTrigger>
+								<AlertDialogContent>
+									<AlertDialogHeader>
+										<AlertDialogTitle>
+											<Trans>Are you sure?</Trans>
+										</AlertDialogTitle>
+										<AlertDialogDescription>
+											<Trans>This will permanently delete all selected records from the database.</Trans>
+										</AlertDialogDescription>
+									</AlertDialogHeader>
+									<AlertDialogFooter>
+										<AlertDialogCancel>
+											<Trans>Cancel</Trans>
+										</AlertDialogCancel>
+										<AlertDialogAction
+											className={cn(buttonVariants({ variant: "destructive" }))}
+											onClick={handleBulkDelete}
+										>
+											<Trans>Continue</Trans>
+										</AlertDialogAction>
+									</AlertDialogFooter>
+								</AlertDialogContent>
+							</AlertDialog>
+							<Button variant="outline" className="h-10" onClick={handleExportCSV}>
+								<DownloadIcon className="size-4" />
+								<span className="ms-1">
+									<Trans>Export</Trans>
+								</span>
+							</Button>
+						</div>
+					)}
+					<Input
+						placeholder={t`Filter...`}
+						value={globalFilter}
+						onChange={(e) => setGlobalFilter(e.target.value)}
+						className="px-4 w-full max-w-full @3xl:w-64"
+					/>
+				</div>
+			</div>
+			<div className="rounded-md border overflow-x-auto whitespace-nowrap">
+				<Table>
+					<TableHeader>
+						{table.getHeaderGroups().map((headerGroup) => (
+							<TableRow key={headerGroup.id}>
+								{headerGroup.headers.map((header) => (
+									<TableHead className="px-2" 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} className="py-3">
+											{flexRender(cell.column.columnDef.cell, cell.getContext())}
+										</TableCell>
+									))}
+								</TableRow>
+							))
+						) : (
+							<TableRow>
+								<TableCell colSpan={table.getAllColumns().length} className="h-24 text-center">
+									<Trans>No results.</Trans>
+								</TableCell>
+							</TableRow>
+						)}
+					</TableBody>
+				</Table>
+			</div>
+			<div className="flex items-center justify-between ps-1 tabular-nums">
+				<div className="text-muted-foreground hidden flex-1 text-sm lg:flex">
+					<Trans>
+						{table.getFilteredSelectedRowModel().rows.length} of {table.getFilteredRowModel().rows.length} row(s)
+						selected.
+					</Trans>
+				</div>
+				<div className="flex w-full items-center gap-8 lg:w-fit my-3">
+					<div className="hidden items-center gap-2 lg:flex">
+						<Label htmlFor="rows-per-page" className="text-sm font-medium">
+							<Trans>Rows per page</Trans>
+						</Label>
+						<Select
+							value={`${table.getState().pagination.pageSize}`}
+							onValueChange={(value) => {
+								table.setPageSize(Number(value))
+							}}
+						>
+							<SelectTrigger className="w-[4.8em]" id="rows-per-page">
+								<SelectValue placeholder={table.getState().pagination.pageSize} />
+							</SelectTrigger>
+							<SelectContent side="top">
+								{[10, 20, 50, 100, 200].map((pageSize) => (
+									<SelectItem key={pageSize} value={`${pageSize}`}>
+										{pageSize}
+									</SelectItem>
+								))}
+							</SelectContent>
+						</Select>
+					</div>
+					<div className="flex w-fit items-center justify-center text-sm font-medium">
+						<Trans>
+							Page {table.getState().pagination.pageIndex + 1} of {table.getPageCount()}
+						</Trans>
+					</div>
+					<div className="ms-auto flex items-center gap-2 lg:ms-0">
+						<Button
+							variant="outline"
+							className="hidden size-9 p-0 lg:flex"
+							onClick={() => table.setPageIndex(0)}
+							disabled={!table.getCanPreviousPage()}
+						>
+							<span className="sr-only">Go to first page</span>
+							<ChevronsLeftIcon className="size-5" />
+						</Button>
+						<Button
+							variant="outline"
+							className="size-9"
+							size="icon"
+							onClick={() => table.previousPage()}
+							disabled={!table.getCanPreviousPage()}
+						>
+							<span className="sr-only">Go to previous page</span>
+							<ChevronLeftIcon className="size-5" />
+						</Button>
+						<Button
+							variant="outline"
+							className="size-9"
+							size="icon"
+							onClick={() => table.nextPage()}
+							disabled={!table.getCanNextPage()}
+						>
+							<span className="sr-only">Go to next page</span>
+							<ChevronRightIcon className="size-5" />
+						</Button>
+						<Button
+							variant="outline"
+							className="hidden size-9 lg:flex"
+							size="icon"
+							onClick={() => table.setPageIndex(table.getPageCount() - 1)}
+							disabled={!table.getCanNextPage()}
+						>
+							<span className="sr-only">Go to last page</span>
+							<ChevronsRightIcon className="size-5" />
+						</Button>
+					</div>
+				</div>
+			</div>
+		</div>
+	)
+}
--- a/beszel/site/src/components/routes/settings/general.tsx
+++ b/beszel/site/src/components/routes/settings/general.tsx
@@ -11,7 +11,7 @@ import { useState } from "react"
 import languages from "@/lib/languages"
 import { dynamicActivate } from "@/lib/i18n"
 import { useLingui } from "@lingui/react/macro"
-// import { setLang } from "@/lib/i18n"
+import { Unit } from "@/lib/enums"

 export default function SettingsProfilePage({ userSettings }: { userSettings: UserSettings }) {
 	const [isLoading, setIsLoading] = useState(false)
@@ -101,6 +101,87 @@ export default function SettingsProfilePage({ userSettings }: { userSettings: Us
 					</p>
 				</div>
 				<Separator />
+				<div className="space-y-2">
+					<div className="mb-4">
+						<h3 className="mb-1 text-lg font-medium">
+							<Trans>Unit preferences</Trans>
+						</h3>
+						<p className="text-sm text-muted-foreground leading-relaxed">
+							<Trans>Change display units for metrics.</Trans>
+						</p>
+					</div>
+					<div className="grid sm:grid-cols-3 gap-4">
+						<div className="space-y-2">
+							<Label className="block" htmlFor="unitTemp">
+								<Trans>Temperature unit</Trans>
+							</Label>
+							<Select
+								name="unitTemp"
+								key={userSettings.unitTemp}
+								defaultValue={userSettings.unitTemp?.toString() || String(Unit.Celsius)}
+							>
+								<SelectTrigger id="unitTemp">
+									<SelectValue />
+								</SelectTrigger>
+								<SelectContent>
+									<SelectItem value={String(Unit.Celsius)}>
+										<Trans>Celsius (°C)</Trans>
+									</SelectItem>
+									<SelectItem value={String(Unit.Fahrenheit)}>
+										<Trans>Fahrenheit (°F)</Trans>
+									</SelectItem>
+								</SelectContent>
+							</Select>
+						</div>
+
+						<div className="space-y-2">
+							<Label className="block" htmlFor="unitNet">
+								<Trans>Network unit</Trans>
+							</Label>
+							<Select
+								name="unitNet"
+								key={userSettings.unitNet}
+								defaultValue={userSettings.unitNet?.toString() ?? String(Unit.Bytes)}
+							>
+								<SelectTrigger id="unitNet">
+									<SelectValue />
+								</SelectTrigger>
+								<SelectContent>
+									<SelectItem value={String(Unit.Bytes)}>
+										<Trans>Bytes (KB/s, MB/s, GB/s)</Trans>
+									</SelectItem>
+									<SelectItem value={String(Unit.Bits)}>
+										<Trans>Bits (Kbps, Mbps, Gbps)</Trans>
+									</SelectItem>
+								</SelectContent>
+							</Select>
+						</div>
+
+						<div className="space-y-2">
+							<Label className="block" htmlFor="unitDisk">
+								<Trans>Disk unit</Trans>
+							</Label>
+							<Select
+								name="unitDisk"
+								key={userSettings.unitDisk}
+								defaultValue={userSettings.unitDisk?.toString() ?? String(Unit.Bytes)}
+							>
+								<SelectTrigger id="unitDisk">
+									<SelectValue />
+								</SelectTrigger>
+								<SelectContent>
+									<SelectItem value={String(Unit.Bytes)}>
+										<Trans>Bytes (KB/s, MB/s, GB/s)</Trans>
+									</SelectItem>
+									<SelectItem value={String(Unit.Bits)}>
+										<Trans>Bits (Kbps, Mbps, Gbps)</Trans>
+									</SelectItem>
+								</SelectContent>
+							</Select>
+						</div>
+					</div>
+				</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>
--- a/beszel/site/src/components/routes/settings/layout.tsx
+++ b/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 {
@@ -63,7 +64,12 @@ export default function SettingsLayout() {
 			title: t`Tokens & Fingerprints`,
 			href: getPagePath($router, "settings", { name: "tokens" }),
 			icon: FingerprintIcon,
-			// admin: true,
+			noReadOnly: true,
+		},
+		{
+			title: t`Alert History`,
+			href: getPagePath($router, "settings", { name: "alert-history" }),
+			icon: LogsIcon,
 		},
 		{
 			title: t`YAML Config`,
@@ -121,5 +127,7 @@ function SettingsContent({ name }: { name: string }) {
 			return <ConfigYaml />
 		case "tokens":
 			return <Fingerprints />
+		case "alert-history":
+			return <AlertsHistoryDataTable />
 	}
 }
--- a/beszel/site/src/components/routes/settings/sidebar-nav.tsx
+++ b/beszel/site/src/components/routes/settings/sidebar-nav.tsx
@@ -1,5 +1,5 @@
 import React from "react"
-import { cn, isAdmin } from "@/lib/utils"
+import { cn, isAdmin, isReadOnlyUser } from "@/lib/utils"
 import { buttonVariants } from "../../ui/button"
 import { $router, Link, navigate } from "../../router"
 import { useStore } from "@nanostores/react"
@@ -12,6 +12,7 @@ interface SidebarNavProps extends React.HTMLAttributes<HTMLElement> {
 		title: string
 		icon?: React.FC<React.SVGProps<SVGSVGElement>>
 		admin?: boolean
+		noReadOnly?: boolean
 	}[]
 }

@@ -32,7 +33,7 @@ export function SidebarNav({ className, items, ...props }: SidebarNavProps) {
 							return (
 								<SelectItem key={item.href} value={item.href}>
 									<span className="flex items-center gap-2 truncate">
-										{item.icon && <item.icon className="h-4 w-4" />}
+										{item.icon && <item.icon className="size-4" />}
 										<span className="truncate">{item.title}</span>
 									</span>
 								</SelectItem>
@@ -44,9 +45,9 @@ export function SidebarNav({ className, items, ...props }: SidebarNavProps) {
 			</div>

 			{/* Desktop View */}
-			<nav className={cn("hidden md:grid gap-1", className)} {...props}>
+			<nav className={cn("hidden md:grid gap-1 sticky top-6", className)} {...props}>
 				{items.map((item) => {
-					if (item.admin && !isAdmin()) {
+					if ((item.admin && !isAdmin()) || (item.noReadOnly && isReadOnlyUser())) {
 						return null
 					}
 					return (
@@ -59,7 +60,7 @@ export function SidebarNav({ className, items, ...props }: SidebarNavProps) {
 								page?.path === item.href ? "bg-muted hover:bg-muted" : "hover:bg-muted/50"
 							)}
 						>
-							{item.icon && <item.icon className="h-4 w-4 shrink-0" />}
+							{item.icon && <item.icon className="size-4 shrink-0" />}
 							<span className="truncate">{item.title}</span>
 						</Link>
 					)
--- a/beszel/site/src/components/routes/settings/tokens-fingerprints.tsx
+++ b/beszel/site/src/components/routes/settings/tokens-fingerprints.tsx
@@ -34,6 +34,8 @@ import {
 	InstallDropdown,
 } from "@/components/install-dropdowns"
 import { AppleIcon, DockerIcon, TuxIcon, WindowsIcon } from "@/components/ui/icons"
+import { redirectPage } from "@nanostores/router"
+import { $router } from "@/components/router"

 const pbFingerprintOptions = {
 	expand: "system",
@@ -41,6 +43,9 @@ const pbFingerprintOptions = {
 }

 const SettingsFingerprintsPage = memo(() => {
+	if (isReadOnlyUser()) {
+		redirectPage($router, "settings", { name: "general" })
+	}
 	const [fingerprints, setFingerprints] = useState<FingerprintRecord[]>([])

 	// Get fingerprint records on mount
@@ -154,7 +159,7 @@ const SectionUniversalToken = memo(() => {
 					or on hub restart.
 				</Trans>
 			</p>
-			<div className="min-h-16 overflow-auto max-w-full inline-flex items-center gap-5 mt-3 border py-2 pl-5 pr-4 rounded-md">
+			<div className="min-h-16 overflow-auto max-w-full inline-flex items-center gap-5 mt-3 border py-2 ps-5 pe-4 rounded-md">
 				{!isLoading && (
 					<>
 						<Switch
--- a/beszel/site/src/components/routes/system.tsx
+++ b/beszel/site/src/components/routes/system.tsx
@@ -11,7 +11,7 @@ import {
 	$temperatureFilter,
 } from "@/lib/stores"
 import { ChartData, ChartTimes, ContainerStatsRecord, GPUData, SystemRecord, SystemStatsRecord } from "@/types"
-import { ChartType, Os } from "@/lib/enums"
+import { ChartType, Unit, Os } from "@/lib/enums"
 import React, { lazy, memo, useCallback, useEffect, useMemo, useRef, useState } from "react"
 import { Card, CardHeader, CardTitle, CardDescription } from "../ui/card"
 import { useStore } from "@nanostores/react"
@@ -21,9 +21,10 @@ import ChartTimeSelect from "../charts/chart-time-select"
 import {
 	chartTimeData,
 	cn,
+	decimalString,
+	formatBytes,
 	getHostDisplayValue,
 	getPbTimestamp,
-	getSizeAndUnit,
 	listen,
 	toFixedFloat,
 	useLocalStorage,
@@ -47,6 +48,7 @@ const DiskChart = lazy(() => import("../charts/disk-chart"))
 const SwapChart = lazy(() => import("../charts/swap-chart"))
 const TemperatureChart = lazy(() => import("../charts/temperature-chart"))
 const GpuPowerChart = lazy(() => import("../charts/gpu-power-chart"))
+const LoadAverageChart = lazy(() => import("../charts/load-average-chart"))

 const cache = new Map<string, any>()

@@ -131,6 +133,7 @@ export default function SystemDetail({ name }: { name: string }) {
 	const [bottomSpacing, setBottomSpacing] = useState(0)
 	const [chartLoading, setChartLoading] = useState(true)
 	const isLongerChart = chartTime !== "1h"
+	const userSettings = $userSettings.get()

 	useEffect(() => {
 		document.title = `${name} / Beszel`
@@ -472,7 +475,13 @@ export default function SystemDetail({ name }: { name: string }) {
 						description={t`Average system-wide CPU utilization`}
 						cornerEl={maxValSelect}
 					>
-						<AreaChartDefault chartData={chartData} chartName="CPU Usage" maxToggled={maxValues} unit="%" />
+						<AreaChartDefault
+							chartData={chartData}
+							chartName="CPU Usage"
+							maxToggled={maxValues}
+							tickFormatter={(val) => toFixedFloat(val, 2) + "%"}
+							contentFormatter={({ value }) => decimalString(value) + "%"}
+						/>
 					</ChartCard>

 					{containerFilterBar && (
@@ -519,7 +528,19 @@ export default function SystemDetail({ name }: { name: string }) {
 						description={t`Throughput of root filesystem`}
 						cornerEl={maxValSelect}
 					>
-						<AreaChartDefault chartData={chartData} chartName="dio" maxToggled={maxValues} />
+						<AreaChartDefault
+							chartData={chartData}
+							chartName="dio"
+							maxToggled={maxValues}
+							tickFormatter={(val) => {
+								const { value, unit } = formatBytes(val, true, userSettings.unitDisk, true)
+								return toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit
+							}}
+							contentFormatter={({ value }) => {
+								const { value: convertedValue, unit } = formatBytes(value, true, userSettings.unitDisk, true)
+								return decimalString(convertedValue, convertedValue >= 100 ? 1 : 2) + " " + unit
+							}}
+						/>
 					</ChartCard>

 					<ChartCard
@@ -529,7 +550,19 @@ export default function SystemDetail({ name }: { name: string }) {
 						cornerEl={maxValSelect}
 						description={t`Network traffic of public interfaces`}
 					>
-						<AreaChartDefault chartData={chartData} chartName="bw" maxToggled={maxValues} />
+						<AreaChartDefault
+							chartData={chartData}
+							chartName="bw"
+							maxToggled={maxValues}
+							tickFormatter={(val) => {
+								let { value, unit } = formatBytes(val, true, userSettings.unitNet, true)
+								return toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit
+							}}
+							contentFormatter={({ value }) => {
+								const { value: convertedValue, unit } = formatBytes(value, true, userSettings.unitNet, true)
+								return decimalString(convertedValue, convertedValue >= 100 ? 1 : 2) + " " + unit
+							}}
+						/>
 					</ChartCard>

 					{containerFilterBar && containerData.length > 0 && (
@@ -563,6 +596,18 @@ export default function SystemDetail({ name }: { name: string }) {
 						</ChartCard>
 					)}

+					{/* Load Average chart */}
+					{system.info.l1 !== undefined && (
+						<ChartCard
+							empty={dataEmpty}
+							grid={grid}
+							title={t`Load Average`}
+							description={t`System load averages over time`}
+						>
+							<LoadAverageChart chartData={chartData} />
+						</ChartCard>
+					)}
+
 					{/* Temperature chart */}
 					{systemStats.at(-1)?.stats.t && (
 						<ChartCard
@@ -594,10 +639,6 @@ export default function SystemDetail({ name }: { name: string }) {
 					<div className="grid xl:grid-cols-2 gap-4">
 						{Object.keys(systemStats.at(-1)?.stats.g ?? {}).map((id) => {
 							const gpu = systemStats.at(-1)?.stats.g?.[id] as GPUData
-							const sizeFormatter = (value: number, decimals?: number) => {
-								const { v, u } = getSizeAndUnit(value, false)
-								return toFixedFloat(v, decimals || 1) + u
-							}
 							return (
 								<div key={id} className="contents">
 									<ChartCard
@@ -606,7 +647,12 @@ export default function SystemDetail({ name }: { name: string }) {
 										title={`${gpu.n} ${t`Usage`}`}
 										description={t`Average utilization of ${gpu.n}`}
 									>
-										<AreaChartDefault chartData={chartData} chartName={`g.${id}.u`} unit="%" />
+										<AreaChartDefault
+											chartData={chartData}
+											chartName={`g.${id}.u`}
+											tickFormatter={(val) => toFixedFloat(val, 2) + "%"}
+											contentFormatter={({ value }) => decimalString(value) + "%"}
+										/>
 									</ChartCard>
 									<ChartCard
 										empty={dataEmpty}
@@ -618,8 +664,14 @@ export default function SystemDetail({ name }: { name: string }) {
 											chartData={chartData}
 											chartName={`g.${id}.mu`}
 											max={gpu.mt}
-											tickFormatter={sizeFormatter}
-											contentFormatter={(value) => sizeFormatter(value, 2)}
+											tickFormatter={(val) => {
+												const { value, unit } = formatBytes(val, false, Unit.Bytes, true)
+												return toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit
+											}}
+											contentFormatter={({ value }) => {
+												const { value: convertedValue, unit } = formatBytes(value, false, Unit.Bytes, true)
+												return decimalString(convertedValue) + " " + unit
+											}}
 										/>
 									</ChartCard>
 								</div>
@@ -653,7 +705,19 @@ export default function SystemDetail({ name }: { name: string }) {
 										description={t`Throughput of ${extraFsName}`}
 										cornerEl={maxValSelect}
 									>
-										<AreaChartDefault chartData={chartData} chartName={`efs.${extraFsName}`} maxToggled={maxValues} />
+										<AreaChartDefault
+											chartData={chartData}
+											chartName={`efs.${extraFsName}`}
+											maxToggled={maxValues}
+											tickFormatter={(val) => {
+												const { value, unit } = formatBytes(val, true, userSettings.unitDisk, true)
+												return toFixedFloat(value, value >= 10 ? 0 : 1) + " " + unit
+											}}
+											contentFormatter={({ value }) => {
+												const { value: convertedValue, unit } = formatBytes(value, true, userSettings.unitDisk, true)
+												return decimalString(convertedValue, convertedValue >= 100 ? 1 : 2) + " " + unit
+											}}
+										/>
 									</ChartCard>
 								</div>
 							)
--- a/beszel/site/src/components/systems-table/systems-table.tsx
+++ b/beszel/site/src/components/systems-table/systems-table.tsx
@@ -63,9 +63,17 @@ import {
 	PenBoxIcon,
 } from "lucide-react"
 import { memo, useEffect, useMemo, useRef, useState } from "react"
-import { $systems, pb } from "@/lib/stores"
+import { $systems, $userSettings, pb } from "@/lib/stores"
 import { useStore } from "@nanostores/react"
-import { cn, copyToClipboard, decimalString, isReadOnlyUser, useLocalStorage } from "@/lib/utils"
+import {
+	cn,
+	copyToClipboard,
+	isReadOnlyUser,
+	useLocalStorage,
+	formatTemperature,
+	decimalString,
+	formatBytes,
+} from "@/lib/utils"
 import AlertsButton from "../alerts/alert-button"
 import { $router, Link, navigate } from "../router"
 import { EthernetIcon, GpuIcon, HourglassIcon, ThermometerIcon } from "../ui/icons"
@@ -165,7 +173,7 @@ export default function SystemsTable() {
 				invertSorting: false,
 				Icon: ServerIcon,
 				cell: (info) => (
-					<span className="flex gap-0.5 items-center text-base md:pe-5">
+					<span className="flex gap-0.5 items-center text-base md:ps-1 md:pe-5">
 						<IndicatorDot system={info.row.original} />
 						<Button
 							data-nolink
@@ -174,14 +182,14 @@ export default function SystemsTable() {
 							onClick={() => copyToClipboard(info.getValue() as string)}
 						>
 							{info.getValue() as string}
-							<CopyIcon className="h-2.5 w-2.5" />
+							<CopyIcon className="size-2.5" />
 						</Button>
 					</span>
 				),
 				header: sortableHeader,
 			},
 			{
-				accessorFn: (originalRow) => originalRow.info.cpu,
+				accessorFn: ({ info }) => decimalString(info.cpu, info.cpu >= 10 ? 1 : 2),
 				id: "cpu",
 				name: () => t`CPU`,
 				cell: CellFormatter,
@@ -214,53 +222,60 @@ export default function SystemsTable() {
 				header: sortableHeader,
 			},
 			{
-				accessorFn: (originalRow) => originalRow.info.b || 0,
-				id: "net",
-				name: () => t`Net`,
-				size: 50,
-				Icon: EthernetIcon,
-				header: sortableHeader,
-				cell(info) {
-					const val = info.getValue() as number
-					return <span className="tabular-nums whitespace-nowrap">{decimalString(val, val >= 100 ? 1 : 2)} MB/s</span>
+				id: "loadAverage",
+				accessorFn: ({ info }) => {
+					const { l1 = 0, l5 = 0, l15 = 0 } = info
+					return l1 + l5 + l15
 				},
-			},
-			{
-				accessorFn: (originalRow) => originalRow.info.l5,
-				id: "l5",
-				name: () => t({ message: "L5", comment: "Load average 5 minutes" }),
+				name: () => t({ message: "Load Avg", comment: "Short label for load average" }),
 				size: 0,
-				hideSort: true,
 				Icon: HourglassIcon,
 				header: sortableHeader,
-				cell(info) {
-					const val = info.getValue() as number
-					if (!val) {
+				cell(info: CellContext<SystemRecord, unknown>) {
+					const { info: sysInfo, status } = info.row.original
+					if (sysInfo.l1 === undefined) {
 						return null
 					}
+
+					const { l1 = 0, l5 = 0, l15 = 0, t: cpuThreads = 1 } = sysInfo
+					const loadAverages = [l1, l5, l15]
+
+					function getDotColor() {
+						const max = Math.max(...loadAverages)
+						const normalized = max / cpuThreads
+						if (status !== "up") return "bg-primary/30"
+						if (normalized < 0.7) return "bg-green-500"
+						if (normalized < 1) return "bg-yellow-500"
+						return "bg-red-600"
+					}
+
 					return (
-						<span className={cn("tabular-nums whitespace-nowrap", viewMode === "table" && "ps-1")}>
-							{decimalString(val)}
-						</span>
+						<div className="flex items-center gap-[.35em] w-full tabular-nums tracking-tight">
+							<span className={cn("inline-block size-2 rounded-full me-0.5", getDotColor())} />
+							{loadAverages.map((la, i) => (
+								<span key={i}>{decimalString(la, la >= 10 ? 1 : 2)}</span>
+							))}
+						</div>
 					)
 				},
 			},
 			{
-				accessorFn: (originalRow) => originalRow.info.l15,
-				id: "l15",
-				name: () => t({ message: "L15", comment: "Load average 15 minutes" }),
+				accessorFn: (originalRow) => originalRow.info.b || 0,
+				id: "net",
+				name: () => t`Net`,
 				size: 0,
-				hideSort: true,
-				Icon: HourglassIcon,
+				Icon: EthernetIcon,
 				header: sortableHeader,
 				cell(info) {
-					const val = info.getValue() as number
-					if (!val) {
+					if (info.row.original.status === "paused") {
 						return null
 					}
+					const val = info.getValue() as number
+					const userSettings = useStore($userSettings)
+					const { value, unit } = formatBytes(val, true, userSettings.unitNet, true)
 					return (
-						<span className={cn("tabular-nums whitespace-nowrap", viewMode === "table" && "ps-1")}>
-							{decimalString(val)}
+						<span className="tabular-nums whitespace-nowrap">
+							{decimalString(value, value >= 100 ? 1 : 2)} {unit}
 						</span>
 					)
 				},
@@ -278,9 +293,11 @@ export default function SystemsTable() {
 					if (!val) {
 						return null
 					}
+					const userSettings = useStore($userSettings)
+					const { value, unit } = formatTemperature(val, userSettings.unitTemp)
 					return (
 						<span className={cn("tabular-nums whitespace-nowrap", viewMode === "table" && "ps-0.5")}>
-							{decimalString(val)} °C
+							{decimalString(value, value >= 100 ? 1 : 2)} {unit}
 						</span>
 					)
 				},
@@ -531,7 +548,7 @@ function SystemsTableHead({ table, colLength }: { table: TableType<SystemRecord>
 					<TableRow key={headerGroup.id}>
 						{headerGroup.headers.map((header) => {
 							return (
-								<TableHead className="px-1" key={header.id}>
+								<TableHead className="px-1.5" key={header.id}>
 									{flexRender(header.column.columnDef.header, header.getContext())}
 								</TableHead>
 							)
--- a/beszel/site/src/components/ui/checkbox.tsx
+++ b/beszel/site/src/components/ui/checkbox.tsx
@@ -1,3 +1,5 @@
+"use client"
+
 import * as React from "react"
 import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
 import { Check } from "lucide-react"
@@ -11,13 +13,14 @@ const Checkbox = React.forwardRef<
 	<CheckboxPrimitive.Root
 		ref={ref}
 		className={cn(
-			"peer h-4 w-4 shrink-0 rounded-[.3em] border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+			"peer size-4 flex items-center justify-center shrink-0 rounded-[.3em] border border-input ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
+
 			className
 		)}
 		{...props}
 	>
 		<CheckboxPrimitive.Indicator className={cn("flex items-center justify-center text-current")}>
-			<Check className="h-4 w-4" />
+			<Check className="size-4" />
 		</CheckboxPrimitive.Indicator>
 	</CheckboxPrimitive.Root>
 ))
--- a/beszel/site/src/components/ui/collapsible.tsx
+++ b/beszel/site/src/components/ui/collapsible.tsx
@@ -0,0 +1,49 @@
+import * as React from "react"
+import { ChevronDownIcon, HourglassIcon } from "lucide-react"
+import { cn } from "@/lib/utils"
+import { Button } from "./button"
+
+interface CollapsibleProps {
+	title: string
+	children: React.ReactNode
+	description?: React.ReactNode
+	defaultOpen?: boolean
+	className?: string
+	icon?: React.ReactNode
+}
+
+export function Collapsible({ title, children, description, defaultOpen = false, className, icon }: CollapsibleProps) {
+	const [isOpen, setIsOpen] = React.useState(defaultOpen)
+
+	return (
+		<div className={cn("border rounded-lg", className)}>
+			<Button
+				variant="ghost"
+				className="w-full justify-between p-4 font-semibold"
+				onClick={() => setIsOpen(!isOpen)}
+			>
+				<div className="flex items-center gap-2">
+					{icon}
+					{title}
+				</div>
+				<ChevronDownIcon
+					className={cn("h-4 w-4 transition-transform duration-200", {
+						"rotate-180": isOpen,
+					})}
+				/>
+			</Button>
+			{description && (
+				<div className="px-4 pb-2 text-sm text-muted-foreground">
+					{description}
+				</div>
+			)}
+			{isOpen && (
+				<div className="px-4 pb-4">
+					<div className="grid gap-3">
+						{children}
+					</div>
+				</div>
+			)}
+		</div>
+	)
+} 
--- a/beszel/site/src/components/ui/table.tsx
+++ b/beszel/site/src/components/ui/table.tsx
@@ -37,7 +37,7 @@ const TableRow = React.forwardRef<HTMLTableRowElement, React.HTMLAttributes<HTML
 		<tr
 			ref={ref}
 			className={cn(
-				"border-b border-border/60 hover:bg-muted/40 dark:hover:bg-muted/20 data-[state=selected]:bg-muted",
+				"border-b border-border/60 hover:bg-muted/40 dark:hover:bg-muted/20 data-[state=selected]:!bg-muted",
 				className
 			)}
 			{...props}
--- a/beszel/site/src/lib/enums.ts
+++ b/beszel/site/src/lib/enums.ts
@@ -1,3 +1,4 @@
+/** Operating system */
 export enum Os {
 	Linux = 0,
 	Darwin,
@@ -5,9 +6,18 @@ export enum Os {
 	FreeBSD,
 }

+/** Type of chart */
 export enum ChartType {
 	Memory,
 	Disk,
 	Network,
 	CPU,
 }
+
+/** Unit of measurement */
+export enum Unit {
+	Bytes,
+	Bits,
+	Celsius,
+	Fahrenheit,
+}
--- a/beszel/site/src/lib/stores.ts
+++ b/beszel/site/src/lib/stores.ts
@@ -28,6 +28,9 @@ export const $maxValues = atom(false)
 export const $userSettings = map<UserSettings>({
 	chartTime: "1h",
 	emails: [pb.authStore.record?.email || ""],
+	// unitTemp: "celsius",
+	// unitNet: "mbps",
+	// unitDisk: "mbps",
 })
 // update local storage on change
 $userSettings.subscribe((value) => {
--- a/beszel/site/src/lib/utils.ts
+++ b/beszel/site/src/lib/utils.ts
@@ -3,7 +3,15 @@ import { toast } from "@/components/ui/use-toast"
 import { type ClassValue, clsx } from "clsx"
 import { twMerge } from "tailwind-merge"
 import { $alerts, $copyContent, $systems, $userSettings, pb } from "./stores"
-import { AlertInfo, AlertRecord, ChartTimeData, ChartTimes, FingerprintRecord, SystemRecord } from "@/types"
+import {
+	AlertInfo,
+	AlertRecord,
+	ChartTimeData,
+	ChartTimes,
+	FingerprintRecord,
+	SystemRecord,
+	UserSettings,
+} from "@/types"
 import { RecordModel, RecordSubscription } from "pocketbase"
 import { WritableAtom } from "nanostores"
 import { timeDay, timeHour } from "d3-time"
@@ -11,6 +19,7 @@ import { useEffect, useState } from "react"
 import { CpuIcon, HardDriveIcon, MemoryStickIcon, ServerIcon } from "lucide-react"
 import { EthernetIcon, HourglassIcon, ThermometerIcon } from "@/components/ui/icons"
 import { prependBasePath } from "@/components/router"
+import { Unit } from "./enums"

 export function cn(...inputs: ClassValue[]) {
 	return twMerge(clsx(inputs))
@@ -73,7 +82,10 @@ export const updateSystemList = (() => {

 /** Logs the user out by clearing the auth store and unsubscribing from realtime updates. */
 export async function logOut() {
-	sessionStorage.setItem("lo", "t")
+	$systems.set([])
+	$alerts.set([])
+	$userSettings.set({} as UserSettings)
+	sessionStorage.setItem("lo", "t") // prevent auto login on logout
 	pb.authStore.clear()
 	pb.realtime.unsubscribe()
 }
@@ -225,17 +237,17 @@ export function useYAxisWidth() {
 	return { yAxisWidth, updateYAxisWidth }
 }

-export function toFixedWithoutTrailingZeros(num: number, digits: number) {
-	return parseFloat(num.toFixed(digits)).toString()
-}
-
+/** Format number to x decimal places, without trailing zeros */
 export function toFixedFloat(num: number, digits: number) {
-	return parseFloat(num.toFixed(digits))
+	return parseFloat((digits === 0 ? Math.ceil(num) : num).toFixed(digits))
 }

 let decimalFormatters: Map<number, Intl.NumberFormat> = new Map()
-/** Format number to x decimal places */
+/** Format number to x decimal places, maintaining trailing zeros */
 export function decimalString(num: number, digits = 2) {
+	if (digits === 0) {
+		return Math.ceil(num).toString()
+	}
 	let formatter = decimalFormatters.get(digits)
 	if (!formatter) {
 		formatter = new Intl.NumberFormat(undefined, {
@@ -266,42 +278,96 @@ export function useLocalStorage<T>(key: string, defaultValue: T) {
 	return [value, setValue]
 }

+/** Format temperature to user's preferred unit */
+export function formatTemperature(celsius: number, unit?: Unit): { value: number; unit: string } {
+	if (!unit) {
+		unit = $userSettings.get().unitTemp || Unit.Celsius
+	}
+	// need loose equality check due to form data being strings
+	if (unit == Unit.Fahrenheit) {
+		return {
+			value: celsius * 1.8 + 32,
+			unit: "°F",
+		}
+	}
+	return {
+		value: celsius,
+		unit: "°C",
+	}
+}
+
+/** Format bytes to user's preferred unit */
+export function formatBytes(
+	size: number,
+	perSecond = false,
+	unit = Unit.Bytes,
+	isMegabytes = false
+): { value: number; unit: string } {
+	// Convert MB to bytes if isMegabytes is true
+	if (isMegabytes) size *= 1024 * 1024
+
+	// need loose equality check due to form data being strings
+	if (unit == Unit.Bits) {
+		const bits = size * 8
+		const suffix = perSecond ? "ps" : ""
+		if (bits < 1000) return { value: bits, unit: `b${suffix}` }
+		if (bits < 1_000_000) return { value: bits / 1_000, unit: `Kb${suffix}` }
+		if (bits < 1_000_000_000)
+			return {
+				value: bits / 1_000_000,
+				unit: `Mb${suffix}`,
+			}
+		if (bits < 1_000_000_000_000)
+			return {
+				value: bits / 1_000_000_000,
+				unit: `Gb${suffix}`,
+			}
+		return {
+			value: bits / 1_000_000_000_000,
+			unit: `Tb${suffix}`,
+		}
+	}
+	// bytes
+	const suffix = perSecond ? "/s" : ""
+	if (size < 100) return { value: size, unit: `B${suffix}` }
+	if (size < 1000 * 1024) return { value: size / 1024, unit: `KB${suffix}` }
+	if (size < 1000 * 1024 ** 2)
+		return {
+			value: size / 1024 ** 2,
+			unit: `MB${suffix}`,
+		}
+	if (size < 1000 * 1024 ** 3)
+		return {
+			value: size / 1024 ** 3,
+			unit: `GB${suffix}`,
+		}
+	return {
+		value: size / 1024 ** 4,
+		unit: `TB${suffix}`,
+	}
+}
+
+/** Fetch or create user settings in database */
 export async function updateUserSettings() {
 	try {
 		const req = await pb.collection("user_settings").getFirstListItem("", { fields: "settings" })
 		$userSettings.set(req.settings)
 		return
 	} catch (e) {
-		console.log("get settings", e)
+		console.error("get settings", e)
 	}
 	// create user settings if error fetching existing
 	try {
 		const createdSettings = await pb.collection("user_settings").create({ user: pb.authStore.record!.id })
 		$userSettings.set(createdSettings.settings)
 	} catch (e) {
-		console.log("create settings", e)
+		console.error("create settings", e)
 	}
 }

-/**
- * Get the value and unit of size (TB, GB, or MB) for a given size
- * @param n size in gigabytes or megabytes
- * @param isGigabytes boolean indicating if n represents gigabytes (true) or megabytes (false)
- * @returns an object containing the value and unit of size
- */
-export const getSizeAndUnit = (n: number, isGigabytes = true) => {
-	const sizeInGB = isGigabytes ? n : n / 1_000
-
-	if (sizeInGB >= 1_000) {
-		return { v: sizeInGB / 1_000, u: " TB" }
-	} else if (sizeInGB >= 1) {
-		return { v: sizeInGB, u: " GB" }
-	}
-	return { v: isGigabytes ? sizeInGB * 1_000 : n, u: " MB" }
-}
-
 export const chartMargin = { top: 12 }

+/** Alert info for each alert type */
 export const alertInfo: Record<string, AlertInfo> = {
 	Status: {
 		name: () => t`Status`,
@@ -342,6 +408,16 @@ export const alertInfo: Record<string, AlertInfo> = {
 		icon: ThermometerIcon,
 		desc: () => t`Triggers when any sensor exceeds a threshold`,
 	},
+	LoadAvg1: {
+		name: () => t`Load Average 1m`,
+		unit: "",
+		icon: HourglassIcon,
+		max: 100,
+		min: 0.1,
+		start: 10,
+		step: 0.1,
+		desc: () => t`Triggers when 1 minute load average exceeds a threshold`,
+	},
 	LoadAvg5: {
 		name: () => t`Load Average 5m`,
 		unit: "",
@@ -380,3 +456,42 @@ export const getHubURL = () => BESZEL?.HUB_URL || window.location.origin

 /** Map of system IDs to their corresponding tokens (used to avoid fetching in add-system dialog) */
 export const tokenMap = new Map<SystemRecord["id"], FingerprintRecord["token"]>()
+
+/** Calculate duration between two dates and format as human-readable string */
+export function formatDuration(
+	createdDate: string | null | undefined,
+	resolvedDate: string | null | undefined
+): string {
+	const created = createdDate ? new Date(createdDate) : null
+	const resolved = resolvedDate ? new Date(resolvedDate) : null
+
+	if (!created || !resolved) return ""
+
+	const diffMs = resolved.getTime() - created.getTime()
+	if (diffMs < 0) return ""
+
+	const totalSeconds = Math.floor(diffMs / 1000)
+	let hours = Math.floor(totalSeconds / 3600)
+	let minutes = Math.floor((totalSeconds % 3600) / 60)
+	let seconds = totalSeconds % 60
+
+	// if seconds are close to 60, round up to next minute
+	// if minutes are close to 60, round up to next hour
+	if (seconds >= 58) {
+		minutes += 1
+		seconds = 0
+	}
+	if (minutes >= 60) {
+		hours += 1
+		minutes = 0
+	}
+
+	// For durations over 1 hour, omit seconds for cleaner display
+	if (hours > 0) {
+		return [hours ? `${hours}h` : null, minutes ? `${minutes}m` : null].filter(Boolean).join(" ")
+	}
+
+	return [hours ? `${hours}h` : null, minutes ? `${minutes}m` : null, seconds ? `${seconds}s` : null]
+		.filter(Boolean)
+		.join(" ")
+}
--- a/beszel/site/src/types.d.ts
+++ b/beszel/site/src/types.d.ts
@@ -1,5 +1,5 @@
 import { RecordModel } from "pocketbase"
-import { Os } from "./lib/enums"
+import { Unit, Os } from "./lib/enums"

 // global window properties
 declare global {
@@ -44,6 +44,8 @@ export interface SystemInfo {
 	c: number
 	/** cpu model */
 	m: string
+	/** load average 1 minute */
+	l1?: number
 	/** load average 5 minutes */
 	l5?: number
 	/** load average 15 minutes */
@@ -187,6 +189,16 @@ export interface AlertRecord extends RecordModel {
 	// user: string
 }

+export interface AlertsHistoryRecord extends RecordModel {
+	alert: string
+	user: string
+	system: string
+	name: string
+	val: number
+	created: string
+	resolved?: string | null
+}
+
 export type ChartTimes = "1h" | "12h" | "24h" | "1w" | "30d"

 export interface ChartTimeData {
@@ -200,11 +212,14 @@ export interface ChartTimeData {
 	}
 }

-export type UserSettings = {
+export interface UserSettings {
 	// lang?: string
 	chartTime: ChartTimes
 	emails?: string[]
 	webhooks?: string[]
+	unitTemp?: Unit
+	unitNet?: Unit
+	unitDisk?: Unit
 }

 type ChartDataContainer = {
--- a/beszel/site/tailwind.config.js
+++ b/beszel/site/tailwind.config.js
@@ -91,6 +91,7 @@ module.exports = {
 		},
 	},
 	plugins: [
+		require("@tailwindcss/container-queries"),
 		require("tailwindcss-animate"),
 		require("tailwindcss-rtl"),
 		function ({ addVariant }) {
--- a/beszel/site/tsconfig.app.json
+++ b/beszel/site/tsconfig.app.json
@@ -2,10 +2,10 @@
 	"compilerOptions": {
 		"composite": true,
 		"tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-		"target": "ES2021",
+		"target": "ES2022",
 		"useDefineForClassFields": true,
 		"module": "ESNext",
-		"lib": ["ES2021", "DOM", "DOM.Iterable"],
+		"lib": ["ES2022", "DOM", "DOM.Iterable"],
 		"skipLibCheck": true,
 		"baseUrl": ".",
 		"paths": {
Author	SHA1	Message	Date
henrygd	261f7fb76c	update go dependencies	2025-07-21 20:14:31 -04:00
henrygd	18d9258907	Alert history updates	2025-07-21 20:07:52 -04:00
Sven van Ginkel	9d7fb8ab80	[Feature] Add Alerts History page (#973 ) * Add alert history * refactor * fix one colunm * update migration * add retention	2025-07-20 19:20:51 -04:00
henrygd	3730a78e5a	update load avg display and include it in longer records	2025-07-16 21:24:42 -04:00
Sven van Ginkel	7cdd0907e8	[Feature][0.12.0-Beta] Enhance Load Average Display, Charting & Alert Grouping (#960 ) * Add 1m load * update alart dialog * fix null data * Remove omit zero * change table and alert view	2025-07-16 16:03:26 -04:00
henrygd	3586f73f30	check for malformed sensor names on darwin (#796 )	2025-07-16 14:56:13 -04:00
henrygd	752ccc6beb	hide tokens page for readonly users	2025-07-16 14:41:23 -04:00
henrygd	f577476c81	clear systems from memory on logout (#970 )	2025-07-16 14:39:15 -04:00
henrygd	49ae424698	refactor: consolidate fixedFloat funcs + remove trailing zeroes from y axis	2025-07-15 21:46:41 -04:00
henrygd	d4fd19522b	fix races when loading user settings	2025-07-15 21:29:51 -04:00
henrygd	5c047e4afd	Refactor unit preferences and update chart components * Refactor user settings to use enum for unit preferences (temperature, network, disk). * Update chart components to utilize new unit formatting functions * Remove deprecated conversion functions and streamline unit handling across charts. * Enhance settings page to allow user selection of unit preferences with updated labels.	2025-07-15 18:57:37 -04:00
Anish Chanda	6576141f54	Adds display unit preference (#938 ) * Adds temperature unit preference * add unit preferences for networking * adds options for MB/s and bps. * supports disk throughput unit preferences	2025-07-14 14:46:13 -04:00
Sven van Ginkel	926e807020	[Chore] Fix CI labels (#964 )	2025-07-14 14:03:56 -04:00
Sven van Ginkel	d91847c6c5	[Chrore] Improve Issue Templates with Categorization and Label Automation (#939 ) * Update templates * update script * update labels * add PR template * update dropdown	2025-07-13 19:51:29 -04:00
Alexander Mnich	0abd88270c	fix docker edge tag (#959 )	2025-07-13 11:18:25 -04:00