Alert on genuinely new (never-seen-before) devices

New seen_macs table: permanent, insert-only, MAC-keyed record of the
first time each device was ever seen -- deliberately decoupled from
devices.first_seen (IP-keyed, would false-positive on every DHCP
lease change). Bootstrap-safe: first call seeds the baseline from
whatever's currently on the network without alerting on all 71+
existing devices at once. Verified locally: bootstrap call reports
nothing new, repeat calls with the same MACs report nothing new, one
genuinely new MAC gets reported exactly once.

Pushes a Home Assistant persistent_notification when a new MAC
appears (gated behind HOME_ASSISTANT_TOKEN + homeAssistant.url in
hosts.yaml -- missing config just means no push, detection still
runs). Also surfaced directly in the dashboard as a blue "new" badge
for anything first seen in the last 24h, independent of HA config.

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

apps/web/src/api.ts

@@ -60,6 +60,9 @@ export interface Device {
   known: boolean;
   vendor: string | null;
   mdnsHostname: string | null;
+  // True if this MAC (not IP -- survives DHCP lease changes) was first ever
+  // seen within the last 24h.
+  isNew: boolean;
   firstSeen: string;
   lastSeen: string;
 }

apps/web/src/components/DeviceTable.tsx

@@ -247,6 +247,11 @@ export function DeviceTable({
                   <span className={`device-badge ${d.known ? "known" : "unknown"}`}>
                     {d.known ? "known" : "unknown"}
                   </span>
+                  {d.isNew && (
+                    <span className="device-badge new" title="First seen on this network within the last 24h">
+                      new
+                    </span>
+                  )}
                 </td>
                 <td>{d.ip}</td>
                 <td className="mono">{d.mac}</td>

apps/web/src/index.css

@@ -353,6 +353,12 @@ body {
   color: #f5a623;
 }
 
+.device-badge.new {
+  background: #1a3a4d;
+  color: #58a6ff;
+  margin-left: 0.3rem;
+}
+
 .sparkline {
   width: 100%;
   height: 24px;