React Pomodoro Timer Failure

React Pomodoro Timer Failure


So I built a pomodoro timer for the beta react unit and usually with these projects I kind of build a skeleton around the project requirements and make sure it passes all tests and then I build my project around it but this time I skimmed over them in the beginning and went to building what I had envisioned.

As I got closer to finishing up what I was working on I started fretting looking back at the requirements I thought my biggest concern was going to be where to put the increment and decrement buttons since I went with input sliders.

I was wrong, because my app renders different “pages” I fail almost all of the tests :confused: I basically need to start over :sob:

Well anyway here’s what I was working on and a link to the github repo if you want to see the code, if you guys notice any glaring deficiencies let me know. I figured I’d get some feedback before I rework it.

I was thinking about adding a New Timer or Restart type of button to the timer component as of now you’d have to refresh the page, other than that I hope to keep much of the functionality the same.


Looks fine to me. Love the tide going up and down.
I noticed the waves disappear if you hit reset and I was confused as to what I just reset.
Was it the break or the whole thing?
A “new timer” buttons sounds good.
Anyway. I am not sure which requirements you broke but for me it’s a working Pomodoro timer.
The other thing I would improve would be to have a louder “bell” sound.
Good work :smiley: :+1:


Technically you are adding an extra second to each session and break. Why? Let’s say, I set the work time to 1:00 and the break time to 1:00 and click start. The following is what I see at the very last of the work session and the beginning of the break session

0:00 this should be the end of the work session and the beginning of the timer
1:00 this is the extra second that gets added

One way to remove the extra second would be if the timer displayed the following

0:00 end of work session and beginning of break session


Yeah the reset should start the whole set over again, did the waves go away or fill back up?

It was really hard to find a good sound haha! I went to a couple of open source sound websites and they were either annoyingly loud or quiet I might just play a tone with audio contexte createoscilator method.


Good catch, thanks for taking a look at it!


I think the waves disappear leaving the solid section to move down. Perhaps the waters became calm. :peace_symbol:


Haha perhaps. Could I ask what browser you’re using? I can’t seem to recreate that.


If you are on a break and you hit pause, then reset, the waves disappear.

PS. If you want to hear a noisy alarm, try mine :rofl:


Ahh I kept testing it with the timer and break set to 1 minute and couldn’t figure out how to trigger what you were seeing but I think I’ve found the logic error! You have the break and timer set to different times right?

I think I’m setting the position of the element based on whether it’s currently on work or break and then switching to the other immediately afterwards. I’ll have to try to work on the tonight when I get home.

Thanks for letting me know about that one.


Correct. Work time 1 min, break time 3 mins.