diff --git a/src/App.jsx b/src/App.jsx
index a17dd8e..dafa0ce 100644
--- a/src/App.jsx
+++ b/src/App.jsx
@@ -1,10 +1,31 @@
-import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom';
+import { BrowserRouter, Routes, Route, Navigate, useNavigate, useLocation } from 'react-router-dom';
+import { useEffect, useRef } from 'react';
import { AuthProvider, useAuth } from './context/AuthContext';
import LoginPage from './pages/LoginPage';
import RegisterPage from './pages/RegisterPage';
import HomePage from './pages/HomePage';
import AdminPage from './pages/AdminPage';
+function AuthRedirect() {
+ const { user } = useAuth();
+ const navigate = useNavigate();
+ const location = useLocation();
+ const prevUserRef = useRef(user);
+
+ useEffect(() => {
+ if (prevUserRef.current && !user) {
+ if (location.pathname.startsWith('/admin')) {
+ navigate('/', { replace: true });
+ } else {
+ navigate('/login', { replace: true });
+ }
+ }
+ prevUserRef.current = user;
+ }, [user, navigate, location.pathname]);
+
+ return null;
+}
+
function AdminRoute({ children }) {
const { user } = useAuth();
if (!user) return ;
@@ -15,19 +36,22 @@ function AdminRoute({ children }) {
function AppRoutes() {
const { user } = useAuth();
return (
-
- : } />
- : } />
- } />
-
-
-
- }
- />
-
+ <>
+
+
+ : } />
+ : } />
+ } />
+
+
+
+ }
+ />
+
+ >
);
}
diff --git a/src/api/client.js b/src/api/client.js
index 72680a8..1ab9630 100644
--- a/src/api/client.js
+++ b/src/api/client.js
@@ -6,6 +6,9 @@ export async function apiFetch(path, options = {}) {
if (token) headers['Authorization'] = `Bearer ${token}`;
const res = await fetch(BASE + path, { ...options, headers });
+ if (res.status === 401) {
+ window.dispatchEvent(new Event('auth:unauthorized'));
+ }
if (!res.ok) {
const err = new Error(res.statusText);
err.status = res.status;
diff --git a/src/context/AuthContext.jsx b/src/context/AuthContext.jsx
index 8349209..867ccfd 100644
--- a/src/context/AuthContext.jsx
+++ b/src/context/AuthContext.jsx
@@ -1,4 +1,4 @@
-import { createContext, useContext, useState, useCallback } from 'react';
+import { createContext, useContext, useState, useCallback, useEffect } from 'react';
import { login as apiLogin } from '../api/auth';
const AuthContext = createContext(null);
@@ -26,6 +26,11 @@ export function AuthProvider({ children }) {
setUser(null);
}, []);
+ useEffect(() => {
+ window.addEventListener('auth:unauthorized', logout);
+ return () => window.removeEventListener('auth:unauthorized', logout);
+ }, [logout]);
+
return (
{children}