diff --git a/packages/bruno-app/src/components/StopWatch/index.js b/packages/bruno-app/src/components/StopWatch/index.js index e2b069532..debba9cd8 100644 --- a/packages/bruno-app/src/components/StopWatch/index.js +++ b/packages/bruno-app/src/components/StopWatch/index.js @@ -1,25 +1,23 @@ import React, { useState, useEffect } from 'react'; -const StopWatch = ({ requestTimestamp }) => { +const StopWatch = () => { const [milliseconds, setMilliseconds] = useState(0); - const tickInterval = 200; + const tickInterval = 100; const tick = () => { - setMilliseconds(milliseconds + tickInterval); + setMilliseconds(_milliseconds => _milliseconds + tickInterval); }; useEffect(() => { - let timerID = setInterval(() => tick(), tickInterval); + let timerID = setInterval(() => { + tick() + }, tickInterval); return () => { - clearInterval(timerID); + clearTimeout(timerID); }; - }); + }, []); - useEffect(() => { - setMilliseconds(Date.now() - requestTimestamp); - }, [requestTimestamp]); - - if (milliseconds < 1000) { + if (milliseconds < 250) { return 'Loading...'; } @@ -27,4 +25,4 @@ const StopWatch = ({ requestTimestamp }) => { return {seconds.toFixed(1)}s; }; -export default StopWatch; +export default React.memo(StopWatch);