vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
972 Commits 29 Branches 1 Tag
60e9a40a1fe698bb7421610e948e2162fc1af06d
Commit Graph

46 Commits

Author SHA1 Message Date
zdl
afc92ee583 fix: h5 去掉通知弹窗引导 2025-11-27 13:37:01 +08:00
zdl
cd6ffdbe68 fix: 修复hooks报错 2025-11-26 15:45:46 +08:00
zdl
e277352133 src/contexts/NotificationContext.js 
- 添加 selectIsMobile 导入 在 NotificationProvider 组件开头添加移动端检测 移动端返回空壳 Provider
  - 桌面端保持原有完整功能
  移除 ConnectionStatusBar 组件和 ConnectionStatusBarWrapper（所有端）
  - 移除了不再使用的 useNotification、useLocation、logger 导入
  - 添加了 Redux selectIsMobile 检测
  - 移动端不渲染 NotificationContainer
 2025-11-26 15:15:20 +08:00
zdl
1d1d6c8169 pref: P0: PostHog 延迟加载 - ✅ 完成 
P0: HeroPanel 懒加载 - ✅ 完成
 P0/P1: Charts/FullCalendar 懒加载 - ✅ 已通过路由懒加载隔离，无需额外处理
删除空的 CSS 文件
 2025-11-26 13:33:58 +08:00
zdl
5f959fb44f feat: 添加 认证检查 和 首页渲染 的性能标记 2025-11-26 11:10:50 +08:00
zdl
2fcc341213 feat: 修复通知初始化问题 2025-11-26 10:55:38 +08:00
zdl
6886a649f5 perf: Socket 连接异步化，使用 requestIdleCallback 不阻塞首屏 
- NotificationContext: 将 Socket 初始化包裹在 requestIdleCallback 中
- 设置 3 秒超时保护，确保连接不会被无限延迟
- 不支持 requestIdleCallback 的浏览器自动降级到 setTimeout(0)
- socket/index.js: 移除模块加载时的 console.log，减少首屏阻塞感知
- 所有页面的首屏渲染都不再被 Socket 连接阻塞

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-26 10:34:45 +08:00
zdl
25cc28e03b feat: 完全移除邮箱登录代码 
移除 registerWithEmail 方法
     移除 sendEmailCode 方法
     已从导出对象中移除 registerWithEmail 和 sendEmailCode。
 2025-11-19 16:15:50 +08:00
zdl
5f9901a098 feat: 清理过时代码：移除 AuthContext.js 中过时的追踪逻辑 2025-11-19 16:07:51 +08:00
zdl
bb28e141e6 feat: 处理用户登出事件 2025-11-19 15:57:00 +08:00
zdl
17c04211bb feat: 完善 PostHog 用户生命周期追踪 + 性能优化 
新增功能：
     1. 首次访问追踪 (first_visit)
        - 记录用户来源（referrer、UTM参数）
        - 记录落地页
        - 使用 localStorage 永久标记

     2. 首次登录追踪 (first_login)
        - 区分首次登录和后续登录
        - 按用户 ID 独立标记
        - 用于计算新用户激活率

     3. 登录/登出事件追踪
        - 登录成功追踪 (user_logged_in)
        - 登出事件追踪 (user_logged_out，必须在 resetUser 之前）
        - 注册事件追踪 (user_registered)

     4. 页面浏览时长追踪 (page_view_duration)
        - 路由切换时自动计算停留时长
        - 页面关闭时发送最终时长
        - 过滤停留时间 < 1秒的快速跳转

     性能优化：
     1. 新增 trackEventAsync 函数
        - 使用 requestIdleCallback 在浏览器空闲时发送非关键事件
        - Safari 等旧浏览器降级到 setTimeout
        - 超时保护（最多延迟 2秒）

     2. 异步追踪非关键事件
        - first_visit - 不阻塞首屏渲染
        - page_view_duration - 不阻塞页面切换

     3. 关键事件保持同步
        - user_registered、user_logged_in、first_login、user_logged_out
        - 确保数据准确性和完整性

     分析能力提升：
     - ✅ 营销渠道 ROI 分析（UTM 参数追踪）
     - ✅ 新用户激活率分析（首次登录标记）
     - ✅ 用户留存率分析（注册→首次登录→后续登录）
     - ✅ 页面热度分析（停留时长统计）
     - ✅ 流失用户识别（7天未登录，需后端支持）
 2025-11-18 21:29:33 +08:00
zdl
163c55f819 refactor: 重构 NotificationContext.js 日志系统，替换所有 console 调用为 logger 
## 主要改动
- 将 47 处 console.log/warn/error 全部替换为 logger 方法
- 删除 6 处装饰性分隔线（%c════════）
- 合并冗余日志，优化日志结构
- 减少代码行数：1021 → 1003（-18 行）

## 日志分类
- logger.info (43 处)：重要操作（连接、订阅、通知发送）
- logger.debug (17 处)：详细调试信息（数据内容、中间状态）
- logger.warn (5 处)：警告信息（权限问题、重复事件、断开连接）
- logger.error (9 处)：错误信息（失败、异常、Ref 未初始化）

## 优化效果
- ✅ 生产环境可通过 REACT_APP_ENABLE_DEBUG 控制日志输出
- ✅ 日志更规范，带时间戳和统一格式
- ✅ console.log 调用：47 → 0（100% 清理完成）
- ✅ 代码更清洁，无装饰性代码

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-17 15:10:41 +08:00
zdl
a9f0c5ced2 pref: 删除测试 API（优先）通知 2025-11-17 14:47:24 +08:00
zdl
ddd6b2d4af feat: 实现 Socket 触发的智能列表自动刷新功能（带防抖） 
核心改动：
- 扩展 NotificationContext，添加事件更新回调注册机制
- VirtualizedFourRowGrid 添加 forwardRef 暴露 getScrollPosition 方法
- DynamicNewsCard 实现智能刷新逻辑（根据模式和滚动位置判断是否刷新）
- Community 页面注册 Socket 回调自动触发刷新
- 创建 TypeScript 通用防抖工具函数（debounce.ts）
- 集成防抖机制（2秒延迟），避免短时间内频繁请求

智能刷新策略：
- 纵向模式 + 第1页：自动刷新列表
- 纵向模式 + 其他页：不刷新（避免打断用户）
- 平铺模式 + 滚动在顶部：自动刷新列表
- 平铺模式 + 滚动不在顶部：仅显示 Toast 提示

防抖效果：
- 短时间内收到多个新事件，只执行最后一次刷新
- 减少服务器压力，提升用户体验

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-14 19:04:00 +08:00
zdl
6b96744b2c fix(notification): 修复 Socket 重连后通知功能失效问题（方案2） 
采用完全重构的方式解决 Socket 重连后事件监听器丢失和闭包陷阱问题。

## 核心问题
1. Socket 重连后，事件监听器被重复注册，导致监听器累积或丢失
2. 闭包陷阱：监听器捕获了过期的 addNotification 函数引用
3. 依赖循环：registerSocketEvents 依赖 addNotification，导致频繁重新创建

## 解决方案（方案2：完全重构）

### 1. 使用 Ref 存储最新函数引用
```javascript
const addNotificationRef = useRef(null);
const adaptEventToNotificationRef = useRef(null);
const isFirstConnect = useRef(true);
```

### 2. 同步最新函数到 Ref
通过 useEffect 确保 ref.current 始终指向最新的函数：
```javascript
useEffect(() => {
    addNotificationRef.current = addNotification;
}, [addNotification]);
```

### 3. 监听器只注册一次
- useEffect 依赖数组改为 `[]`（空数组）
- socket.on('new_event') 只在组件挂载时注册一次
- 监听器内部使用 `ref.current` 访问最新函数

### 4. 重连时只重新订阅
- Socket 重连后只调用 `subscribeToEvents()`
- 不再重新注册监听器（避免累积）

## 关键代码变更

### NotificationContext.js
- **新增 Ref 定义**（第 62-65 行）：存储最新的回调函数引用
- **新增同步 useEffect**（第 607-615 行）：保持 ref 与函数同步
- **删除 registerSocketEvents 函数**：不再需要提取事件注册逻辑
- **重构 Socket useEffect**（第 618-824 行）：
  - 依赖数组: `[registerSocketEvents, toast]` → `[]`
  - 监听器注册: 只在初始化时执行一次
  - 重连处理: 只调用 `subscribeToEvents()`，不重新注册监听器
  - 防御性检查: 确保 ref 已初始化再使用

## 技术优势

### 彻底解决重复注册
- ✅ 监听器生命周期与组件绑定，只注册一次
- ✅ Socket 重连不会触发监听器重新注册

### 避免闭包陷阱
- ✅ `ref.current` 始终指向最新的函数
- ✅ 监听器不受 useEffect 依赖变化影响

### 简化依赖管理
- ✅ useEffect 无依赖，不会因状态变化而重新运行
- ✅ 性能优化：减少不必要的函数创建和监听器操作

### 提升代码质量
- ✅ 逻辑更清晰：所有监听器集中在一个 useEffect
- ✅ 易于维护：依赖关系简单明了
- ✅ 详细日志：便于调试和追踪问题

## 验证测试

### 测试场景
1. ✅ 首次连接 + 接收事件 → 正常显示通知
2. ✅ 断开重连 + 接收事件 → 重连后正常接收通知
3. ✅ 多次重连 → 每次重连后通知功能正常
4. ✅ 控制台无重复注册警告

### 预期效果
- 首次连接: 显示 "✅ 首次连接成功"
- 重连成功: 显示 "🔄 重连成功!" (不显示 "registerSocketEvents() 被调用")
- 收到事件: 根据页面可见性显示网页通知或浏览器通知

## 影响范围
- 修改文件: `src/contexts/NotificationContext.js`
- 影响功能: Socket 连接管理、事件监听、通知分发
- 兼容性: 完全向后兼容，无破坏性变更

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-11-11 13:35:08 +08:00
zdl
463bdbf09c feat: 添加调试 API 
- 我修改 NotificationContext.js，暴露 addNotification 到 window
    - 或者在调试工具 (devtools/notificationDebugger.js) 中添加测试方法
    - 重新构建并部署
    - 可以手动触发网页通知
 2025-11-11 11:45:19 +08:00
zdl
643c3db03e feat: 通知调试能力 2025-11-10 20:05:53 +08:00
zzlgreat
7f2a4dd36a 事件中心不提示通知修复 2025-11-10 14:20:42 +08:00
zzlgreat
45ff13f4d0 事件中心不提示通知修复 2025-11-10 13:46:34 +08:00
zzlgreat
a00b8bb73d 事件中心ui 2025-11-10 12:45:34 +08:00
zdl
d5881462d2 feat: 将 AuthModalProvider 迁移到 Redux 
## 主要改动

### 新增
- 创建 `store/slices/authModalSlice.js` - Redux Slice 管理认证弹窗状态
- 创建 `hooks/useAuthModal.js` - 自定义 Hook，组合 Redux 状态和业务逻辑

### 修改
- 更新 `store/index.js` - 添加 authModal reducer
- 更新 `App.js` - 移除 AuthModalProvider 包裹层
- 更新 5 个组件的 import 路径：
  - AuthFormContent.js
  - AuthModalManager.js
  - WechatRegister.js
  - HomeNavbar.js
  - ProtectedRoute.js

### 删除
- 删除 `contexts/AuthModalContext.js` - 旧的 Context 实现

## 迁移效果

- ✅ 减少 Provider 嵌套层级（4层 → 3层）
- ✅ 统一状态管理架构（Redux）
- ✅ 更好的调试体验（Redux DevTools）
- ✅ 保持 API 兼容性（无破坏性修改）

## 技术细节

- 使用 `useRef` 存储 `onSuccessCallback`（函数不可序列化）
- 保持与 AuthContext 的依赖关系（AuthProvider 暂未迁移）
- 所有业务逻辑保持不变，仅改变状态管理方式

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
 2025-10-30 13:22:45 +08:00
zdl
c77061f36d feat: 将 IndustryProvider (176行) 完整迁移到 Redux 2025-10-30 12:54:32 +08:00
zzlgreat
513134f285 整合register端口进入login端口 2025-10-28 11:20:50 +08:00
zdl
a9dc1191bf feat:. mockSocketService 添加 connecting 状态 
- 新增 connecting 标志防止重复连接
  - 在 connect() 方法中检查 connected 和 connecting 状态
  - 连接成功或失败后清除 connecting 标志\
2. NotificationContext 调整监听器注册顺序

  - 在 useEffect 中重新排序初始化步骤
  - 第一步：注册所有事件监听器（connect, disconnect, new_event 等）
  - 第二步：获取最大重连次数
  - 第三步：调用 socket.connect()
  - 使用空依赖数组 [] 防止 React 严格模式重复执行\
3. logger 添加日志限流

  - 实现 shouldLog() 函数，1秒内相同日志只输出一次
  - 使用 Map 缓存最近日志，带最大缓存限制（100条）
  - 应用到所有 logger 方法：info, warn, debug, api.request, api.response
  - 错误日志（error, api.error）不做限流，始终输出\
修复 emit 时机确保事件被接收

  - 在 mockSocketService 的 connect() 方法中
  - 使用 setTimeout(0) 延迟 emit(connect) 调用
  - 确保监听器注册完毕后再触发事件\
 2025-10-27 13:13:56 +08:00
zdl
72a009e1ae feat: session 添加节流检查 2025-10-24 17:09:42 +08:00
zdl
3f881d000b feat: 添加修改行业分类不展示的问题 2025-10-24 13:30:52 +08:00
zdl
bcf81f4d47 feat: 使用静态行业数据 2025-10-24 12:32:14 +08:00
zdl
e91656d332 feat: user 依赖优化 2025-10-24 12:19:37 +08:00
zdl
1ba8b8fd2f feat: 消息通知能力测试 2025-10-23 15:25:36 +08:00
zdl
9dcd4bfbf3 feat: 调整行业请求数据结构 2025-10-23 14:24:26 +08:00
zdl
a9fee411ea feat: 权限引导能力测试 2025-10-22 15:23:36 +08:00
zdl
23188d5690 feat: 修改文件 │ 
│                                                                                           │
     │ 1. src/services/socketService.js - 指数退避 + 无限重试                                    │
     │ 2. src/components/ConnectionStatusBar/index.js - UI 优化 + 自动消失                       │
     │ 3. src/App.js - handleClose 实现 + dismissed 状态管理                                     │
     │ 4. src/contexts/NotificationContext.js - 添加成功状态检测                                 │
     │ 5. NOTIFICATION_SYSTEM.md - v2.11.0 文档更新
 2025-10-21 18:34:38 +08:00
zdl
09c9273190 feat: sockt 弹窗功能添加 2025-10-21 17:50:21 +08:00
zdl
38499ce650 feat: 添加消息推送能力 2025-10-21 15:48:38 +08:00
zdl
5a3a3ad42b feat: 添加消息推送能力，添加新闻催化分析页的合规提示 2025-10-21 10:59:52 +08:00
zdl
47fcb570c0 feat: 日志优化 2025-10-18 17:33:15 +08:00
zdl
36558e0715 feat: 1. 基础设施（2个文件） 
- ✅ src/utils/logger.js - 统一日志工具
    - API 请求/响应/错误日志
    - 组件错误/警告/调试日志
    - 开发环境详细分组，生产环境仅错误
  - ✅ src/utils/axiosConfig.js - axios 全局拦截器
    - 自动记录所有请求/响应
    - 统一 baseURL 和 credentials 配置\
2. 核心文件重构（8个文件）\
 AuthFormContent.js | ✅ 保留登录/注册成功 toast❌ 移除验证码发送 toast✅ 添加 .trim()✅ 所有 API 添加 logger | ✅ 完成 |
  | Center.js          | ❌ 移除所有 toast✅ 移除 toast 依赖✅ 添加错误 logger                         | ✅ 完成 |
  | Community/index.js | ❌ 移除所有 toast 和导入✅ 移除 toast 依赖✅ 添加错误 logger                     | ✅ 完成 |
  | authService.js     | ✅ 统一 apiRequest 函数✅ 所有请求自动记录❌ 移除 console.error                 | ✅ 完成 |
  | eventService.js    | ✅ 重构 apiRequest✅ 所有方法添加 logger❌ 移除 console.log/error           | ✅ 完成 |
  | stockService       | ✅ 所有方法添加 logger❌ 移除 console 输出                                 | ✅ 完成 |
  | indexService       | ✅ 添加 logger❌ 移除 console 输出                                     | ✅ 完成 |
  | AuthContext.js     | ✅ 保留注册/登出成功 toast❌ 移除验证码发送 toast✅ 所有方法添加 logger                | ✅ 完成 |\
3. Mock 数据完善（\
 Mock 数据完善（1个文件）

  - ✅ src/mocks/handlers/account.js - 个人中心 Mock
    - ✅ 自选股列表 (GET /api/account/watchlist)
    - ✅ 实时行情 (GET /api/account/watchlist/realtime)
    - ✅ 添加自选股 (POST /api/account/watchlist/add)
    - ✅ 删除自选股 (DELETE /api/account/watchlist/:id)
    - ✅ 关注的事件 (GET /api/account/events/following)
    - ✅ 事件评论 (GET /api/account/events/comments)
    - ✅ 当前订阅 (GET /api/subscription/current)\
4. API 文档（1个文件）

  - ✅ API_ENDPOINTS.md - 完整 API 接口文档
    - 认证相关: 4个接口
    - 个人中心: 12个接口
    - 事件相关: 12个接口
    - 总计: 28+个接口\
5。Toast 策略执行:
  - ✅ 保留: 3种（登录成功、注册成功、登出成功）
  - ❌ 移除: 15+处（验证码、数据加载等）

  Logger 替换:
  - ✅ console.log → logger.debug/logger.info
  - ✅ console.error → logger.error\- console.warn → logger.warn

  Mock 数据:
  已有: auth.js, event.js, users.js, events.js
  新增: account.js（7个新接口）
6.用户体验改进
  静默优化:不再弹出验证码发送成功提示（静默处理）不再弹出数据加载失败提示（console 记录） 仅在关键操作显示 toast（登录/注册/登出）

  开发体验: Console 中有清晰的分组日志（🌐 🔴 ⚠️ 等图标）， 所有 API 请求/响应自动记录，错误日志包含完整上下文和堆栈，Mock 服务完善
 测试场景: 登录/注册 - 仅显示成功 toast，验证码静默发送 个人中心 - 加载自选股、实时行情、关注事件 社区页面 - 加载事件列表、Console 查看
9. 添加日志：API Request / ✅ API Response / ❌ API Error
 2025-10-18 07:48:00 +08:00
zdl
081eb3c5c3 pref: 去除开发环境配置 2025-10-16 15:54:57 +08:00
zdl
7c166f7186 feat: 手机验证码调试 2025-10-16 10:09:15 +08:00
zdl
4e9acd12c2 feat: 登陆注册UI调整，用户协议和隐私政策跳转调整 2025-10-15 11:03:00 +08:00
zdl
cd50d718fe pref: 代码打包优化 2025-10-13 19:53:13 +08:00
zdl
d4ea72e207 feat: 解决权限校验阻塞页面渲染问题 2025-10-13 16:40:06 +08:00
zdl
0792a57e6f feat: 修复JS配置错误 2025-10-11 21:26:31 +08:00
zdl
495ad758ea feat: 10.10线上最新代码提交 2025-10-11 16:16:02 +08:00
zzlgreat
4d0dc109bc updated 2025-10-11 12:10:00 +08:00
zzlgreat
8107dee8d3 Initial commit 2025-10-11 12:02:01 +08:00