Routing on React?
I have this code:
return (
<div className="App">
<Routes>
<Route path="/login" element={<LoginPanel login={login} register={register} />} />
<Route
path="*"
element={
<ProtectedRoute isAuthenticated={isAuthenticated} isLoading={isLoading}>
{renderMainContent()}
</ProtectedRoute>
}
/>
</Routes>
</div>
)
if i try to access my app with for example "/products" isAuthenticated gets set to false, even if I'm logged in. I'll be logged in, I check isAuthenticated in the console, it's true, then I enter "/products" and I get set back to login screen. If I don't check for isAuthenticated the routing works. Do I need to set something in Kinde admin?
1 Reply
React SDK, app create with create-react, using "react-router-dom": "^6.26.1".
This isn't urgent because I'm not using any routing at the moment and may not need it. I made a different branch to add routing so that I could bookmark pages, but although the routes work on that branch, the auth causes a redirect to login.
The issue is simpler than routing. On my current branch with no routing, I can log in fine. However, if I enter any other url than root, like /hello, the isAuthenticated flag is "false". If I put a breakpoint in my main App.tsx file, when I enter / isAuthenticated is true. When I enter /hello, isAuthenticated if false. So routing can never work. Is this something that I would set up in Kinde?