wise-white
wise-white13mo ago

redirect issue

as soon as the page loads on the screen it should be redirected to the login page. I have made the login page, but it is not redirecting to the login page by default. can anyone provide any guidance and help me in this? <Route element={ <Authenticated fallback={<Outlet />}> <NavigateToResource resource="categories" /> </Authenticated> } > <Route path="/login" element={<Login />} /> <Route path="/register" element={<Register />} /> </Route> <Route path="*" element={<ErrorComponent />} /> </Routes>
3 Replies
kapa.ai
kapa.ai13mo ago
Hi @coops8. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- To redirect users to the login page by default when the page loads, you can use the <Navigate> component from react-router-dom. You should wrap your routes with the <Authenticated> component and use the fallback prop to redirect unauthenticated users to the login page. Here's an example based on the code you provided:
import { Navigate } from "react-router-dom";

// ...

<Routes>
<Route
element={
<Authenticated fallback={<Navigate to="/login" />}>
<NavigateToResource resource="categories" />
</Authenticated>
}
>
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
</Route>
<Route path="*" element={<ErrorComponent />} />
</Routes>
import { Navigate } from "react-router-dom";

// ...

<Routes>
<Route
element={
<Authenticated fallback={<Navigate to="/login" />}>
<NavigateToResource resource="categories" />
</Authenticated>
}
>
<Route path="/login" element={<Login />} />
<Route path="/register" element={<Register />} />
</Route>
<Route path="*" element={<ErrorComponent />} />
</Routes>
In this example, if a user is not authenticated, they will be redirected to the /login route by default. ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------
kapa.ai
kapa.ai13mo ago
<@992776053590339674> kapa.ai is still learning and improving, please let us how it did by reacting below
wise-white
wise-white13mo ago
The solution which i got, is just before closing of the </Routes> element, one need to add the <Route path="*" element={<Navigate to="/login" />} /> so any route other than the defined route, will be redirected to the "/login" page, automatically