feat: show inventory timestamps on Device Inventory tiles
Surface the same lifecycle timestamps on the Device Inventory cards as on the
detail panel. Tiles for devices placed on a canvas show their linked node's
created / last scan / last modified / last seen (correlated by ip or
ieee_address, aggregated across matches: created = oldest, others = newest).
Devices not yet on any canvas fall back to their discovered_at.
Rendered as compact relative times ("2d ago") with the full date on hover, in
a tight two-column footer so the tile keeps its original footprint.
Backend: PendingDeviceResponse gains node_created_at / node_last_scan /
node_last_modified / node_last_seen; the canvas correlation now also pulls node
timestamps in the same single query. Frontend: shared timeFormat util
(absolute + relative), reused by the detail panel.
ha-relevant: maybe
This commit is contained in:
@@ -0,0 +1,36 @@
|
||||
// Shared timestamp formatting. Backend timestamps may arrive without a timezone
|
||||
// suffix (naive UTC); append 'Z' when absent so the browser parses them as UTC
|
||||
// rather than local time.
|
||||
|
||||
function toUtcIso(value: string): string {
|
||||
return /[Zz]|[+-]\d{2}:?\d{2}$/.test(value) ? value : value + 'Z'
|
||||
}
|
||||
|
||||
/** Full locale date+time, e.g. for tooltips and the detail panel. */
|
||||
export function formatTimestamp(value: string): string {
|
||||
return new Date(toUtcIso(value)).toLocaleString()
|
||||
}
|
||||
|
||||
/**
|
||||
* Compact relative time, e.g. "just now", "5m ago", "3h ago", "2d ago",
|
||||
* "4w ago", "5mo ago", "2y ago". Future timestamps clamp to "just now".
|
||||
* `now` is injectable for deterministic tests.
|
||||
*/
|
||||
export function formatRelative(value: string, now: number = Date.now()): string {
|
||||
const then = new Date(toUtcIso(value)).getTime()
|
||||
if (Number.isNaN(then)) return ''
|
||||
const sec = Math.floor((now - then) / 1000)
|
||||
if (sec < 60) return 'just now'
|
||||
const min = Math.floor(sec / 60)
|
||||
if (min < 60) return `${min}m ago`
|
||||
const hr = Math.floor(min / 60)
|
||||
if (hr < 24) return `${hr}h ago`
|
||||
const day = Math.floor(hr / 24)
|
||||
if (day < 7) return `${day}d ago`
|
||||
const week = Math.floor(day / 7)
|
||||
if (week < 5) return `${week}w ago`
|
||||
const month = Math.floor(day / 30)
|
||||
if (month < 12) return `${month}mo ago`
|
||||
const year = Math.floor(day / 365)
|
||||
return `${year}y ago`
|
||||
}
|
||||
Reference in New Issue
Block a user