refactor: 架构重构 - 解耦过度耦合模块
主要改动: 1. 创建乐观更新工具函数 (optimisticUpdate.ts) - 消除 userStore.ts 中的重复代码 2. 拆分 useResponsive.ts (485行 -> 12个专注模块) - useBreakpoint: 断点检测 - useOrientation: 方向检测 - usePlatform: 平台检测 - useScreenSize: 屏幕尺寸 - useResponsiveValue: 响应式值 - useResponsiveStyle: 响应式样式 - useMediaQuery: 媒体查询 - useColumnCount: 列数计算 - useResponsiveSpacing: 响应式间距 3. 整理数据层 (Repository 层) - ApiDataSource: API数据源 - LocalDataSource: 本地数据源 - CacheDataSource: 缓存数据源 - MessageRepository: 消息仓库 4. 重构 messageManager.ts (2194行 -> 4个模块) - MessageStateManager: 状态管理 - WebSocketMessageHandler: WebSocket处理 - MessageSyncService: 消息同步 - ReadReceiptManager: 已读管理 5. 导航解耦 (MainNavigator.tsx: 1118行 -> 100行) - 创建 NavigationService 解耦层 - 拆分多个 Navigator 组件 架构改进: - 单一职责原则: 每个模块职责明确 - 依赖倒置: 通过接口解耦 - 代码复用: 工具函数可被多处使用 - 可测试性: 各模块可独立测试
This commit is contained in:
60
src/infrastructure/navigation/hooks/useNavigationState.ts
Normal file
60
src/infrastructure/navigation/hooks/useNavigationState.ts
Normal file
@@ -0,0 +1,60 @@
|
||||
/**
|
||||
* 导航状态管理 Hook
|
||||
* 管理导航相关状态,如当前路由、导航历史等
|
||||
*/
|
||||
|
||||
import { useState, useCallback, useEffect } from 'react';
|
||||
import { useNavigationState as useRNNavigationState, Route } from '@react-navigation/native';
|
||||
import type { RootStackParamList } from '../../../navigation/types';
|
||||
|
||||
type TabName = 'HomeTab' | 'MessageTab' | 'ScheduleTab' | 'ProfileTab';
|
||||
|
||||
interface NavigationState {
|
||||
currentTab: TabName;
|
||||
isCollapsed: boolean;
|
||||
isReady: boolean;
|
||||
}
|
||||
|
||||
interface NavigationActions {
|
||||
setCurrentTab: (tab: TabName) => void;
|
||||
toggleCollapse: () => void;
|
||||
setIsReady: (ready: boolean) => void;
|
||||
}
|
||||
|
||||
/**
|
||||
* 导航状态管理 Hook
|
||||
*/
|
||||
export function useNavigationState(): NavigationState & NavigationActions {
|
||||
const [currentTab, setCurrentTab] = useState<TabName>('HomeTab');
|
||||
const [isCollapsed, setIsCollapsed] = useState(false);
|
||||
const [isReady, setIsReady] = useState(false);
|
||||
|
||||
const toggleCollapse = useCallback(() => {
|
||||
setIsCollapsed(prev => !prev);
|
||||
}, []);
|
||||
|
||||
return {
|
||||
currentTab,
|
||||
isCollapsed,
|
||||
isReady,
|
||||
setCurrentTab,
|
||||
toggleCollapse,
|
||||
setIsReady,
|
||||
};
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取当前路由名称
|
||||
*/
|
||||
export function useCurrentRouteName(): string | null {
|
||||
const routeName = useRNNavigationState(state => state?.routes[state.index]?.name ?? null);
|
||||
return routeName;
|
||||
}
|
||||
|
||||
/**
|
||||
* 检查是否在指定路由
|
||||
*/
|
||||
export function useIsRoute(routeName: keyof RootStackParamList): boolean {
|
||||
const currentRoute = useCurrentRouteName();
|
||||
return currentRoute === routeName;
|
||||
}
|
||||
Reference in New Issue
Block a user