Skip to content

refactor(diff): DiffView 拆分职责,收敛行内评论渲染 / zone 装配 / 业务 hooks#82

Merged
huhamhire merged 1 commit into
devfrom
refactor/diffview-split
Jun 19, 2026
Merged

refactor(diff): DiffView 拆分职责,收敛行内评论渲染 / zone 装配 / 业务 hooks#82
huhamhire merged 1 commit into
devfrom
refactor/diffview-split

Conversation

@huhamhire

Copy link
Copy Markdown
Owner

背景

DiffView.tsx 膨胀到 2647 行,单文件承担数据拉取、Monaco view-zone 生命周期、行内评论 / 草稿渲染、blame 列、范围选择、错误展示等全部职责;其中评论 zone(~250 行)与草稿 zone(~300 行)两段创建逻辑高度重复。本 PR 按职责拆分,运行时行为零变化(纯结构性重构)。

改动

DiffView.tsx 2647 → 380 行,退化为「组合根」:调 hooks 拿状态 + 渲染布局。

tabs/diff/ 新结构

  • zones/mountInlineZones.ts —— 抽象评论 zone 与草稿 zone 共用的通用 view-zone 装配(双层 dom/inner、stopPropagation 接管、宽度 / 横滚 / 高度同步、removeZone/unmount 清理);zones/line-mapping.ts 统一/并排视图的 old→modified 行号映射
  • inline-comments/InlineCommentZone.tsx —— 行内评论渲染独立成域
  • blame/(BlameColumn + blame-utils)· DiffPane · DiffScopeSelect · DiffStatus · DraftZoneList · diff-types 各自拆出
  • hooks/(+ index barrel)—— 数据流(变更文件 / 内容 / 评论 / blame / 范围 / 跳转)与三段 zone 装配 effect 拆成 12 个聚焦 hook

评论渲染公共抽取(新 tabs/shared/

  • useCommentThread(reply/edit/delete 状态机 + handleDelete)与 CommentMarkdown(markdown 样板)由 CommentItem(评论/活动 tab) 与 InlineCommentZone(diff) 共用
  • i18n:评论操作 key 合并进 commentsPanel.*,四 locale 各删 9 个 diffView.* 重复项

行为保留说明

逐行搬运,依赖数组 / 事件集合 / 多时间点兜底 setTimeout 一律原样保留。两段 zone 仅两处不可观测分歧做了统一:① inner 的 stopPropagation 注册时机统一取评论 zone 文档化的「createRoot 之后」(stopPropagation 不阻断同元素监听,草稿改后无观测差异);② syncHeight 兜底 setTimeout 取并集。早期开发的 M4 注释标记已去除、保留注释内容。

验证

  • lint 零警告 ✓ · typecheck ✓ · build ✓(DiffView lazy chunk 完好)
  • test:仅 repo-mirror 5 个 git-CLI 环境性测试失败(未触及该包,此前已知),其余项目通过

外部接口面不变:仅 PrPanel 引用 DiffViewPendingCommitView,二者继续从入口导出。

关联里程碑 代码质量重构 (#3)。后续将单独处理 common/ barrel 收敛。

🤖 Generated with Claude Code

DiffView.tsx 2647 → 380 行,退化为组合根(调 hooks + 渲染布局),行为零变化。

- zones/mountInlineZones:抽象评论 zone 与草稿 zone 共用的通用 view-zone 装配
  (双层 dom/inner、stopPropagation 接管、宽度/横滚/高度同步、removeZone/unmount 清理)
- inline-comments/InlineCommentZone:行内评论渲染独立成域
- blame/ · DiffPane · DiffScopeSelect · DiffStatus · DraftZoneList · diff-types 各自拆出
- hooks/(+ index barrel):数据流与三段 zone 装配 effect 拆成 12 个聚焦 hook
- tabs/shared/:CommentItem(tab) 与 InlineCommentZone(diff) 共用 useCommentThread
  (reply/edit/delete 状态机)与 CommentMarkdown(markdown 样板)
- i18n:评论操作 key 合并进 commentsPanel.*,四 locale 各删 9 个 diffView.* 重复项

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
@huhamhire huhamhire added this to the 代码质量重构 milestone Jun 19, 2026
@huhamhire huhamhire added the refactor 代码重构(不改运行行为) label Jun 19, 2026
@qodo-code-review

Copy link
Copy Markdown

Qodo reviews are paused for this user.

Troubleshooting steps vary by plan Learn more →

On a Teams plan?
Reviews resume once this user has a paid seat and their Git account is linked in Qodo.
Link Git account →

Using GitHub Enterprise Server, GitLab Self-Managed, or Bitbucket Data Center?
These require an Enterprise plan - Contact us
Contact us →

@huhamhire huhamhire merged commit 4b31710 into dev Jun 19, 2026
1 check passed
@huhamhire huhamhire deleted the refactor/diffview-split branch June 19, 2026 08:35
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

refactor 代码重构(不改运行行为)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant