import React, { Suspense } from 'react';
import { Routes, Route, Navigate } from 'react-router-dom';
import { ProtectedRoute } from './ProtectedRoute';
import { LoadingSpinner } from '../components/ui';
import { AppShell } from '../components/layout';

// Lazy load the pages we actually have
const LandingPage = React.lazy(() => import('../pages/public/LandingPage'));
const LoginPage = React.lazy(() => import('../pages/public/LoginPage'));
const RegisterPage = React.lazy(() => import('../pages/public/RegisterPage'));
const DemoPage = React.lazy(() => import('../pages/public/DemoPage'));
const PrivacyPolicyPage = React.lazy(() => import('../pages/public/PrivacyPolicyPage'));
const TermsOfServicePage = React.lazy(() => import('../pages/public/TermsOfServicePage'));
const CookiePolicyPage = React.lazy(() => import('../pages/public/CookiePolicyPage'));
const CookiePreferencesPage = React.lazy(() => import('../pages/public/CookiePreferencesPage'));
const BlogPage = React.lazy(() => import('../pages/public/BlogPage'));
const AboutPage = React.lazy(() => import('../pages/public/AboutPage'));
const CareersPage = React.lazy(() => import('../pages/public/CareersPage'));
const HelpCenterPage = React.lazy(() => import('../pages/public/HelpCenterPage'));
const DocumentationPage = React.lazy(() => import('../pages/public/DocumentationPage'));
const ContactPage = React.lazy(() => import('../pages/public/ContactPage'));
const FeedbackPage = React.lazy(() => import('../pages/public/FeedbackPage'));
const DashboardPage = React.lazy(() => import('../pages/app/DashboardPage'));

// Operations pages
const InventoryPage = React.lazy(() => import('../pages/app/operations/inventory/InventoryPage'));
const ProductionPage = React.lazy(() => import('../pages/app/operations/production/ProductionPage'));
const RecipesPage = React.lazy(() => import('../pages/app/operations/recipes/RecipesPage'));
const ProcurementPage = React.lazy(() => import('../pages/app/operations/procurement/ProcurementPage'));
const SuppliersPage = React.lazy(() => import('../pages/app/operations/suppliers/SuppliersPage'));
const OrdersPage = React.lazy(() => import('../pages/app/operations/orders/OrdersPage'));
const POSPage = React.lazy(() => import('../pages/app/operations/pos/POSPage'));
const MaquinariaPage = React.lazy(() => import('../pages/app/operations/maquinaria/MaquinariaPage'));

// Analytics pages
const ProductionAnalyticsPage = React.lazy(() => import('../pages/app/analytics/ProductionAnalyticsPage'));
const ProcurementAnalyticsPage = React.lazy(() => import('../pages/app/analytics/ProcurementAnalyticsPage'));
const ForecastingPage = React.lazy(() => import('../pages/app/analytics/forecasting/ForecastingPage'));
const SalesAnalyticsPage = React.lazy(() => import('../pages/app/analytics/sales-analytics/SalesAnalyticsPage'));
const ScenarioSimulationPage = React.lazy(() => import('../pages/app/analytics/scenario-simulation/ScenarioSimulationPage'));
const AIInsightsPage = React.lazy(() => import('../pages/app/analytics/ai-insights/AIInsightsPage'));
const PerformanceAnalyticsPage = React.lazy(() => import('../pages/app/analytics/performance/PerformanceAnalyticsPage'));


// Settings pages - Unified
const BakerySettingsPage = React.lazy(() => import('../pages/app/settings/bakery/BakerySettingsPage'));
const NewProfileSettingsPage = React.lazy(() => import('../pages/app/settings/profile/NewProfileSettingsPage'));
const SubscriptionPage = React.lazy(() => import('../pages/app/settings/subscription/SubscriptionPage'));
const TeamPage = React.lazy(() => import('../pages/app/settings/team/TeamPage'));
const OrganizationsPage = React.lazy(() => import('../pages/app/settings/organizations/OrganizationsPage'));

// Database pages
const DatabasePage = React.lazy(() => import('../pages/app/database/DatabasePage'));
const ModelsConfigPage = React.lazy(() => import('../pages/app/database/models/ModelsConfigPage'));
const QualityTemplatesPage = React.lazy(() => import('../pages/app/database/quality-templates/QualityTemplatesPage'));

// Data pages
const WeatherPage = React.lazy(() => import('../pages/app/data/weather/WeatherPage'));
const TrafficPage = React.lazy(() => import('../pages/app/data/traffic/TrafficPage'));
const EventsPage = React.lazy(() => import('../pages/app/data/events/EventsPage'));

// Onboarding pages
const OnboardingPage = React.lazy(() => import('../pages/onboarding/OnboardingPage'));

export const AppRouter: React.FC = () => {
  return (
    <Suspense fallback={<LoadingSpinner overlay text="Cargando aplicación..." />}>
      <Routes>
        {/* Public Routes */}
        <Route path="/" element={<LandingPage />} />
        <Route path="/login" element={<LoginPage />} />
        <Route path="/register" element={<RegisterPage />} />
        <Route path="/demo" element={<DemoPage />} />

        {/* Company Routes - Public */}
        <Route path="/blog" element={<BlogPage />} />
        <Route path="/about" element={<AboutPage />} />
        <Route path="/careers" element={<CareersPage />} />

        {/* Help & Support Routes - Public */}
        <Route path="/help" element={<HelpCenterPage />} />
        <Route path="/help/docs" element={<DocumentationPage />} />
        <Route path="/help/support" element={<ContactPage />} />
        <Route path="/help/feedback" element={<FeedbackPage />} />

        {/* Legal & Privacy Routes - Public */}
        <Route path="/privacy" element={<PrivacyPolicyPage />} />
        <Route path="/terms" element={<TermsOfServicePage />} />
        <Route path="/cookies" element={<CookiePolicyPage />} />
        <Route path="/cookie-preferences" element={<CookiePreferencesPage />} />
        
        {/* Protected Routes with AppShell Layout */}
        <Route 
          path="/app" 
          element={
            <ProtectedRoute>
              <AppShell>
                <DashboardPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />
        <Route 
          path="/app/dashboard" 
          element={
            <ProtectedRoute>
              <AppShell>
                <DashboardPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />

        {/* Operations Routes - Business Operations Only */}
        <Route
          path="/app/operations/procurement"
          element={
            <ProtectedRoute>
              <AppShell>
                <ProcurementPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/operations/production"
          element={
            <ProtectedRoute>
              <AppShell>
                <ProductionPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/operations/pos"
          element={
            <ProtectedRoute>
              <AppShell>
                <POSPage />
              </AppShell>
            </ProtectedRoute>
          }
        />

        {/* Database Routes - Current Bakery Status */}
        <Route
          path="/app/database"
          element={
            <ProtectedRoute>
              <AppShell>
                <DatabasePage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/recipes"
          element={
            <ProtectedRoute>
              <AppShell>
                <RecipesPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/orders"
          element={
            <ProtectedRoute>
              <AppShell>
                <OrdersPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/suppliers"
          element={
            <ProtectedRoute>
              <AppShell>
                <SuppliersPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/inventory"
          element={
            <ProtectedRoute>
              <AppShell>
                <InventoryPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        {/* NEW: Unified Bakery Settings Route */}
        <Route
          path="/app/settings/bakery"
          element={
            <ProtectedRoute>
              <AppShell>
                <BakerySettingsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        {/* Legacy routes redirect to new unified page */}
        <Route path="/app/database/information" element={<Navigate to="/app/settings/bakery" replace />} />
        <Route path="/app/database/ajustes" element={<Navigate to="/app/settings/bakery" replace />} />
        <Route
          path="/app/database/team"
          element={
            <ProtectedRoute>
              <AppShell>
                <TeamPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/models"
          element={
            <ProtectedRoute>
              <AppShell>
                <ModelsConfigPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/quality-templates"
          element={
            <ProtectedRoute>
              <AppShell>
                <QualityTemplatesPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/database/maquinaria"
          element={
            <ProtectedRoute>
              <AppShell>
                <MaquinariaPage />
              </AppShell>
            </ProtectedRoute>
          }
        />

        {/* Analytics Routes */}
        <Route
          path="/app/analytics/production"
          element={
            <ProtectedRoute>
              <AppShell>
                <ProductionAnalyticsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/analytics/procurement"
          element={
            <ProtectedRoute>
              <AppShell>
                <ProcurementAnalyticsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/analytics/forecasting"
          element={
            <ProtectedRoute>
              <AppShell>
                <ForecastingPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route 
          path="/app/analytics/sales" 
          element={
            <ProtectedRoute>
              <AppShell>
                <SalesAnalyticsPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />
        <Route
          path="/app/analytics/scenario-simulation"
          element={
            <ProtectedRoute>
              <AppShell>
                <ScenarioSimulationPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/analytics/ai-insights"
          element={
            <ProtectedRoute>
              <AppShell>
                <AIInsightsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/analytics/performance"
          element={
            <ProtectedRoute>
              <AppShell>
                <PerformanceAnalyticsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />


        {/* Settings Routes */}
        {/* NEW: Unified Profile Settings Route */}
        <Route
          path="/app/settings/profile"
          element={
            <ProtectedRoute>
              <AppShell>
                <NewProfileSettingsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        {/* Legacy routes redirect to new unified profile page */}
        <Route path="/app/settings/personal-info" element={<Navigate to="/app/settings/profile" replace />} />
        <Route path="/app/settings/communication-preferences" element={<Navigate to="/app/settings/profile" replace />} />
        <Route path="/app/settings/privacy" element={<Navigate to="/app/settings/profile" replace />} />
        <Route
          path="/app/settings/subscription"
          element={
            <ProtectedRoute>
              <AppShell>
                <SubscriptionPage />
              </AppShell>
            </ProtectedRoute>
          }
        />
        <Route
          path="/app/settings/organizations"
          element={
            <ProtectedRoute>
              <AppShell>
                <OrganizationsPage />
              </AppShell>
            </ProtectedRoute>
          }
        />

        {/* Data Routes */}
        <Route 
          path="/app/data/weather" 
          element={
            <ProtectedRoute>
              <AppShell>
                <WeatherPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />
        <Route 
          path="/app/data/traffic" 
          element={
            <ProtectedRoute>
              <AppShell>
                <TrafficPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />
        <Route 
          path="/app/data/events" 
          element={
            <ProtectedRoute>
              <AppShell>
                <EventsPage />
              </AppShell>
            </ProtectedRoute>
          } 
        />

        {/* Onboarding Route - Protected but without AppShell */}
        <Route 
          path="/app/onboarding" 
          element={
            <ProtectedRoute>
              <OnboardingPage />
            </ProtectedRoute>
          } 
        />

        {/* Default redirects */}
        <Route path="/app/*" element={<Navigate to="/app/dashboard" replace />} />
        <Route path="*" element={<Navigate to="/" replace />} />
      </Routes>
    </Suspense>
  );
};

export default AppRouter;