import { BrowserRouter, Routes, Route, Navigate } from 'react-router-dom'
import { ConfigProvider } from 'antd'
import zhCN from 'antd/locale/zh_CN'
import { PermissionProvider } from './framework/permission'
import { RouteGuard } from './framework/router'
import MainLayout from './framework/layout/MainLayout'
import HomePage from './pages/HomePage'
import { MODULES } from './framework/modules/moduleRegistry'

/**
 * 应用根组件
 * 
 * @description 
 * - ConfigProvider: Ant Design国际化配置
 * - PermissionProvider: 权限管理系统（Week 2 Day 7新增）
 * - RouteGuard: 路由守卫保护（Week 2 Day 7新增）⭐
 * - BrowserRouter: 前端路由
 * 
 * @version Week 2 Day 7 - 任务17：完整版权限系统
 */
function App() {
  return (
    <ConfigProvider locale={zhCN}>
      {/* 权限提供者：提供全局权限状态 */}
      <PermissionProvider>
        <BrowserRouter>
          <Routes>
            <Route path="/" element={<MainLayout />}>
              {/* 首页 */}
              <Route index element={<HomePage />} />
              
              {/* 动态加载模块路由 - 应用路由守卫保护 ⭐ */}
              {MODULES.map(module => (
                <Route
                  key={module.id}
                  path={`${module.path}/*`}
                  element={
                    // 为每个模块添加路由守卫
                    <RouteGuard
                      requiredVersion={module.requiredVersion}
                      moduleName={module.name}
                    >
                      <module.component />
                    </RouteGuard>
                  }
                />
              ))}
              
              {/* 404重定向 */}
              <Route path="*" element={<Navigate to="/" replace />} />
            </Route>
          </Routes>
        </BrowserRouter>
      </PermissionProvider>
    </ConfigProvider>
  )
}

export default App
