From f871afd548ef6c45e1ee3fdeec033b76ce53f124 Mon Sep 17 00:00:00 2001 From: Josh Date: Wed, 30 Jun 2021 17:47:54 -0700 Subject: [PATCH] fix: prevent negative count up period on tps card (#18344) --- explorer/src/components/TpsCard.tsx | 10 ++++++++-- 1 file changed, 8 insertions(+), 2 deletions(-) diff --git a/explorer/src/components/TpsCard.tsx b/explorer/src/components/TpsCard.tsx index 617481ad0..221aa326d 100644 --- a/explorer/src/components/TpsCard.tsx +++ b/explorer/src/components/TpsCard.tsx @@ -230,8 +230,14 @@ function AnimatedTransactionCount({ info }: { info: PerformanceInfo }) { // and start from there. const elapsed = Date.now() - countUp.lastUpdate; const elapsedPeriods = elapsed / (PERF_UPDATE_SEC * 1000); - countUp.start = countUp.start + elapsedPeriods * countUp.period; - countUp.period = txCount - countUp.start; + countUp.start = Math.floor( + countUp.start + elapsedPeriods * countUp.period + ); + + // if counter gets ahead of actual count, just hold for a bit + // until txCount catches up (this will sometimes happen when a tab is + // sent to the background and/or connection drops) + countUp.period = Math.max(txCount - countUp.start, 1); } else { // Since this is the first tx count value, estimate the previous // tx count in order to have a starting point for our animation