Skip to content

git_ui: Add staged/unstaged view mode like VS Code - #36646

Closed
mohebifar wants to merge 1 commit into
zed-industries:mainfrom
mohebifar:feat/git-panel-staged-unstaged
Closed

git_ui: Add staged/unstaged view mode like VS Code#36646
mohebifar wants to merge 1 commit into
zed-industries:mainfrom
mohebifar:feat/git-panel-staged-unstaged

Conversation

@mohebifar

Copy link
Copy Markdown

Closes #26560

Release Notes:

  • Added a new settings option to git_panel settings display_mode that allows you to switch to a mode similar to VSCode's default which groups files by staged/unstaged instead of tracked vs untracked. If a file has some staged changes and some unstaged changes at the same time, it will appear in both sections just like VSCode.
Screen.Recording.2025-08-20.at.5.06.31.PM.mov

@cla-bot

cla-bot Bot commented Aug 21, 2025

Copy link
Copy Markdown

We require contributors to sign our Contributor License Agreement, and we don't have @mohebifar on file. You can sign our CLA at https://zed.dev/cla. Once you've signed, post a comment here that says '@cla-bot check'.

@mohebifar
mohebifar force-pushed the feat/git-panel-staged-unstaged branch from 85674cc to c12140a Compare August 21, 2025 00:17
@cla-bot cla-bot Bot added the cla-signed The user has signed the Contributor License Agreement label Aug 21, 2025
@mohebifar
mohebifar force-pushed the feat/git-panel-staged-unstaged branch from c12140a to 1f006d2 Compare August 21, 2025 00:18
//
// Default: false
"collapse_untracked_diff": false,
"display_mode": "tracked_untracked",

Copy link
Copy Markdown
Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The default is tracked_untracked, but users can opt in for staged_unstaged

@maxdeviant maxdeviant changed the title feat: git panel's staged/unstaged view mode like vscode git_ui: Add staged/unstaged view mode like VS Code Aug 21, 2025
@secondl1ght

Copy link
Copy Markdown

Will this PR be reviewed? This is a highly requested Git feature and would bring Zed closer to having feature parody with the popular VSCode git panel. I am sure there are lots of edge cases to test before merging, but it looks like review hasn't started yet.

@cole-miller

Copy link
Copy Markdown
Member

Hi @mohebifar, thanks for the PR and sorry for the delay in reviewing.

I think we'd be fine having something like this in Zed, but there are some unsolved design issues:

  1. It fits poorly with our use of checkboxes for staging and unstaging--having the list entry jump to a different place when you click the checkbox feels bad. (VS Code has a different UI affordance for staging and unstaging that works better with this.)
  2. It also doesn't work very well with the diff multibuffer--we don't want to reorder the files in that multibuffer when staging and unstaging, and that means the order of entries in the status list won't agree with the order of files in the multibuffer.

We unfortunately don't have the bandwidth right now to solve these problems, so I'm going to close this PR.

@jerrygreen

jerrygreen commented Sep 12, 2025

Copy link
Copy Markdown

TL;DR – silly comment, skip


we don't want to reorder the files in that multibuffer when staging and unstaging, and that means the order of entries in the status list won't agree with the order of files in the multibuffer

I agree! I hated this in VSCode. Though, that is not a reason to close PR is it? You could have just left this notice and give the guy some time to fix the order to be consistent? And then he re-requests review.

It fits poorly with our use of checkboxes for staging and unstaging--having the list entry jump to a different place when you click the checkbox feels bad

Again, it’s fixable, no? It’s possible to (1) remove the heading, and (2) keep the order. Instead of separating by section with a header, it is possible to differentiate the elements by color – red for unstaged files, green for stages ones. And no header. Then the elements won’t jump here and there.

With the mentioned fixes, it will be a handy compact list of files to quickly jump between the files, as well as seeing the state of entire project diff in one screen, rather than relying on manual git commands or third-party software. I wanted the ability to jump between files long ago. I couldn’t use zed's diff editor because it currently doesn’t work well for big changes.

I did read CONTRIBUTING.md and it looks more like a case where PR shouldn’t have been closed… I mean, it obviously looks great, just requires small changes. No?

@mohebifar

Copy link
Copy Markdown
Author

I see your points, and they make a lot of sense @cole-miller. As @jerrygreen suggested, I'm open to making the adjustments. That said, if there's no chance of this getting merged even with the improvements, I'll leave it at that. I still think the default grouping strategy is not that useful (tracked vs untracked) and this will be a great help :)

p.s. in general, what's stopping me from making the switch to Zed is its git and diff views. I find it a bit confusing compared to vscode and lazygit. I really wanna make it happen and I'll be more than happy to help.

@jerrygreen

jerrygreen commented Sep 13, 2025

Copy link
Copy Markdown

After some thought I think what I just said is just silly, because it's literally what tracked/untracked is. Although there's another approach that can be valid:

2025-09-13-174908_hyprshot

Clicking the button unstaged will show the only unstaged diff. This will solve the issue with jumping up-and-down UI that I hated in VSCode, and will keep the staged/unstaged logic. (Of course, assuming there are hotkeys for the button, too)

Also I have found that on your screen recording @mohebifar, when you click a file from staged category, it doesn't really show «only the staged diff» like VSCode does, and still shows the entire diff. Which is unhelpful yet, in such an early stage of the feature. But overall idea of having displayed staged/unstaged is still good.

@cole-miller

Copy link
Copy Markdown
Member

Hi @mohebifar, as mentioned in #44379 if you're still interested in working on this we've discussed internally and are ready to work to get it merged!

@mohebifar

mohebifar commented Dec 18, 2025

Copy link
Copy Markdown
Author

@cole-miller For sure. I'd love to continue contributing. I can continue working on this over the weekend or next week. How does that sound?

@ozturkkl

Copy link
Copy Markdown

This would be insanely useful. I just transitioned from Cursor and this git view not having a staged/unstaged split is killing it for me.

After this a fast follow would be the "split view" diff. It's nice to see some activity on this, that means I don't have to make drastic changes to my flow like killing the UI completely and adding lazygit, which doesn't flow nicely if you want to make changes realtime while reviewing.

@jorgeatlivo

Copy link
Copy Markdown

Really, really looking forward to this PR. Mixed staged and unstaged files is my biggest gripe with the current git implementation. Thanks @mohebifar and Zed team for the work!!

@secondl1ght

Copy link
Copy Markdown

Awesome to see this getting revived, just dropping the related links here: #26560, #26862, #29635. Thanks @mohebifar! And hopefully the Zed team and @cole-miller can work closely with you to get this feature included.

@mohebifar

Copy link
Copy Markdown
Author

@secondl1ght @cole-miller Here's an update on the progress I made: #26560 (comment)

@drbh drbh mentioned this pull request Jan 11, 2026
2 tasks
pull Bot pushed a commit to mr-narender/zed that referenced this pull request Jul 7, 2026
This PR explores the addition of a new feature and UI to improve
visibility into partially staged commits.

Currently, the Git panel shows tracked and untracked changes, but it
does not clearly distinguish between staged and unstaged changes.

As a result, it’s difficult to quickly see which changes are not staged
in the current UI. Both staged and unstaged changes are combined into
the `Uncommitted Changes` multibuffer. This developer experience differs
from other editors, most notably VS Code; which presents separate Staged
Changes and Changes lists.

### Staged and unstaged diffs in multibuffers

This PR introduces an alternative UI for unstaged changes that aligns
with the overall Zed experience. Instead of showing changes on a
per-file basis, staged and unstaged diffs are each displayed in their
own multibuffers, similar to how `Uncommitted Changes` currently works.

For example the following screenshot shows the current `Uncommitted
Changes` on the left, the `Staged Changes` in the middle and the
`Unstaged Changes` buffer on the right for comparison

<img width="1408" height="859"
src="https://github.com/user-attachments/assets/aa709f7a-041d-4cb1-95d6-84c0f5fff688"
/>

### Indicators/interactions

The new multibuffers can be opened in two ways:

1. Via a new `U` chip, which appears when a file has unstaged changes
2. Via new menu options

(See screenshots below for both interaction paths.)


<table>
  <tr>
    <td style="text-align: center; vertical-align: top;">
      <p>via the chip</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/3ef69f02-b787-499c-959a-25f50b3728e8"
        alt="Via the chip"
      />
    </td>
    <td style="text-align: center; vertical-align: top;">
      <p>via the menu</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/f5be8b6d-ccdc-4420-bd29-75570b558016"
        alt="Via the menu"
      />
    </td>
  </tr>
</table>

### Design goals
- minimally intrusive UI changes (small new badge and menu items)
- adhere by Zed'ism (use multibuffer where possible)
- avoid disabling any current interactions (Uncommitted Changes ui is
unchanged)
- avoid introducing an app level view mode (no new settings needed)

### Experience goals
- make it easy to see what changes are not staged
- make it easy to see that a file has unstaged changes (avoid developers
accidently leaving out changes in a commit; a personal issue that I have
when using Zed)
- elegantly handle large file's unstaged changes (follows the same
collapse and expanding seen in `Uncommitted Changes`)

### How to try

- Clone the repo and run `cargo run`
- Make a change to a file and stage it
- Make another change to the file (the `U` indicator will appear)
- Click the `U` to see the unstaged view

### Open questions/rough edges
- [ ] determine if this user experience is useful for others
- [ ] ensure all interactions work as expected (response to all update
cases)

In general I'm really interested in hearing the community's feedback
about this interface, more than happy to make any changes or explore a
different solution!

### Related issue:
- zed-industries#36646
- zed-industries#26560

Release Notes:

- Support partially staged commit multibuffers via a staged and unstaged
changes view.

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: Cole Miller <cole@zed.dev>
TakuroBreath pushed a commit to TakuroBreath/zed that referenced this pull request Jul 7, 2026
This PR explores the addition of a new feature and UI to improve
visibility into partially staged commits.

Currently, the Git panel shows tracked and untracked changes, but it
does not clearly distinguish between staged and unstaged changes.

As a result, it’s difficult to quickly see which changes are not staged
in the current UI. Both staged and unstaged changes are combined into
the `Uncommitted Changes` multibuffer. This developer experience differs
from other editors, most notably VS Code; which presents separate Staged
Changes and Changes lists.

### Staged and unstaged diffs in multibuffers

This PR introduces an alternative UI for unstaged changes that aligns
with the overall Zed experience. Instead of showing changes on a
per-file basis, staged and unstaged diffs are each displayed in their
own multibuffers, similar to how `Uncommitted Changes` currently works.

For example the following screenshot shows the current `Uncommitted
Changes` on the left, the `Staged Changes` in the middle and the
`Unstaged Changes` buffer on the right for comparison

<img width="1408" height="859"
src="https://github.com/user-attachments/assets/aa709f7a-041d-4cb1-95d6-84c0f5fff688"
/>

### Indicators/interactions

The new multibuffers can be opened in two ways:

1. Via a new `U` chip, which appears when a file has unstaged changes
2. Via new menu options

(See screenshots below for both interaction paths.)


<table>
  <tr>
    <td style="text-align: center; vertical-align: top;">
      <p>via the chip</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/3ef69f02-b787-499c-959a-25f50b3728e8"
        alt="Via the chip"
      />
    </td>
    <td style="text-align: center; vertical-align: top;">
      <p>via the menu</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/f5be8b6d-ccdc-4420-bd29-75570b558016"
        alt="Via the menu"
      />
    </td>
  </tr>
</table>

### Design goals
- minimally intrusive UI changes (small new badge and menu items)
- adhere by Zed'ism (use multibuffer where possible)
- avoid disabling any current interactions (Uncommitted Changes ui is
unchanged)
- avoid introducing an app level view mode (no new settings needed)

### Experience goals
- make it easy to see what changes are not staged
- make it easy to see that a file has unstaged changes (avoid developers
accidently leaving out changes in a commit; a personal issue that I have
when using Zed)
- elegantly handle large file's unstaged changes (follows the same
collapse and expanding seen in `Uncommitted Changes`)

### How to try

- Clone the repo and run `cargo run`
- Make a change to a file and stage it
- Make another change to the file (the `U` indicator will appear)
- Click the `U` to see the unstaged view

### Open questions/rough edges
- [ ] determine if this user experience is useful for others
- [ ] ensure all interactions work as expected (response to all update
cases)

In general I'm really interested in hearing the community's feedback
about this interface, more than happy to make any changes or explore a
different solution!

### Related issue:
- zed-industries#36646
- zed-industries#26560

Release Notes:

- Support partially staged commit multibuffers via a staged and unstaged
changes view.

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: Cole Miller <cole@zed.dev>
jolutz pushed a commit to jolutz/zed that referenced this pull request Aug 8, 2026
This PR explores the addition of a new feature and UI to improve
visibility into partially staged commits.

Currently, the Git panel shows tracked and untracked changes, but it
does not clearly distinguish between staged and unstaged changes.

As a result, it’s difficult to quickly see which changes are not staged
in the current UI. Both staged and unstaged changes are combined into
the `Uncommitted Changes` multibuffer. This developer experience differs
from other editors, most notably VS Code; which presents separate Staged
Changes and Changes lists.

### Staged and unstaged diffs in multibuffers

This PR introduces an alternative UI for unstaged changes that aligns
with the overall Zed experience. Instead of showing changes on a
per-file basis, staged and unstaged diffs are each displayed in their
own multibuffers, similar to how `Uncommitted Changes` currently works.

For example the following screenshot shows the current `Uncommitted
Changes` on the left, the `Staged Changes` in the middle and the
`Unstaged Changes` buffer on the right for comparison

<img width="1408" height="859"
src="https://github.com/user-attachments/assets/aa709f7a-041d-4cb1-95d6-84c0f5fff688"
/>

### Indicators/interactions

The new multibuffers can be opened in two ways:

1. Via a new `U` chip, which appears when a file has unstaged changes
2. Via new menu options

(See screenshots below for both interaction paths.)


<table>
  <tr>
    <td style="text-align: center; vertical-align: top;">
      <p>via the chip</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/3ef69f02-b787-499c-959a-25f50b3728e8"
        alt="Via the chip"
      />
    </td>
    <td style="text-align: center; vertical-align: top;">
      <p>via the menu</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/f5be8b6d-ccdc-4420-bd29-75570b558016"
        alt="Via the menu"
      />
    </td>
  </tr>
</table>

### Design goals
- minimally intrusive UI changes (small new badge and menu items)
- adhere by Zed'ism (use multibuffer where possible)
- avoid disabling any current interactions (Uncommitted Changes ui is
unchanged)
- avoid introducing an app level view mode (no new settings needed)

### Experience goals
- make it easy to see what changes are not staged
- make it easy to see that a file has unstaged changes (avoid developers
accidently leaving out changes in a commit; a personal issue that I have
when using Zed)
- elegantly handle large file's unstaged changes (follows the same
collapse and expanding seen in `Uncommitted Changes`)

### How to try

- Clone the repo and run `cargo run`
- Make a change to a file and stage it
- Make another change to the file (the `U` indicator will appear)
- Click the `U` to see the unstaged view

### Open questions/rough edges
- [ ] determine if this user experience is useful for others
- [ ] ensure all interactions work as expected (response to all update
cases)

In general I'm really interested in hearing the community's feedback
about this interface, more than happy to make any changes or explore a
different solution!

### Related issue:
- zed-industries#36646
- zed-industries#26560

Release Notes:

- Support partially staged commit multibuffers via a staged and unstaged
changes view.

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: Cole Miller <cole@zed.dev>
playdohface pushed a commit to playdohface/zed that referenced this pull request Aug 29, 2026
This PR explores the addition of a new feature and UI to improve
visibility into partially staged commits.

Currently, the Git panel shows tracked and untracked changes, but it
does not clearly distinguish between staged and unstaged changes.

As a result, it’s difficult to quickly see which changes are not staged
in the current UI. Both staged and unstaged changes are combined into
the `Uncommitted Changes` multibuffer. This developer experience differs
from other editors, most notably VS Code; which presents separate Staged
Changes and Changes lists.

### Staged and unstaged diffs in multibuffers

This PR introduces an alternative UI for unstaged changes that aligns
with the overall Zed experience. Instead of showing changes on a
per-file basis, staged and unstaged diffs are each displayed in their
own multibuffers, similar to how `Uncommitted Changes` currently works.

For example the following screenshot shows the current `Uncommitted
Changes` on the left, the `Staged Changes` in the middle and the
`Unstaged Changes` buffer on the right for comparison

<img width="1408" height="859"
src="https://github.com/user-attachments/assets/aa709f7a-041d-4cb1-95d6-84c0f5fff688"
/>

### Indicators/interactions

The new multibuffers can be opened in two ways:

1. Via a new `U` chip, which appears when a file has unstaged changes
2. Via new menu options

(See screenshots below for both interaction paths.)


<table>
  <tr>
    <td style="text-align: center; vertical-align: top;">
      <p>via the chip</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/3ef69f02-b787-499c-959a-25f50b3728e8"
        alt="Via the chip"
      />
    </td>
    <td style="text-align: center; vertical-align: top;">
      <p>via the menu</p>
      <img
        height="400"

src="https://github.com/user-attachments/assets/f5be8b6d-ccdc-4420-bd29-75570b558016"
        alt="Via the menu"
      />
    </td>
  </tr>
</table>

### Design goals
- minimally intrusive UI changes (small new badge and menu items)
- adhere by Zed'ism (use multibuffer where possible)
- avoid disabling any current interactions (Uncommitted Changes ui is
unchanged)
- avoid introducing an app level view mode (no new settings needed)

### Experience goals
- make it easy to see what changes are not staged
- make it easy to see that a file has unstaged changes (avoid developers
accidently leaving out changes in a commit; a personal issue that I have
when using Zed)
- elegantly handle large file's unstaged changes (follows the same
collapse and expanding seen in `Uncommitted Changes`)

### How to try

- Clone the repo and run `cargo run`
- Make a change to a file and stage it
- Make another change to the file (the `U` indicator will appear)
- Click the `U` to see the unstaged view

### Open questions/rough edges
- [ ] determine if this user experience is useful for others
- [ ] ensure all interactions work as expected (response to all update
cases)

In general I'm really interested in hearing the community's feedback
about this interface, more than happy to make any changes or explore a
different solution!

### Related issue:
- zed-industries#36646
- zed-industries#26560

Release Notes:

- Support partially staged commit multibuffers via a staged and unstaged
changes view.

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Co-authored-by: Cole Miller <cole@zed.dev>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

cla-signed The user has signed the Contributor License Agreement

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Staged and Unstaged diffs

6 participants