import { StrictMode, type ReactNode } from 'react';
import { createRoot } from 'react-dom/client';
import { BrowserRouter, Navigate, Route, Routes } from 'react-router-dom';
import { QueryClient, QueryClientProvider } from '@tanstack/react-query';
import { AppLayout } from './components/layout/app-layout';
import { RequireAdmin, RequireAuth } from './components/route-guards';
import { ToastProvider } from './components/ui/toast';
import { AuthProvider } from './features/auth/auth-context';
import { LoginPage } from './features/auth/login-page';
import { DashboardPage } from './features/dashboard/dashboard-page';
import { SystemStatusPage } from './features/admin/system-status-page';
import { UsersPage } from './features/admin/users-page';
import { ModulesPage } from './features/admin/modules-page';
import { AuditPage } from './features/admin/audit-page';
import { ForbiddenPage, NotFoundPage } from './pages/error-pages';
import './index.css';

document.documentElement.dataset.theme =
  localStorage.getItem('mpm-theme') === 'dark' ? 'dark' : 'light';

/** TanStack Query: keine automatischen Refetches bei Fensterfokus. */
const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      retry: 1,
      refetchOnWindowFocus: false,
      staleTime: 30_000,
    },
  },
});

/** Routenbaum der Management-Plattform. */
function AppRoutes(): ReactNode {
  return (
    <Routes>
      <Route path="/login" element={<LoginPage />} />

      <Route element={<RequireAuth><AppLayout /></RequireAuth>}>
        <Route path="/" element={<DashboardPage />} />
        <Route
          path="/admin/users"
          element={<RequireAdmin><UsersPage /></RequireAdmin>}
        />
        <Route
          path="/admin/modules"
          element={<RequireAdmin><ModulesPage /></RequireAdmin>}
        />
        <Route
          path="/admin/system"
          element={<RequireAdmin><SystemStatusPage /></RequireAdmin>}
        />
        <Route
          path="/admin/audit"
          element={<RequireAdmin><AuditPage /></RequireAdmin>}
        />
        <Route path="/403" element={<ForbiddenPage />} />
      </Route>

      <Route path="*" element={<Navigate to="/404" replace />} />
      <Route path="/404" element={<NotFoundPage />} />
    </Routes>
  );
}

const rootElement = document.getElementById('root');
if (!rootElement) {
  throw new Error('Root-Element nicht gefunden');
}

createRoot(rootElement).render(
  <StrictMode>
    <QueryClientProvider client={queryClient}>
      <BrowserRouter>
        <AuthProvider>
          <ToastProvider>
            <AppRoutes />
          </ToastProvider>
        </AuthProvider>
      </BrowserRouter>
    </QueryClientProvider>
  </StrictMode>,
);