Remove narbar and two previous pages

frontend/src/App.tsx

@@ -1,26 +1,17 @@
 import { FC } from 'react';
 import { BrowserRouter as Router, Navigate } from 'react-router-dom';
 
-import Navbar from './Components/Navbar';
-import RoadConditions from './pages/RoadConditions';
-import Conditions from './pages/Conditions';
-
 import './App.css';
-
 import { Route, Routes } from 'react-router-dom';
 import RoadDetails from './pages/RoadDetails';
-import './App.css';
-import './css/roadDetails.css';
 
 const App: FC = () => {
   return (
     <div className="App">
       <Router>
-        <Navbar />
         <Routes>
-          <Route index element={<Navigate to="/conditions" replace />} />
-          <Route path="/conditions" element={<Conditions />} />
-          <Route path="/road_conditions" element={<RoadConditions />} />
+          <Route index element={<Navigate to="/road-details" replace />} />
+
           <Route path="/road-details" element={<RoadDetails />} />
         </Routes>
       </Router>

frontend/src/Components/roadDetails/TopBar.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { Link, useNavigate } from 'react-router-dom';
+import { Link, useNavigate } from 'react-router-dom'; // Import useNavigate
 
 interface TopBarProps {
   setShowMiddleArea2: React.Dispatch<React.SetStateAction<boolean>>;
@@ -22,7 +22,7 @@ const return_btn = (
 );
 
 const TopBar: React.FC<TopBarProps> = ({ setShowMiddleArea2 }) => {
-  const navigate = useNavigate();
+  const navigate = useNavigate(); // Get the navigate function
 
   const handleReturn = () => {
     // Navigate back to the home page when the button is clicked
@@ -54,48 +54,3 @@ const TopBar: React.FC<TopBarProps> = ({ setShowMiddleArea2 }) => {
 };
 
 export default TopBar;
-
-// import React, { useState } from 'react';
-// import { Link, useNavigate } from 'react-router-dom';
-
-// const return_btn = (
-//   <svg
-//     xmlns="http://www.w3.org/2000/svg"
-//     width="16"
-//     height="16"
-//     fill="currentColor"
-//     className="btn bi bi-chevron-left btnWhite"
-//     viewBox="0 0 16 16"
-//   >
-//     <path
-//       fillRule="evenodd"
-//       d="M11.354 1.646a.5.5 0 0 1 0 .708L5.707 8l5.647 5.646a.5.5 0 0 1-.708.708l-6-6a.5.5 0 0 1 0-.708l6-6a.5.5 0 0 1 .708 0z"
-//     />
-//   </svg>
-// );
-
-// const TopBar: React.FC = () => {
-//   const navigate = useNavigate();
-//   const [showMiddleArea2, setShowMiddleArea2] = useState(false);
-
-//   const handleReturn = () => {
-//     // Navigate back to the home page when the button is clicked
-//     navigate('/');
-//   };
-
-//   const handleToggleMiddleArea = () => {
-//     // Toggle the state to show/hide MiddleArea2
-//     setShowMiddleArea2((prevState) => !prevState);
-//   };
-
-//   return (
-//     <div className="top-bar">
-//       <Link to="/" onClick={handleReturn} className="btnLinkContainer">
-//         {return_btn}
-//       </Link>
-//       <button onClick={handleToggleMiddleArea}>Toggle Middle Area</button>
-//     </div>
-//   );
-// };
-
-// export default TopBar;