feat(tui): diff viewer

[davidpdrsn]

Features:

• Pressing d toggles a detail+diff view
• For commits it shows details such as full sha, timestamps, and messages
• Shows a unified diff inspired by delta
• Diffs have syntax highlighting using syntect which is the same crate that bat uses
• The diff view is scrollable with ctrl+n and ctrl+p for individual lines and ctrl+d and ctrl+u for bigger jumps

Don't let the size of this PR scare you. The bulk of it is the syntax highlighting theme.

Prior art includes the but diff and but diff --tui commands. I took some inspiration from those implementations but ultimately decided to write something new for the TUI. In part to get more familiarity with the data structures but also because I'm hoping this new implementation can become more full featured and have better performance. When this has matured we should be able to replace the other implementations.

Future improvements

These are things that I have intentionally not focused on yet but will in the future.

• Performance. When you select a new commit or branch I re-render the whole diff from scratch. Thats slow and can be made much better. However I don't have good ways to measure performance at the moment so I want to build that first. When that is in place I want to try and render the diff incrementally, so not everything rendered on one frame, and maybe do it on a separate thread.
• Full screen diff. Currently the diff is always in a vertical 50/50 split. In the future I want to make that more flexible both supporting horizontal split but also full screen.
• Line wrapping in the diff. If lines are too long they overflow. The commit message is wrapped.
• Side-by-side diff. Currently the diff is always unified (deleted/added lines shown together) but I want to add the option to show them split instead.
• Word level diff. I really the word level diff that delta does but I haven't implemented it yet.
• Scrolling the diff view with the mouse. General mouse support for the TUI is still on my TODO.

I have filled Linear tickets for these.

---

This is part 3 of 3 in a stack made with GitButler:

•  3  refactor(tui): move tui Mode and related types into their own module #13063
•  2  refactor(tui): move DebugAsType into its own module #13062
•  1  feat(tui): diff viewer #13047 👈

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated (UTC)
gitbutler-web	Ignored	Preview	Mar 27, 2026 4:19pm

[Copilot]

Pull request overview

Adds an in-TUI “details” pane that renders commit metadata and a syntax-highlighted unified diff for the selected commit.

Changes:

• Introduces a Details component and wires it into the status TUI update/render loop.
• Implements diff rendering with syntect-based syntax highlighting and adds a bundled Monokai theme asset (+ license).
• Updates workspace/crate dependencies (ratatui feature flag, adds syntect + textwrap).

Reviewed changes

Copilot reviewed 6 out of 7 changed files in this pull request and generated 10 comments.

Show a summary per file

File	Description
crates/but/src/command/legacy/status/tui/mod.rs	Integrates a details pane into the status screen layout and update loop.
crates/but/src/command/legacy/status/tui/details.rs	Implements commit-details fetching and diff rendering with syntax highlighting.
crates/but/assets/syntax-highlighting-themes/Monokai Extended.tmTheme	Adds a bundled theme consumed by syntect.
crates/but/assets/syntax-highlighting-themes/Monokai Extended License	Adds license notice for the bundled theme.
crates/but/Cargo.toml	Adds dependencies needed for diff rendering/wrapping/highlighting.
Cargo.toml	Enables a ratatui unstable feature at the workspace level.

[krlvi]

There is syntax highlighting! I didnt know this was possible! awesome

[davidpdrsn]

There is syntax highlighting! I didnt know this was possible! awesome

Yeah its very useful! I found https://docs.rs/syntect which does all the heavy lifting.

[OliverJAsh]

Looks great!

Regarding the diff layout (unified / side-by-side) and wrapping, I spent some time recently making this work nicely in jjui with difftastic, and I learnt a few things a long the way.

For the future, it would be nice to support custom external diff tools, like lazygit. Difftastic is my daily driver.

I believe it's possible to pass --width to both delta and difftastic so it can automatically wrap. I'm using this with jjui's preview it's working well for me.

I also wrote a small wrapper for difftastic that automatically switches the display/layout between unified and side-by-side based on available width: https://github.com/OliverJAsh/dotfiles/blob/5341c9c28d13128b3134e3a909cabc2e0e875369/pkgs/difft-auto-layout.nix. Maybe we could do something similar.

[OliverJAsh]

Demo of difftastic using unified for preview and side-by-side for fullscreen diff:

Screen.Recording.2026-03-27.at.09.56.48.mov

[davidpdrsn]

For the future, it would be nice to support custom external diff tools, like lazygit. Difftastic is my daily driver.

Yes I agree that would be good to support.

Demo of difftastic using unified for preview and side-by-side for fullscreen diff:

That's nice! I think I'm gonna steal that for our diff rendering.

[Copilot]

Pull request overview

Copilot reviewed 8 out of 9 changed files in this pull request and generated 7 comments.

[Copilot]

Pull request overview

Copilot reviewed 65 out of 66 changed files in this pull request and generated 6 comments.