refactor(editing-planner): 拆分 useTimelineMenus 为子Hook（192→67行, -65%） #1093

Merged

xiaoxia merged 1 commits from refactor/use-timeline-menus into develop 2026-07-28 16:18:48 +08:00

Conversation 3 Commits 1 Files Changed 3

+208 -149

xiaoxia commented 2026-07-28 13:55:17 +08:00

Owner

Copy Link

Copy Source

变更说明

将 useTimelineMenus Hook 拆分为两个子 Hook，主文件从 192 行减至 67 行（-65%）。

拆分结构

• useContextMenu：右键菜单逻辑（状态管理、操作回调、外部点击关闭）
• useAddPicker：添加片段面板逻辑（位置计算、类型/时长选择、外部点击关闭）
• useTimelineMenus：主 Hook，组合子 Hook + 悬停状态

兼容性

• 导出路径不变
• 返回值接口完全兼容，无破坏性变更

### 变更说明 将 useTimelineMenus Hook 拆分为两个子 Hook，主文件从 192 行减至 67 行（-65%）。 ### 拆分结构 - **useContextMenu**：右键菜单逻辑（状态管理、操作回调、外部点击关闭） - **useAddPicker**：添加片段面板逻辑（位置计算、类型/时长选择、外部点击关闭） - **useTimelineMenus**：主 Hook，组合子 Hook + 悬停状态 ### 兼容性 - 导出路径不变 - 返回值接口完全兼容，无破坏性变更

xiaoxia force-pushed refactor/use-timeline-menus from 9a9211ef86 to c726fc61c0 2026-07-28 15:13:15 +08:00 Compare

xiaoxia added 1 commit 2026-07-28 16:06:08 +08:00

refactor(editing-planner): 拆分useTimelineMenus为子Hook（192→67行, -65%） d79a652c69

xiaoxia force-pushed refactor/use-timeline-menus from c726fc61c0 to d79a652c69 2026-07-28 16:06:08 +08:00 Compare

xiaoxia merged commit cb7daa0674 into develop 2026-07-28 16:18:48 +08:00

auto-approve-bot reviewed 2026-07-28 16:37:41 +08:00

auto-approve-bot left a comment

Collaborator

Copy Link

Copy Source

CI全绿，自动审批通过。

CI全绿，自动审批通过。

gitea-actions bot commented 2026-07-28 16:37:59 +08:00

Copy Link

Copy Source

🚀 预览环境已部署

项目	详情
PR号	#1093
预览链接	https://pr-1093.preview.xiaoxiajianji.com
API环境	staging

💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。

🔄 每次提交新代码后预览环境会自动更新。

🗑️ PR 关闭或合并后，预览环境会自动清理。

🚀 **预览环境已部署** | 项目 | 详情 | |------|------| | PR号 | #1093 | | 预览链接 | [https://pr-1093.preview.xiaoxiajianji.com](https://pr-1093.preview.xiaoxiajianji.com) | | API环境 | staging | > 💡 预览环境使用 staging API 数据，请勿在预览环境中操作重要数据。 > > 🔄 每次提交新代码后预览环境会自动更新。 > > 🗑️ PR 关闭或合并后，预览环境会自动清理。

auto-approve-bot commented 2026-07-28 16:42:47 +08:00

Collaborator

Copy Link

Copy Source

代码审查结果 - PR #1093

⚠️ 问题（2个需要修改）

1. apps/web/src/pages/editing-planner/hooks/useTimelineMenus.ts 第30行：代码diff在该文件末尾截断，return 语句未闭合。这将导致语法错误，且无法确认是否正确返回了 hoveredClipId、setHoveredClipId 等原有状态，会导致组件运行时崩溃或功能丢失。
2. apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts 第73-76行：点击外部关闭逻辑存在缺陷。handleClickOutside 仅判断了点击是否在 pickerRef 内部，未排除触发按钮 addCardRef。当用户点击触发按钮试图关闭弹窗时，会先触发“点击外部”关闭弹窗，随后触发按钮的 onClick 重新打开弹窗，导致无法通过再次点击按钮关闭弹窗（产生闪烁或无效交互）。

💡 建议（2个可选）

1. apps/web/src/pages/editing-planner/hooks/timeline-menus/useContextMenu.ts 第32行：右键菜单定位直接使用了 e.clientX/Y，未做边界检测。若用户在屏幕右下角右键，菜单可能会超出视口。建议参考 useAddPicker 的边界计算逻辑。
2. apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts 第48-65行：弹窗位置计算仅在 showAddPicker 变化时触发。若用户在弹窗打开时调整窗口大小，弹窗位置不会更新，可能导致遮挡。建议增加 resize 事件监听。

---

✅ 格式检查通过 | ❌ 逻辑审查需修改 | ⚠️ 建议关注性能

---

_{🤖 由 AI 代码审查机器人自动生成 | 2026-07-28 08:42:47 | 模型:}

## 代码审查结果 - PR #1093 ### ⚠️ 问题（2个需要修改） 1. **apps/web/src/pages/editing-planner/hooks/useTimelineMenus.ts 第30行**：代码diff在该文件末尾截断，`return` 语句未闭合。这将导致语法错误，且无法确认是否正确返回了 `hoveredClipId`、`setHoveredClipId` 等原有状态，会导致组件运行时崩溃或功能丢失。 2. **apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts 第73-76行**：点击外部关闭逻辑存在缺陷。`handleClickOutside` 仅判断了点击是否在 `pickerRef` 内部，未排除触发按钮 `addCardRef`。当用户点击触发按钮试图关闭弹窗时，会先触发“点击外部”关闭弹窗，随后触发按钮的 `onClick` 重新打开弹窗，导致无法通过再次点击按钮关闭弹窗（产生闪烁或无效交互）。 ### 💡 建议（2个可选） 1. **apps/web/src/pages/editing-planner/hooks/timeline-menus/useContextMenu.ts 第32行**：右键菜单定位直接使用了 `e.clientX/Y`，未做边界检测。若用户在屏幕右下角右键，菜单可能会超出视口。建议参考 `useAddPicker` 的边界计算逻辑。 2. **apps/web/src/pages/editing-planner/hooks/timeline-menus/useAddPicker.ts 第48-65行**：弹窗位置计算仅在 `showAddPicker` 变化时触发。若用户在弹窗打开时调整窗口大小，弹窗位置不会更新，可能导致遮挡。建议增加 `resize` 事件监听。 --- ✅ 格式检查通过 | ❌ 逻辑审查需修改 | ⚠️ 建议关注性能 --- _{🤖 由 AI 代码审查机器人自动生成 | 2026-07-28 08:42:47 | 模型:} <!-- AI_CODE_REVIEW_AUTO_COMMENT -->

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

Clear labels

P0

阻塞性，必须立即处理

P1

高优先级

P2

中优先级

P3

低优先级/后考虑

architecture

架构设计

backend

后端相关

blocked

阻塞中

bug

Bug修复

ci-bug

CI本身的bug

ci-optimization

CI优化类任务

ci-pipeline

CI流水线/workflow相关

cleanup

代码清理

devops

运维/部署/CI

documentation

文档相关

feature

新功能

frontend

前端相关

question

需要讨论确认

ready

PR CI通过，可合并

refactor

代码重构

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

auto-approve-bot xiaoxia

No Assignees

3 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: xiaoxia/xiaoxia-saas#1093