rock-paper-scissors with react and tailwind

Hey, nice submission!

There are some problems in the game logic:

1. There are no draws. It's probably your design decision and you are aware of this, but it's not Rock Paper Scissors when your opponent knows your hand and doesn't repeat it.
2. The opponent's choice is biased towards the Rock. This is because of how you generate the choice:

const guess = shapes[Math.round(Math.random() * 2)]

You round a number between 0 and 2, so:

• 0 < N < 0.5 = 0
• 0.5 < N < 1.5 = 1
• 1.5 < N < 2 = 2

As you can see the range that rounds to 1 is two times bigger than others. So if you choose the Paper every move, the opponent will choose the Rock in 66% and the Scissors in 33%. And vice versa, when you choose the Scissors you lose twice as frequent as you win.

The proper random number is:

Math.floor(Math.random() * 3)

Also there are accessibility warnings that you should check out, accessibility is important.

Hope this helps.