Overview
The commit details view provides in-depth information about each commit, including author information, commit message, file changes with statistics, and the ability to view diffs for individual files.Viewing Commit Details
Click on any commit in the graph to display its details. The view appears inline, expanding the graph to accommodate the information.With
autoCenterCommitDetailsView enabled (default), the view automatically scrolls to center the commit details.Commit Metadata
Information Displayed
The commit details panel shows:Commit Hash
Full SHA-1 hash of the commit
Parent Commits
SHA-1 hashes of parent commits (multiple for merges)
Author
Name and email of the commit author
Committer
Name of the person who committed (may differ from author)
Date
Timestamp based on
dateType settingMessage
Full commit message including body
Date Formats
Configure how dates are displayed:Date Type
Choose which date to display:- Commit Date
These dates can differ when commits are cherry-picked, rebased, or applied from patches.
File Changes
Change Types
The commit details view displays all modified files with their change type:| Type | Icon | Description |
|---|---|---|
| A | ➕ | Added - New file created |
| M | ✏️ | Modified - Existing file changed |
| D | ➖ | Deleted - File removed |
| R | 🔄 | Renamed - File moved or renamed |
File Statistics
For each file, the view shows:- Additions: Number of lines added (green)
- Deletions: Number of lines removed (red)
- Old path: Original file path (for renames)
- New path: Current file path
Implementation Details
The extension uses two Git commands to gather file information:Why two commands?
Why two commands?
The extension runs both commands in parallel for efficiency:
--name-statusprovides file paths and change types--numstatprovides addition/deletion counts
dataSource.ts:192-218).Viewing Diffs
Opening File Diffs
Click on any file in the commit details to open a side-by-side diff view using VS Code’s built-in diff viewer.Diff Title Format
The diff editor title varies by change type:Diff Implementation
Diffs are opened using thevscode.diff command:
Diffs open in preview mode by default. Click the diff tab to pin it.
Special Cases
Added Files
Added Files
- Left side: Empty file
- Right side: New file content at commit
Deleted Files
Deleted Files
- Left side: File content at parent commit
- Right side: Empty file
Renamed Files
Renamed Files
- Shows both old and new paths
- Displays content diff if file was also modified
Merge Commits
Merge Commits
- Shows diff against first parent by default
- All file changes across merge are displayed
Commit Message Body
The full commit message is displayed, including:- Subject line (first line)
- Empty line separator
- Message body (all subsequent lines)
Context Menu Actions
Right-click on commit details to access additional actions:- Copy Commit Hash: Copy full SHA-1 to clipboard
- Copy Commit Subject: Copy first line of message
- Checkout Commit: Detach HEAD at this commit
- Cherry-pick Commit: Apply changes to current branch
- Revert Commit: Create inverse commit
- Reset to Commit: Move branch pointer (soft/mixed/hard)
- Create Branch: Start new branch from this commit
- Create Tag: Tag this commit
Auto-Centering
Control whether the view scrolls to show commit details:- Enabled (Default)
- Disabled
- View automatically scrolls to center the expanded commit
- Provides consistent viewing experience
- Recommended for most users
Related Features
Avatar Support
Display author avatars from GitHub, GitLab, or Gravatar
Branch Operations
Checkout, merge, and manage branches from commit details
Performance Considerations
Optimization Tips
- Large commits: Stats are fetched in parallel for faster loading
- Merge commits: Only changes vs. first parent are shown by default
- Binary files: Numstat may show
-for additions/deletions
Keyboard Navigation
- Escape: Close commit details and collapse view
- Click outside: Deselect commit and close details
- Arrow keys: Navigate to adjacent commits (if implemented in web UI)