62 lines
1.9 KiB
JavaScript
62 lines
1.9 KiB
JavaScript
// src/providers/AppProviders.js
|
||
// 集中管理应用的所有 Provider
|
||
|
||
import React from 'react';
|
||
import { ChakraProvider } from '@chakra-ui/react';
|
||
import { Provider as ReduxProvider } from 'react-redux';
|
||
|
||
// Redux Store
|
||
import { store } from '../store';
|
||
|
||
// Theme
|
||
import theme from '../theme/theme.js';
|
||
|
||
// Contexts
|
||
import { AuthProvider } from '../contexts/AuthContext';
|
||
import { NotificationProvider } from '../contexts/NotificationContext';
|
||
|
||
/**
|
||
* AppProviders - 应用的 Provider 容器
|
||
* 集中管理所有 Context Provider,避免 App.js 中层级嵌套过深
|
||
*
|
||
* Provider 层级顺序 (从外到内):
|
||
* 1. ReduxProvider - 状态管理层
|
||
* 2. ChakraProvider - UI 框架层(主要)
|
||
* 3. NotificationProvider - 通知系统
|
||
* 4. AuthProvider - 认证系统
|
||
*
|
||
* 注意:
|
||
* - HeroUI v3 不再需要 HeroUIProvider,样式通过 CSS 导入加载 (src/styles/heroui.css)
|
||
* - AuthModal 已迁移到 Redux (authModalSlice + useAuthModal Hook)
|
||
* - ErrorBoundary 在各 Layout 层实现,不在全局层,以实现精细化错误隔离
|
||
* - MainLayout: PageTransitionWrapper 包含 ErrorBoundary (页面错误不影响导航栏)
|
||
* - Auth.js: 独立 ErrorBoundary (认证页错误隔离)
|
||
*
|
||
* @param {Object} props
|
||
* @param {React.ReactNode} props.children - 子组件
|
||
*/
|
||
export function AppProviders({ children }) {
|
||
return (
|
||
<ReduxProvider store={store}>
|
||
<ChakraProvider
|
||
theme={theme}
|
||
toastOptions={{
|
||
defaultOptions: {
|
||
position: 'top',
|
||
duration: 3000,
|
||
isClosable: true,
|
||
}
|
||
}}
|
||
>
|
||
<NotificationProvider>
|
||
<AuthProvider>
|
||
{children}
|
||
</AuthProvider>
|
||
</NotificationProvider>
|
||
</ChakraProvider>
|
||
</ReduxProvider>
|
||
);
|
||
}
|
||
|
||
export default AppProviders;
|