Build a Pomodoro Clock reset animation

Tell us what’s happening:

I’m can’t figure out how to reset the css animation on the timer and the tomato clock. Specifically, when you increment or decrement the session, the timer numbers should update, the break delay be adjusted. clicking ‘reset’ should reset the timer and tomato clock to the 25 and 5 minute defaults. I use animation delay in the CSS to initialized the timer and tomato clock but this doesn’t work in react. I tried setting the delay in a style element and that did not work either. I found documentation saying, yeah, this doesn’t work.

I found an example of removing and adding classes to reset an animation on and looked for a react alternative. While I might get this to work to reset the timer and clock, it won’t work for setting the delay when the session or break length is changed. I found a react set of add ons for animtions using reactCSSTransitionsGroup, but I’m lost.

I’ve learned a lot on this project and some cool stuff. I hope someone more experienced can help me out. Thanks in advance.

Your code so far

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3578.98 Safari/537.36.

Link to the challenge:

Well, I abandoned using an animation for the numbers and implemented like the example. I passed all but 2 tests. my timer pauses but the timer continues??? no idea how to fix this. The tomato animation is just for looks. Its not accurate and doesn’t reset. I still have the same question as above regarding animation.

I have another question. To get accurateInterval to work I had to use the include Who is this mystery source? Is it ok to use their installed library?

I couldn’t find the originator ‘squuege’ or any documentation. How can this be a real world best practice? I borrowed someone’s audio file too because I don’t know where to find free audio snippets and I didn’t want to use the klaxon from the example.

What do you do when you can’t find the originator source and want to use a snippet from someone’s code? Forgive me if I’m wrong to use someone’s code but I’m learning and not sure what’s ok. It seems like a bad practice since the link could break anytime.