Fix field name mismatches, add events filter, in-place suppression refresh

- links.html: fix all field name bugs (auto_negotiation→autoneg, full_duplex,
  tx/rx_errors/drops_per_sec→_rate, tx/rx_bytes_per_sec→_rate, poe_total_w/poe_max_w
  computed from ports, renderUnifiSwitches uses top-level updated timestamp)
- suppressions.html: in-place DOM refresh after create/remove (no page reload),
  datalist autocomplete for target names, form reset after submit
- inspector.html: ESC key closes detail panel via lt.keys.on
- index.html: events filter bar with search input + severity pills (All/Critical/Warning),
  MutationObserver re-applies filter after dynamic updates
- style.css: g-section-actions, events-filter-bar, sev-pills layout
- app.js/db.py/monitor.py: carry forward prior session fixes (Promise.allSettled,
  daemon_ok, stale connection handling, double Prometheus call, self.cfg fix)

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

templates/links.html

@@ -108,9 +108,9 @@ function voltageClass(v) {
 
 function errorBadges(d) {
   const badges = [];
-  if ((d.tx_errors_per_sec || 0) > 0 || (d.rx_errors_per_sec || 0) > 0)
+  if ((d.tx_errs_rate || 0) > 0.001 || (d.rx_errs_rate || 0) > 0.001)
     badges.push('<span class="link-alert-badge">ERR</span>');
-  if ((d.tx_drops_per_sec || 0) > 0 || (d.rx_drops_per_sec || 0) > 0)
+  if ((d.tx_drops_rate || 0) > 0.001 || (d.rx_drops_rate || 0) > 0.001)
     badges.push('<span class="link-alert-badge link-alert-amber">DROP</span>');
   if ((d.carrier_changes || 0) > 3)
     badges.push('<span class="link-alert-badge link-alert-amber">FLAP</span>');
@@ -119,14 +119,15 @@ function errorBadges(d) {
 
 // ── Render a single server interface card ─────────────────────────
 function renderIfaceCard(ifaceName, d) {
-  const isDown   = d.link_detected === false || d.admin_status === 'down';
-  const mediaTag = d.media_type === 'fibre' ? 'type-fibre'
-                 : d.media_type === 'da'    ? 'type-da'
+  const isDown   = d.link_detected === false;
+  const pt       = (d.port_type || '').toUpperCase();
+  const mediaTag = pt === 'FIBRE' || pt === 'SFP' || pt.includes('FIBRE') ? 'type-fibre'
+                 : pt === 'DA' ? 'type-da'
                  : 'type-copper';
-  const mediaLabel = d.media_type || '–';
+  const mediaLabel = d.port_type || '–';
   const speedStr   = d.speed_mbps ? fmtSpeed(d.speed_mbps) : '–';
-  const txPct      = fmtRateBar(d.tx_bytes_per_sec, d.speed_mbps);
-  const rxPct      = fmtRateBar(d.rx_bytes_per_sec, d.speed_mbps);
+  const txPct      = fmtRateBar(d.tx_bytes_rate, d.speed_mbps);
+  const rxPct      = fmtRateBar(d.rx_bytes_rate, d.speed_mbps);
 
   let sfpHtml = '';
   if (d.sfp && Object.keys(d.sfp).length > 0) {
@@ -142,7 +143,7 @@ function renderIfaceCard(ifaceName, d) {
       <div class="sfp-panel">
         <div class="sfp-vendor-row">
           ${s.vendor ? `<span>${escHtml(s.vendor)}</span>` : ''}
-          ${s.part_number ? ` / <span>${escHtml(s.part_number)}</span>` : ''}
+          ${s.part_no ? ` / <span>${escHtml(s.part_no)}</span>` : ''}
         </div>
         <div class="sfp-grid">
           <div class="sfp-stat">
@@ -199,7 +200,7 @@ function renderIfaceCard(ifaceName, d) {
         </div>
         <div class="link-stat">
           <span class="link-stat-label">Auto-neg</span>
-          <span class="link-stat-value">${d.auto_negotiation == null ? '–' : d.auto_negotiation ? 'On' : 'Off'}</span>
+          <span class="link-stat-value">${d.auto_neg == null ? '–' : d.auto_neg ? 'On' : 'Off'}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">Carrier Δ</span>
@@ -207,31 +208,31 @@ function renderIfaceCard(ifaceName, d) {
         </div>
         <div class="link-stat">
           <span class="link-stat-label">TX Err/s</span>
-          <span class="link-stat-value">${fmtErrors(d.tx_errors_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.tx_errs_rate)}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">RX Err/s</span>
-          <span class="link-stat-value">${fmtErrors(d.rx_errors_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.rx_errs_rate)}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">TX Drop/s</span>
-          <span class="link-stat-value">${fmtErrors(d.tx_drops_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.tx_drops_rate)}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">RX Drop/s</span>
-          <span class="link-stat-value">${fmtErrors(d.rx_drops_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.rx_drops_rate)}</span>
         </div>
       </div>
       <div class="traffic-section">
         <div class="traffic-row">
           <span class="traffic-label">TX</span>
           <div class="traffic-bar-track"><div class="traffic-bar-fill traffic-tx" style="width:${txPct}%"></div></div>
-          <span class="traffic-value">${fmtRate(d.tx_bytes_per_sec)}</span>
+          <span class="traffic-value">${fmtRate(d.tx_bytes_rate)}</span>
         </div>
         <div class="traffic-row">
           <span class="traffic-label">RX</span>
           <div class="traffic-bar-track"><div class="traffic-bar-fill traffic-rx" style="width:${rxPct}%"></div></div>
-          <span class="traffic-value">${fmtRate(d.rx_bytes_per_sec)}</span>
+          <span class="traffic-value">${fmtRate(d.rx_bytes_rate)}</span>
         </div>
       </div>
       ${sfpHtml}
@@ -242,13 +243,13 @@ function renderIfaceCard(ifaceName, d) {
 function renderPortCard(portName, d) {
   const isDown   = !d.up;
   const speedStr = d.speed_mbps ? fmtSpeed(d.speed_mbps) : '–';
-  const txPct    = fmtRateBar(d.tx_bytes_per_sec, d.speed_mbps);
-  const rxPct    = fmtRateBar(d.rx_bytes_per_sec, d.speed_mbps);
+  const txPct    = fmtRateBar(d.tx_bytes_rate, d.speed_mbps);
+  const rxPct    = fmtRateBar(d.rx_bytes_rate, d.speed_mbps);
   const numBadge = d.port_idx != null ? `<span class="port-badge port-badge-num">#${d.port_idx}</span>` : '';
   const uplinkBadge = d.is_uplink ? `<span class="port-badge port-badge-uplink">UPLINK</span>` : '';
-  const poeBadge    = d.poe_power_w ? `<span class="port-badge port-badge-poe">PoE ${d.poe_power_w.toFixed(1)}W</span>` : '';
+  const poeBadge    = d.poe_power ? `<span class="port-badge port-badge-poe">PoE ${d.poe_power.toFixed(1)}W</span>` : '';
   const lldpLine  = d.lldp ? `<div class="port-lldp">→ ${escHtml(d.lldp.system_name || '')} (${escHtml(d.lldp.port_id || '')})</div>` : '';
-  const poeLine   = d.poe_class ? `<div class="port-poe-info">PoE ${escHtml(d.poe_class)} · max ${d.poe_power_w_max != null ? d.poe_power_w_max.toFixed(1)+'W' : '–'}</div>` : '';
+  const poeLine   = d.poe_class ? `<div class="port-poe-info">PoE ${escHtml(d.poe_class)} · max ${d.poe_max_power != null ? d.poe_max_power.toFixed(1)+'W' : '–'}</div>` : '';
 
   return `
     <div class="link-iface-card ${isDown ? 'port-down' : ''}">
@@ -266,55 +267,60 @@ function renderPortCard(portName, d) {
         </div>
         <div class="link-stat">
           <span class="link-stat-label">Duplex</span>
-          <span class="link-stat-value">${fmtDuplex(d.duplex)}</span>
+          <span class="link-stat-value">${d.full_duplex == null ? '–' : d.full_duplex ? 'Full' : 'Half'}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">Auto-neg</span>
-          <span class="link-stat-value">${d.auto_negotiation == null ? '–' : d.auto_negotiation ? 'On' : 'Off'}</span>
+          <span class="link-stat-value">${d.autoneg == null ? '–' : d.autoneg ? 'On' : 'Off'}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">TX Err/s</span>
-          <span class="link-stat-value">${fmtErrors(d.tx_errors_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.tx_errs_rate)}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">RX Err/s</span>
-          <span class="link-stat-value">${fmtErrors(d.rx_errors_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.rx_errs_rate)}</span>
         </div>
         <div class="link-stat">
           <span class="link-stat-label">TX Drop/s</span>
-          <span class="link-stat-value">${fmtErrors(d.tx_drops_per_sec)}</span>
+          <span class="link-stat-value">${fmtErrors(d.tx_drops_rate)}</span>
         </div>
       </div>
       <div class="traffic-section">
         <div class="traffic-row">
           <span class="traffic-label">TX</span>
           <div class="traffic-bar-track"><div class="traffic-bar-fill traffic-tx" style="width:${txPct}%"></div></div>
-          <span class="traffic-value">${fmtRate(d.tx_bytes_per_sec)}</span>
+          <span class="traffic-value">${fmtRate(d.tx_bytes_rate)}</span>
         </div>
         <div class="traffic-row">
           <span class="traffic-label">RX</span>
           <div class="traffic-bar-track"><div class="traffic-bar-fill traffic-rx" style="width:${rxPct}%"></div></div>
-          <span class="traffic-value">${fmtRate(d.rx_bytes_per_sec)}</span>
+          <span class="traffic-value">${fmtRate(d.rx_bytes_rate)}</span>
         </div>
       </div>
     </div>`;
 }
 
 // ── Render all UniFi switches ─────────────────────────────────────
-function renderUnifiSwitches(unifiSwitches) {
+function renderUnifiSwitches(unifiSwitches, dataUpdated) {
   if (!unifiSwitches || !Object.keys(unifiSwitches).length) return '';
+  const updStr = dataUpdated
+    ? new Date(dataUpdated.replace(' UTC', 'Z').replace(' ', 'T')).toLocaleTimeString()
+    : '';
   const html = Object.entries(unifiSwitches).map(([swName, sw]) => {
     const ports = sw.ports || {};
+    const portValues = Object.values(ports);
     const portCards = Object.entries(ports)
       .sort(([,a],[,b]) => (a.port_idx||0) - (b.port_idx||0))
       .map(([pname, d]) => renderPortCard(pname, d)).join('');
-    const updStr = sw.updated ? new Date(sw.updated + (sw.updated.includes('Z') ? '' : 'Z')).toLocaleTimeString() : '';
-    const poeLoad = sw.poe_total_w != null ? ` · PoE ${sw.poe_total_w.toFixed(1)}W` : '';
+    const poe_total_w = portValues.reduce((s, p) => s + (p.poe_power || 0), 0);
+    const poe_max_w   = portValues.reduce((s, p) => s + (p.poe_max_power || 0), 0);
+    const poeLoad = poe_total_w > 0 ? ` · PoE ${poe_total_w.toFixed(1)}W` : '';
 
     // PoE utilisation bar
     let poebar = '';
-    if (sw.poe_total_w != null && sw.poe_max_w) {
-      const pct = Math.min(100, (sw.poe_total_w / sw.poe_max_w) * 100);
+    if (poe_total_w > 0 && poe_max_w > 0) {
+      const pct = Math.min(100, (poe_total_w / poe_max_w) * 100);
       const cls = pct > 80 ? 'poe-bar-crit' : pct > 60 ? 'poe-bar-warn' : 'poe-bar-ok';
       poebar = `<div class="poe-bar-track"><div class="poe-bar-fill ${cls}" style="width:${pct}%"></div></div>`;
     }
@@ -324,7 +330,7 @@ function renderUnifiSwitches(unifiSwitches) {
         <div class="link-host-title" onclick="togglePanel(this.closest('.link-host-panel'))">
           <span class="link-host-name">${escHtml(swName)}</span>
           <span class="link-host-ip">${escHtml(sw.ip || '')}</span>
-          <span class="link-host-upd">${updStr}${poeLoad}</span>
+          <span class="link-host-upd">${escHtml(sw.model || '')}${updStr ? ' · ' + updStr : ''}${poeLoad}</span>
           ${poebar}
           <span class="panel-toggle">[–]</span>
         </div>
@@ -368,11 +374,13 @@ function buildLinkSummary(hosts, unifiSwitches) {
     for (const d of Object.values(ifaces)) {
       totalIfaces++;
       if (d.link_detected === false) downIfaces++;
-      if ((d.tx_errors_per_sec || 0) > 0 || (d.rx_errors_per_sec || 0) > 0) errIfaces++;
+      if ((d.tx_errs_rate || 0) > 0 || (d.rx_errs_rate || 0) > 0) errIfaces++;
     }
   }
   for (const sw of Object.values(unifiSwitches || {})) {
-    totalPoe += sw.poe_total_w || 0;
+    for (const p of Object.values(sw.ports || {})) {
+      totalPoe += p.poe_power || 0;
+    }
   }
   const hasAlerts = downIfaces > 0 || errIfaces > 0;
   return `
@@ -434,7 +442,7 @@ function renderLinks(data) {
       </div>`);
   }
 
-  parts.push(renderUnifiSwitches(unifiSwitches));
+  parts.push(renderUnifiSwitches(unifiSwitches, data.updated));
   parts.push('</div>');
   document.getElementById('links-container').innerHTML = parts.join('');
   restoreCollapseState();