refactor(editing-planner): 拆分 CoverSelector 组件,抽离 Hook + 模式面板 #1010

Closed
xiaoxia wants to merge 6 commits from refactor/cover-selector-split into develop
Owner

变更说明

拆分 CoverSelector 组件(286 行),按职责拆分为目录结构:

  • useCoverSelector - 状态管理、文件上传、模式切换等逻辑
  • CoverModePanels - 智能封面/抽帧/上传 三个模式面板组件
  • index - 组合入口 + Drawer 布局

主文件 286 → 160 行(-44%)

导入路径保持不变,向后兼容。

## 变更说明 拆分 CoverSelector 组件(286 行),按职责拆分为目录结构: - **useCoverSelector** - 状态管理、文件上传、模式切换等逻辑 - **CoverModePanels** - 智能封面/抽帧/上传 三个模式面板组件 - **index** - 组合入口 + Drawer 布局 主文件 286 → 160 行(-44%) 导入路径保持不变,向后兼容。
xiaoxia added 1 commit 2026-07-27 07:39:48 +08:00
refactor(editing-planner): 拆分 CoverSelector 组件,抽离 Hook + 模式面板
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 49s
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 1m29s
CI/CD Pipeline / Validate - Code Quality (pull_request) Failing after 2m41s
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 1m5s
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Frontend Lint (pull_request) Failing after 37s
CI/CD Pipeline / PR Build Worker Image (pull_request) Successful in 1m46s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 2m7s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 2m10s
Preview Deploy / Deploy Preview Environment (pull_request) Failing after 55s
CI/CD Pipeline / PR Build Web Image (pull_request) Failing after 2m58s
AI Code Review / AI Code Review (pull_request) Successful in 3m3s
CI/CD Pipeline / PR Build API Image (pull_request) Successful in 7m45s
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
CI/CD Pipeline / Frontend Unit Tests (pull_request) Failing after 25s
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
922e0bdc58
主文件 286→160 行(-44%),拆分为:
- useCoverSelector: 状态管理、文件上传、模式切换等逻辑
- CoverModePanels: 智能封面/抽帧/上传 三个模式面板
- index: 组合入口 + Drawer 布局

导入路径保持向后兼容
xiaoxia added 1 commit 2026-07-27 12:32:37 +08:00
Merge branch 'develop' into refactor/cover-selector-split
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 24s
CI/CD Pipeline / PR Build Worker Image (pull_request) Successful in 21s
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Frontend Lint (pull_request) Failing after 1m7s
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 1m52s
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 1m52s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 1m15s
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
Preview Deploy / Deploy Preview Environment (pull_request) Failing after 45s
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Validate - Code Quality (pull_request) Failing after 2m39s
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 53s
CI/CD Pipeline / Frontend Unit Tests (pull_request) Failing after 21s
AI Code Review / AI Code Review (pull_request) Successful in 2m0s
CI/CD Pipeline / PR Build Web Image (pull_request) Failing after 2m57s
CI/CD Pipeline / Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / PR Build API Image (pull_request) Has been cancelled
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been cancelled
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / Deploy Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been cancelled
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been cancelled
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
185431788c
xiaoxia added 1 commit 2026-07-27 12:37:56 +08:00
fix(cover-selector): 修复 types 导入路径(../types → ../../types)
CI/CD Pipeline / Check if frontend-only change (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Code Quality (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Has been cancelled
CI/CD Pipeline / Unit Tests (pull_request) Has been cancelled
CI/CD Pipeline / Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / Frontend Lint (pull_request) Has been cancelled
CI/CD Pipeline / Frontend Unit Tests (pull_request) Has been cancelled
CI/CD Pipeline / PR Build API Image (pull_request) Has been cancelled
CI/CD Pipeline / PR Build Web Image (pull_request) Has been cancelled
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging API Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been cancelled
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been cancelled
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / Build Production API Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Production Web Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Deploy Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been cancelled
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been cancelled
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
AI Code Review / AI Code Review (pull_request) Has been cancelled
Preview Deploy / Deploy Preview Environment (pull_request) Has been cancelled
PR Automation / Auto Approve on CI Green (pull_request) Successful in 46s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 50s
2781663c61
xiaoxia added 1 commit 2026-07-27 12:37:59 +08:00
xiaoxia added 1 commit 2026-07-27 12:37:59 +08:00
fix(cover-selector): 修复 types 导入路径(../types → ../../types)
CI/CD Pipeline / Check if frontend-only change (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Code Quality (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Has been cancelled
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Has been cancelled
CI/CD Pipeline / Unit Tests (pull_request) Has been cancelled
CI/CD Pipeline / Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / Frontend Lint (pull_request) Has been cancelled
CI/CD Pipeline / Frontend Unit Tests (pull_request) Has been cancelled
CI/CD Pipeline / PR Build API Image (pull_request) Has been cancelled
CI/CD Pipeline / PR Build Web Image (pull_request) Has been cancelled
CI/CD Pipeline / PR Build Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging API Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been cancelled
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been cancelled
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been cancelled
CI/CD Pipeline / Build Production API Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Production Web Image (pull_request) Has been cancelled
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been cancelled
CI/CD Pipeline / Deploy Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been cancelled
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been cancelled
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
AI Code Review / AI Code Review (pull_request) Has been cancelled
Preview Deploy / Deploy Preview Environment (pull_request) Has been cancelled
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 45m52s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 2m47s
be1a1dae60
xiaoxia added 1 commit 2026-07-27 12:39:02 +08:00
refactor(cover-selector): 主文件改为 re-export 子目录,完成拆分
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 5s
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 1m19s
CI/CD Pipeline / Validate - Code Quality (pull_request) Failing after 1m50s
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 28s
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 1m7s
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / PR Build Worker Image (pull_request) Successful in 21s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 54s
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m42s
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 47s
CI/CD Pipeline / PR Build API Image (pull_request) Successful in 3m32s
AI Code Review / AI Code Review (pull_request) Successful in 3m37s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 15m16s
ACR Cleanup / ACR Image Cleanup (pull_request_target) Has been cancelled
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
CI/CD Pipeline / Frontend Unit Tests (pull_request) Failing after 23s
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 21s
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped
51a79230d5
auto-approve-bot approved these changes 2026-07-27 14:56:21 +08:00
auto-approve-bot left a comment
Collaborator

CI全绿,自动审批通过。

CI全绿,自动审批通过。
auto-approve-bot approved these changes 2026-07-27 14:56:21 +08:00
auto-approve-bot left a comment
Collaborator

CI全绿,自动审批通过。

CI全绿,自动审批通过。

🚀 预览环境已部署

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

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

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

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

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

代码审查结果 - PR #1010

⚠️ 问题(3个需要修改)

  1. apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第72行FileReader 读取结果未判空,存在类型安全隐患。

    • 说明e.target?.result 可能为 null(例如读取失败或中止),代码直接使用 as string 强制断言,导致后续逻辑可能处理 null 值,引发渲染错误或数据异常。
    • 建议:添加空值检查,如 const url = e.target?.result; if (typeof url === 'string') { ... }
  2. apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第65行:文件上传缺少错误处理机制。

    • 说明FileReader 只定义了 onload,未定义 onerror。如果读取文件失败(如磁盘错误、权限问题),用户无任何反馈,且组件状态可能处于不一致的等待中。
    • 建议:添加 reader.onerror 回调,并在其中进行错误提示(如 Toast)及状态清理。
  3. apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第65行:大文件上传存在内存溢出风险。

    • 说明:使用 FileReader.readAsDataURL 将图片转换为 Base64 字符串会占用大量内存(约为文件大小的 1.3 倍)。代码未限制文件大小,用户上传几十兆的高清图可能导致浏览器卡顿或崩溃。
    • 建议:在 handleFileUpload 开头增加文件大小校验(例如限制 < 10MB),超大文件直接拦截并提示。

💡 建议(2个可选)

  1. apps/web/src/pages/editing-planner/components/cover-selector/CoverModePanels.tsx 第73行:视频时长边界处理存在逻辑瑕疵。

    • 说明max={Math.max(totalDuration, 1)}totalDuration 为 0 时会将最大值设为 1,允许用户选择不存在的第 1 秒画面,可能导致后续抽帧逻辑报错或显示黑屏。
    • 建议:当 totalDuration <= 0 时,应禁用滑块或设置 max={0},并提示用户无效时长。
  2. apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第90行formatTime 函数定义位置不当影响性能。

    • 说明formatTime 在 Hook 内部定义,每次组件重新渲染都会创建新的函数引用,并传递给多个子组件,导致子组件发生不必要的重渲染。
    • 建议:将 formatTime 移至 Hook 外部(作为纯函数)或使用 useCallback 包裹。

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


🤖 由 AI 代码审查机器人自动生成 | 2026-07-27 06:58:57 | 模型:

## 代码审查结果 - PR #1010 ### ⚠️ 问题(3个需要修改) 1. **apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第72行**:`FileReader` 读取结果未判空,存在类型安全隐患。 - **说明**:`e.target?.result` 可能为 `null`(例如读取失败或中止),代码直接使用 `as string` 强制断言,导致后续逻辑可能处理 `null` 值,引发渲染错误或数据异常。 - **建议**:添加空值检查,如 `const url = e.target?.result; if (typeof url === 'string') { ... }`。 2. **apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第65行**:文件上传缺少错误处理机制。 - **说明**:`FileReader` 只定义了 `onload`,未定义 `onerror`。如果读取文件失败(如磁盘错误、权限问题),用户无任何反馈,且组件状态可能处于不一致的等待中。 - **建议**:添加 `reader.onerror` 回调,并在其中进行错误提示(如 Toast)及状态清理。 3. **apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第65行**:大文件上传存在内存溢出风险。 - **说明**:使用 `FileReader.readAsDataURL` 将图片转换为 Base64 字符串会占用大量内存(约为文件大小的 1.3 倍)。代码未限制文件大小,用户上传几十兆的高清图可能导致浏览器卡顿或崩溃。 - **建议**:在 `handleFileUpload` 开头增加文件大小校验(例如限制 < 10MB),超大文件直接拦截并提示。 ### 💡 建议(2个可选) 1. **apps/web/src/pages/editing-planner/components/cover-selector/CoverModePanels.tsx 第73行**:视频时长边界处理存在逻辑瑕疵。 - **说明**:`max={Math.max(totalDuration, 1)}` 在 `totalDuration` 为 0 时会将最大值设为 1,允许用户选择不存在的第 1 秒画面,可能导致后续抽帧逻辑报错或显示黑屏。 - **建议**:当 `totalDuration <= 0` 时,应禁用滑块或设置 `max={0}`,并提示用户无效时长。 2. **apps/web/src/pages/editing-planner/components/cover-selector/useCoverSelector.ts 第90行**:`formatTime` 函数定义位置不当影响性能。 - **说明**:`formatTime` 在 Hook 内部定义,每次组件重新渲染都会创建新的函数引用,并传递给多个子组件,导致子组件发生不必要的重渲染。 - **建议**:将 `formatTime` 移至 Hook 外部(作为纯函数)或使用 `useCallback` 包裹。 --- ✅ 格式检查通过 | ❌ 逻辑审查需修改 | ⚠️ 建议关注性能 --- <sub>🤖 由 AI 代码审查机器人自动生成 | 2026-07-27 06:58:57 | 模型: </sub> <!-- AI_CODE_REVIEW_AUTO_COMMENT -->
Collaborator

Auto merge skipped after multiple 405 errors: PR may have conflicts or unresolved checks. Please review manually. This is not a CI failure.

Auto merge skipped after multiple 405 errors: PR may have conflicts or unresolved checks. Please review manually. This is not a CI failure.
xiaoxia closed this pull request 2026-07-27 15:28:43 +08:00

🗑️ 预览环境已清理

PR #1010 已关闭或合并,对应的预览环境已被清理。

如有需要,可以重新打开 PR 来重新生成预览环境。

🗑️ **预览环境已清理** PR #1010 已关闭或合并,对应的预览环境已被清理。 > 如有需要,可以重新打开 PR 来重新生成预览环境。
Some checks are pending
CI/CD Pipeline / Check if frontend-only change (pull_request) Successful in 5s
CI/CD Pipeline / Validate - Type Check (mypy) (pull_request) Successful in 1m19s
CI/CD Pipeline / Validate - Code Quality (pull_request) Failing after 1m50s
CI/CD Pipeline / Frontend Lint (pull_request) Successful in 28s
CI/CD Pipeline / Validate - Migration (alembic) (pull_request) Successful in 1m7s
CI/CD Pipeline / Build Staging API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Staging Worker Image (pull_request) Has been skipped
CI/CD Pipeline / PR Build Worker Image (pull_request) Successful in 21s
PR Automation / Auto Approve on CI Green (pull_request) Successful in 54s
CI/CD Pipeline / PR Build Web Image (pull_request) Successful in 1m42s
Preview Deploy / Deploy Preview Environment (pull_request) Successful in 47s
CI/CD Pipeline / PR Build API Image (pull_request) Successful in 3m32s
AI Code Review / AI Code Review (pull_request) Successful in 3m37s
PR Automation / Auto Merge on CI Green + Approved (pull_request) Successful in 15m16s
ACR Cleanup / ACR Image Cleanup (pull_request_target) Has been cancelled
CI/CD Pipeline / Unit Tests (pull_request) Has been skipped
CI/CD Pipeline / Build Production API Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Web Image (pull_request) Has been skipped
CI/CD Pipeline / Build Production Worker Image (pull_request) Has been skipped
CI/CD Pipeline / Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / Deploy Staging (Watchtower auto-deploy) (pull_request) Has been skipped
CI/CD Pipeline / Frontend Unit Tests (pull_request) Failing after 23s
Preview Cleanup / Cleanup Preview Environment (pull_request) Successful in 21s
CI/CD Pipeline / Deploy Production (pull_request) Has been skipped
CI/CD Pipeline / Staging E2E Tests (pull_request) Has been skipped
CI/CD Pipeline / Staging API Integration Tests (pull_request) Has been skipped
CI/CD Pipeline / ACR Image Cleanup (pull_request) Has been skipped
CI/CD Pipeline / Canary Release to Production (pull_request) Has been cancelled
CI/CD Pipeline / Production Browser E2E (pull_request) Has been skipped

Pull request closed

Sign in to join this conversation.