https://codesandbox.io/s/ancient-rain-19d4rb?file=/src/App.js

I created a sandbox above to demonstrate the problem that I am having. Please play with it and look at the code to see what it’s doing.

The left side has selections for the ‘gamemode’ and for each gamemode there exists options ‘options’ on the right side.

The API call requires both of these values to be inputted.

Whenever I change the option on the right, it should do an API call in Game.js
If I change the gamemode on the left, it should also automatically change the option on the right to be the 0th index. With my current logic, it does two API calls whenever I change the gamemode since it’s also changing the option.

How can I change the design or how can I adjust things to get the result I’m looking for?

Let me know if further clarification is needed.