# POMODORO CLOCK Proj with React Hooks 28/29 Help

**URL:** <https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215>\
**Category:** General\
**Created:** [February 21, 2020, 1:54pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215 "2020-02-21T13:54:39Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![djma777](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/djma777/32/134674_2.png) [@djma777](https://forum.freecodecamp.org/u/djma777)\
**Post date:** [February 21, 2020, 1:54pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/1 "2020-02-21T13:54:39Z")

</div>

[Github Link](https://github.com/djma777/fcc-pomodoro-clock-v2) for code  
[App deployed at Netlify](https://fcc-pomodoro-clock-proj.netlify.com/) for tests

I hope to get some help on this project. Current score is 23/29. I haven’t added audio yet, but the errors prior to the audio part I couldn’t quite figure out why.

I wrote a custom hook that would wait 1 second before running the clock again to solve the 00:00, dunno if it’s causing my other errors.

TIA!

[UPDATE]  
score: 25/29

A bit frustrated with the last failed tests.

- I can see an element with corresponding id=“time-left”. NOTE: Paused or running, the value in this field should always be displayed in mm:ss format (i.e. 25:00).

- If the timer is running and I click the element with id=“start\_stop”, the countdown should pause.

- I should not be able to set a session or break length to \> 60.

- If the timer is paused and I click the element with id=“start\_stop”, the countdown should resume running from the point at which it was paused.

I think the app is supposed to pass these tests. Kindly see for yourself. Help…

[UPDATE]  
score: 26/29

I might be able to solve 2 of the last 3, which may leave me with this:

- I can see an element with corresponding id=“time-left”. NOTE: Paused or running, the value in this field should always be displayed in mm:ss format (i.e. 25:00).

I just have to do something before I resume working on this.

[UPDATE]  
score: 28/29

So apparently I have accidentally removed my `usePause` hook, but I put it back on and it’s working. Now this last problem.

- I can see an element with corresponding id=“time-left”. NOTE: Paused or running, the value in this field should always be displayed in mm:ss format (i.e. 25:00).

The next two lines goes:  
_time-left is not formatted correctly: expected ‘59’ to equal ‘60’_  
_AssertionError: time-left is not formatted correctly: expected ‘59’ to equal ‘60’_

Like, my timer never goes ‘60’…

```auto
const timer = () => {

    let minutes = Math.floor(timeLeft / 60);

    let seconds = timeLeft - minutes * 60;

    minutes = minutes < 10 ? "0" + minutes : minutes;

    seconds = seconds < 10 ? "0" + seconds : seconds;

    return `${minutes}:${seconds}`;

  };

```

and that goes into `<span id="time-left">{timer()}</span>`

Anyone? 😃

[UPDATE]  
I just change my topic category to #help, maybe I 'll have better luck here. 😃

[FINAL UPDATE]  
score: 29/29

Finally!!!

 ![pomodoro-2929](https://global.discourse-cdn.com/freecodecamp/original/3X/b/6/b675bd9f5c63c0a600ba60beb61520c02c3cc630.png)

I just need to design this now. 😃

---

<div class="post-metadata">

**Author:** ![jenovs](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/jenovs/32/60963_2.png) [@jenovs](https://forum.freecodecamp.org/u/jenovs)\
**Post date:** [February 23, 2020, 3:31pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/2 "2020-02-23T15:31:37Z")

</div>

I recently helped with similar problem with react hooks:

> [@Pomodoro Clock Works Great, But](http://forum.freecodecamp.org/t/pomodoro-clock-works-great-but/350569/2):
>
> It’s because in your code the timer update after button click happens in two passes: first you change increaseSession to trigger useEffect (1st pass) which changes sessionLength and minutes (2nd pass). You can’t see it because it happens very fast, but tests can catch it. Overall, the way you use useEffect is not quite right. You should go with a regular onClick handler which updates all the necessary variables (you really don’t need useEffect to handle clicks). Here’s an example (look at lin…

Check how you you go from clicking “Up” button to updating time in blue “Session” block.

---

<div class="post-metadata">

**Author:** ![djma777](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/djma777/32/134674_2.png) [@djma777](https://forum.freecodecamp.org/u/djma777)\
**Post date:** [February 24, 2020, 6:08am UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/5 "2020-02-24T06:08:29Z")

</div>

Actually I found a different bug, or I don’t know if it’s still related to your solution… But the timer actually stops (freezes) when I press any of the up/down buttons… then continues the timer after releasing the button… Any thoughts on that?

---

<div class="post-metadata">

**Author:** ![djma777](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/djma777/32/134674_2.png) [@djma777](https://forum.freecodecamp.org/u/djma777)\
**Post date:** [February 24, 2020, 2:03pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/6 "2020-02-24T14:03:02Z")

</div>

Hi! I honestly am not sure if the solution you suggested directly solves my problem, but it did get me to change my code. I initially just really wanted to try out custom hooks to learn, I feel like I did, there’s so much more to learn and absorb. I think your solution will still help anyone who comes across this post so… Thanks! 😃

---

<div class="post-metadata">

**Author:** ![rayra](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/rayra/32/134407_2.png) [@rayra](https://forum.freecodecamp.org/u/rayra)\
**Post date:** [March 9, 2020, 3:24pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/7 "2020-03-09T15:24:40Z")

</div>

Hello, to pass test 8 is it necessary to update the clock at the same time that I click on the increment and decrement buttons?

---

<div class="post-metadata">

**Author:** ![djma777](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/djma777/32/134674_2.png) [@djma777](https://forum.freecodecamp.org/u/djma777)\
**Post date:** [March 26, 2020, 1:25pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/8 "2020-03-26T13:25:22Z")

</div>

Hi, have you solved this yet? I haven’t been active on the forums for days, sorry… If you haven’t solved yours yet, kindly link your post so I can try and help. Hopefully, you’re already done with this project. Best of luck! 😃

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [June 1, 2021, 7:32pm UTC](https://forum.freecodecamp.org/t/pomodoro-clock-proj-with-react-hooks-28-29-help/352215/9 "2021-06-01T19:32:26Z")

</div>

Closed on June 1, 2021, 7:32pm UTC


