Skip to main content

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 setting

Message

Full commit message including body

Date Formats

Configure how dates are displayed:
{
  "neo-git-graph.dateFormat": "Date & Time"
}
// Example: "19 Mar 2019 21:34"

Date Type

Choose which date to display:
{
  "neo-git-graph.dateType": "Author Date" // or "Commit Date"
}
The date when the changes were originally created (default)
git log --format="%at"
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:
TypeIconDescription
AAdded - New file created
M✏️Modified - Existing file changed
DDeleted - 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:
// Get file change types and paths
git diff-tree --name-status -r -m --root --find-renames --diff-filter=AMDR <hash>

// Get line statistics
git diff-tree --numstat -r -m --root --find-renames --diff-filter=AMDR <hash>
The extension runs both commands in parallel for efficiency:
  1. --name-status provides file paths and change types
  2. --numstat provides addition/deletion counts
Results are merged using a filename lookup table (see 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:
filename.ext (Added in abc1234)

Diff Implementation

Diffs are opened using the vscode.diff command:
// From gitGraphView.ts:442-448
vscode.commands.executeCommand(
  "vscode.diff",
  encodeDiffDocUri(repo, oldFilePath, commitHash + "^"),
  encodeDiffDocUri(repo, newFilePath, commitHash),
  title,
  { preview: true }
)
Diffs open in preview mode by default. Click the diff tab to pin it.

Special Cases

  • Left side: Empty file
  • Right side: New file content at commit
  • Left side: File content at parent commit
  • Right side: Empty file
  • Shows both old and new paths
  • Displays content diff if file was also modified
  • 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)
// From dataSource.ts:163
body: lines.slice(1, lastLine + 1).join("\n")
Commit messages are rendered with preserved formatting, including newlines and indentation.

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:
{
  "neo-git-graph.autoCenterCommitDetailsView": true
}
  • View automatically scrolls to center the expanded commit
  • Provides consistent viewing experience
  • Recommended for most users

Avatar Support

Display author avatars from GitHub, GitLab, or Gravatar

Branch Operations

Checkout, merge, and manage branches from commit details

Performance Considerations

For commits with thousands of file changes, the details view may take time to render. The extension loads file statistics asynchronously to maintain responsiveness.

Optimization Tips

  1. Large commits: Stats are fetched in parallel for faster loading
  2. Merge commits: Only changes vs. first parent are shown by default
  3. 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)

Build docs developers (and LLMs) love