/**
 =========================================================
 Vision UI PRO React - v1.0.0
 =========================================================
 Product Page: https://www.creative-tim.com/product/vision-ui-dashboard-pro-react
 Copyright 2021 Creative Tim (https://www.creative-tim.com/)
 Design and Coded by Simmmple & Creative Tim
 =========================================================
 The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Visionware.
 */

import React, { Suspense, useEffect } from "react";
import { ChakraProvider } from '@chakra-ui/react';
import { Routes, Route, Navigate } from "react-router-dom";

// Chakra imports
import { Box, useColorMode } from '@chakra-ui/react';

// Core Components
import theme from "theme/theme.js";

// Loading Component
import PageLoader from "components/Loading/PageLoader";

// Layouts - 保持同步导入（需要立即加载）
import Auth from "layouts/Auth";
import HomeLayout from "layouts/Home";
import MainLayout from "layouts/MainLayout";

// ⚡ 使用 React.lazy() 实现路由懒加载
// 首屏不需要的组件按需加载，大幅减少初始 JS 包大小
const Community = React.lazy(() => import("views/Community"));
const LimitAnalyse = React.lazy(() => import("views/LimitAnalyse"));
const ForecastReport = React.lazy(() => import("views/Company/ForecastReport"));
const ConceptCenter = React.lazy(() => import("views/Concept"));
const FinancialPanorama = React.lazy(() => import("views/Company/FinancialPanorama"));
const CompanyIndex = React.lazy(() => import("views/Company"));
const MarketDataView = React.lazy(() => import("views/Company/MarketDataView"));
const StockOverview = React.lazy(() => import("views/StockOverview"));
const EventDetail = React.lazy(() => import("views/EventDetail"));
const TradingSimulation = React.lazy(() => import("views/TradingSimulation"));

// Contexts
import { AuthProvider } from "contexts/AuthContext";
import { AuthModalProvider } from "contexts/AuthModalContext";
import { NotificationProvider, useNotification } from "contexts/NotificationContext";
import { IndustryProvider } from "contexts/IndustryContext";

// Components
import ProtectedRoute from "components/ProtectedRoute";
import ProtectedRouteRedirect from "components/ProtectedRouteRedirect";
import ErrorBoundary from "components/ErrorBoundary";
import AuthModalManager from "components/Auth/AuthModalManager";
import NotificationContainer from "components/NotificationContainer";
import ConnectionStatusBar from "components/ConnectionStatusBar";
import NotificationTestTool from "components/NotificationTestTool";
import ScrollToTop from "components/ScrollToTop";
import { logger } from "utils/logger";

/**
 * ConnectionStatusBar 包装组件
 * 需要在 NotificationProvider 内部使用，所以单独提取
 */
function ConnectionStatusBarWrapper() {
    const { connectionStatus, reconnectAttempt, maxReconnectAttempts, retryConnection } = useNotification();
    const [isDismissed, setIsDismissed] = React.useState(false);

    // 监听连接状态变化
    React.useEffect(() => {
        // 重连成功后，清除 dismissed 状态
        if (connectionStatus === 'connected' && isDismissed) {
            setIsDismissed(false);
            // 从 localStorage 清除 dismissed 标记
            localStorage.removeItem('connection_status_dismissed');
        }

        // 从 localStorage 恢复 dismissed 状态
        if (connectionStatus !== 'connected' && !isDismissed) {
            const dismissed = localStorage.getItem('connection_status_dismissed');
            if (dismissed === 'true') {
                setIsDismissed(true);
            }
        }
    }, [connectionStatus, isDismissed]);

    const handleClose = () => {
        // 用户手动关闭，保存到 localStorage
        setIsDismissed(true);
        localStorage.setItem('connection_status_dismissed', 'true');
        logger.info('App', 'Connection status bar dismissed by user');
    };

    return (
        <ConnectionStatusBar
            status={connectionStatus}
            reconnectAttempt={reconnectAttempt}
            maxReconnectAttempts={maxReconnectAttempts}
            onRetry={retryConnection}
            onClose={handleClose}
            isDismissed={isDismissed}
        />
    );
}

function AppContent() {
    const { colorMode } = useColorMode();

    return (
        <Box minH="100vh" bg={colorMode === 'dark' ? 'gray.800' : 'white'}>
            {/* Socket 连接状态条 */}
            <ConnectionStatusBarWrapper />

            {/* 路由切换时自动滚动到顶部 */}
            <ScrollToTop />
            <Routes>
                {/* 带导航栏的主布局 - 所有需要导航栏的页面都在这里 */}
                {/* MainLayout 内部有 Suspense，确保导航栏始终可见 */}
                <Route element={<MainLayout />}>
                    {/* 首页路由 */}
                    <Route path="home/*" element={<HomeLayout />} />

                    {/* Community页面路由 - 需要登录 */}
                    <Route
                        path="community"
                        element={
                            <ProtectedRoute>
                                <Community />
                            </ProtectedRoute>
                        }
                    />

                    {/* 概念中心路由 - 需要登录 */}
                    <Route
                        path="concepts"
                        element={
                            <ProtectedRoute>
                                <ConceptCenter />
                            </ProtectedRoute>
                        }
                    />
                    <Route
                        path="concept"
                        element={
                            <ProtectedRoute>
                                <ConceptCenter />
                            </ProtectedRoute>
                        }
                    />

                    {/* 股票概览页面路由 - 需要登录 */}
                    <Route
                        path="stocks"
                        element={
                            <ProtectedRoute>
                                <StockOverview />
                            </ProtectedRoute>
                        }
                    />
                    <Route
                        path="stock-overview"
                        element={
                            <ProtectedRoute>
                                <StockOverview />
                            </ProtectedRoute>
                        }
                    />

                    {/* Limit Analyse页面路由 - 需要登录 */}
                    <Route
                        path="limit-analyse"
                        element={
                            <ProtectedRoute>
                                <LimitAnalyse />
                            </ProtectedRoute>
                        }
                    />

                    {/* 模拟盘交易系统路由 - 需要登录 */}
                    <Route
                        path="trading-simulation"
                        element={
                            <ProtectedRoute>
                                <TradingSimulation />
                            </ProtectedRoute>
                        }
                    />

                    {/* 事件详情独立页面路由 - 需要登录（跳转模式） */}
                    <Route
                        path="event-detail/:eventId"
                        element={
                            <ProtectedRouteRedirect>
                                <EventDetail />
                            </ProtectedRouteRedirect>
                        }
                    />

                    {/* 公司相关页面 */}
                    {/* 财报预测 - 需要登录（跳转模式） */}
                    <Route
                        path="forecast-report"
                        element={
                            <ProtectedRouteRedirect>
                                <ForecastReport />
                            </ProtectedRouteRedirect>
                        }
                    />

                    {/* 财务全景 - 需要登录（弹窗模式） */}
                    <Route
                        path="Financial"
                        element={
                            <ProtectedRoute>
                                <FinancialPanorama />
                            </ProtectedRoute>
                        }
                    />

                    {/* 公司页面 - 需要登录（弹窗模式） */}
                    <Route
                        path="company"
                        element={
                            <ProtectedRoute>
                                <CompanyIndex />
                            </ProtectedRoute>
                        }
                    />

                    {/* 公司详情 - 需要登录（跳转模式） */}
                    <Route
                        path="company/:code"
                        element={
                            <ProtectedRouteRedirect>
                                <CompanyIndex />
                            </ProtectedRouteRedirect>
                        }
                    />

                    {/* 市场数据 - 需要登录（弹窗模式） */}
                    <Route
                        path="market-data"
                        element={
                            <ProtectedRoute>
                                <MarketDataView />
                            </ProtectedRoute>
                        }
                    />
                </Route>

                {/* 认证页面路由 - 不使用 MainLayout */}
                <Route path="auth/*" element={<Auth />} />

                {/* 默认重定向到首页 */}
                <Route path="/" element={<Navigate to="/home" replace />} />

                {/* 404 页面 */}
                <Route path="*" element={<Navigate to="/home" replace />} />
            </Routes>
        </Box>
    );
}

export default function App() {
    // 全局错误处理：捕获未处理的 Promise rejection
    useEffect(() => {
        const handleUnhandledRejection = (event) => {
            logger.error('App', 'unhandledRejection', event.reason instanceof Error ? event.reason : new Error(String(event.reason)), {
                promise: event.promise
            });
            // 阻止默认的错误处理（防止崩溃）
            event.preventDefault();
        };

        const handleError = (event) => {
            logger.error('App', 'globalError', event.error || new Error(event.message), {
                filename: event.filename,
                lineno: event.lineno,
                colno: event.colno
            });
            // 阻止默认的错误处理（防止崩溃）
            event.preventDefault();
        };

        window.addEventListener('unhandledrejection', handleUnhandledRejection);
        window.addEventListener('error', handleError);

        return () => {
            window.removeEventListener('unhandledrejection', handleUnhandledRejection);
            window.removeEventListener('error', handleError);
        };
    }, []);

    return (
        <ChakraProvider
            theme={theme}
            toastOptions={{
                defaultOptions: {
                    position: 'top',
                    duration: 3000,
                    isClosable: true,
                }
            }}
        >
            <ErrorBoundary>
                <NotificationProvider>
                    <AuthProvider>
                        <AuthModalProvider>
                            <IndustryProvider>
                                <AppContent />
                                <AuthModalManager />
                                <NotificationContainer />
                                <NotificationTestTool />
                            </IndustryProvider>
                        </AuthModalProvider>
                    </AuthProvider>
                </NotificationProvider>
            </ErrorBoundary>
        </ChakraProvider>
    );
}