Hi everyone, I recently started leveraging Auth0 for user authetication in a personal react app I’m building. I followed the docs and successfully got a sample static site working with login and logout functionality. Moving the login and logic over to my own project, I’ve run into a problem.
What’s supposed to happen is whenever the user isn’t authenticated, a login button shows up based on the isAutenticated hook and if the user is logged in, a logout button appears. This is what I had set up in the sample site and it worked. In my personal app, however, whenever I try to login, the user ends up not getting authenticated upon redirection back to my initial landing page. I am taken to the universal login page upon button click (so that part works) but between that and getting redirected something goes wrong because the login button gets shown. Console logging the isAuthenticated hook shows that it comes back false, further proving that the user isn’t getting authenticated.
I found the component causing this seeing as commenting it out seems to fix the authentication issue. This component uses Mirage JS to mock out a get request to list a few things. I’m relatively new to React, Auth0 and Mirage so I hope you all can excuse my ignorance but Google searches haven’t solved my problem so I decided to ask on here. What extra hoops do I need to jump through to get Mirage to play nice with Auth0?
Any suggestions are much appreciated!