Improve routing on frontend

[rytc]

Managing routes on the front end could be better.

• Valid routes/URLs should work whether the user is logged in or not. If the route requires authentication, then redirect to login/register page.
• Invalid routes should show error page whether they are logged in or not

Ideas:

• Add a AuthenticatedRoute component. Usage would be like this: <Route path="/user/:username" element={<AuthenticatedRoute element={<Profile />} /> This would automatically redirect the user to the login or register page if they are not authenticated.
• Subroutes? https://stackoverflow.com/questions/49473727/how-to-handle-multiple-routers-in-react

[rytc]

Protected routes and auth hook/context https://ui.dev/react-router-protected-routes-authentication/

[rytc]

react-router-dom auth tips https://reactrouter.com/docs/en/v6/examples/auth