Add option to show pinned tabs in a separate row by yaroslavrick · Pull Request #46573 · zed-industries/zed

yaroslavrick · 2026-01-11T17:46:59Z

Problem:

When working with many pinned tabs, they consume significant horizontal space in the tab bar, leaving less room for unpinned (active working) tabs, especially on small screens. This creates a poor user experience as users must constantly scroll to find their working tabs, or the tabs become too narrow to read file names.

Solution:

Added a new opt-in setting tab_bar.show_pinned_tabs_in_separate_row that displays pinned and unpinned tabs in two separate rows:

Top row: Pinned tabs with navigation buttons and tab bar controls
Bottom row: Unpinned (working) tabs with full horizontal space
when pinned and not pinned tabs we show 2 rows:

This is a well-established UX pattern used in many popular IDEs including JetBrains products (IntelliJ IDEA, WebStorm, PyCharm, RubyMine), Visual Studio, and Eclipse.

The two-row layout only appears when both pinned AND unpinned tabs exist. If only one type is present, a single row is displayed:

when only not pinned tabs we show one row:

when only pinned tabs we show one row:

Important - Default Behavior Preserved:

The setting defaults to false - existing users will see no change whatsoever
Original tab bar logic is preserved in a dedicated render_single_row_tab_bar method, while the new two-row layout lives in render_two_row_tab_bar. Both methods share common components (configure_tab_bar_start, configure_tab_bar_end, render_unpinned_tabs_container, render_tab_bar_drop_target) ensuring DRY code and consistent behavior.
Purely opt-in - users must explicitly enable this feature via Settings UI or settings.json
No impact on default UX - Zed's default tab bar appearance and behavior remains identical

This implementation ensures zero risk to the existing user experience while providing an optional enhancement for users who prefer separated tab rows.

Configuration

Via Settings UI:

Open Settings (Cmd+,) → Editor section → "Pinned Tabs Layout" toggle

Via settings.json:

{
  "tab_bar": {
    "show_pinned_tabs_in_separate_row": true
  }
}

Video of implemented feature:

720.mov

Tested:

Verify default behavior unchanged (single row with pinned + unpinned tabs inline)
Enable setting → verify two rows appear when both pinned and unpinned tabs exist
Enable setting → verify single row when only pinned tabs exist
Enable setting → verify single row when only unpinned tabs exist
Verify drag & drop works in both layouts
Verify navigation buttons and tab bar buttons render correctly
Verify setting toggle works in Settings UI
Verify setting works via settings.json

Tested on: MacBook Pro M4, macOS 26.2

Release Notes:

Added tab_bar.show_pinned_tabs_in_separate_row setting to display pinned and unpinned tabs in separate rows, giving unpinned tabs full horizontal space

cla-bot · 2026-01-11T17:47:02Z

We require contributors to sign our Contributor License Agreement, and we don't have @yaroslavrick 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'.

yaroslavrick · 2026-01-11T17:48:25Z

@cla-bot check

cla-bot · 2026-01-11T17:48:28Z

The cla-bot has been summoned, and re-checked this pull request!

yaroslavrick · 2026-01-13T14:31:17Z

Correct me if I'm wrong, but it looks like the failed test in CI is flaky:

It passes locally on my machine. I don't have permission to re-run the CI. @mattermill Could you please re-run it?

williamdes · 2026-01-14T23:26:58Z

Thank you so much, I will enable this as soon as tomorrow!
Since you have experience with the tab bars, would you make them wrap tabs ?

See issue #5005

KieranP · 2026-01-15T04:42:02Z

This may have broken tab reordering when not enabled - please see #46864

yaroslavrick · 2026-01-15T05:47:43Z

This may have broken tab reordering when not enabled - please see #46864

I will take a look at this

yaroslavrick · 2026-01-15T06:09:18Z

This may have broken tab reordering when not enabled - please see #46864

Seems that I've found the roots of issue: here is this line: 10b2072#diff-f3e6f80bf80e98b614b1fba64a700fc347b10286412e005f363e52279a550244R2768

crates/workspace/src/pane.rs:2768

cc @mattermill

yaroslavrick · 2026-01-15T06:10:23Z

crates/workspace/src/pane.rs

                cx.listener(move |this, dragged_tab: &DraggedTab, window, cx| {
                    this.drag_split_direction = None;
-                    this.handle_tab_drop(dragged_tab, ix, window, cx)
+                    this.handle_tab_drop(dragged_tab, this.items.len(), window, cx)


Seems that I've found the roots of issue: here is this line: 10b2072#diff-f3e6f80bf80e98b614b1fba64a700fc347b10286412e005f363e52279a550244R2768

crates/workspace/src/pane.rs:2768

cc @mattermill

PR of fix: #46872

yaroslavrick · 2026-01-15T07:34:46Z

This may have broken tab reordering when not enabled - please see #46864

PR of fix: #46872

Closes [#46864](#46864) Initial PR: #46573 ## Summary Fix a regression where dragging a tab onto another tab would place it at the end of the tab bar instead of at the target position. The issue was in the `on_drop` handler: it used `this.items.len()` (evaluated at drop time) instead of the captured `ix` index (the position of the tab being dropped onto). Release Notes: - Fixed tab reordering not working correctly when dragging tabs ## Video after fix: - when 'show_pinned_tabs_in_separate_row' is false: https://github.com/user-attachments/assets/1ede0ce5-1161-4209-83f4-33a07572782a - when 'show_pinned_tabs_in_separate_row' is true: https://github.com/user-attachments/assets/d56c0e59-8372-41d4-973b-32a4895ca729 --------- Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com>

…view) (#46878) Cherry-pick of #46872 to preview ---- Closes [#46864](#46864) Initial PR: #46573 ## Summary Fix a regression where dragging a tab onto another tab would place it at the end of the tab bar instead of at the target position. The issue was in the `on_drop` handler: it used `this.items.len()` (evaluated at drop time) instead of the captured `ix` index (the position of the tab being dropped onto). Release Notes: - Fixed tab reordering not working correctly when dragging tabs ## Video after fix: - when 'show_pinned_tabs_in_separate_row' is false: https://github.com/user-attachments/assets/1ede0ce5-1161-4209-83f4-33a07572782a - when 'show_pinned_tabs_in_separate_row' is true: https://github.com/user-attachments/assets/d56c0e59-8372-41d4-973b-32a4895ca729 --------- Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com> Co-authored-by: Yaroslav Yenkala <yaroslavrick@gmail.com> Co-authored-by: Smit Barmase <heysmitbarmase@gmail.com>

JosephTLyons · 2026-01-15T17:43:22Z

Hey @yaroslavrick, caught this bug: #46926

Implement separate pinned tabs row feature

cb07909

cla-bot bot added the cla-signed The user has signed the Contributor License Agreement label Jan 11, 2026

yaroslavrick added 2 commits January 11, 2026 19:54

Merge main and resolve conflict in page_data.rs

48bab10

Fix array size in tab_bar_section return type

d1c0351

yaroslavrick changed the title ~~Implement separate pinned tabs row feature~~ Separate pinned tabs row feature Jan 11, 2026

yaroslavrick changed the title ~~Separate pinned tabs row feature~~ Add option to show pinned tabs in a separate row Jan 11, 2026

yaroslavrick added 2 commits January 11, 2026 20:39

Refactor: extract tab bar rendering into separate methods

faf51eb

DRY: extract common tab bar components into reusable methods

251bdf2

smitbarmase assigned mattermill Jan 12, 2026

pass check_style

10b2072

mattermill merged commit 72f6d39 into zed-industries:main Jan 13, 2026
36 of 39 checks passed

yaroslavrick commented Jan 15, 2026

View reviewed changes

yaroslavrick mentioned this pull request Jan 15, 2026

workspace: Fix tab reordering regression #46872

Merged

zed-zippy bot mentioned this pull request Jan 15, 2026

workspace: Fix tab reordering regression (#46872) (cherry-pick to preview) #46878

Merged

Uh oh!

Conversation

yaroslavrick commented Jan 11, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Problem:

Solution:

Video of implemented feature:

Tested:

Release Notes:

Uh oh!

cla-bot bot commented Jan 11, 2026

Uh oh!

yaroslavrick commented Jan 11, 2026

Uh oh!

cla-bot bot commented Jan 11, 2026

Uh oh!

yaroslavrick commented Jan 13, 2026

Uh oh!

Uh oh!

williamdes commented Jan 14, 2026

Uh oh!

KieranP commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

yaroslavrick commented Jan 15, 2026

Uh oh!

yaroslavrick commented Jan 15, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

yaroslavrick Jan 15, 2026

Choose a reason for hiding this comment

Uh oh!

yaroslavrick Jan 15, 2026

Choose a reason for hiding this comment

Uh oh!

yaroslavrick commented Jan 15, 2026

Uh oh!

JosephTLyons commented Jan 15, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

5 participants

yaroslavrick commented Jan 11, 2026 •

edited

Loading

KieranP commented Jan 15, 2026 •

edited

Loading

yaroslavrick commented Jan 15, 2026 •

edited

Loading