Taha's things

[Taha-Hassan-Git]

I love the alien names and stats, slimeFactor is particularly funny. It's all very neatly component-ised and you use props/state etc very well!

Some things about the UI that I'm sure you're aware of:

• You can submit your card without having selected an attribute.
• It's not clear to me what the start game button does.
• It wasn't obvious to me how to submit my card, I think the "unleash..." button is a bit too wordy and wide to seem like a button
• It's not clear what attribute the computer is using against you.
• Everything is quite small on mobile.

Some questions:

• Many of your components return a single element, could you return some of these on one line instead of using brackets?
  For example:
  instead of this

if(winner) {
    return (
      <p>Player 1 crushes the competition!</p>
    )
  }
  if(!winner) {
    return (
      <p>Defeated by player 2!</p>
    )
  }

this

if (winner) return <p>Player 1 crushes the competition!</p>;
return <p>Defeated by player 2!</p>;

• You used state a lot! Would it have been possible to collate some of the state declarations? Or use one to determine others?
  For example:

  const [showWinMsg, setShowWinMsg] = useState(false);
  const [winner, setWinner] = useState(true);

[Psydwinder]

Hey team,

Piggy backing off what Taha said about condensing your if statement down into the following code:

if (winner) return <p>Player 1 crushes the competition!</p>;
return <p>Defeated by player 2!</p>;

You could simplyfy it further and just use a ternary operator, like this:

return (
  winner ? <p>Player 1 crushes the competition!</p> : <p>Defeated by player 2!</p>
);