Skip to content

feat: ファイル変更差分表示の追加#22

Merged
ktmage merged 7 commits into
developmentfrom
feature/16/file-diff
Feb 28, 2026
Merged

feat: ファイル変更差分表示の追加#22
ktmage merged 7 commits into
developmentfrom
feature/16/file-diff

Conversation

@ktmage

@ktmage ktmage commented Feb 28, 2026

Copy link
Copy Markdown
Owner

Summary

セッションレベルのファイル変更差分を表示する機能を追加。SDK の session.diff() API を利用し、TodoHeader と同様の折りたたみバー UI で変更ファイル一覧・インライン差分・VS Code ネイティブ diff エディタへの連携を提供する。

Related Issue

Closes #16

Changes

バックエンド(Extension Host)

  • opencode-client.ts: getSessionDiff() メソッド追加、FileDiff 型のエクスポート
  • chat-view-provider.ts: getSessionDiff / openDiffEditor メッセージハンドラ追加
  • extension.ts: opencode-diff-before / opencode-diff-after TextDocumentContentProvider 登録

メッセージ型・共通

  • vscode-api.ts: sessionDiff(Ext→Webview)、getSessionDiff / openDiffEditor(Webview→Ext)メッセージ型追加
  • locales/en.ts, locales/ja.ts: fileChanges.* ロケール文字列追加
  • icons.tsx: DiffIcon, ExternalLinkIcon 追加

Webview

  • useFileChanges フック: session.diff SSE イベントで差分データを管理
  • FileChangesHeader コンポーネント: TodoHeader 風の折りたたみバー UI
    • ファイル数・追加/削除行数のサマリー表示
    • ファイルごとのステータスバッジ(A/D/M)
    • インライン差分表示(DiffView)
    • VS Code diff エディタを開くボタン
  • App.tsx: フック統合、sessionDiff メッセージ処理、TodoHeader の下に FileChangesHeader を配置
  • AppContext.tsx: fileDiffs / onOpenDiffEditor 追加

テスト

  • icons.test.tsx: DiffIcon / ExternalLinkIcon 単体テスト(+16)
  • FileChangesHeader.test.tsx: コンポーネント単体テスト(22)
  • useFileChanges.test.ts: フック単体テスト(5)
  • 15-file-changes.test.tsx: シナリオテスト(12)

Checklist

  • npm run build passes
  • npm test passes (52 files, 709 tests)
  • Biome check passes

ktmage added 7 commits March 1, 2026 03:21
- Add getSessionDiff() method to OpenCodeClient
- Add getSessionDiff/openDiffEditor message handlers in ChatViewProvider
- Register opencode-diff-before/after TextDocumentContentProviders
- Export FileDiff type from opencode-client
- Add sessionDiff, getSessionDiff, openDiffEditor message types
- Add fileChanges.* locale strings (en/ja)
- Add DiffIcon and ExternalLinkIcon components
- Handle session.diff SSE events
- Provide diffs/setDiffs/clearDiffs/handleFileChangeEvent
- TodoHeader-style collapsible bar with file count and stats
- Per-file items with status badge (A/D/M), inline diff, open button
- Expandable inline DiffView for each file
- Wire useFileChanges hook and sessionDiff message handling in App
- Add fileDiffs/onOpenDiffEditor to AppContext
- Render FileChangesHeader below TodoHeader above InputArea
- Add DiffIcon/ExternalLinkIcon to icons unit tests (+16 tests)
- Add FileChangesHeader unit tests (22 tests)
- Add useFileChanges hook tests (5 tests)
- Add scenario test 15-file-changes (12 tests)
@ktmage ktmage linked an issue Feb 28, 2026 that may be closed by this pull request
@ktmage ktmage changed the title Feature/16/file-diff feat: ファイル変更差分表示の追加 Feb 28, 2026
@ktmage ktmage marked this pull request as ready for review February 28, 2026 18:26
@ktmage ktmage merged commit 943bc5f into development Feb 28, 2026
1 check passed
@ktmage ktmage deleted the feature/16/file-diff branch March 1, 2026 17:58
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

ファイル変更差分表示の追加

1 participant