Tengo una cuenta regresiva hasta Año Nuevo, ahora quiero tener otras cuentas regresivas hasta Semana Santa por ejemplo. Pensé en hacer otras constantes como "diferencia", pero no sé cómo hacer que esas otras cosas cambien según el tema que se elija.
import './App.css'; import React, {useEffect, useState} from "react"; function App() { const calculateTimeLeft = () => { let year = new Date().getFullYear(); const difference = +new Date(`01/01/${year+1}`) - +new Date(); let timeLeft = {}; if (difference > 0) { timeLeft = { days: Math.floor(difference / (1000 * 60 * 60 * 24)), hours: Math.floor((difference / (1000 * 60 * 60)) % 24), minutes: Math.floor((difference / 1000 / 60) % 60), seconds: Math.floor((difference / 1000) % 60) }; } return timeLeft }; const [timeLeft, setTimeLeft] = useState(calculateTimeLeft()); const [year] = useState(new Date().getFullYear()); useEffect(() => { const timer = setTimeout(() => { setTimeLeft(calculateTimeLeft()); }, 1000); return () => clearTimeout(timer); }); const timerComponents = []; Object.keys(timeLeft).forEach((interval) => { if (!timeLeft[interval]) { return; } timerComponents.push( <span> {timeLeft[interval]} {interval}{" "} </span> ); }); return ( <div className="App"> <h1>New Year {year+1} Countdown</h1> {timerComponents.length ? timerComponents : <span>Time's up!</span>} </div> ); }; export default App;