import React, { lazy, Suspense } from 'react';
import { BrowserRouter as Router, Routes, Route } from 'react-router-dom';
import LoadingState from './components/ui/LoadingState';
import MainLayout from './layouts';

const OperationAgent = lazy(() => import('./pages/OperationAgent'));
const OperationAgentEnhanced = lazy(() => import('./pages/OperationAgentEnhanced'));
const Homepage = lazy(() => import('./pages/Homepage'));
const Pricing = lazy(() => import('./pages/Pricing'));
const CaseStudy = lazy(() => import('./pages/CaseStudy'));
const LoginPage = lazy(() => import('./pages/Auth/LoginPage'));
const RegisterPage = lazy(() => import('./pages/Auth/RegisterPage'));

const AuditPage = lazy(() => import('./pages/Audit'));
const ChatbotPage = lazy(() => import('./pages/Chatbot'));
const CommandPage = lazy(() => import('./pages/Command'));
const CreativePage = lazy(() => import('./pages/Creative'));
const CustomerPage = lazy(() => import('./pages/Customer'));
const GovernancePage = lazy(() => import('./pages/Governance'));
const MonitoringPage = lazy(() => import('./pages/Monitoring'));
const NLPPage = lazy(() => import('./pages/NLP'));
const OmnichannelPage = lazy(() => import('./pages/Omnichannel'));
const OrderFulfillmentPage = lazy(() => import('./pages/OrderFulfillment'));
const RecommendationPage = lazy(() => import('./pages/Recommendation'));
const SovereigntyPage = lazy(() => import('./pages/Sovereignty'));
const SyncPage = lazy(() => import('./pages/Sync'));
const TelemetryPage = lazy(() => import('./pages/Telemetry'));
const TracePage = lazy(() => import('./pages/Trace'));
const VaultPage = lazy(() => import('./pages/Vault'));
const WebhookPage = lazy(() => import('./pages/Webhook'));
const AdPage = lazy(() => import('./pages/Ad'));
const ProcurementPage = lazy(() => import('./pages/Procurement'));
const WarehousePage = lazy(() => import('./pages/Warehouse'));
const OrderListRefactored = lazy(() => import('./pages/Orders/OrderListRefactored'));
const AutoExecutionPage = lazy(() => import('./pages/AutoExecution'));
const AutoPilotPage = lazy(() => import('./pages/AutoPilot'));

const AppRouter: React.FC = () => {
  return (
    <Router>
      <Suspense fallback={<LoadingState fullScreen={true} />}>
        <Routes>
          <Route path="/" element={<Homepage />} />
          <Route path="/pricing" element={<Pricing />} />
          <Route path="/case-study" element={<CaseStudy />} />
          <Route path="/case-study/:id" element={<CaseStudy />} />
          
          <Route path="/auth/login" element={<LoginPage />} />
          <Route path="/auth/register" element={<RegisterPage />} />
          
          <Route path="/operation-agent" element={<OperationAgent />} />
          <Route path="/operation-agent-enhanced" element={<OperationAgentEnhanced />} />
          
          <Route path="/dashboard" element={<MainLayout />}>
            <Route index element={<OperationAgent />} />
            <Route path="ad" element={<AdPage />} />
            <Route path="audit" element={<AuditPage />} />
            <Route path="chatbot" element={<ChatbotPage />} />
            <Route path="command" element={<CommandPage />} />
            <Route path="creative" element={<CreativePage />} />
            <Route path="customer" element={<CustomerPage />} />
            <Route path="governance" element={<GovernancePage />} />
            <Route path="monitoring" element={<MonitoringPage />} />
            <Route path="nlp" element={<NLPPage />} />
            <Route path="omnichannel" element={<OmnichannelPage />} />
            <Route path="order-fulfillment" element={<OrderFulfillmentPage />} />
            <Route path="recommendation" element={<RecommendationPage />} />
            <Route path="sovereignty" element={<SovereigntyPage />} />
            <Route path="sync" element={<SyncPage />} />
            <Route path="telemetry" element={<TelemetryPage />} />
            <Route path="trace" element={<TracePage />} />
            <Route path="vault" element={<VaultPage />} />
            <Route path="webhook" element={<WebhookPage />} />
            <Route path="procurement" element={<ProcurementPage />} />
            <Route path="warehouse" element={<WarehousePage />} />
            <Route path="orders" element={<OrderListRefactored />} />
            <Route path="auto-execution" element={<AutoExecutionPage />} />
            <Route path="auto-pilot" element={<AutoPilotPage />} />
          </Route>
        </Routes>
      </Suspense>
    </Router>
  );
};

export default AppRouter;