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 组件

架构改进:
- 单一职责原则: 每个模块职责明确
- 依赖倒置: 通过接口解耦
- 代码复用: 工具函数可被多处使用
- 可测试性: 各模块可独立测试

src/presentation/hooks/responsive/useResponsiveValue.ts

@@ -0,0 +1,95 @@
+/**
+ * useResponsiveValue Hook
+ * 响应式值映射 - 根据当前断点返回对应值
+ */
+
+import { useMemo } from 'react';
+import { useWindowDimensions } from './useScreenSize';
+import { getFineBreakpoint } from './useBreakpoint';
+import type { FineBreakpointKey, ResponsiveValue } from './types';
+
+const breakpointOrder: FineBreakpointKey[] = ['4xl', '3xl', '2xl', 'xl', 'lg', 'md', 'sm', 'xs'];
+
+/**
+ * 根据当前断点从响应式值对象中选择合适的值
+ * 
+ * @param value - 响应式值，可以是单一值或断点映射对象
+ * @returns 选中的值
+ * 
+ * @example
+ * const padding = useResponsiveValue({ xs: 8, md: 16, lg: 24 });
+ * // 在 xs 屏幕返回 8，md 屏幕返回 16，lg 及以上返回 24
+ */
+export function useResponsiveValue<T>(value: ResponsiveValue<T>): T {
+  const { width } = useWindowDimensions();
+  const fineBreakpoint = getFineBreakpoint(width);
+  
+  return useMemo(() => {
+    // 如果不是对象，直接返回
+    if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+      return value as T;
+    }
+    
+    const valueMap = value as Partial<Record<FineBreakpointKey, T>>;
+    
+    // 从当前断点开始向下查找
+    const currentIndex = breakpointOrder.indexOf(fineBreakpoint);
+    for (let i = currentIndex; i < breakpointOrder.length; i++) {
+      const bp = breakpointOrder[i];
+      if (bp in valueMap) {
+        return valueMap[bp]!;
+      }
+    }
+    
+    // 如果没找到，返回 xs 的值或第一个值
+    return (valueMap.xs ?? Object.values(valueMap)[0]) as T;
+  }, [value, fineBreakpoint]);
+}
+
+/**
+ * 响应式样式生成器
+ * 根据断点生成响应式样式
+ * 
+ * @param styles - 响应式样式对象
+ * @returns 当前断点对应的样式
+ * 
+ * @example
+ * const containerStyle = useResponsiveStyle({
+ *   padding: { xs: 8, md: 16, lg: 24 },
+ *   fontSize: { xs: 14, lg: 16 }
+ * });
+ */
+export function useResponsiveStyle<T extends Record<string, ResponsiveValue<unknown>>>(
+  styles: T
+): { [K in keyof T]: T[K] extends ResponsiveValue<infer V> ? V : never } {
+  const { width } = useWindowDimensions();
+  const fineBreakpoint = getFineBreakpoint(width);
+  
+  return useMemo(() => {
+    const result = {} as { [K in keyof T]: T[K] extends ResponsiveValue<infer V> ? V : never };
+    
+    for (const key in styles) {
+      const value = styles[key];
+      
+      if (typeof value !== 'object' || value === null || Array.isArray(value)) {
+        (result as Record<string, unknown>)[key] = value;
+      } else {
+        const valueMap = value as Partial<Record<FineBreakpointKey, unknown>>;
+        const currentIndex = breakpointOrder.indexOf(fineBreakpoint);
+        
+        let selectedValue: unknown = undefined;
+        for (let i = currentIndex; i < breakpointOrder.length; i++) {
+          const bp = breakpointOrder[i];
+          if (bp in valueMap) {
+            selectedValue = valueMap[bp];
+            break;
+          }
+        }
+        
+        (result as Record<string, unknown>)[key] = selectedValue ?? valueMap.xs ?? Object.values(valueMap)[0];
+      }
+    }
+    
+    return result;
+  }, [styles, fineBreakpoint]);
+}