fix: Move AuthProvider to main.tsx to fix context error (Refs #2)

Frontend/src/App.tsx

@@ -1,5 +1,5 @@
 import { Routes, Route, Navigate } from 'react-router-dom';
-import { AuthProvider, useAuth } from './hooks/useAuth';
+import { useAuth } from './hooks/useAuth';
 import ProtectedRoute from './components/ProtectedRoute';
 import LoginPage from './pages/LoginPage';
 import RegisterPage from './pages/RegisterPage';
@@ -9,23 +9,21 @@ function App() {
   const { isAuthenticated } = useAuth();
 
   return (
-    <AuthProvider>
+    <Routes>
-      <Routes>
+      <Route path="/" element={
-        <Route path="/" element={
+        <Navigate to={isAuthenticated ? '/dashboard' : '/login'} replace />
-          <Navigate to={isAuthenticated ? '/dashboard' : '/login'} replace />
+      } />
-        } />
+      <Route path="/login" element={<LoginPage />} />
-        <Route path="/login" element={<LoginPage />} />
+      <Route path="/register" element={<RegisterPage />} />
-        <Route path="/register" element={<RegisterPage />} />
+      <Route 
-        <Route 
+        path="/dashboard" 
-          path="/dashboard" 
+        element={
-          element={
+          <ProtectedRoute>
-            <ProtectedRoute>
+            <DashboardPage />
-              <DashboardPage />
+          </ProtectedRoute>
-            </ProtectedRoute>
+        } 
-          } 
+      />
-        />
+    </Routes>
-      </Routes>
-    </AuthProvider>
   );
 }
 

Frontend/src/main.tsx

@@ -3,11 +3,14 @@ import { createRoot } from 'react-dom/client'
 import './index.css'
 import App from './App.tsx'
 import { BrowserRouter } from 'react-router-dom'
+import { AuthProvider } from './hooks/useAuth'
 
 createRoot(document.getElementById('root')!).render(
   <StrictMode>
     <BrowserRouter>
-      <App />
+      <AuthProvider>
+        <App />
+      </AuthProvider>
     </BrowserRouter>
   </StrictMode>,
 )