admin/src/App.tsx

104 lines
4.2 KiB
TypeScript

import { BrowserRouter as Router, Routes, Route, Navigate } from 'react-router-dom';
import { QueryClientProvider } from '@tanstack/react-query';
import { ReactQueryDevtools } from '@tanstack/react-query-devtools';
import { AuthProvider } from './contexts/AuthContext';
import { ThemeProvider } from './contexts/ThemeContext';
import { ToastProvider } from './contexts/ToastContext';
import { ErrorBoundary } from './components/common/ErrorBoundary';
import { LoadingSpinner } from './components/ui/LoadingSpinner';
import { queryClient } from './lib/queryClient';
import { useAuth } from './contexts/AuthContext';
import { Login } from './pages/Login';
import { Dashboard } from './pages/Dashboard';
import { Users } from './pages/Users';
import Products from './pages/Products';
import { Orders } from './pages/Orders';
import { Reports } from './pages/Reports';
import { Notifications } from './pages/Notifications';
import { Layout } from './components/layout/Layout';
// Roles Pages
import RolesListPage from './pages/roles/roles-list/RolesListPage';
import RoleFormPage from './pages/roles/role-form/RoleFormPage';
import RoleDetailPage from './pages/roles/role-detail/RoleDetailPage';
import RolePermissionsPage from './pages/roles/role-permissions/RolePermissionsPage';
// Admin Users Pages
import AdminUsersListPage from './pages/admin-users/admin-users-list/AdminUsersListPage';
import AdminUserFormPage from './pages/admin-users/admin-user-form/AdminUserFormPage';
// Permissions Pages
import PermissionsListPage from './pages/permissions/permissions-list/PermissionsListPage';
import PermissionFormPage from './pages/permissions/permission-form/PermissionFormPage';
const ProtectedRoute = ({ children }: { children: any }) => {
const { user, isLoading } = useAuth();
if (isLoading) {
return (
<div className="min-h-screen flex items-center justify-center">
<LoadingSpinner />
</div>
);
}
return user ? children : <Navigate to="/login" replace />;
};
const AppRoutes = () => {
return (
<Routes>
<Route path="/login" element={<Login />} />
<Route path="/" element={
<ProtectedRoute>
<Layout />
</ProtectedRoute>
}>
<Route index element={<Dashboard />} />
<Route path="users" element={<Users />} />
<Route path="products" element={<Products />} />
<Route path="orders" element={<Orders />} />
<Route path="reports" element={<Reports />} />
<Route path="notifications" element={<Notifications />} />
{/* Roles Routes */}
<Route path="roles" element={<RolesListPage />} />
<Route path="roles/create" element={<RoleFormPage />} />
<Route path="roles/:id" element={<RoleDetailPage />} />
<Route path="roles/:id/edit" element={<RoleFormPage />} />
<Route path="roles/:id/permissions" element={<RolePermissionsPage />} />
{/* Admin Users Routes */}
<Route path="admin-users" element={<AdminUsersListPage />} />
<Route path="admin-users/create" element={<AdminUserFormPage />} />
<Route path="admin-users/:id/edit" element={<AdminUserFormPage />} />
{/* Permissions Routes */}
<Route path="permissions" element={<PermissionsListPage />} />
<Route path="permissions/create" element={<PermissionFormPage />} />
<Route path="permissions/:id/edit" element={<PermissionFormPage />} />
</Route>
</Routes>
);
};
const App = () => {
return (
<ErrorBoundary>
<QueryClientProvider client={queryClient}>
<ThemeProvider>
<ToastProvider>
<AuthProvider>
<Router>
<AppRoutes />
</Router>
</AuthProvider>
</ToastProvider>
</ThemeProvider>
<ReactQueryDevtools initialIsOpen={false} />
</QueryClientProvider>
</ErrorBoundary>
);
};
export default App;