v12.9.2

changelog.md

@@ -1,5 +1,26 @@
 # Changelog
 
+## 2026-04-04 - 12.9.2 - fix(config-ui)
+handle missing HTTP/3 config safely and standardize overview section headings
+
+- Prevents route augmentation logic from failing when HTTP/3 configuration is undefined by using optional chaining.
+- Updates the operations overview to use dees-heading components for activity, email, DNS, RADIUS, and VPN section headings.
+- Bumps @push.rocks/smartproxy from ^27.2.0 to ^27.3.1.
+
+## 2026-04-04 - 12.9.1 - fix(monitoring)
+update SmartProxy and use direct connection protocol metrics access
+
+- bump @push.rocks/smartproxy from ^27.1.0 to ^27.2.0
+- replace fallback any-based access with direct frontend and backend protocol metric calls in MetricsManager
+
+## 2026-04-04 - 12.9.0 - feat(monitoring)
+add frontend and backend protocol distribution metrics to network stats
+
+- Expose frontend and backend protocol distribution data in monitoring metrics, stats responses, and shared interfaces.
+- Render protocol distribution donut charts in the ops network view using the new stats fields.
+- Preserve existing stored certificate IDs when updating certificate records by domain.
+- Bump @design.estate/dees-catalog to ^3.55.5 for the new chart component support.
+
 ## 2026-04-04 - 12.8.1 - fix(ops-view-routes)
 correct route form dropdown selection handling for security profiles and network targets
 

package.json

@@ -1,7 +1,7 @@
 {
   "name": "@serve.zone/dcrouter",
   "private": false,
-  "version": "12.8.1",
+  "version": "12.9.2",
   "description": "A multifaceted routing service handling mail and SMS delivery functions.",
   "type": "module",
   "exports": {
@@ -35,7 +35,7 @@
     "@api.global/typedserver": "^8.4.6",
     "@api.global/typedsocket": "^4.1.2",
     "@apiclient.xyz/cloudflare": "^7.1.0",
-    "@design.estate/dees-catalog": "^3.55.1",
+    "@design.estate/dees-catalog": "^3.55.5",
     "@design.estate/dees-element": "^2.2.4",
     "@push.rocks/lik": "^6.4.0",
     "@push.rocks/projectinfo": "^5.1.0",
@@ -53,7 +53,7 @@
     "@push.rocks/smartnetwork": "^4.5.2",
     "@push.rocks/smartpath": "^6.0.0",
     "@push.rocks/smartpromise": "^4.2.3",
-    "@push.rocks/smartproxy": "^27.1.0",
+    "@push.rocks/smartproxy": "^27.3.1",
     "@push.rocks/smartradius": "^1.1.1",
     "@push.rocks/smartrequest": "^5.0.1",
     "@push.rocks/smartrx": "^3.0.10",

pnpm-lock.yaml

@@ -24,8 +24,8 @@ importers:
         specifier: ^7.1.0
         version: 7.1.0
       '@design.estate/dees-catalog':
-        specifier: ^3.55.1
-        version: 3.55.1(@tiptap/pm@2.27.2)
+        specifier: ^3.55.5
+        version: 3.55.5(@tiptap/pm@2.27.2)
       '@design.estate/dees-element':
         specifier: ^2.2.4
         version: 2.2.4
@@ -78,8 +78,8 @@ importers:
         specifier: ^4.2.3
         version: 4.2.3
       '@push.rocks/smartproxy':
-        specifier: ^27.1.0
-        version: 27.1.0
+        specifier: ^27.3.1
+        version: 27.3.1
       '@push.rocks/smartradius':
         specifier: ^1.1.1
         version: 1.1.1
@@ -350,8 +350,8 @@ packages:
   '@configvault.io/interfaces@1.0.17':
     resolution: {integrity: sha512-bEcCUR2VBDJsTin8HQh8Uw/mlYl2v8A3jMIaQ+MTB9Hrqd6CZL2dL7iJdWyFl/3EIX+LDxWFR+Oq7liIq7w+1Q==}
 
-  '@design.estate/dees-catalog@3.55.1':
-    resolution: {integrity: sha512-UXBC68Dg+L2cGJynvrXyaJATlSLnmiA5SMrE1SWVcp2H1niXqHph6KVi9+E52YSLoEmsCS23cf+XjUjoRNgZTw==}
+  '@design.estate/dees-catalog@3.55.5':
+    resolution: {integrity: sha512-NAMUkTVqdZZmwI/g1xKOxOYM9QUd9FHODh6MYkP6LhLjD0NOGh3bITCnNN9Z3x8/mI7vQQOlSe9tyTtxCP1itQ==}
 
   '@design.estate/dees-comms@1.0.30':
     resolution: {integrity: sha512-KchMlklJfKAjQiJiR0xmofXtQ27VgZtBIxcMwPE9d+h3jJRv+lPZxzBQVOM0eyM0uS44S5vJMZ11IeV4uDXSHg==}
@@ -1279,8 +1279,8 @@ packages:
   '@push.rocks/smartpromise@4.2.3':
     resolution: {integrity: sha512-Ycg/TJR+tMt+S3wSFurOpEoW6nXv12QBtKXgBcjMZ4RsdO28geN46U09osPn9N9WuwQy1PkmTV5J/V4F9U8qEw==}
 
-  '@push.rocks/smartproxy@27.1.0':
-    resolution: {integrity: sha512-uMtmbT6/9Y+lOnSi4w6SRICWJr9q9bHsYAq6xMLmym3zvnEzEwJWF6sw4Jb/uEFEjI2/e4irNSQ9Ba74DhFRlg==}
+  '@push.rocks/smartproxy@27.3.1':
+    resolution: {integrity: sha512-h5RK0WJFCwbv/Mq2euIyUCIqaC/aI5S/hM0TNxlFhT4tAQomBQ7Ufs+10R9wAXbjb9O/7zkqVjLxXhmE/3v9TA==}
 
   '@push.rocks/smartpuppeteer@2.0.5':
     resolution: {integrity: sha512-yK/qSeWVHIGWRp3c8S5tfdGP6WCKllZC4DR8d8CQlEjszOSBmHtlTdyyqOMBZ/BA4kd+eU5f3A1r4K2tGYty1g==}
@@ -2516,6 +2516,9 @@ packages:
   ecdsa-sig-formatter@1.0.11:
     resolution: {integrity: sha512-nagl3RYrbNv6kQkeJIpt6NJZy8twLB/2vtz6yN9Z4vRKHN4/QZJIEbqohALSgwKdnksuY3k5Addp5lg8sVoVcQ==}
 
+  echarts@5.6.0:
+    resolution: {integrity: sha512-oTbVTsXfKuEhxftHqL5xprgLoc0k7uScAwtryCgWF6hPYFLRwOUHiFmHGCBKP5NPFNkDVopOieyUqYGH8Fa3kA==}
+
   emoji-regex@8.0.0:
     resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
 
@@ -2866,8 +2869,8 @@ packages:
   humanize-ms@1.2.1:
     resolution: {integrity: sha1-xG4xWaKT9riW2ikxbYtv6Lt5u+0=}
 
-  ibantools@4.5.1:
-    resolution: {integrity: sha512-DfKQpLlFq9yEUIEnFuCJzss3XavD7iHZTU5PyqXiAJ+rmaMp+NFP3hboumHKuK8nZjuOJg93WemTzcQ5b9jOZA==}
+  ibantools@4.5.2:
+    resolution: {integrity: sha512-is+8TgZcKS/AMv/z9nW1zz0bhjhoyjpA1p0nc3A6GkW/InOdcQiUZpkufADzh/aO/LY/TOD/P3oPWncNRn5QMA==}
 
   iconv-lite@0.4.24:
     resolution: {integrity: sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==}
@@ -3300,6 +3303,10 @@ packages:
     resolution: {integrity: sha512-oRjTw/97aTBN0RHbYCdtF1MQfvusSIBQM0IZEgzl6426+8jSC0nF1a/GmnVLpfB9yyr6g6FTqWqiZVbxrtaCIg==}
     engines: {node: 18 || 20 || >=22}
 
+  minimatch@10.2.5:
+    resolution: {integrity: sha512-MULkVLfKGYDFYejP07QOurDLLQpcjk7Fw+7jXS2R2czRQzR56yHRveU5NDJEOviH+hETZKSkIk5c+T23GjFUMg==}
+    engines: {node: 18 || 20 || >=22}
+
   minimatch@3.1.5:
     resolution: {integrity: sha512-VgjWUsnnT6n+NUk6eZq77zeFdpW2LWDzP6zFGrCbHXiYNul5Dzqk2HHQ5uFH2DNW5Xbp8+jVzaeNt94ssEEl4w==}
 
@@ -4068,6 +4075,9 @@ packages:
   tslib@1.14.1:
     resolution: {integrity: sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==}
 
+  tslib@2.3.0:
+    resolution: {integrity: sha512-N82ooyxVNm6h1riLCoyS9e3fuJ3AMG2zIZs2Gd1ATcSFjSA23Q0fzjjZeh0jbJvWVDZ0cJT8yaNNaaXHzueNjg==}
+
   tslib@2.8.1:
     resolution: {integrity: sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==}
 
@@ -4315,6 +4325,9 @@ packages:
   zod@3.25.76:
     resolution: {integrity: sha512-gzUt/qt81nXsFGKIFcC3YnfEAx5NkunCfnDlvuBSSFS02bcXu4Lmea0AFIUwbLWxWPx3d9p8S5QoaujKcNQxcQ==}
 
+  zrender@5.6.1:
+    resolution: {integrity: sha512-OFXkDJKcrlx5su2XbzJvj/34Q3m6PvyCZkVPHGYpcCJ52ek4U/ymZyfuV1nKE23AyBJ51E/6Yr0mhZ7xGTO4ag==}
+
   zwitch@2.0.4:
     resolution: {integrity: sha512-bXE4cR/kVZhKZX/RjPEflHaKVhUVl85noU3v6b8apfQEc1x4A+zBxjZ4lN8LqGd6WZ3dl98pY4o717VFmoPp+A==}
 
@@ -4342,7 +4355,7 @@ snapshots:
       '@api.global/typedrequest-interfaces': 3.0.19
       '@api.global/typedsocket': 4.1.2(@push.rocks/smartserve@2.0.3)
       '@cloudflare/workers-types': 4.20260317.1
-      '@design.estate/dees-catalog': 3.55.1(@tiptap/pm@2.27.2)
+      '@design.estate/dees-catalog': 3.55.5(@tiptap/pm@2.27.2)
       '@design.estate/dees-comms': 1.0.30
       '@push.rocks/lik': 6.4.0
       '@push.rocks/smartdelay': 3.0.5
@@ -4871,7 +4884,7 @@ snapshots:
     dependencies:
       '@api.global/typedrequest-interfaces': 3.0.19
 
-  '@design.estate/dees-catalog@3.55.1(@tiptap/pm@2.27.2)':
+  '@design.estate/dees-catalog@3.55.5(@tiptap/pm@2.27.2)':
     dependencies:
       '@design.estate/dees-domtools': 2.5.4
       '@design.estate/dees-element': 2.2.4
@@ -4891,8 +4904,9 @@ snapshots:
       '@tiptap/extension-underline': 2.27.2(@tiptap/core@2.27.2(@tiptap/pm@2.27.2))
       '@tiptap/starter-kit': 2.27.2
       '@tsclass/tsclass': 9.5.0
+      echarts: 5.6.0
       highlight.js: 11.11.1
-      ibantools: 4.5.1
+      ibantools: 4.5.2
       lightweight-charts: 5.1.0
       lucide: 0.577.0
       monaco-editor: 0.55.1
@@ -6508,14 +6522,14 @@ snapshots:
 
   '@push.rocks/smartpromise@4.2.3': {}
 
-  '@push.rocks/smartproxy@27.1.0':
+  '@push.rocks/smartproxy@27.3.1':
     dependencies:
       '@push.rocks/smartcrypto': 2.0.4
       '@push.rocks/smartlog': 3.2.1
-      '@push.rocks/smartnftables': 1.0.1
+      '@push.rocks/smartnftables': 1.1.0
       '@push.rocks/smartrust': 1.3.2
       '@tsclass/tsclass': 9.5.0
-      minimatch: 10.2.4
+      minimatch: 10.2.5
 
   '@push.rocks/smartpuppeteer@2.0.5(typescript@6.0.2)':
     dependencies:
@@ -6909,7 +6923,7 @@ snapshots:
 
   '@serve.zone/catalog@2.11.0(@tiptap/pm@2.27.2)':
     dependencies:
-      '@design.estate/dees-catalog': 3.55.1(@tiptap/pm@2.27.2)
+      '@design.estate/dees-catalog': 3.55.5(@tiptap/pm@2.27.2)
       '@design.estate/dees-domtools': 2.5.4
       '@design.estate/dees-element': 2.2.4
       '@design.estate/dees-wcctools': 3.8.0
@@ -7978,6 +7992,11 @@ snapshots:
     dependencies:
       safe-buffer: 5.2.1
 
+  echarts@5.6.0:
+    dependencies:
+      tslib: 2.3.0
+      zrender: 5.6.1
+
   emoji-regex@8.0.0: {}
 
   encoding-japanese@2.2.0: {}
@@ -8410,7 +8429,7 @@ snapshots:
     dependencies:
       ms: 2.1.3
 
-  ibantools@4.5.1: {}
+  ibantools@4.5.2: {}
 
   iconv-lite@0.4.24:
     dependencies:
@@ -9048,6 +9067,10 @@ snapshots:
     dependencies:
       brace-expansion: 5.0.5
 
+  minimatch@10.2.5:
+    dependencies:
+      brace-expansion: 5.0.5
+
   minimatch@3.1.5:
     dependencies:
       brace-expansion: 1.1.13
@@ -9942,6 +9965,8 @@ snapshots:
 
   tslib@1.14.1: {}
 
+  tslib@2.3.0: {}
+
   tslib@2.8.1: {}
 
   tsx@4.21.0:
@@ -10169,4 +10194,8 @@ snapshots:
 
   zod@3.25.76: {}
 
+  zrender@5.6.1:
+    dependencies:
+      tslib: 2.3.0
+
   zwitch@2.0.4: {}

ts/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '12.8.1',
+  version: '12.9.2',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

ts/classes.storage-cert-manager.ts

@@ -29,9 +29,9 @@ export class StorageBackedCertManager implements plugins.smartacme.ICertManager
     let doc = await AcmeCertDoc.findByDomain(cert.domainName);
     if (!doc) {
       doc = new AcmeCertDoc();
+      doc.id = cert.id;
       doc.domainName = cert.domainName;
     }
-    doc.id = cert.id;
     doc.created = cert.created;
     doc.privateKey = cert.privateKey;
     doc.publicKey = cert.publicKey;

ts/config/classes.route-config-manager.ts

@@ -386,7 +386,7 @@ export class RouteConfigManager {
     for (const stored of this.storedRoutes.values()) {
       if (stored.enabled) {
         let route = stored.route;
-        if (http3Config && http3Config.enabled !== false) {
+        if (http3Config?.enabled !== false) {
           route = augmentRouteWithHttp3(route, { enabled: true, ...http3Config });
         }
         enabledRoutes.push(injectVpn(route));

ts/monitoring/classes.metricsmanager.ts

@@ -591,6 +591,10 @@ export class MetricsManager {
       const requestsPerSecond = proxyMetrics.requests.perSecond();
       const requestsTotal = proxyMetrics.requests.total();
 
+      // Get frontend/backend protocol distribution
+      const frontendProtocols = proxyMetrics.connections.frontendProtocols() ?? null;
+      const backendProtocols = proxyMetrics.connections.backendProtocols() ?? null;
+
       // Collect backend protocol data
       const backendMetrics = proxyMetrics.backends.byBackend();
       const protocolCache = proxyMetrics.backends.detectedProtocols();
@@ -705,6 +709,8 @@ export class MetricsManager {
         requestsPerSecond,
         requestsTotal,
         backends,
+        frontendProtocols,
+        backendProtocols,
       };
     }, 1000); // 1s cache — matches typical dashboard poll interval
   }

ts/opsserver/handlers/stats.handler.ts

@@ -311,6 +311,8 @@ export class StatsHandler {
                   requestsPerSecond: stats.requestsPerSecond || 0,
                   requestsTotal: stats.requestsTotal || 0,
                   backends: stats.backends || [],
+                  frontendProtocols: stats.frontendProtocols || null,
+                  backendProtocols: stats.backendProtocols || null,
                 };
               })()
             );

ts_interfaces/data/stats.ts

@@ -166,6 +166,21 @@ export interface INetworkMetrics {
   requestsPerSecond?: number;
   requestsTotal?: number;
   backends?: IBackendInfo[];
+  frontendProtocols?: IProtocolDistribution | null;
+  backendProtocols?: IProtocolDistribution | null;
+}
+
+export interface IProtocolDistribution {
+  h1Active: number;
+  h1Total: number;
+  h2Active: number;
+  h2Total: number;
+  h3Active: number;
+  h3Total: number;
+  wsActive: number;
+  wsTotal: number;
+  otherActive: number;
+  otherTotal: number;
 }
 
 export interface IConnectionDetails {

ts_web/00_commitinfo_data.ts

@@ -3,6 +3,6 @@
  */
 export const commitinfo = {
   name: '@serve.zone/dcrouter',
-  version: '12.8.1',
+  version: '12.9.2',
   description: 'A multifaceted routing service handling mail and SMS delivery functions.'
 }

ts_web/appstate.ts

@@ -56,6 +56,8 @@ export interface INetworkState {
   requestsPerSecond: number;
   requestsTotal: number;
   backends: interfaces.data.IBackendInfo[];
+  frontendProtocols: interfaces.data.IProtocolDistribution | null;
+  backendProtocols: interfaces.data.IProtocolDistribution | null;
   lastUpdated: number;
   isLoading: boolean;
   error: string | null;
@@ -154,6 +156,8 @@ export const networkStatePart = await appState.getStatePart<INetworkState>(
     requestsPerSecond: 0,
     requestsTotal: 0,
     backends: [],
+    frontendProtocols: null,
+    backendProtocols: null,
     lastUpdated: 0,
     isLoading: false,
     error: null,
@@ -523,6 +527,8 @@ export const fetchNetworkStatsAction = networkStatePart.createAction(async (stat
       requestsPerSecond: networkStatsResponse.requestsPerSecond || 0,
       requestsTotal: networkStatsResponse.requestsTotal || 0,
       backends: networkStatsResponse.backends || [],
+      frontendProtocols: networkStatsResponse.frontendProtocols || null,
+      backendProtocols: networkStatsResponse.backendProtocols || null,
       lastUpdated: Date.now(),
       isLoading: false,
       error: null,
@@ -1845,6 +1851,8 @@ async function dispatchCombinedRefreshActionInner() {
           requestsPerSecond: network.requestsPerSecond || 0,
           requestsTotal: network.requestsTotal || 0,
           backends: network.backends || [],
+          frontendProtocols: network.frontendProtocols || null,
+          backendProtocols: network.backendProtocols || null,
           lastUpdated: Date.now(),
           isLoading: false,
           error: null,
@@ -1866,6 +1874,8 @@ async function dispatchCombinedRefreshActionInner() {
           requestsPerSecond: network.requestsPerSecond || 0,
           requestsTotal: network.requestsTotal || 0,
           backends: network.backends || [],
+          frontendProtocols: network.frontendProtocols || null,
+          backendProtocols: network.backendProtocols || null,
           lastUpdated: Date.now(),
           isLoading: false,
           error: null,

ts_web/elements/ops-view-network.ts

@@ -274,6 +274,12 @@ export class OpsViewNetwork extends DeesElement {
         background: ${cssManager.bdTheme('#fff3e0', '#3a2a1a')};
         color: ${cssManager.bdTheme('#f57c00', '#ff9933')};
       }
+
+      .protocolChartGrid {
+        display: grid;
+        grid-template-columns: repeat(2, 1fr);
+        gap: 16px;
+      }
     `,
   ];
 
@@ -305,6 +311,9 @@ export class OpsViewNetwork extends DeesElement {
           .yAxisFormatter=${(val: number) => `${val} Mbit/s`}
         ></dees-chart-area>
 
+        <!-- Protocol Distribution Charts -->
+        ${this.renderProtocolCharts()}
+
         <!-- Top IPs Section -->
         ${this.renderTopIPs()}
 
@@ -527,7 +536,54 @@ export class OpsViewNetwork extends DeesElement {
     `;
   }
 
-  
+  private renderProtocolCharts(): TemplateResult {
+    const fp = this.networkState.frontendProtocols;
+    const bp = this.networkState.backendProtocols;
+
+    const protoColors: Record<string, string> = {
+      'HTTP/1.1': '#1976d2',
+      'HTTP/2': '#388e3c',
+      'HTTP/3': '#7b1fa2',
+      'WebSocket': '#f57c00',
+      'Other': '#757575',
+    };
+
+    const buildDonutData = (dist: interfaces.data.IProtocolDistribution | null) => {
+      if (!dist) return [];
+      const items: Array<{ name: string; value: number; color: string }> = [];
+      if (dist.h1Active > 0) items.push({ name: 'HTTP/1.1', value: dist.h1Active, color: protoColors['HTTP/1.1'] });
+      if (dist.h2Active > 0) items.push({ name: 'HTTP/2', value: dist.h2Active, color: protoColors['HTTP/2'] });
+      if (dist.h3Active > 0) items.push({ name: 'HTTP/3', value: dist.h3Active, color: protoColors['HTTP/3'] });
+      if (dist.wsActive > 0) items.push({ name: 'WebSocket', value: dist.wsActive, color: protoColors['WebSocket'] });
+      if (dist.otherActive > 0) items.push({ name: 'Other', value: dist.otherActive, color: protoColors['Other'] });
+      return items;
+    };
+
+    const frontendData = buildDonutData(fp);
+    const backendData = buildDonutData(bp);
+
+    return html`
+      <div class="protocolChartGrid">
+        <dees-chart-donut
+          .label=${'Frontend Protocols'}
+          .data=${frontendData.length > 0 ? frontendData : [{ name: 'No Traffic', value: 1, color: '#757575' }]}
+          .showLegend=${true}
+          .showLabels=${true}
+          .innerRadiusPercent=${'55%'}
+          .valueFormatter=${(val: number) => `${val} active`}
+        ></dees-chart-donut>
+        <dees-chart-donut
+          .label=${'Backend Protocols'}
+          .data=${backendData.length > 0 ? backendData : [{ name: 'No Traffic', value: 1, color: '#757575' }]}
+          .showLegend=${true}
+          .showLabels=${true}
+          .innerRadiusPercent=${'55%'}
+          .valueFormatter=${(val: number) => `${val} active`}
+        ></dees-chart-donut>
+      </div>
+    `;
+  }
+
   private renderTopIPs(): TemplateResult {
     if (this.networkState.topIPs.length === 0) {
       return html``;

ts_web/elements/ops-view-overview.ts

@@ -64,13 +64,6 @@ export class OpsViewOverview extends DeesElement {
     cssManager.defaultStyles,
     shared.viewHostCss,
     css`
-      h2 {
-        margin: 32px 0 16px 0;
-        font-size: 24px;
-        font-weight: 600;
-        color: ${cssManager.bdTheme('#333', '#ccc')};
-      }
-
       .chartGrid {
         display: grid;
         grid-template-columns: repeat(2, 1fr);
@@ -123,6 +116,7 @@ export class OpsViewOverview extends DeesElement {
 
         ${this.renderVpnStats()}
 
+        <dees-heading level="hr">Activity Charts</dees-heading>
         <div class="chartGrid">
           <dees-chart-area
             .label=${'Email Traffic (24h)'}
@@ -330,7 +324,7 @@ export class OpsViewOverview extends DeesElement {
     ];
 
     return html`
-      <h2>Email Statistics</h2>
+      <dees-heading level="hr">Email Statistics</dees-heading>
       <dees-statsgrid .tiles=${tiles}></dees-statsgrid>
     `;
   }
@@ -379,7 +373,7 @@ export class OpsViewOverview extends DeesElement {
     ];
 
     return html`
-      <h2>DNS Statistics</h2>
+      <dees-heading level="hr">DNS Statistics</dees-heading>
       <dees-statsgrid .tiles=${tiles}></dees-statsgrid>
     `;
   }
@@ -430,7 +424,7 @@ export class OpsViewOverview extends DeesElement {
     ];
 
     return html`
-      <h2>RADIUS Statistics</h2>
+      <dees-heading level="hr">RADIUS Statistics</dees-heading>
       <dees-statsgrid .tiles=${tiles}></dees-statsgrid>
     `;
   }
@@ -470,7 +464,7 @@ export class OpsViewOverview extends DeesElement {
     ];
 
     return html`
-      <h2>VPN Statistics</h2>
+      <dees-heading level="hr">VPN Statistics</dees-heading>
       <dees-statsgrid .tiles=${tiles}></dees-statsgrid>
     `;
   }