/** @format */ import React, { useEffect, useState } from 'react'; import { intervalToDuration } from 'date-fns'; const TimerUi = ({ reason, time }) => { const boxDialer = window.BoxDialer; const [dndTimer, setDndTimer] = useState(time); useEffect(() => { if (reason !== 'free') { var intervalId = setInterval(() => { setDndTimer((prevCount) => prevCount + 1); }, 1000); return () => clearInterval(intervalId); } }, [reason]); console.log('inset_timer', { reason, time }); useEffect(() => { setDndTimer(time); }, [reason]); const dataFormatter = (secund) => { let ts = intervalToDuration({ start: 0, end: secund * 1000, }); return secund > 3599 ? `${ts.hours}:${ts.minutes}:${ts.seconds}` : `${ts.minutes}:${ts.seconds}`; }; if (reason === 'free') { return <></>; } return ( <span> {boxDialer?.timer.type !== 'free' && ( <span>{dataFormatter(dndTimer)}</span> )} </span> ); }; export default TimerUi;