重构目标: 使用 Redux 管理订阅数据,替代本地状态 Phase 2 完成: ✅ 创建 subscriptionSlice.js (143行) - Redux Toolkit createSlice + createAsyncThunk - 管理订阅信息、loading、error、Modal 状态 - fetchSubscriptionInfo 异步 thunk - resetToFree reducer (登出时调用) ✅ 注册到 Redux Store - 添加 subscriptionReducer 到 store ✅ 重构 useSubscription Hook (182行) - 从本地状态迁移到 Redux (useSelector + useDispatch) - 保留所有权限检查逻辑 - 新增: isSubscriptionModalOpen, open/closeSubscriptionModal - 自动加载订阅数据 (登录时) ✅ 重构 HomeNavbar 使用 Redux - 替换 useSubscriptionData → useSubscription - 删除 ./hooks/useSubscriptionData.js 架构优势: ✅ 全局状态共享 - 多组件可访问订阅数据 ✅ Redux DevTools 可调试 ✅ 异步逻辑统一管理 (createAsyncThunk) ✅ 与现有架构一致 (authModalSlice 等) 性能优化: ✅ Redux 状态优化,减少不必要渲染 ✅ useSelector 精确订阅,只在相关数据变化时更新 累计优化: - 原始: 1623行 - Phase 1后: 1573行 (↓ 50行) - Phase 2后: 1533行 (↓ 90行, -5.5%) - 新增 Redux 逻辑: subscriptionSlice (143行) + Hook (182行) 下一步: Phase 3+ 继续拆分组件 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
36 lines
1.4 KiB
JavaScript
36 lines
1.4 KiB
JavaScript
// src/store/index.js
|
|
import { configureStore } from '@reduxjs/toolkit';
|
|
import communityDataReducer from './slices/communityDataSlice';
|
|
import posthogReducer from './slices/posthogSlice';
|
|
import industryReducer from './slices/industrySlice';
|
|
import stockReducer from './slices/stockSlice';
|
|
import authModalReducer from './slices/authModalSlice';
|
|
import subscriptionReducer from './slices/subscriptionSlice';
|
|
import posthogMiddleware from './middleware/posthogMiddleware';
|
|
|
|
export const store = configureStore({
|
|
reducer: {
|
|
communityData: communityDataReducer,
|
|
posthog: posthogReducer, // ✅ PostHog Redux 状态管理
|
|
industry: industryReducer, // ✅ 行业分类数据管理
|
|
stock: stockReducer, // ✅ 股票和事件数据管理
|
|
authModal: authModalReducer, // ✅ 认证弹窗状态管理
|
|
subscription: subscriptionReducer, // ✅ 订阅信息状态管理
|
|
},
|
|
middleware: (getDefaultMiddleware) =>
|
|
getDefaultMiddleware({
|
|
serializableCheck: {
|
|
// 忽略这些 action types 的序列化检查
|
|
ignoredActions: [
|
|
'communityData/fetchPopularKeywords/fulfilled',
|
|
'communityData/fetchHotEvents/fulfilled',
|
|
'posthog/trackEvent/fulfilled', // ✅ PostHog 事件追踪
|
|
'stock/fetchEventStocks/fulfilled',
|
|
'stock/fetchStockQuotes/fulfilled',
|
|
],
|
|
},
|
|
}).concat(posthogMiddleware), // ✅ PostHog 自动追踪中间件
|
|
});
|
|
|
|
export default store;
|