Add Route Protection

Author: zntb

frontend/src/App.js

@@ -17,7 +17,7 @@ import AuthenticationPage, {
   action as authAction,
 } from './pages/Authentication';
 import { action as logoutAction } from './pages/Logout';
-import { tokenLoader } from './util/auth';
+import { checkAuthLoader, tokenLoader } from './util/auth';
 
 const router = createBrowserRouter([
   {
@@ -56,13 +56,15 @@ const router = createBrowserRouter([
                 path: 'edit',
                 element: <EditEventPage />,
                 action: manipulateEventAction,
+                loader: checkAuthLoader,
               },
             ],
           },
           {
             path: 'new',
             element: <NewEventPage />,
             action: manipulateEventAction,
+            loader: checkAuthLoader,
           },
         ],
       },

frontend/src/util/auth.js

@@ -1,3 +1,5 @@
+import { redirect } from 'react-router-dom';
+
 export function getAuthToken() {
   const token = localStorage.getItem('token');
   return token;
@@ -6,3 +8,13 @@ export function getAuthToken() {
 export function tokenLoader() {
   return getAuthToken();
 }
+
+export function checkAuthLoader() {
+  const token = getAuthToken();
+
+  if (!token) {
+    return redirect('/auth');
+  }
+
+  return null;
+}