Proyectos de Subversion LeadersLinked - SPA

import React, { useEffect, useState } from 'react';

import { Box } from '@mui/material';

function QuizTimer({ time, onStop }) {

  const [minutes, setMinutes] = useState(time);

  const [seconds, setSeconds] = useState(0);

  useEffect(() => {

    const countDown = setInterval(() => {

      if (minutes === 0 && seconds === 0) {

        clearInterval(countDown);

        onStop();

      }

      setSeconds((prevSeconds) => (prevSeconds === 0 ? 0 : prevSeconds - 1));

      if (seconds === 0) {

        setMinutes((prevMinutes) => (prevMinutes === 0 ? 0 : prevMinutes - 1));

        setSeconds(59);

      }

    }, 1000);

    return () => clearInterval(countDown);

  }, [minutes, seconds]);

  return (

    <Box component='span'>

      {minutes < 10 ? `0${minutes}` : minutes}:{seconds < 10 ? `0${seconds}` : seconds}

    </Box>

  );

}

export default QuizTimer;