App.js

import "./App.css";
import React from "react";
import { UserProvider } from "./util/UserContext";
import {
  BrowserRouter as Router,
  Route,
  Routes,
  Navigate,
} from "react-router-dom";

import Home from "./components/Home";
import Login from "./components/Login";

// Returns true if localstorage has an authToken item
const isAuthenticated = () => {
  return localStorage.getItem("authToken") ? true : false;
};

function App() {
  return (
    <UserProvider>
      <Router>
        <div className="App">
          <Routes>
            {/* If authenticated, show Home; otherwise, redirect to /login */}
            <Route
              path="/"
              element={isAuthenticated() ? <Home /> : <Navigate to="/login" />}
            />
            {/* Login route */}
            <Route path="/login" element={<Login />} />
          </Routes>
        </div>
      </Router>
    </UserProvider>
  );
}

export default App;