Auth0provider not compatible with useNavigate hook

[mayo7e]

Checklist

• The issue can be reproduced in the auth0-react sample app (or N/A).
• I have looked into the Readme, Examples, and FAQ and have not found a suitable solution or answer.
• I have looked into the API documentation and have not found a suitable solution or answer.
• I have searched the issues and have not found a suitable solution or answer.
• I have searched the Auth0 Community forums and have not found a suitable solution or answer.
• I agree to the terms within the Auth0 Code of Conduct.

Description

When using the Auth0 React SDK with React Router v6, attempting to use useNavigate() results in the following error: Uncaught Error: useNavigate() may be used only in the context of a component. This issue occurs despite wrapping the application with or as required by React Router v6.

Reproduction

1. Set up a React application using React Router v6.
2. Integrate Auth0 React SDK for authentication.
3. Attempt to use useNavigate() for navigation within the application.

Additional context

No response

auth0-react version

2.2.4

React version

18.3.1

Which browsers have you tested in?

Chrome

[frederikprijck]

We have an example that uses Router-Router and its useNavigate hook. I recommend looking at that: https://github.com/auth0/auth0-react/blob/main/examples/cra-react-router/src/index.tsx.

If you believe there is still an issue with our SDK, please open an issue with more information to allow us to help troubleshoot.