import { lazy, Suspense, type ReactNode } from "react";
import { BrowserRouter as Router, Navigate, Outlet, Route, Routes, useLocation } from "react-router-dom";
import { Toaster } from "sonner";
import "./App.css";
import { AuthProvider } from "./contexts/AuthContext";
import { AutoRedirector } from "./components/auth/AutoRedirector";
import { MainLayout } from "./components/layout/MainLayout";
import { RouteLoading } from "./components/ui/route-loading";

const Index = lazy(() => import("./pages/Index"));
const About = lazy(() => import("./pages/About"));
const Login = lazy(() => import("./pages/Login"));
const Signup = lazy(() => import("./pages/Signup"));
const NotFound = lazy(() => import("./pages/NotFound"));
const AuthCallbackPage = lazy(() => import("./pages/AuthCallback"));
const CompleteSignupPage = lazy(() => import("./pages/auth/CompleteSignupPage"));
const ForgotPassword = lazy(() => import("./pages/ForgotPassword"));
const ResetPassword = lazy(() => import("./pages/ResetPassword"));
const Architecture = lazy(() => import("./pages/Architecture"));
const PlannerProtectedLayout = lazy(() => import("./components/layout/PlannerProtectedLayout"));
const TravelerProtectedLayout = lazy(() => import("./components/layout/TravelerProtectedLayout"));
const PlannerDashboard = lazy(() => import("./pages/planner/Dashboard"));
const PlannerTripsPage = lazy(() => import("./pages/planner/TripsPage"));
const CreateTripPage = lazy(() => import("./pages/planner/CreateTripPage"));
const TripWorkspaceLayout = lazy(() => import("./components/workspace/TripWorkspaceLayout").then((module) => ({ default: module.TripWorkspaceLayout })));
const TripItineraryPage = lazy(() => import('./pages/planner/workspace/ItineraryPage'));
const TripWorkspaceTravelersPage = lazy(() => import("./pages/planner/workspace/TravelersPage"));
const TripWorkspaceDocumentsPage = lazy(() => import("./pages/planner/workspace/DocumentsPage"));
const TripMessagesPage = lazy(() => import("./pages/planner/workspace/MessagesPage"));
const TripSettingsPage = lazy(() => import("./pages/planner/workspace/PlaceholderPage").then((module) => ({ default: module.TripSettingsPage })));
const LegacyTripSectionRedirect = lazy(() => import("./components/workspace/LegacyTripSectionRedirect").then((module) => ({ default: module.LegacyTripSectionRedirect })));
const PlannerTravelersPage = lazy(() => import("./pages/planner/TravelersPage"));
const PlannerDocumentsPage = lazy(() => import("./pages/planner/DocumentsPage"));
const PlannerClientsPage = lazy(() => import("./pages/planner/ClientsPage"));
const PlannerActivityPage = lazy(() => import("./pages/planner/ActivityPage"));
const PlannerTemplatesPage = lazy(() => import('./pages/planner/TemplatesPage'));
const PlannerSettingsPage = lazy(() => import("./pages/planner/SettingsPage"));
const PlannerHelpPage = lazy(() => import("./pages/planner/HelpPage"));
const TravelerDashboard = lazy(() => import('./pages/traveler/Dashboard'));
const TravelerTripDetailPage = lazy(() => import('./pages/traveler/TripDetailPage'));
const TravelerDocumentsPage = lazy(() => import('./pages/traveler/DocumentsPage'));
const TravelerMorePage = lazy(() => import('./pages/traveler/MorePage'));

const deferred = (element: ReactNode) => <Suspense fallback={<RouteLoading />}>{element}</Suspense>;
const TripIndexRedirect = () => { const { search } = useLocation(); return <Navigate to={`itinerary${search}`} replace />; };

function App() {
  return <AuthProvider><Router><AutoRedirector /><Suspense fallback={<RouteLoading />}><Routes>
    <Route path="/" element={<MainLayout><Outlet /></MainLayout>}>
      <Route index element={<Index />} /><Route path="about" element={<About />} /><Route path="login" element={<Login />} /><Route path="signup" element={<Signup />} /><Route path="architecture" element={<Architecture />} /><Route path="forgot-password" element={<ForgotPassword />} /><Route path="reset-password" element={<ResetPassword />} />
    </Route>
    <Route path="/auth"><Route path="callback" element={<AuthCallbackPage />} /><Route path="complete-signup" element={<MainLayout><CompleteSignupPage /></MainLayout>} /></Route>
    <Route path="/dashboard" element={<PlannerProtectedLayout />}>
      <Route index element={<PlannerDashboard />} /><Route path="trips"><Route index element={<PlannerTripsPage />} /><Route path="create" element={<CreateTripPage />} /><Route path=":tripId" element={<TripWorkspaceLayout />}><Route index element={<TripIndexRedirect />} /><Route path="itinerary" element={deferred(<TripItineraryPage />)} /><Route path="travelers" element={<TripWorkspaceTravelersPage />} /><Route path="documents" element={<TripWorkspaceDocumentsPage />} /><Route path="messages" element={<TripMessagesPage />} /><Route path="settings" element={<TripSettingsPage />} /><Route path="preview" element={deferred(<TravelerTripDetailPage preview />)} /></Route></Route>
      <Route path="documents/:tripId" element={<LegacyTripSectionRedirect section="documents" />} /><Route path="travelers" element={<PlannerTravelersPage />} /><Route path="documents" element={<PlannerDocumentsPage />} /><Route path="clients" element={<PlannerClientsPage />} /><Route path="activity" element={<PlannerActivityPage />} /><Route path="templates" element={deferred(<PlannerTemplatesPage />)} /><Route path="settings" element={<PlannerSettingsPage />} /><Route path="help" element={<PlannerHelpPage />} /><Route path="architecture" element={<Architecture />} />
    </Route>
    <Route path="/voyageur" element={<TravelerProtectedLayout />}>
      <Route index element={<Navigate to="/voyageur/dashboard" replace />} /><Route path="dashboard" element={deferred(<TravelerDashboard />)} /><Route path="trips/:tripId" element={deferred(<TravelerTripDetailPage />)} /><Route path="documents" element={<TravelerDocumentsPage />} /><Route path="documents/:tripId" element={deferred(<TravelerDocumentsPage />)} /><Route path="more" element={deferred(<TravelerMorePage />)} /><Route path="architecture" element={<Architecture />} />
    </Route>
    <Route path="*" element={<NotFound />} />
  </Routes></Suspense><Toaster position="top-center" closeButton richColors /></Router></AuthProvider>;
}

export default App;
