Added unauth and auth only routes (#4091)

* Added unauth and auth only routes

* eslint

app/javascript/main.jsx

@@ -33,6 +33,8 @@ import DefaultErrorPage from './components/errors/DefaultErrorPage';
 import NotFoundPage from './components/errors/NotFoundPage';
 import VerifyAccount from './components/users/account_activation/VerifyAccount';
 import AdminPanel from './components/admin/AdminPanel';
+import UnauthenticatedOnly from './routes/UnauthenticatedOnly';
+import AuthenticatedOnly from './routes/AuthenticatedOnly';
 
 const queryClient = new QueryClient();
 
@@ -45,13 +47,18 @@ const root = (
             <Routes>
               <Route path="/" element={<App />}>
                 <Route index element={<HomePage />} />
+
+                <Route element={<UnauthenticatedOnly />}>
                   <Route path="/signup" element={<Signup />} />
                   <Route path="/signin" element={<SignIn />} />
                   <Route path="/forget_password" element={<ForgetPassword />} />
-                <Route path="/reset_password/:token" element={<ResetPassword />} />
-                <Route path="/activate_account/:token" element={<ActivateAccount />} />
-                <Route path="/verify_account" element={<VerifyAccount />} />
-                <Route path="/profile" element={<Profile />} />
+                </Route>
+
+                <Route element={<AuthenticatedOnly />}>
+                  <Route path="/rooms" element={<Rooms />} />
+                  <Route path="/rooms/:friendlyId" element={<Room />} />
+                  <Route path="/home" element={<Home />} />
+
                   <Route path="/admin" element={<AdminPanel />} />
                   <Route path="/admin/users" element={<ManageUsers />} />
                   <Route path="/admin/edit_user/:userId" element={<EditUser />} />
@@ -61,10 +68,13 @@ const root = (
                   <Route path="/admin/site_settings" element={<SiteSettings />} />
                   <Route path="/admin/roles" element={<Roles />} />
                   <Route path="/admin/roles/edit/:roleId" element={<EditRole />} />
-                <Route path="/rooms" element={<Rooms />} />
-                <Route path="/rooms/:friendlyId" element={<Room />} />
+                </Route>
+
+                <Route path="/reset_password/:token" element={<ResetPassword />} />
+                <Route path="/activate_account/:token" element={<ActivateAccount />} />
+                <Route path="/verify_account" element={<VerifyAccount />} />
+                <Route path="/profile" element={<Profile />} />
                 <Route path="/rooms/:friendlyId/join" element={<RoomJoin />} />
-                <Route path="/home" element={<Home />} />
                 <Route path="/404" element={<NotFoundPage />} />
                 <Route path="*" element={<Navigate to="404" />} />
               </Route>

app/javascript/routes/AuthenticatedOnly.jsx

+import React from 'react';
+import { Navigate, Outlet } from 'react-router-dom';
+import { toast } from 'react-hot-toast';
+import { useTranslation } from 'react-i18next';
+import { useAuth } from '../contexts/auth/AuthProvider';
+import VerifyAccount from '../components/users/account_activation/VerifyAccount';
+
+export default function AuthenticatedOnly() {
+  const { t } = useTranslation();
+  const currentUser = useAuth();
+
+  if (!currentUser.signed_in) {
+    toast.error(t('toast.error.signin_required'));
+    return <Navigate to="/" />;
+  }
+
+  if (!currentUser.verified) {
+    return <VerifyAccount currentUser={currentUser} />;
+  }
+
+  return <Outlet />;
+}

app/javascript/routes/UnauthenticatedOnly.jsx

+import React from 'react';
+import { Navigate, Outlet } from 'react-router-dom';
+import { useAuth } from '../contexts/auth/AuthProvider';
+
+export default function UnauthenticatedOnly() {
+  const currentUser = useAuth();
+
+  if (currentUser.signed_in) {
+    return <Navigate to="/" replace />;
+  }
+
+  return <Outlet />;
+}

public/locales/en.json

@@ -344,6 +344,7 @@
       "problem_completing_action": "There was a problem completing that action. \n Please try again.",
       "file_type_not_supported": "File type is not supported.",
       "file_size_too_large": "File size is too large.",
+      "signin_required": "You must be signed in to access this page",
       "roles": {
         "role_assigned": "This role can't be deleted as it is assigned to at least one user."
       },