feat!: 合并 Git 面板与文件追踪为统一「文件变动」tab（双视角 + 统一 diff 栈）
在 PR #471（file-trace）基础上的演进： - 合并 tab：git tab（id 保留，兼容持久化布局）升级为「文件变动」双视角 tab——Git 视角（原 GitView 全部能力：staged/unstaged/提交/历史/worktree· 子仓库选择/右键菜单/确认弹窗）+ 本轮文件视角（原 file-trace：会话事件 日志实时折叠的模型读写编辑记录，按文件分组、新增类型筛选 chips、相对 时间）；file-trace tab 移除（未随任何版本发布）。 - 统一 diff 组件：新 src/client/diff/ 模块（rows.ts 引擎 + DiffRows/ DiffFiles 渲染器 + highlight.ts 语法着色）——git diff 与会话操作 diff 共用一套渲染：mod 改写配对（del-run/add-run 对半标蓝）、行内字符级 高亮（修复了旧实现旧侧失配不高亮的问题，改为行对象身份键）、上下文 hunk 折叠、git hunk 间未输出区间按行号范围生成不可展开折叠、语法着色 色相落位 diff 三色空档、+n −m 统计 chips、行底色 tint；DiffTab 改用 该栈（git diff tab 从此也有高亮）。 - 交互：两视角共用底部可拖拽预览面板（点击文件/提交/操作即预览，不再 直接开 diff tab；面板可刷新、可键盘/拖拽调高、git 目标可一键展开为 独立 diff tab）；视角选择与面板高度持久化在 tab.meta；git 行 XY 徽章 按状态字母着色；选中行高亮。 - i18n：fileTrace* 十键重命名为 changes* 前缀，git 键值更新为「文件 变动」，新增 7 键（视角/筛选/面板操作），全部 21 个词典同步。 - 结构：src/client/changes/（ChangesTab/GitLens/SessionLens/DiffPane/ ops）+ src/client/diff/；GitView/DiffView/filetrace/ 删除；git 样式 从 sidebar.module.css 迁至 changes.module.css。 - 测试：builtins 8→7（git tab 承接 badge pin）、diff-rows（unified 转换/mod 配对/间隙折叠/统计）、changes-tab（壳交互 jsdom）、 diff-files-collapse（原 DiffView 折叠行为钉住）、changes-ops（原 filetrace 数据层）、git-view-worktree 迁移至 GitLens；全量 1122 通过。 - 文档：README ×2 功能矩阵合并、external-plugin-guide §4.4 与内置清单 7 tab、mount e2e 菜单标题同步。
This commit is contained in:
Menghuan1918
@@ -0,0 +1,122 @@
|
||||
/**
|
||||
* A full unified-diff document (one changed file, or every file of a commit
|
||||
* patch): collapsible per-file headers — source files open by default, tests
|
||||
* / docs / generated files stay folded — each expanded file rendering through
|
||||
* the shared {@link DiffRows} (so git diffs get the same rewrite tinting,
|
||||
* intra-line highlights, syntax colors and hunk folds as session-op diffs).
|
||||
* Untracked files produce no `git diff` output; the caller passes their
|
||||
* content to render as a full-file addition instead.
|
||||
*/
|
||||
import { useEffect, useMemo, useState, type ReactNode } from 'react'
|
||||
import clsx from 'clsx'
|
||||
import { t } from '../locales.ts'
|
||||
import { diffStats, displayPath, parseUnifiedDiff, unifiedSegments, untrackedFile, type DiffFile } from './rows.ts'
|
||||
import { langOfPath } from './highlight.ts'
|
||||
import { DiffRows } from './DiffRows.tsx'
|
||||
import css from './diff.module.css'
|
||||
|
||||
const TEST_PATH = /(^|\/)(?:__tests__|tests?|specs?|fixtures?|mocks?|snapshots?)(?:\/|$)|\.(?:test|spec)\.[^/]+$/i
|
||||
const DOC_PATH = /(^|\/)(?:docs?|documentation)(?:\/|$)|(^|\/)(?:readme|changelog|contributing|license|authors|notice)(\.[^/]*)?$/i
|
||||
const GENERATED_PATH = /(^|\/)(?:dist|build|coverage|generated|vendor|node_modules)(?:\/|$)|(^|\/)(?:package-lock\.json|pnpm-lock\.yaml|yarn\.lock|bun\.lockb?|composer\.lock|cargo\.lock|poetry\.lock)$/i
|
||||
const SOURCE_PATH = /\.(?:js|jsx|mjs|cjs|ts|tsx|mts|cts|py|pyw|rb|php|java|kt|kts|scala|go|rs|swift|c|h|cc|cpp|cxx|hpp|hh|hxx|cs|fs|fsx|vb|dart|lua|r|ex|exs|erl|hrl|clj|cljs|cljc|groovy|sh|bash|zsh|fish|ps1|sql|vue|svelte|astro|html|htm|css|scss|sass|less)$/i
|
||||
|
||||
/** Source files open by default; tests, docs, generated files and unknown types stay folded. */
|
||||
function defaultExpandedFiles(files: readonly DiffFile[]): Set<number> {
|
||||
const expanded = new Set<number>()
|
||||
files.forEach((file, index) => {
|
||||
const path = displayPath(file.newPath === '/dev/null' ? file.oldPath : file.newPath)
|
||||
if (!file.binary && file.hunks.length > 0
|
||||
&& !TEST_PATH.test(path) && !DOC_PATH.test(path) && !GENERATED_PATH.test(path)
|
||||
&& SOURCE_PATH.test(path)) {
|
||||
expanded.add(index)
|
||||
}
|
||||
})
|
||||
return expanded
|
||||
}
|
||||
|
||||
/** The file header badge: added / deleted / renamed / binary ('' for a plain edit). */
|
||||
function fileTag(file: DiffFile): string | null {
|
||||
if (file.binary) return t('diffBinary')
|
||||
if (file.oldPath === '/dev/null') return t('diffAdded')
|
||||
if (file.newPath === '/dev/null') return t('diffDeleted')
|
||||
const oldPath = displayPath(file.oldPath)
|
||||
const newPath = displayPath(file.newPath)
|
||||
if (oldPath !== newPath) return t('diffRenamed')
|
||||
return null
|
||||
}
|
||||
|
||||
export interface DiffFilesProps {
|
||||
/** Unified diff text (`git.diff` or `git.commit-diff` payloads). */
|
||||
diff: string
|
||||
/** Untracked-file content: when present, renders as a full-file addition instead of parsing. */
|
||||
untrackedPath?: string
|
||||
untrackedContent?: string
|
||||
}
|
||||
|
||||
export function DiffFiles({ diff, untrackedPath, untrackedContent }: DiffFilesProps) {
|
||||
const parsed = useMemo(() => {
|
||||
if (untrackedPath !== undefined) {
|
||||
return { files: [untrackedFile(untrackedPath, untrackedContent ?? '')] }
|
||||
}
|
||||
return parseUnifiedDiff(diff)
|
||||
}, [diff, untrackedPath, untrackedContent])
|
||||
const [expandedFiles, setExpandedFiles] = useState<Set<number>>(() => defaultExpandedFiles(parsed.files))
|
||||
useEffect(() => { setExpandedFiles(defaultExpandedFiles(parsed.files)) }, [parsed])
|
||||
|
||||
// Segments and header stats computed once per file.
|
||||
const files = useMemo(
|
||||
() => parsed.files.map((file) => {
|
||||
const segments = unifiedSegments(file)
|
||||
return { file, segments, stats: diffStats(segments) }
|
||||
}),
|
||||
[parsed],
|
||||
)
|
||||
|
||||
const renderFile = (entry: (typeof files)[number], fileIndex: number): ReactNode => {
|
||||
const { file, segments, stats } = entry
|
||||
const tag = fileTag(file)
|
||||
const from = displayPath(file.oldPath)
|
||||
const to = displayPath(file.newPath)
|
||||
const expandable = !file.binary && file.hunks.length > 0
|
||||
const fileExpanded = expandedFiles.has(fileIndex)
|
||||
return (
|
||||
<div key={`file-${String(fileIndex)}`} className={css.fileBlock}>
|
||||
<button
|
||||
type="button"
|
||||
className={css.file}
|
||||
disabled={!expandable}
|
||||
aria-expanded={expandable ? fileExpanded : undefined}
|
||||
onClick={() => {
|
||||
setExpandedFiles(current => {
|
||||
const next = new Set(current)
|
||||
if (next.has(fileIndex)) next.delete(fileIndex)
|
||||
else next.add(fileIndex)
|
||||
return next
|
||||
})
|
||||
}}
|
||||
>
|
||||
{expandable && <span aria-hidden="true" className={clsx(css.fileChevron, fileExpanded && css.fileChevronExpanded)}>›</span>}
|
||||
<span className={css.filePath}>{to}</span>
|
||||
{from !== to && <span className={css.fileOld}>← {from}</span>}
|
||||
{tag !== null && <span className={css.fileTag}>{tag}</span>}
|
||||
{expandable && (stats.added > 0 || stats.deleted > 0) && (
|
||||
<span className={css.fileStats}>
|
||||
{stats.added > 0 && <span className={css.statAdd}>+{String(stats.added)}</span>}
|
||||
{stats.deleted > 0 && <span className={css.statDel}>−{String(stats.deleted)}</span>}
|
||||
</span>
|
||||
)}
|
||||
</button>
|
||||
{expandable && fileExpanded && (
|
||||
<DiffRows segments={segments} lang={langOfPath(to)} />
|
||||
)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
if (parsed.files.length === 0) return null
|
||||
return (
|
||||
<div className={css.files}>
|
||||
{files.map(renderFile)}
|
||||
</div>
|
||||
)
|
||||
}
|
||||
Reference in New Issue
Block a user