import { createBrowserRouter, Navigate } from 'react-router';
import { lazy, Suspense } from 'react';
import { AppShell } from './components/layout/AppShell';
import { ProtectedRoute } from './auth/ProtectedRoute';
import { LoginPage } from './auth/LoginPage';
import { OidcCallback } from './auth/OidcCallback';
import { ExecutionExplorer } from './pages/executions/ExecutionExplorer';
import { OidcAdminPage } from './pages/admin/OidcAdminPage';
import { RoutePage } from './pages/routes/RoutePage';
import { ApplicationsPage } from './pages/apps/ApplicationsPage';

const SwaggerPage = lazy(() => import('./pages/swagger/SwaggerPage').then(m => ({ default: m.SwaggerPage })));

export const router = createBrowserRouter([
  {
    path: '/login',
    element: <LoginPage />,
  },
  {
    path: '/oidc/callback',
    element: <OidcCallback />,
  },
  {
    element: <ProtectedRoute />,
    children: [
      {
        element: <AppShell />,
        children: [
          { index: true, element: <Navigate to="/executions" replace /> },
          { path: 'executions', element: <ExecutionExplorer /> },
          { path: 'apps', element: <ApplicationsPage /> },
          { path: 'apps/:group/routes/:routeId', element: <RoutePage /> },
          { path: 'admin/oidc', element: <OidcAdminPage /> },
          { path: 'swagger', element: <Suspense fallback={null}><SwaggerPage /></Suspense> },
        ],
      },
    ],
  },
]);