Vscode: Tab groups "for components"

Created on 21 Nov 2017  路  11Comments  路  Source: microsoft/vscode

Hi,

I was looking to do an extension for vs code. I'm currently developing with Angular 1.6 and i'm building many components. Each one of them as 4 files : index.js, ctrl.js, template.pug, style.scss. I open a lot of tabs and i just end up not using them cause i have too many.. So i just search the file in the tree instead it's quicker.
image
image

I'm sure we could do something about that ! My main idea is to add tab groups. This is an example of what i mean :
image

It would need to be configurable because, we don't all have the same structure.. With all the component base frameworks out there i think there is definitely a lot of people that would benefit from this :)

But i have no experience with vs code extensions and i think there is no way of doing this since we don't have DOM access :/. So what do you guys think of this ?

*duplicate feature-request workbench-tabs

Most helpful comment

In my opinion the feature should be built as simple as possible to prevent a cluttered UI / too many settings.
From my understanding three options would suffice:

  1. No Tab Groups
  2. Tabs grouped by folder (all open files that are in the same folder are displayed in a group (similar to the original feature request)
  3. Tabs grouped by folder and filename

Option 3 is helpful if the files are named MyComponent.html, MyComponent.js, MyComponent.css but is also great for C++ developers which have MyClass.cpp and MyClass.h.
The UI is also straight forward: simply have a tab with the file name without extension and separate buttons for the file extensions.

All 11 comments

This would be a very helpful feature. Maybe another way of imagining this:

Make tabs be either a file or a group. Groups are marked visually to distinguish them. Adding a group does not show anything inside it, it is an empty tab. Anything you open while that group is active, becomes a new tile that is draggable. This way, you can switch tabs, and some tabs can contain multiple tiles.
Bonus points: Checkbox to toggle remembering the group contents after it was closed.
This might sound different to what jbeau suggests which is configuring auto-detection based on folder structures. Either way would be good.

Unfortunately, this sounds rather complex and could be confusing for the user. But I assume this could greatly the ease of navigation

My main idea was to group tabs if they share some context. Should it be detected via folder structure ? Maybe, but it would be hard to please all.. Maybe it could be done manually as a first iteration and test if it does indeed helps with the problem.

I posted that a while ago.. not sure if it will be done tbh. Someone with more time could try to do it in a fork and who knows what MS will do with this.

The way I see it, this problem would be solved by the general concept of _tab hierarchy_, i.e. having not just a flat list of open documents but a tree of tabs. In most cases this tree would have two levels, but I can see the benefit of having it deeper.

The concept itself is relatively straightforward. Figuring out the UI would be more tricky, I imagine.

So, wassup?

In my opinion the feature should be built as simple as possible to prevent a cluttered UI / too many settings.
From my understanding three options would suffice:

  1. No Tab Groups
  2. Tabs grouped by folder (all open files that are in the same folder are displayed in a group (similar to the original feature request)
  3. Tabs grouped by folder and filename

Option 3 is helpful if the files are named MyComponent.html, MyComponent.js, MyComponent.css but is also great for C++ developers which have MyClass.cpp and MyClass.h.
The UI is also straight forward: simply have a tab with the file name without extension and separate buttons for the file extensions.

This feature request is now a candidate for our backlog. The community has 60 days to upvote the issue. If it receives 20 upvotes we will move it to our backlog. If not, we will close it. To learn more about how we handle feature requests, please see our documentation.

Happy Coding!

:slightly_smiling_face: This feature request received a sufficient number of community upvotes and we moved it to our backlog. To learn more about how we handle feature requests, please see our documentation.

Happy Coding!

The new Chrome version has this feature now.

image

https://blog.google/products/chrome/manage-tabs-with-google-chrome

I think vscode should do this in a similar way.

Really excited for this feature when it comes 馃檹

Even though https://github.com/microsoft/vscode/issues/100335 is newer, I think it makes sense to merge the two.

/duplicate https://github.com/microsoft/vscode/issues/100335

Thanks for creating this issue! We figured it's covering the same as another one we already have. Thus, we closed this one as a duplicate. You can search for existing issues here. See also our issue reporting guidelines.

Happy Coding!

Was this page helpful?
0 / 5 - 0 ratings