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