Add option to pin tabs similar to Visual Studio

[jez9999]

There should be an option in Visual Studio Code to pin tabs, like you can in Visual Studio.

As with issue #10739 there should be a config option allowing you to hide the "pin tab" icon in the tab itself if you just want to use the right-click menu or shortcut to pin/unpin tabs.

There should also be an option (again, like in Visual Studio) where pinned tabs are put onto a separate line above the other tabs.

[4imble]

Would love this too, this is how I manage my tabs in 'visual studio full'. I am finding it somewhat hard to live without as the files that open during my normal flow are getting in the way.

[pascal-mormin]

I am agree, it would be nice

[wonea]

We already have functionality for this. Opening a file from the file explorer with a single or double click does what happens with a pin in Visual Studio. I'd vote to close this issue, and open another making how the tabs are handled clearer. Perhaps adding a pin icon on the window tabs are marked "Keep Open".

[asednev]

@wonea Visual Studio has option to keep pinned tabs separate from open tabs (and on the different row). Such option would be great to have in Visual Studio Code. Perhaps that should be a separate ticket.

[jez9999]

@asednev Exactly. I'd say VS Code could actually improve on Visual Studio by keeping the current behaviour, but additionally allowing tabs to be "top pinned" or something, which would put them in a row above the rest of the tabs (ie. the regular Visual Studio pin behaviour).

[eliashdezr]

Another vote for the pinned tabs in a top row. This helps greatly to work on the "main" files when you end up open a lot of files.

[predragbaltic]

Pinned tabs are very good feature which we must to have

[andrew-lis]

I wrote a little VSCode extension to solve a similar problem. It's called Workbench: https://github.com/andrew-lis/Workbench
Maybe my solution could be a hint for you how to implement it natively.

[mouradhamoud]

I keep closing tabs by accident, it would be nice to have this feature available (Like Google Chrome does)

[ChuckkNorris]

Doesn't need to be fancy - something simple like this with a context menu item to pin a tab would be great!

[pmunin]

Created intersecting issue: #32836

[maccurt]

yes, for the love of all that is holy add it.

[tmatthews0020]

+1

[SirLants]

I am shocked that this feature hasn't been implemented yet, I assumed a simple Google Search would yield some setting I need to turn on. I can't say exactly what the productivity cost is, but I sometimes have up to 30-40 pins in Visual Studio and it makes life so easy. Whenever this is added I will be super happy, VS Code dev team.

[zbendefy]

+1

[PaulARoy]

As exciting as unexpected!
THANK YOU!

Even if I think a second row is a must have, I completely understand your approach.

I cannot say thank you enough!

[ChuckkNorris]

@bpasero Thanks for the update on the feature!

My main feedback is that I believe it's critical to allow users to have pinned tabs on a separate row:

• If we want the entire file name to show in the pinned tab, then we'll lose a lot of room for "transient" tabs which will require us to scroll horizontally way more than we should need to.
• Having them on a separate line makes it much quicker to differentiate between unpinned tabs

[Fell]

Thank you, looks great!

How is the behaviour when closing multiple tabs?
Will they stay open on "Close All"?

[bpasero]

If it works just like in the video, and we can rearrange the pinned tabs

Pinned tabs can be moved in and out to pin or unpin. The drop feedback will indicate what happens (e.g. if you drop on a pinned tab, the tab will be pinned and vice versa).

How is the behaviour when closing multiple tabs? Will they stay open on "Close All"?

The only way to close a pinned tab is by explicitly closing it (e.g. via Cmd+W when active). Actions such as "Close All" or "Close Others" will not close pinned tabs. There are only a few exceptions, e.g. we have a "Close All Editor Groups" command that would also take down pinned tabs.

[Acmion]

Awesome work @bpasero ! Exited to see this in VS Code!

It's important to get this first version out there, after which enhancements (for example, the separate row) can be implemented.

[bpasero]

Insiders is now updated with these changes: https://code.visualstudio.com/insiders/

To pin a tab you can either:

• right click > Pin
• or configure a keybinding to the command workbench.action.pinEditor and workbench.action.unpinEditor (CtrlCmd+K CtrlCmd+Enter by default)

[SirLants]

I work in a full MS stack but for my client-side work I really prefer working in something lighter like VS Code. It made me sad how much pinned tabs was a deal breaker. From fellow software engineers to software engineers, thank you!

[derekaug]

Insiders is now updated with these changes: https://code.visualstudio.com/insiders/

To pin a tab you can either:

• right click > Pin
• or configure a keybinding to the command workbench.action.pinEditor and workbench.action.unpinEditor (CtrlCmd+K CtrlCmd+Enter by default)

Wow, this is great! I know this is still early in development, but would be great to have an option to pin files and keep the filename visible. Lot of times I just pin things that I just want to keep open indefinitely but it gets tough to know which is which if I have multiple files of a specific type pinned.

[abdulkareemnalband]

Hiding pinned tab filename can be an issue, As most files in a project will be of same type, And we cannot distinguish them by just looking at icon

[rsodre]

Hiding pinned tab filename can be an issue, As most files in a project will of same type, And we cannot distinguish them by just looking at icon

I agree. A second row for the pinned tabs would be more useful for me.
That could be a settings option:

• Pinned with name
• Pinned as Icon
• Pin on a second row (with name)

[petertirrell]

For what it's worth I would prefer the behavior to match regular Visual Studio - making the tabs "sticky" to the left, but retaining the full file name. Heh, I can't say I've ever used the "2nd row" behavior in Visual Studio for pinned tabs :-P

[gimbo]

All I want from pinned tabs is that they don't go away when I do a "close all" or "close others" type operation, and also don't get closed automatically if I go over workbench.editor.limit.value tabs open. In fact, the workbench.editor.limit.value thing is the most important to me, since hitting that limit will happen more than I hit "close all", and right now I don't use the workbench.editor.limit.value option at all because without pinned tabs it's useless to me.

[bpasero]

Pinned tabs will behave as such:

• close operations that are not for a single editor ignore them (e.g. "Close All")
• with regards to workbench.editor.limit pinned tabs are treated like dirty tabs and will not close

[Choiyos]

I think my opinion should also see the file name on a fixed tab.
I think the reason why Chrome's fixed tabs didn't have to be named is because the icons were enough to distinguish them.

[woutgg]

In some cases, it might be useful to show just an icon with the first letter of the filename in it (like default avatars showing a user's initials on various platforms).
So for instance with 'README.md' and 'TODO.md' pinned, you would see an icon with 'R' and one with 'T'.

[bpasero]

I wonder if one setting should be there where you can simply put the size of a pinned tab (currently it is 38px). If you put more than 38px we start to render the name of the tab but it would cut off the name if exceeding that width.

Btw if you have not seen pinned tabs without icons enabled, they pick the first letter of the file name:

[CWempe]

How about adding the icon as a badge on the bottom right corner of the tab.

Just a thought...

[bpasero]

@CWempe

How about adding the icon as a badge on the bottom right corner of the tab.

Do you mean to always do that independent from the icon setting or only in this case? I think if the user has chosen to disable icons we should not show them and in the other case, I am not sure if a small badge has sufficient visibility to tell files apart.

@AndrewDavis

rounding down to the nearest letter for each tab's title string would be a good idea

I am not sure I understand that idea. Can you give an example?

[CWempe]

Do you mean to always do that independent from the icon setting or only in this case? I think if the user has chosen to disable icons we should not show them and in the other case, I am not sure if a small badge has sufficient visibility to tell files apart.

Actually, I did not know you could disable icons. 😄
Of cause this option should be configurable or depending on the general icon setting.

Here is a quick mockup.

Yes, the "bagdes" might be a little smaller once implemented.
But since many icons have different colors they might be distinguishable, even if they are small.

I guess we will have to see how this will look in reality.

Regarding the width of pinned tab.
I do not know how vscode works internally, but keep in mind users can zoom in and out the GUI.
So a fixed width in pixels might not work. In HTML there are other units ypou can use to dynamically set the size of an element.
But I am sure the vscode developers will know this better than me. 😄

[Fell]

I'd be happy if I could chose icon + x characters from the file name, preferably without '…' because it just wastes space.

So you can have:
☐ GameManager.cpp
☐ GameM
☐ Ga
☐ G
or just
☐

This doesn't require big layout changes and makes it possible to adjust for every codebase and user.

[Fell]

Really? It has no limit on tab with? Well... that's good in a way. But also... bad. Is there a setting for that?

And yes, they would have different sizes, but if you set it to say 4 characters it would only differ slightly.

To unify the widths, I would experiment with fixing the tab width to num_chars * 1em. I'm not a web/css expert, but as I understood it, 1em is roughly the "width of an m", the widest character, and it changes with the selected font or zoom level.

[bpasero]

You can configure "workbench.editor.tabSizing": "shrink" to let tabs shrink to a smaller size up to a minimum of 120px, but the default (fit) will always show the entire tab, even if it exceeds the available space.

[yannlairdc]

@bpasero Really glad to see things thing are moving forward with this!

To add my view on this, I also believe it would be better to show the full name of the file on the tab by default. Having just the icon when you're working exclusively with cs or js file for example would make it hard to interact with.
There could be an option like "tab.maxfilenamecharsize" to decide if we want to cut the name of the file if it's too long, with a popup when you hover over the tab to display the fullname.

On a side note, have you already created the ticket to talk about the dedicated row for pinned tab by any chance?

[bpasero]

I extracted the following issues:

• Allow to pin tabs Allow to pin tabs #98558
• Pinned tabs: show them in a secondary tab row above others Pinned tabs: show them in a secondary tab row above others #98160
• Pinned tabs: add a setting to show more context Pinned tabs: add a setting to show more context #98161

On top of that I created a test plan item (#98019) where people can see the current implemented set of features. I suggest to file new issues if something is not covered by the existing issues I opened.

@jez9999 if there are no objections I would go ahead and close this issue and continue the remaining parts in the referenced issues. I realize that this issue has gotten a ton of upvotes and explicitly asks for the VS way ("Add option to pin tabs similar to Visual Studio") but would ask for moving votes and discussions into the follow up issues I created.