feat: Zen Folders

[octaviusz]

Continued work on #7359

TODO:

• Drag-and-drop tabs / other folders into collapsed folders.
• Empty folders
• Fix overall drag and dropping when having sub folders
• Add right click context menu to perform folder actions (Instead of firefox's native menu)
• Allow folder name inline editing
• Figure out what to do in collapsed mode
• Restore subfolders after restart session

Few extras:

• Folder -> workspace conversion and the other way around
• "import bookmarks" should create folders instead of actually importing bookmarks (this needs to be discussed)

[Anoms12]

Not sure if this has been patched out yet, but an issue with pinned groups right now is middle clicking to open a new tab opens it in the pinned group (as a regular tab). Just incase it was not on the radar :)

[mr-cheffy]

@octaviusz i've been thinking about the changes done to the mutation observers we've talked before. Is there really no possible workaround for this? This patch is going to be hell to maintain in the long run.

[octaviusz]

@mr-cheffy I tried to preserve the original logic, but the call to #observeTabChanges needs to be placed at the end so that .tab-group-container has time to initialize.

[mr-cheffy]

Some things left:

• Drag-and-drop tabs / other folders into collapsed folders.

I believe there's to ways to tackle this.

1. Show an indicator (e.g. when dragging a tab to the workspace name), to show an action can be done. This can be as simple as just showing a hover effect on the folder when dragged onto. Once the item is dropped, it'll be added to the start of the folder
2. Open the folder so it can be properly inserted

• Empty folders.

[adrian-aaen]

1. Show an indicator (e.g. when dragging a tab to the workspace name), to show an action can be done. This can be as simple as just showing a hover effect on the folder when dragged onto. Once the item is dropped, it'll be added to the start of the folder

2. Open the folder so it can be properly inserted

What about both? I don't remember specific examples, but I've seen multiple apps using option 1, then switching to option 2 if the user keeps hovering for longer.

[mr-cheffy]

These class names should be changed to something more specific before merge

[mr-cheffy]

Nothing should open if there's no tabs to search for

[mr-cheffy]

What about both? I don't remember specific examples, but I've seen multiple apps using option 1, then switching to option 2 if the user keeps hovering for longer.

Oh, very true!

[CrypticVader]

pinned tabs must have been bookmarks since the very beginning of Zen

What do you mean? Firefox already can sync tabs and groups iirc

The Firefox implementation has been counterintuitive in my experience, since the tab synchronization is device dependent. So if I hop between Zen on multiple devices signed in with the same Mozilla account, then I will not be able to bring over the same open tabs and that leads to a disjointed experience.

[z1lV3r]

"import bookmarks" should create folders instead of actually importing bookmarks (this needs to be discussed)

pinned tabs must have been bookmarks since the very beginning of Zen

I disagree with this approach. As an Arc user, I rely on having a complete and separate space for my bookmarks. The key distinctions between the concepts are:

• Pinned Tab: Handy tab to load a page within a space.
• Pinned Tab folders: Group open tabs by topic within a space.
• Bookmark: Shortcut to open tabs in any space, independently.
• Bookmark folders: Group bookmarks by topics to open tabs in any space.

An improvement to evaluate would be to allow users to quickly generate a space from a bookmark folder preserving its URLs and nested folder structure. This would bridge both concepts without removing the flexibility of bookmarks.

[bpavuk]

"import bookmarks" should create folders instead of actually importing bookmarks (this needs to be discussed)

pinned tabs must have been bookmarks since the very beginning of Zen

I disagree with this approach. As an Arc user, I rely on having a complete and separate space for my bookmarks. The key distinctions between the concepts are:

* Pinned Tab: Handy tab to load a page _within_ a space.

* Pinned Tab folders: Group open tabs by topic _within_ a space.

* Bookmark: Shortcut to open tabs in _any_ space, independently.

* Bookmark folders: Group bookmarks by topics to open tabs in _any_ space.

An improvement to evaluate would be to allow users to quickly generate a space from a bookmark folder preserving its URLs and nested folder structure. This would bridge both concepts without removing the flexibility of bookmarks.

is Zen Browser root folder in bookmarks that eyestrain?

[bartbog]

"import bookmarks" should create folders instead of actually importing bookmarks (this needs to be discussed)

It would be nice to offer this feature, maybe in an optional way (checkbox while importing?)
For new users used to having only bookmarks, this would be a timesaver

(but I would not consider this to be a requirement for the current PR)

[bdbch]

Coming in here as well regarding the Tab vs Bookmark discussion.

I think bookmarks could be a great way to solve problems like syncing essential and pinned tabs. Currently since Firefox sync doesn't differentiate between your pinned tabs, you can't sync those to multiple devices with Zen.

Using bookmarks would allow Zen to basically sync pinned & essential tabs using just default Firefox bookmarking behavior. Instead of pinning a tab, what would happen is that it creates a bookmark in a folder (Pinned Tabs, Essential Tabs (or Essential Tabs - WORKSPACE_NAME) which can then easily be synced by Firefox Sync and reused on other devices.

On top of that we could just use nested bookmark folders for tab folders. In general I see "pinned" and "essentials" more like bookmarks then tabs. The only difference to normal bookmarks is the fluid transformation from "static" bookmark into an active tab.

Tl;dr

Bookmarks

Pro Bookmarks

• Already exists and 100% reflects what "pinned" tabs in for example Arc were meant to be
• Easily syncable via Firefox Sync
• Already supports deep nesting
• Can be used for both pinned and essential tabs
• Can be renamed, have descriptions, etc.
• Even when users move off Zen back to Firefox, they'll be able to enjoy their synced tabs

Contra Bookmarks

• Needs extra work to add dynamic replacement of the bookmark in UI with the open tab
• Pollute Firefox bookmarks of sync users with Zen bookmark folders (which can easily be mitigated by putting those bookmarks all into a "Zen" parent bookmark

I created a discussion related to this.

[MrModest]

@bdbch If going with the bookmark approach, then each workspace should have its own dedicated folder so its pinned tab can be living there. Otherwise, how Zen would know which workspace the just synced pinned tab belongs to.

I'm not arguing, just want to emphisize on the crucial part since people that don't use workspaces tend to ignore these nuances while for others they could be crucial.

Complimenting to your suggestion, I can see the Bookmarks structure like this:

.
├── Zen/
│   ├── Essential Tabs/
│   │   ├── Bookmark1
│   │   └── Bookmark2
│   ├── Workspace1/
│   │   ├── Folder1
│   │   └── PinnedTab2
│   └── Workspace1/
│       ├── Folder1
│       └── PinnedTab2
└── Another Firefox root bookmark

Note: Essential Tabs doesn't belong to any workspace since they should be available across all workspaces

[mr-cheffy]

People, please stop suggesting tabs as bookmarks, that's not going to happen. We can already have a separate sync directory just for zen's sync, it doesn't have to be a hacky bookmakrs solutions.

https://github.com/zen-browser/desktop/blob/dev/src/zen/workspaces/ZenWorkspacesSync.mjs

[bdbch]

hacky bookmarks solutions

I'm not sure what's more hacky - tabs behaving like bookmarks or bookmarks behaving like tabs and somehow forcing nested folders into it.

I know you already have an opinion on it yet I still believe bookmarks are a better fit for tab folders. Arc tabs are literally bookmarks designed like tabs.

I'd rather have actual bookmarks that I can take with me and import/export from other browsers and have a already battle-tested solution for a nested folder structure and persistence than something that MAY change again 12 beta versions later.

Why is using Bookmarks not a possibility because it's hacky but building all this extra stuff around pinned tabs to in the end basically replicate bookmarks again?

In the end it's your project and your call, we can just talk and discuss about other solutions that could be possible.

Edit

Sorry, just to drive my point home - I tried to replicate a possible structure in Firefox's Sidebar View, how is this a lot different to tab folders except those currently are links and not tabs? Just think away the "meta" stuff I included and you'd end up with something that looks very similar to a tab folder sidebar from Arc.

Sorry for being persistent here - you'll probably go with what you already have in mind. I just hope that I could maybe bring in some extra thoughts about this feature when it comes to staying open and using a standard like Bookmarks that a lot of browsers can understand.

[mr-cheffy]

I get where you're coming from, but honestly, tabs and bookmarks aren't really comparable, they serve totally different purposes. Tabs are meant to be transient, tied to your current session or workflow. Bookmarks, on the other hand, are a persistent, curated list of saved links. Trying to fuse the two creates more confusion than convenience.

The idea of treating pinned or grouped tabs like bookmarks (or vice versa) just introduces unnecessary complexity. You end up forcing tabs to behave like a storage system, or bookmarks to act like live sessions, neither of which is their intended function.

Just because they look similar in a sidebar doesn’t mean they’re meant to do the same thing.

TL;DR: it just doesn't make sense what you are suggesting.

But if you'd like continue talking about this, lets do it somewhere else, because this PR is just strictly for folders and many people are subscribed to it. They are probably getting emails on every comment.

[HenryKleinschmidt]

@mr-cheffy
I think this idea comes from the way the Arc browser handles tabs/bookmarks

https://resources.arc.net/hc/en-us/articles/19400407903767-Where-are-Bookmarks

I personally like the idea because I'm a tab hoarder but I get that it does not appeal to everyone.

[bdbch]

I already opened a discussion, also don't want to pollute the PR with unrelated feature discussion: #9559

[Geezus42]

@mr-cheffy I think this idea comes from the way the Arc browser handles tabs/bookmarks

https://resources.arc.net/hc/en-us/articles/19400407903767-Where-are-Bookmarks

I personally like the idea because I'm a tab hoarder but I get that it does not appeal to everyone.

It does come from Arc and is one of the things that made me move away from it. It seemed cool, until you want to export your bookmarks to another browser or do any heavy management/pruning. IMO tab folders should be separate from bookmarks, but have a context menu option to save a tab folder as a bookmark folder, and another to open a bookmark folder as a tab folder.