import { Routes, Route, Navigate } from 'react-router-dom';
import { Suspense, lazy } from 'react';

// Layout
import MainLayout from './components/layout/MainLayout';
import AuthLayout from './components/layout/AuthLayout';
import ErrorBoundary from './components/ErrorBoundary';

// Loading component
const LoadingSpinner = () => (
  <div className="flex items-center justify-center min-h-screen">
    <div className="animate-spin rounded-full h-12 w-12 border-t-2 border-b-2 border-primary-500"></div>
  </div>
);

// Lazy load modules - Auth
const Login = lazy(() => import('./modules/auth/pages/Login'));
const Register = lazy(() => import('./modules/auth/pages/Register'));
const ForgotPassword = lazy(() => import('./modules/auth/pages/ForgotPassword'));
const AuthCallback = lazy(() => import('./modules/auth/pages/AuthCallback'));
const VerifyEmail = lazy(() => import('./modules/auth/pages/VerifyEmail'));
const ResetPassword = lazy(() => import('./modules/auth/pages/ResetPassword'));
const SecuritySettings = lazy(() => import('./modules/auth/pages/SecuritySettings'));

// Lazy load modules - Core
const Dashboard = lazy(() => import('./modules/dashboard/pages/Dashboard'));
const Trading = lazy(() => import('./modules/trading/pages/Trading'));
const TradingAgents = lazy(() => import('./modules/trading/pages/AgentsPage'));
const BotDetail = lazy(() => import('./modules/trading/pages/BotDetailPage'));
const MLDashboard = lazy(() => import('./modules/ml/pages/MLDashboard'));
const BacktestingDashboard = lazy(() => import('./modules/backtesting/pages/BacktestingDashboard'));
const Investment = lazy(() => import('./modules/investment/pages/Investment'));
const InvestmentPortfolio = lazy(() => import('./modules/investment/pages/Portfolio'));
const InvestmentProducts = lazy(() => import('./modules/investment/pages/Products'));
const AccountDetail = lazy(() => import('./modules/investment/pages/AccountDetail'));
const Withdrawals = lazy(() => import('./modules/investment/pages/Withdrawals'));
const InvestmentTransactions = lazy(() => import('./modules/investment/pages/Transactions'));
const InvestmentReports = lazy(() => import('./modules/investment/pages/Reports'));
const ProductDetail = lazy(() => import('./modules/investment/pages/ProductDetail'));
const KYCVerification = lazy(() => import('./modules/investment/pages/KYCVerification'));
const InvestmentDeposit = lazy(() => import('./modules/investment/pages/Deposit'));
const InvestmentWithdraw = lazy(() => import('./modules/investment/pages/Withdraw'));
const Settings = lazy(() => import('./modules/settings/pages/Settings'));
const Assistant = lazy(() => import('./modules/assistant/pages/Assistant'));
const AgentSettingsPage = lazy(() => import('./modules/assistant/pages/AgentSettingsPage'));

// Lazy load modules - Portfolio
const PortfolioDashboard = lazy(() => import('./modules/portfolio/pages/PortfolioDashboard'));
const PortfolioDetailPage = lazy(() => import('./modules/portfolio/pages/PortfolioDetailPage'));
const CreatePortfolio = lazy(() => import('./modules/portfolio/pages/CreatePortfolio'));
const CreateGoal = lazy(() => import('./modules/portfolio/pages/CreateGoal'));
const EditAllocations = lazy(() => import('./modules/portfolio/pages/EditAllocations'));

// Lazy load modules - Education
const Courses = lazy(() => import('./modules/education/pages/Courses'));
const CourseDetail = lazy(() => import('./modules/education/pages/CourseDetail'));
const MyLearning = lazy(() => import('./modules/education/pages/MyLearning'));
const Leaderboard = lazy(() => import('./modules/education/pages/Leaderboard'));
const Lesson = lazy(() => import('./modules/education/pages/Lesson'));
const Quiz = lazy(() => import('./modules/education/pages/Quiz'));

// Lazy load modules - Payments
const Pricing = lazy(() => import('./modules/payments/pages/Pricing'));
const Billing = lazy(() => import('./modules/payments/pages/Billing'));
const CheckoutSuccess = lazy(() => import('./modules/payments/pages/CheckoutSuccess'));
const CheckoutCancel = lazy(() => import('./modules/payments/pages/CheckoutCancel'));
const InvoicesPage = lazy(() => import('./modules/payments/pages/InvoicesPage'));
const RefundsPage = lazy(() => import('./modules/payments/pages/RefundsPage'));
const PaymentMethodsPage = lazy(() => import('./modules/payments/pages/PaymentMethodsPage'));

// Lazy load modules - Notifications
const NotificationsPage = lazy(() => import('./modules/notifications/pages/NotificationsPage'));

// Admin module (lazy loaded)
const AdminDashboard = lazy(() => import('./modules/admin/pages/AdminDashboard'));
const MLModelsPage = lazy(() => import('./modules/admin/pages/MLModelsPage'));
const AgentsPage = lazy(() => import('./modules/admin/pages/AgentsPage'));
const PredictionsPage = lazy(() => import('./modules/admin/pages/PredictionsPage'));

// Lazy load modules - Marketplace
const MarketplaceCatalog = lazy(() => import('./modules/marketplace/pages/MarketplaceCatalog'));
const SignalPackDetail = lazy(() => import('./modules/marketplace/pages/SignalPackDetail'));
const AdvisoryDetail = lazy(() => import('./modules/marketplace/pages/AdvisoryDetail'));
const CheckoutFlow = lazy(() => import('./modules/marketplace/pages/CheckoutFlow'));
const SellerDashboard = lazy(() => import('./modules/marketplace/pages/SellerDashboard'));
const CreateProductWizard = lazy(() => import('./modules/marketplace/pages/CreateProductWizard'));

function App() {
  return (
    <ErrorBoundary>
    <Suspense fallback={<LoadingSpinner />}>
      <Routes>
        {/* Auth routes */}
        <Route element={<AuthLayout />}>
          <Route path="/login" element={<Login />} />
          <Route path="/register" element={<Register />} />
          <Route path="/forgot-password" element={<ForgotPassword />} />
          <Route path="/verify-email" element={<VerifyEmail />} />
          <Route path="/reset-password" element={<ResetPassword />} />
        </Route>

        {/* OAuth callback (no layout) */}
        <Route path="/auth/callback" element={<AuthCallback />} />

        {/* Education - Full screen pages (no main layout) */}
        <Route path="/education/courses/:courseSlug/lesson/:lessonId" element={<Lesson />} />
        <Route path="/education/courses/:courseSlug/lesson/:lessonId/quiz" element={<Quiz />} />

        {/* Protected routes */}
        <Route element={<MainLayout />}>
          {/* Dashboard */}
          <Route path="/dashboard" element={<Dashboard />} />

          {/* Trading */}
          <Route path="/trading" element={<Trading />} />
          <Route path="/trading/agents" element={<TradingAgents />} />
          <Route path="/trading/agents/:botId" element={<BotDetail />} />
          <Route path="/ml-dashboard" element={<MLDashboard />} />
          <Route path="/backtesting" element={<BacktestingDashboard />} />
          <Route path="/investment" element={<Investment />} />
          <Route path="/investment/portfolio" element={<InvestmentPortfolio />} />
          <Route path="/investment/products" element={<InvestmentProducts />} />
          <Route path="/investment/accounts/:accountId" element={<AccountDetail />} />
          <Route path="/investment/withdrawals" element={<Withdrawals />} />
          <Route path="/investment/transactions" element={<InvestmentTransactions />} />
          <Route path="/investment/reports" element={<InvestmentReports />} />
          <Route path="/investment/products/:productId" element={<ProductDetail />} />
          <Route path="/investment/kyc" element={<KYCVerification />} />
          <Route path="/investment/deposit" element={<InvestmentDeposit />} />
          <Route path="/investment/withdraw" element={<InvestmentWithdraw />} />

          {/* Portfolio Manager */}
          <Route path="/portfolio" element={<PortfolioDashboard />} />
          <Route path="/portfolio/new" element={<CreatePortfolio />} />
          <Route path="/portfolio/goals/new" element={<CreateGoal />} />
          <Route path="/portfolio/:portfolioId" element={<PortfolioDetailPage />} />
          <Route path="/portfolio/:portfolioId/edit" element={<EditAllocations />} />

          {/* Education */}
          <Route path="/education/courses" element={<Courses />} />
          <Route path="/education/courses/:slug" element={<CourseDetail />} />
          <Route path="/education/my-learning" element={<MyLearning />} />
          <Route path="/education/leaderboard" element={<Leaderboard />} />
          {/* Legacy routes - redirect to new paths */}
          <Route path="/courses" element={<Navigate to="/education/courses" replace />} />
          <Route path="/courses/:slug" element={<Navigate to="/education/courses/:slug" replace />} />

          {/* Payments */}
          <Route path="/pricing" element={<Pricing />} />
          <Route path="/billing" element={<Billing />} />
          <Route path="/billing/invoices" element={<InvoicesPage />} />
          <Route path="/billing/refunds" element={<RefundsPage />} />
          <Route path="/billing/payment-methods" element={<PaymentMethodsPage />} />
          <Route path="/payments/success" element={<CheckoutSuccess />} />
          <Route path="/payments/cancel" element={<CheckoutCancel />} />

          {/* Settings */}
          <Route path="/settings" element={<Settings />} />
          <Route path="/settings/security" element={<SecuritySettings />} />
          <Route path="/settings/billing" element={<Billing />} />
          <Route path="/settings/notifications" element={<NotificationsPage />} />

          {/* Notifications */}
          <Route path="/notifications" element={<NotificationsPage />} />

          {/* Assistant */}
          <Route path="/assistant" element={<Assistant />} />
          <Route path="/assistant/settings" element={<AgentSettingsPage />} />

          {/* Admin */}
          <Route path="/admin" element={<AdminDashboard />} />
          <Route path="/admin/models" element={<MLModelsPage />} />
          <Route path="/admin/agents" element={<AgentsPage />} />
          <Route path="/admin/predictions" element={<PredictionsPage />} />

          {/* Marketplace */}
          <Route path="/marketplace" element={<MarketplaceCatalog />} />
          <Route path="/marketplace/signals/:slug" element={<SignalPackDetail />} />
          <Route path="/marketplace/advisory/:slug" element={<AdvisoryDetail />} />
          <Route path="/marketplace/courses/:slug" element={<CourseDetail />} />
          <Route path="/marketplace/checkout/:productId" element={<CheckoutFlow />} />
          <Route path="/marketplace/seller" element={<SellerDashboard />} />
          <Route path="/marketplace/seller/create" element={<CreateProductWizard />} />
          <Route path="/marketplace/seller/products/new" element={<CreateProductWizard />} />
        </Route>

        {/* Redirects */}
        <Route path="/" element={<Navigate to="/dashboard" replace />} />
        <Route path="*" element={<Navigate to="/dashboard" replace />} />
      </Routes>
    </Suspense>
    </ErrorBoundary>
  );
}

export default App;
