Glow

[isbrakha]

I'm very happy with the simplistic style, had some trouble getting the correct answers and incorrect answers to no always render in the same order, so the correct answer wouldn't always be in the same place, found a good solution

const fetchTrivia = async () => {
        try {
            const res = await fetch('https://the-trivia-api.com/v2/questions?categories=${category}&${difficulty}', {
                headers: {
                    'Content-Type': 'application/json',
                }
            })
            const triviaData = await res.json()
            setTrivia(triviaData)
        } catch (err){
            console.log(err)
        }
        setIsLoading(false)
    }
    function shuffleArray(array) {
        let currentIndex = array.length,  randomIndex;

        while (currentIndex > 0) {

          randomIndex = Math.floor(Math.random() * currentIndex);
          currentIndex--;

          [array[currentIndex], array[randomIndex]] = [
            array[randomIndex], array[currentIndex]];
        }

        return array;
      }

This is how i return the answers:s:

const loaded = () => {
    let answers = []
    answers.push(...trivia[count].incorrectAnswers)
    answers.push(trivia[count].correctAnswer)
    shuffleArray(answers)

    return(
        <section className="game-section">
            <div className="question-wrapper">
                <h2 className="question">{trivia[count].question.text}</h2>
            </div>
            <div className="answers-container">
                <h3 className="answers" onClick={handleClick}>{answers[0]}</h3>
                <h3 className="answers" onClick={handleClick}>{answers[1]}</h3>
                <h3 className="answers" onClick={handleClick}>{answers[2]}</h3>
                <h3 className="answers" onClick={handleClick}>{answers[3]}</h3>
            </div>
            <h2 className="score">Score: {score}</h2>
        </section>
    )
}`

[vachhaniparth96]

I like how you used Math.floor(Math.random()) along with a while loop to randomly generate the index of the answer order. I did have some difficulty understanding lines 28-39 in your code in the Gameplay.jsx file (the shuffleArray function) but I think I get the general gist of what it does. Perhaps adding some comments to give a high-level explanation of what is happening would be good. I also liked the overall look of the app! The theming was nice to look at and the colors did not clash so it was easy to read everything. The implementation of Auth0 was a really nice addition as well!