Logi c для Rock Paper Scissors не работает в ReactJS

Question

Предполагается показать 3 кнопки (камень, бумага или ножницы), и компьютер сгенерирует случайный выбор. Это покажет результаты. Простая игра, и она отлично работала, когда она была компонентом на основе классов, но когда я преобразовал ее в функциональный с хуками вместо состояния, он прослушивался и показывал победителя неправильно по сравнению с тем, что пользователь и компьютер показали, что они выбрали. Когда вы сохраняете файл console.log, он показывает, что должно появиться, но на экране отображается что-то еще. Я пробовал разные способы сделать логи c, такие как операторы переключения регистра и операторы if, но ни один из них не работал.

        const [RPSc, setRPSc] = useState(['Rock', 'Paper', 'Scissors'])
        const [RPSu, setRPSu] = useState(null)
        const [randomNum, setrandomNum] = useState(null)
        const [outcome, setOutcome] = useState('')
        const [RPSca, setRPSca] = useState(null)

    function handleClick(type) {
        const min = 0;
        const max = 3;
        setRPSu(type)
        setrandomNum(Math.floor(min + (Math.random() * (max - min))))
        setRPSca(RPSc[randomNum])
        setOutcome(
            <h1>{
                ((RPSu === 'Rock') && (RPSca === 'Scissors')) ||
                    ((RPSu === 'Paper') && (RPSca === "Rock")) ||
                    ((RPSu === 'Scissors') && (RPSca === "Paper")) ? 'You win' :
                    (RPSc[randomNum] === RPSu) ? "It's a tie" : 'The computer wins'
            }{console.log(RPSu + RPSca + randomNum)}</h1>
        )
    }
    return (
            <div>
                <button value="Click me!" onClick={() => handleClick('Rock')}>Rock</button>
                <button value="Click me!" onClick={() => handleClick('Paper')}>Paper</button>
                <button value="Click me!" onClick={() => handleClick('Scissors')}>Scissors</button>

                <h2 className="x">You selected: {RPSu}</h2>
                <h1 className='x'>The computer selected: {RPSca}</h1>

                {outcome}
            </div>
        );