‫Lastly, we need to write the code that checks if a user has won the game and if they have, we need
‫to display a message.
‫Congrats, which right now we're not doing and we'll also probably hide the table.
‫So let's do it right here where we're setting the state with the board.
‫The new board we're setting has one to be has one, but right now we hardcoded it to be false every
‫time we're saying you lose.
‫But let's actually check.
‫And for us to know if a user has one, we need to iterate and check every single cell here.
‫Make sure that every single one is off, meaning that it's set to false.
‫And to do that, we can't just loop once because we can loop over the rows.
‫And that would give us one, two, three, four, five.
‫But we then need to do our inner loop the same thing X and Y so that we can check all of the values.
‫And I'm going to simplify it instead of doing a for loop or something, I'm just going to use every
‫so board, which is what we just changed.
‫We updated the board here before we're setting the state board every and then we can pass in for each
‫row.
‫I'm going to do another row every now and then for each cell.
‫And we just want to check that the cell is false.
‫So we want this to be truth, meaning not false.
‫I know it's kind of a weird syntax, but we do not sell to make sure this returns true.
‫So every cell in every row should be false.
‫Now.
‫Let's see if it works.
‫This we need to make sure we're setting that to be the value of has one so it has one equal for every
‫OC.
‫And then we save that.
‫Set it to the state.
‫It's going to be annoying to test.
‫So I'm going to cheat a little bit and come into react here and change some of these values and turn
‫things on or off.
‫I just toggled a couple of them on and off or just off, actually.
‫Now I should be able to click here and win the game.
‫And if we take a look in our state, we should have has one set to true.
‫So that part is working now we need to display something based off of that.
‫So inside of render, we're not going to display the board at all if the user has one.
‫So instead of doing it down here, I'm going to just circumvent the entire board and up top do a short
‫circuit.
‫So if this dot state has one, I'm going to just return right there with an H one.
‫We'll style it in the next video if you want to see how I did the neon effect and just say you won.
‫And that's it.
‫So if the user wins, that's what we should see.
‫I'm not sure what color this text will show up as it will be an adventure.
‫Let's check it out.
‫So I'm going to do the same thing and cheat just a bit.
‫But instead of changing the board because we already saw that that part was working, if we update the
‫board to be all off has one set to false?
‫Now if I just toggle it to be true, we're getting the text you won.
‫So our game is officially complete.
‫It's working.
‫I'm terrible at playing it, so I can't verify using the real way of playing it.
‫I can only short circuit it by changing the props.
‫In the next video, I'll show you how to if you want, how to style it the way that I did.
‫It's a little more colorful, I guess some neon effects, but it has very little to do with React.
‫So you might just want to copy and paste the stylesheet from the solution and just see how it works.