Machine details: live-update 'Última atualização' every second
This commit is contained in:
parent
3a752b88c6
commit
01461d031b
1 changed files with 13 additions and 2 deletions
|
|
@ -993,6 +993,17 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
|
|||
const metadata = machine?.inventory ?? null
|
||||
const metrics = machine?.metrics ?? null
|
||||
const metricsCapturedAt = useMemo(() => getMetricsTimestamp(metrics), [metrics])
|
||||
// Live refresh the relative time label every second when we have a capture timestamp
|
||||
const [relativeTick, setRelativeTick] = useState(0)
|
||||
useEffect(() => {
|
||||
if (!metricsCapturedAt) return
|
||||
const id = setInterval(() => setRelativeTick((t) => t + 1), 1000)
|
||||
return () => clearInterval(id)
|
||||
}, [metricsCapturedAt])
|
||||
const lastUpdateRelative = useMemo(
|
||||
() => (metricsCapturedAt ? formatRelativeTime(metricsCapturedAt) : null),
|
||||
[metricsCapturedAt, relativeTick]
|
||||
)
|
||||
const hardware = metadata?.hardware
|
||||
const network = metadata?.network ?? null
|
||||
const networkInterfaces = Array.isArray(network) ? network : null
|
||||
|
|
@ -1547,9 +1558,9 @@ export function MachineDetails({ machine }: MachineDetailsProps) {
|
|||
<section className="space-y-2">
|
||||
<div className="flex flex-wrap items-center gap-2">
|
||||
<h4 className="text-sm font-semibold">Métricas recentes</h4>
|
||||
{metricsCapturedAt ? (
|
||||
{lastUpdateRelative ? (
|
||||
<span className="text-xs font-medium text-muted-foreground">
|
||||
Última atualização {formatRelativeTime(metricsCapturedAt)}
|
||||
Última atualização {lastUpdateRelative}
|
||||
</span>
|
||||
) : null}
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue