I was wondering if the following code looked reasonable enough to be used, and if it’s the best way (although when I click the button, everything dissapears)
useEffect(() => {
// if (isPlayed) {
let interval = setInterval(() => {
//BEGINNING OF SESSION HANDLER
if (!breakStarts && sessionSeconds === 0) { //session is ongoing and seconds reached 0
if (sessionMinutes !== 0) {//session is ongoing, seconds reached 0, and session is not over
setSessionSeconds(59);
setSessionMinutes(sessionMinutes - 1);
} else { //session is ongoing, seconds reached 0, and session is over
setBreakStarts(true) //this makes the timer focus on the break timer
//setBreakMinutes(breakMinutes) // this is to maybe set sessionMinutes back so that it sessionMinutes isn't 0?
}
} else if (!breakStarts && sessionSeconds !== 0) {
setSessionSeconds(sessionSeconds - 1)
}
//END OF SESSION HANDLER
//BEGINNING OF BREAK HANDLER
if (breakStarts && breakSeconds === 0) { //break is ongoing and seconds reached 0
if (breakMinutes !== 0) {//break is ongoing, seconds reached 0, and break is not over
setBreakSeconds(59);
setBreakMinutes(breakMinutes - 1);
} else { //break is ongoing, seconds reached 0, and break is over
setBreakStarts(false) //this makes the timer focus on the session timer
//setSessionMinutes(sessionMinutes) // this is to maybe set breakMinutes back so that it breakMinutes isn't 0?
}
} else if (breakStarts && breakSeconds !== 0) {
setBreakSeconds(breakSeconds - 1)
}
//END OF BREAK HANDLER
}, 1000);
// else if (!isPlayed && breakStarts ? breakSeconds : sessionSeconds !== 0) {
// clearInterval(interval);
// }
return () => clearInterval(interval);
}, [isPlayed, breakStarts ? breakSeconds : sessionSeconds]);