Readur/frontend/src/App.tsx

94 lines
3.5 KiB
TypeScript

import React from 'react';
import { Routes, Route, Navigate } from 'react-router-dom';
import { CssBaseline } from '@mui/material';
import { useAuth } from './contexts/AuthContext';
import { ThemeProvider } from './contexts/ThemeContext';
import { NotificationProvider } from './contexts/NotificationContext';
import Login from './components/Auth/Login';
import OidcCallback from './components/Auth/OidcCallback';
import AppLayout from './components/Layout/AppLayout';
import Dashboard from './components/Dashboard/Dashboard';
import UploadPage from './pages/UploadPage';
import DocumentsPage from './pages/DocumentsPage';
import SearchPage from './pages/SearchPage';
import DocumentDetailsPage from './pages/DocumentDetailsPage';
import SettingsPage from './pages/SettingsPage';
import SourcesPage from './pages/SourcesPage';
import WatchFolderPage from './pages/WatchFolderPage';
import FailedOcrPage from './pages/FailedOcrPage';
import LabelsPage from './pages/LabelsPage';
import IgnoredFilesPage from './pages/IgnoredFilesPage';
function App(): React.ReactElement {
const { user, loading } = useAuth();
if (loading) {
return (
<ThemeProvider>
<CssBaseline />
<div style={{
minHeight: '100vh',
display: 'flex',
alignItems: 'center',
justifyContent: 'center',
background: 'linear-gradient(135deg, #667eea 0%, #764ba2 100%)',
}}>
<div style={{
width: '40px',
height: '40px',
border: '4px solid rgba(255, 255, 255, 0.3)',
borderTop: '4px solid white',
borderRadius: '50%',
animation: 'spin 1s linear infinite',
}} />
<style>{`
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
`}</style>
</div>
</ThemeProvider>
);
}
return (
<ThemeProvider>
<CssBaseline />
<Routes>
<Route path="/login" element={!user ? <Login /> : <Navigate to="/dashboard" />} />
<Route path="/auth/oidc/callback" element={<OidcCallback />} />
<Route
path="/*"
element={
user ? (
<NotificationProvider>
<AppLayout>
<Routes>
<Route path="/" element={<Navigate to="/dashboard" />} />
<Route path="/dashboard" element={<Dashboard />} />
<Route path="/upload" element={<UploadPage />} />
<Route path="/documents" element={<DocumentsPage />} />
<Route path="/documents/:id" element={<DocumentDetailsPage />} />
<Route path="/search" element={<SearchPage />} />
<Route path="/labels" element={<LabelsPage />} />
<Route path="/sources" element={<SourcesPage />} />
<Route path="/watch" element={<WatchFolderPage />} />
<Route path="/settings" element={<SettingsPage />} />
<Route path="/failed-ocr" element={<FailedOcrPage />} />
<Route path="/ignored-files" element={<IgnoredFilesPage />} />
<Route path="/profile" element={<div>Profile Page - Coming Soon</div>} />
</Routes>
</AppLayout>
</NotificationProvider>
) : (
<Navigate to="/login" />
)
}
/>
</Routes>
</ThemeProvider>
);
}
export default App;