 Okay so the problem that we have right here is that our component doesn't have a smooth transition when we render the first time but every subsequent time it works and that's because of the way that we have this set up only after we click are we setting the scroll height for the first time. Now our assignment from yesterday was to implement use effect to get that value on the first time that we render. We're just going to do every time. Now use effect we use react dot use effect we put that right before our return right here we don't need any props right here and we're just going to open that up and put that right there so we literally just moved it out of our on click and we moved it here now this isn't going to happen every time we click anymore it's just going to happen the first time and that's really all we need because once we have that value unless they resize it's going to be the same value now which is that one move we should see that this works the first time i'm a refresh just so you know that i'm not you know pulling your leg here yes it does it works every single time okay so the next assignment is we're going to do something a little bit more ui related so if i render another show less component and this one had significantly less content in it hi there i would expect this not to have a show more or less button right because it's not big enough to justify hiding some of the content and now that we have the content height available from our first render on you should be able to conditionally hide this based on whether or not it's past that threshold of 100 pixels or you can make that dynamic however you want that's it for today pretty simple one i think but if you want to know what we did yesterday to get to this point you can click on this video up here if you want tomorrow's solution it'll be here when it's ready see you in the next one bye