dlvhdr/diffnav — 1.5k Stars

Topics

#cli #delta #diff #git #github #golang #tui

Language breakdown

Go 99.8%

Shell 0.2%

▸ Files click to expand

README

output-onlinepngtools

A git diff pager based on delta but with a file tree, à la GitHub.

❤️ Sponsoring

If you enjoy diffnav and want to help, consider supporting the project with a donation at the sponsors page.

Installation

Homebrew:

brew install dlvhdr/formulae/diffnav

Go:

git clone https://github.com/dlvhdr/diffnav.git
cd diffnav
go install .

[!NOTE]

To get the icons to render properly you should download and install a Nerd font from https://www.nerdfonts.com/. Then, select that font as your font for the terminal.

>

You can install these with brew as well: brew install --cask font-<FONT NAME>-nerd-font

Usage

Pipe into `diffnav`

git diff | diffnav
gh pr diff https://github.com/dlvhdr/gh-dash/pull/447 | diffnav

Set up as Global Git Diff Pager

git config --global pager.diff diffnav

Flags

| Flag | Description | | -------------------- | --------------------------------------------------------------------- | | --side-by-side, -s | Force side-by-side diff view | | --unified, -u | Force unified diff view | | --watch, -w | Watch mode: periodically re-run a command and refresh | | --watch-cmd | Command to run in watch mode (implies --watch, default: git diff) | | --watch-interval | Interval between watch refreshes (default: 2s) |

Example:

git diff | diffnav --unified
git diff | diffnav -u

Watch Mode

Watch mode lets diffnav periodically re-run a diff command and refresh the display automatically. This is useful for monitoring changes as you work.

# watch unstaged changes (default: git diff, every 2s)
diffnav --watch
watch staged changes with a custom interval
diffnav --watch-cmd "git diff --cached" --watch-interval 5s
watch changes against a specific branch
diffnav --watch-cmd "git diff main..."

Configuration

The config file is searched in this order:

$DIFFNAVCONFIGDIR/config.yml (if env var is set)
$XDGCONFIGHOME/diffnav/config.yml (if set, macOS only)
~/.config/diffnav/config.yml (macOS and Linux)
OS-specific config directory (e.g., ~/Library/Application Support/diffnav/config.yml on macOS)

Example config file:

ui: # Hide the header to get more screen space for diffs hideHeader: true # Hide the footer (keybindings help) hideFooter: true # Start with the file tree hidden (toggle with 'e') showFileTree: false # Customize the file tree width (default: 26) fileTreeWidth: 30 # Customize the search panel width (default: 50) searchTreeWidth: 60 # Icon style: "status" (default), "simple", "filetype", "full", "unicode", or "ascii" icons: nerd-fonts-status # Color filenames by git status (default: true) colorFileNames: false # Show the amount of lines added / removed next to the file showDiffStats: false # Use side-by-side diff view (default: true, set false for unified) sideBySide: true

# How many levels of folders to open on start (-1 = all, 0 = none, 1 = first level, etc.) startFoldersOpenDepth: 1

Icon Styles

Delta

You can also configure the diff rendering through delta. Check out their docs.

If you want the exact delta configuration I'm using - it can be found here.

Keys

| Key | Description | | :-------------------------- | :------------------------------- | | j | Next node | | k | Previous node | | n | Next file | | p / N | Previous file | | Ctrl-d | Scroll the diff half page down | | Ctrl-u | Scroll the diff half page up | | Ctrl-e | Scroll the diff one line down | | Ctrl-y | Scroll the diff one line up | | e | Toggle the file tree | | t | Search/go-to file | | y | Copy file path | | i | Cycle icon style | | o | Open file in $EDITOR | | s | Toggle side-by-side/unified view | | Tab | Switch focus between the panes | | q | Quit |