Как решить проблему с таймером?

Question

[KGZVER]

Есть проблема с таймером сделанный на реакте, из сервера получаю данные, через пропсы отображаю в компоненте, но на странице таймер работает некорректно, через каждую секунду таймер становится null:null:null:null. То есть правильные показатели каждую секунду чередуются с ошибкой. Пробовал получать стейты через Redux, та же проблема.

const [lobby, setLobby] = React.useState('')

React.useEffect(() => {
    fetch(`${ENDOPOINT}/lobby/rates/${id}/`, {
      method: 'GET',
    })
      .then((response) => response.json())
      .then((data) => {
        setLobby(data)
      })
      .catch(() => {
        setError(true)
      })
  }, [isLoading])

return (
    <PageTemplate>
      <div>
          <Timer
            date={lobby.date}
          /> 
        }
      </div>
    </PageTemplate>

const [timerDays, setTimerDays] = useState('00');
    const [timerHours, setTimerHours] = useState('00');
    const [timerMinutes, setTimerMinutes] = useState('00');
    const [timerSeconds, setTimerSeconds] = useState('00');
    
    let interval = useRef();

    const startTimer = () => {
      const  countdownDateTrueFormat = `${props.date}`.split("+")[0]
      const countdownDate = new Date(countdownDateTrueFormat).getTime();

      interval = setInterval(()=> {
        const now = new Date().getTime();
        const distance = countdownDate - now;
        let days = Math.floor(distance / (1000 * 60 * 60 * 24));
        let hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
        let minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
        let seconds = Math.floor((distance % (1000 * 60)) / 1000);
        
        if(distance < 0) {
          clearInterval(interval.current)
        } else {
          setTimerDays(days)
          setTimerHours(hours)
          setTimerMinutes(minutes)
          setTimerSeconds(seconds)
        }
        
      }, 1000)
    }
    useEffect(()=> {
      startTimer()
      let someref = interval.current
      return ()=> {
        clearInterval(someref)
      }
    })