[SOLVED] Route Fails with Specific Query Parameters (`code` and `state`)

Route Fails with Specific Query Parameters (`code` and `state`)

I'm encountering an issue with react-router-dom in my React application. I have a route set up for /selects, which works fine unless I include both code and state query parameters.

For example, this route doesn't render anything at all:

http://localhost:3000/v2/something/selects?code=sdasdasdasdas&state=sdasdsadas

However, if I change one of the query parameter names, or pass only one query parameter, the route works as expected.

Additionally, if I use the code and state query parameters in other routes within the same app, like this:

http://localhost:3000/helloworld?code=something&state=somethingelse

it works without any issues.

I've tried creating a new React project with the same routing structure, and everything works fine in that setup.

Any ideas on why the route /selects is failing when both code and state are passed as query parameters in my current app? Could there be a conflict or something I'm missing? Any help is appreciated!

// Selects.tsx

const SelectAdAccount = () => {
  return <h1>Something</h1>;
};

export default SelectAdAccount;

Not getting any errors in console.

Solution

My bad, I have integrated Auth0 React SDK and that is causing the issue.

This snippet fixed the issue.

useEffect(() => {
    if (!isAuthenticated) {
      getAccessTokenSilently();
    }
  }, [isAuthenticated, getAccessTokenSilently]);