<Routes>
{!userlog ? (
<Route path="/" element={<AuthLayout />}>
<Route index element={<Login />} />
<Route path="/login" element={<Login />} />
<Route path="/signin" element={<Login />} />
<Route path="/forgotpassword" element={<ForgotPassword />} />
<Route path="/changepassword" element={<ChangePassword />} />
</Route>
) : userlog?.user_type===1?(
<Route path="/" element={<HomeLayout />}>
<Route index element={<HomePage />} />
<Route path="viewproduct/:id" element={<ViewPage />} />
<Route path="cartlist" element={<CartList />} />
</Route>
):
<Route path="/" element={<AdminLayout />}>
<Route index element={<Dashboard />} />
<Route path="listproducts" element={<ProductsList />} />
</Route>
}
<Route path="*" element={<Navigate to={"/"} />} />
</Routes>
What i want,
Scenario 1(user not logged in): if user try to navigate "/cartlist" it's redirect to the login page. If user try navigate something not an part of route path's want to navigate 404 not found page.
Scenario 2(user logged in): if user try to navigate "/login" it's redirect to the dashboard page. If user try navigate something not an part of route path's want to navigate 404 not found page.
Now what i get is,
User try to navigate any other routes it's navigate to "/" page.
NOTE: I don't want to put private route for every Route's and Also i want routing path like this only..
Thanks in advance....
Ofcourse due to this line, it will go to "/":
<Route path="*" element={<Navigate to={"/"} />} />
With the new react-router v6 you can use this by changing:
// 404 route
<Route path="*" element={<NotFoundPage />} />
NotFoundPage will be your component to tell users that page is not found.
Also, for these, i think you need to put a forward slash / before pathname
<Route path="/viewproduct/:id" element={<ViewPage />} />
<Route path="/cartlist" element={<CartList />} />
<Route path="/listproducts" element={<ProductsList />} />
The reason it always resolves to "/" is because it will choose the first route which matches the given pattern, even if it is a partial match. Since all of your routes begin with "/" eg. "/login" etc it always matches "/".
You can prevent this with the "exact" parameter:
<Route exact path="/" element={<AuthLayout />}>