russ_react/src/App.tsx

74 lines
2.2 KiB
TypeScript

import { useEffect } from 'react';
import { BrowserRouter, Routes, Route } from 'react-router-dom';
import axios from 'axios';
import { useAuthStore } from './stores/authStore';
import { HomePage } from './pages/HomePage';
import { ArticlePage } from './pages/ArticlePage';
import { AdminPage } from './pages/AdminPage';
import { LoginPage } from './pages/LoginPage';
import { UserManagementPage } from './pages/UserManagementPage';
import { SearchPage } from './pages/SearchPage';
import { BookmarksPage } from './pages/BookmarksPage';
import { Footer } from './components/Footer';
import { AuthGuard } from './components/AuthGuard';
function App() {
const { setUser, setLoading } = useAuthStore();
useEffect(() => {
const token = localStorage.getItem('token');
if (token) {
setLoading(true);
axios.get('http://localhost:5000/api/auth/me', {
headers: { Authorization: `Bearer ${token}` }
})
.then(response => {
setUser(response.data);
})
.catch(() => {
localStorage.removeItem('token');
setUser(null);
})
.finally(() => {
setLoading(false);
});
} else {
setLoading(false);
}
}, [setUser, setLoading]);
return (
<BrowserRouter>
<div className="min-h-screen bg-gray-50 flex flex-col">
<div className="flex-1">
<Routes>
<Route path="/" element={<HomePage />} />
<Route path="/article/:id" element={<ArticlePage />} />
<Route path="/search" element={<SearchPage />} />
<Route path="/bookmarks" element={<BookmarksPage />} />
<Route path="/login" element={<LoginPage />} />
<Route
path="/admin"
element={
<AuthGuard>
<AdminPage />
</AuthGuard>
}
/>
<Route
path="/admin/users"
element={
<AuthGuard>
<UserManagementPage />
</AuthGuard>
}
/>
</Routes>
</div>
<Footer />
</div>
</BrowserRouter>
);
}
export default App;