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