Fix access without token issue

Author: qiaoen17

Frontend/src/App.js

@@ -1,11 +1,10 @@
 import './App.css';
 import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
 import 'bootstrap/dist/css/bootstrap.min.css';
-import CreateQn from './components/question/CreateQn';
-import EditQn from './components/question/EditQn';
 import Home from './components/Home';
 import Login from './components/auth/Login';
 import SignUp from './components/auth/SignUp';
+import ProtectedRoute from './components/routes/ProtectedRoute';
 
 function App() {
   return (
@@ -22,7 +21,7 @@ function App() {
           <Route path='/signup' element={<SignUp />} />
 
           {/* Home page route */}
-          <Route path='/home' element={<Home />} />
+          <Route path='/home' element={<ProtectedRoute><Home /></ProtectedRoute>} />
         </Routes>
       </BrowserRouter>
     </div>

Frontend/src/components/auth/Login.jsx

@@ -23,7 +23,15 @@ const Login = () => {
     .then(result => {
       // navigate to home page if successful
       console.log(result);
-      navigate('/home')
+      const jwt_token = result.data.data.accessToken;
+
+      if (jwt_token) {
+        sessionStorage.setItem('jwt_token', jwt_token);
+        navigate('/home');
+      } else {
+        setError('Token not found, authentication failed.');
+      }
+      
     })
     .catch(e => {
       // handle errors here 

Frontend/src/components/routes/ProtectedRoute.jsx

@@ -0,0 +1,18 @@
+import React from 'react';
+import {Navigate} from 'react-router-dom';
+
+// Authenticate user only if they log in once, token is available until they close the tab/browser for now
+const isAuthenticated = () => {
+    const token = sessionStorage.getItem('jwt_token'); // Get token stored in session storage
+    if (!token) {
+        return false;
+    }
+
+    return true;
+};
+
+const ProtectedRoute = ({children}) => {
+    return isAuthenticated() ? children : <Navigate to='/login'/>;
+};
+
+export default ProtectedRoute;