feat: Add config to support more than 12 essential tabs

[blakegearin]

Summary

• Added zen.tabs.essentials.max preference with a default of 12

• Added zen.tabs.essentials.height preference with a default of 0 (height expands to fit)

Screenshots

• Higher max + default height = height expands to fit (legacy behavior)

  

• Higher max + lower height = scrolls

  

  

• Higher max + higher height = expands

  

Notes

• Zen supported more than 12 essential tabs in version 1.12.2b and before leading to a number of threads

  • Zen Browser v1.12.3b: "Add to Essentials" Area Tab Limit (Max 12 Tabs)? #8238

  • Adding new essentials is not working #8308

  • Unable to add tabs to essentials after most recent update #8315

  • Cant Add more Essential tabs #8341

[mr-cheffy]

How does it handle overflows of the window?

[hatimthayyil]

Do you mean in collapsed mode? Essentials overflowing downwards?

[univalis]

Is it possible to re-open the pull-request ?

[mr-cheffy]

I'll reopen it but won't be merged until fundamental issues are solved.

1. Issue with overflowing over the window when there are too many
2. Issue with wrong usage of essentials. (People misusing this feature as pinned tabs rather than highly important apps)

[shaqaruden]

I'll reopen it but won't be merged until fundamental issues are solved.

1. Issue with overflowing over the window when there are too many

2. Issue with wrong usage of essentials. (People misusing this feature as pinned tabs rather than highly important apps)

The more I think about this the more I am leaning in your direction. I guess my main issue was with closing the PR, what I felt was too early. Which I know "what is too early?" is different for everyone. Is there an explanation in the docs that defines the intended use of each kind of tabs? Reason I ask is, "Essential Tabs" has a different meaning to different people and the delineation between Essential and Pinned tabs is a little blurry at least.

Maybe what we need here is a clearer definition of the intended use for each in the docs (if it does not already exist. I could not find it myself) and not to allow a configurable amount of Essential Tabs.

If the look is what people are after there is the Super Pins Mod which can give them that.

[mr-cheffy]

Is there an explanation in the docs that defines the intended use of each kind of tabs

not in the docs, but in the future, im planning on making essentials not being able to be unloaded, only very explicitly through the context menu. Why? Because essentials are supposed to be apps that are "essential", always running on the background. You do not need 38 apps running constantly on the background. If you want them to always stay there, that's the purpose of pinned tabs.

[ErdemGKSL]

btw you should probably do it a getter, or assign listener for it. otherwise the changes you do will not be shown on the fly i guess, probably you would need to restart the browser to see the changes.

[shaqaruden]

Is there an explanation in the docs that defines the intended use of each kind of tabs

not in the docs, but in the future, im planning on making essentials not being able to be unloaded, only very explicitly through the context menu. Why? Because essentials are supposed to be apps that are "essential", always running on the background. You do not need 38 apps running constantly on the background. If you want them to always stay there, that's the purpose of pinned tabs.

Ahhh okay. Knowing that I would have to fully agree with you on this.

@blakegearin any thoughts?

[blakegearin]

Sorry for the delay. I was out of town and then came back to some build issues (XPCOM, mentioned in #107). So I'm going to try on a different machine to examine overflow more closely. I don't use collapsed mode personally.

You do not need 38 apps running constantly on the background.

I don't think a browser should be prescriptive in this domain. People have lots of tabs open, and they're going to organize them in a way that makes the most sense to them. Maybe out there, somewhere, a security guard is using Zen to flip through 20 cameras 😄

The information density of essentials compared to pinned tabs can be as high as 4 to 1. That's a large difference. I don't think 38 pinned tabs can be displayed in one view without scroll. It's not obvious how essential and pinned tabs are different besides their densities. Even if it was well-documented, I presume most users who rub up against this limit aren't going to read it to understand the philosophical differences between essentials and pins. They're going to report a bug. Recent examples: #8689, #8900

While not a perfect comparison, I'm able to get 18 extensions pinned to the toolbar before space runs out. There is no explicit, hard limit as far as I can tell, and that's a good thing. Customization is important, and many extensions run constantly.

I understand there is a maintenance aspect to this, but I haven't heard any specifics on what makes 12 the best "magic number" as compared to 16, 20, or 24. Personally I don't use more than 24.

[hatimthayyil]

The Essentials tab is useful for having easy and quick access to a frequently-used set of sites from any workspace context. I keep a number of workspaces with their own focused set of Pinned tabs. I have more than 12 tabs that is workspace-agnostic and would like to be able to access from any context.

I use the the SuperPins extension to allow for more than 4 tabs per line of essentials. Increases the density and compactness of Essentials. A similar option for essentials (allowing more than four tabs per line) could help with the overflow issue in expanded mode.. It doesn't help with collapsed mode though. I guess people who use collapsed mode would be happy with a smaller number of essentials, and have found workflows that work best for them.

The combination of workspaces, workspace-local "Pinned" tabs, and global "Essential" tabs allows for a flexible workflow that I've found very useful in Zen.

[blakegearin]

Nearly identical to src/zen/workspaces/zen-workspaces.css (source)

[ErdemGKSL]

This looks great especially when using container based essentials. Because for different workspace/containers i have different essentials and hard limit 12 forces me to have 3 essentials per workspace... (i have 4 workspaces)

[PauloDaniel1993]

I'll reopen it but won't be merged until fundamental issues are solved.

1. Issue with overflowing over the window when there are too many

2. Issue with wrong usage of essentials. (People misusing this feature as pinned tabs rather than highly important apps)

Isn't a bit problematic saying that people are using the feature wrong? It was added there and people would use as they want no? And, okay that before there wasn't a limit and probably was a bug or missing some planning, but as there was no limit, there is people that came to the browser because of that feature.

[mr-cheffy]

Isn't a bit problematic saying that people are using the feature wrong?

Why would it be? I've seen people try to drive cars underwater and I wouldn’t say the car is poorly designed just because it doesn’t turn into a submarine. Same goes for features — just because someone misuses them doesn’t mean the feature itself is flawed.

[erdoganersinkeskin]

Hi,

When I tried to change "zen.tabs.essentials.max" to 24 or 30, for example, I still can't add new essentials in the essentials area.

[PauloDaniel1993]

Isn't a bit problematic saying that people are using the feature wrong?

Why would it be? I've seen people try to drive cars underwater and I wouldn’t say the car is poorly designed just because it doesn’t turn into a submarine. Same goes for features — just because someone misuses them doesn’t mean the feature itself is flawed.

Sorry, I didn't get your point. I didn't say that the feature is flawed. What I said is that the feature was there in a way and it changed behavior already established. It is pretty common that something that was designed in a way to be used in another way. And it is not wrong, it is just another way to use it.

[blakegearin]

When I tried to change "zen.tabs.essentials.max" to 24 or 30, for example, I still can't add new essentials in the essentials area.

@erdoganersinkeskin This code isn't merged or released. Are you building locally?

[erdoganersinkeskin]

I tried to use the local version for it, but I gave up. I will wait for stable version updates.

[chrisshieh-direct]

One way to look at it is that the users are "misusing" the feature. Another way is to recognize that the users are giving you information about how they would love to use the feature. They're giving you specific UX feedback, unprompted and motivated. Much better than user testing.

I'd like to echo @blakegearin's sentiment... is there a technical reason why the number is 12? When it was unlimited, I had 16, which doesn't seem like a crazy number.

[PauloDaniel1993]

I agree, I had 20. Given the nature of my work, I need to access a lot of apps a lot of times. Essentials is magical for that.

[braccae]

Just adding my use case for more than 12 essential tabs. Before Zen/Arc I used to keep about 2 dozen PWA's open for notifications and quick access. These were things like webmail, chat clients, news readers, social media, etc. Since moving to Zen, I've replaced those with the essential tabs. This limitation is basically telling me "You can't have more than 12 apps open on your computer at a time." It doesn't feel great.

[mr-cheffy]

Please remove zen.tabs.essentials.height, let's try to keep PRs centralized on fixing a specific problem

[blakegearin]

This addresses the problem identified...

Issue with overflowing over the window when there are too many

Did you have something else in mind for handling overflow?

[mr-cheffy]

Maybe just add a max height for the essentials container and make it overflowable with CSS

[blakegearin]

I think we encounter the same issue. There's no specific magic number for the height that makes sense for all users. It's highly dependent on the number of essentials, rows/width, and screen size.

[PauloDaniel1993]

But if make it overflow, it can have a "random" number specified until we put this zen.tabs.essentials.height back, no?

[blakegearin]

@PauloDaniel1993 I'm not sure I understand your question.

By default zen.tabs.essentials.height is not active. Essentials are added normally, and the height and rows adjust based on the width chosen by the user. Once it's changed to something other than 0, you get either expansion or scrolling depending on how many essentials there are and the screen height (since the number is vh units). There are screenshots in the description.

Because of this behavior, I don't think it makes sense to pick an arbitrary number. This would cause the code change from being passive and opt-in to something that will visually change how the essentials look for many users.

[SalahAdDin]

Why is this even required? In previous versions we didn't have a limit for essentials?

[SomeDudeBrosky]

Also adding my use case for more than 12 essential tabs: I am a medical student. I need more than 12 essentials in order to complete my daily work.
Also; 12 is a very arbitrary number to limit the amount of essentials to.

[mr-cheffy]

Is this pr done? There seems to be some git conflicts