Private routing[Feature]:

[belisky]

What is the new or updated feature that you are suggesting?

Private routing to prevent unauthorised users to certain routes. All the implementations ive seen so far doesnt use your latest version. Please if you have any idea to implement it, I'd love to learn it. Thanks

Why should this feature be included?

to prevent unauthorised users to certain routes.

[MeiKatz]

There are solutions:

function App() {
  return (
    <Routes>
      <Route path="admin/*" element={<AdminPage />} />
    </Routes>
  );
}

function AdminPage() {
  const isAdmin = useIsAdmin();

  if ( isAdmin ) {
    return (
      <Routes>
        <Route path="users" element={<UsersPage />} />
        { /* some other routes */ } 
      </Routes>
    );
  }

  return (
    <div>You're not allowed to access this page!</div>
  );
}

[timdorr]

This is already one of the examples: https://reactrouter.com/docs/en/v6/examples/auth

[veloware]

Apologies for commenting on a closed issue, but can I ask - the comment here - https://stackoverflow.com/a/69592617/1849358 seems to offer a much 'nicer' approach to private routes, with no replication of having to wrap each private element. Does this seem like a valid solution? Particularly since in https://reactrouter.com/docs/en/v6/getting-started/concepts#layout-routes you recommend not to wrap the elements withPageLayout but instead use a 'layout' route?