mirrors/desktop
1
0
Fork 0
mirror of https://github.com/zen-browser/desktop.git synced 2025-09-05 19:08:18 +00:00
Code Issues Packages Projects Releases Wiki Activity

Merge branch 'dev' of https://github.com/zen-browser/desktop into dev

Browse Source
This commit is contained in:
Mr. M
2025-08-18 20:11:52 +02:00
parent d216114364 f95f245644
commit d8196c58ab
2 changed files with 93 additions and 56 deletions
Download Patch File Download Diff File Expand all files Collapse all files

29
src/browser/components/tabbrowser/content/tabs-js.patch
View File

@@ -1,5 +1,5 @@
diff --git a/browser/components/tabbrowser/content/tabs.js b/browser/components/tabbrowser/content/tabs.js
index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef622eef930 100644
index e47f735e4e4563c9b7537944628418d1478c068d..8af76f08278e5db4029bf060bbf4ea4c82929be7 100644
--- a/browser/components/tabbrowser/content/tabs.js
+++ b/browser/components/tabbrowser/content/tabs.js
@@ -332,7 +332,7 @@
@@ -28,14 +28,15 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
let tabsPerRow = 0;
let position = RTL_UI
? window.windowUtils.getBoundsWithoutFlushing(
@@ -773,8 +772,9 @@
@@ -772,9 +771,10 @@
if (tab.multiselected) {
this.#moveTogetherSelectedTabs(tab);
} else if (isTabGroupLabel(tab) && !tab.group.collapsed) {
- } else if (isTabGroupLabel(tab) && !tab.group.collapsed) {
- tab.group.collapsed = true;
- expandGroupOnDrop = true;
+ } else if (isTabGroupLabel(tab) && (!tab.group.collapsed || tab.group.hasAttribute("has-active"))) {
+ tab.group.collapsed = !tab.group.hasAttribute("split-view-group");
+ expandGroupOnDrop = !tab.group.collapsed || tab.group.hasAttribute("has-active");
expandGroupOnDrop = true;
+ gZenFolders.collapseVisibleTab(tab.group);
}
}
@@ -472,7 +473,7 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
if (dropElement) {
- let dropElementForOverlap = isTabGroupLabel(dropElement)
+ if (dropElement?.group?.hasAttribute("split-view-group") || dropElement.hasAttribute("split-view-group")) {
+ dropElement = dropElement.group.labelElement;
+ dropElement = dropElement.group.labelElement ?? dropElement.labelElement;
+ }
+ let dropElementForOverlap = isTabGroupLabel(dropElement) && !dropElement.group?.hasAttribute("split-view-group")
? dropElement.parentElement
@@ -645,7 +646,15 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
item.removeAttribute("dragover-createGroup");
}
this.removeAttribute("movingtab-createGroup");
@@ -3198,7 +3270,7 @@
@@ -3122,7 +3194,6 @@
"tab-group-label-container"
)) {
label.style.width = "";
- label.style.height = "";
label.style.left = "";
label.style.top = "";
label.removeAttribute("dragtarget");
@@ -3198,7 +3269,7 @@
let postTransitionCleanup = () => {
movingTab._moveTogetherSelectedTabsData.animate = false;
};
@@ -654,7 +663,7 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
postTransitionCleanup();
} else {
let onTransitionEnd = transitionendEvent => {
@@ -3371,7 +3443,7 @@
@@ -3371,7 +3442,7 @@
}
_notifyBackgroundTab(aTab) {
@@ -663,7 +672,7 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
return;
}
@@ -3480,7 +3552,10 @@
@@ -3480,7 +3551,10 @@
#getDragTarget(event, { ignoreSides = false } = {}) {
let { target } = event;
while (target) {
@@ -675,7 +684,7 @@ index e47f735e4e4563c9b7537944628418d1478c068d..6c26b1ff42c386db52d743cdf0b53ef6
break;
}
target = target.parentNode;
@@ -3497,6 +3572,9 @@
@@ -3497,6 +3571,9 @@
return null;
}
}

120
src/zen/folders/ZenFolders.mjs
View File

@@ -253,6 +253,7 @@
if (activeGroup?.length > 0) {
for (const folder of activeGroup) {
folder.removeAttribute('has-active');
folder.removeAttribute('selected-tab-id');
this.collapseVisibleTab(folder);
this.updateFolderIcon(folder, 'close', false);
}
@@ -352,6 +353,7 @@
if (selectedItem) {
group.setAttribute('has-active', 'true');
selectedItem.setAttribute('folder-active', 'true');
group.setAttribute('selected-tab-id', selectedItem.getAttribute('zen-pin-id'));
this.setFolderIndentation([selectedItem], group, /* for collapse = */ true);
}
@@ -398,43 +400,48 @@
const animations = [];
tabsContainer.style.overflow = 'hidden';
if (group.hasAttribute('has-active')) {
const selectedTabId = group.getAttribute('selected-tab-id');
const selectedTab = group?.querySelector(`tab[zen-pin-id="${selectedTabId}"]`);
// Since the folder is now expanded, we should remove active attribute
// to the tab that was previously visible
selectedTab.removeAttribute('folder-active');
selectedTab.style.removeProperty('--zen-folder-indent');
group.removeAttribute('has-active');
group.removeAttribute('selected-tab-id');
}
// Since the folder is now expanded, we should remove active attribute
// to the tab that was previously visible
for (const tab of group.tabs) {
if (tab.group === group && tab.hasAttribute('folder-active')) {
tab.removeAttribute('folder-active');
}
}
const groupItems = [];
group.childGroupsAndTabs.forEach((item) => {
if (gBrowser.isTabGroupLabel(item)) {
if (item?.group?.hasAttribute('split-view-group')) {
item = item.group;
} else {
item = item.parentNode;
}
}
// If all the groups above the item are visible, remove the indentation
if (gBrowser.isTab(item)) {
let isVisible = true;
let parent = item.group;
while (parent) {
if (parent.collapsed && !parent.hasAttribute('has-active')) {
isVisible = false;
break;
const normalizeGroupItems = (items) => {
const processed = [];
items
.filter((item) => !item.hasAttribute('zen-empty-tab'))
.forEach((item) => {
if (gBrowser.isTabGroupLabel(item)) {
if (item?.group?.hasAttribute('split-view-group')) {
item = item.group;
} else {
item = item.parentElement;
}
}
parent = parent.group;
}
if (isVisible) {
item.style.removeProperty('--zen-folder-indent');
}
processed.push(item);
});
return processed;
};
const activeGroups = group.querySelectorAll('zen-folder[has-active]');
const groupItems = normalizeGroupItems(group.childGroupsAndTabs);
const itemsToHide = [];
for (const activeGroup of activeGroups) {
let selectedTabId = activeGroup.getAttribute('selected-tab-id');
let selectedTab = activeGroup.querySelector(`tab[zen-pin-id="${selectedTabId}"]`);
// If the selected tab is in a split view group, we need to get the last tab
if (selectedTab?.group?.hasAttribute('split-view-group')) {
selectedTab = selectedTab.group.tabs.at(-1);
}
groupItems.push(item);
});
let index = activeGroup.childGroupsAndTabs.indexOf(selectedTab);
let itemsAfter = activeGroup.childGroupsAndTabs.slice(index + 1);
itemsToHide.push(...normalizeGroupItems(itemsAfter));
}
groupItems.map((item) => {
animations.push(
@@ -442,7 +449,20 @@
item,
{
opacity: 1,
height: 'auto',
height: '',
},
{ duration: 0.1, ease: 'easeInOut' }
)
);
});
itemsToHide.map((item) => {
animations.push(
gZenUIManager.motion.animate(
item,
{
opacity: 0,
height: 0,
},
{ duration: 0.1, ease: 'easeInOut' }
)
@@ -451,16 +471,20 @@
animations.push(...this.updateFolderIcon(group));
animations.push(
gZenUIManager.motion.animate(
groupStart,
{
marginTop: 0,
},
{
duration: 0.1,
ease: 'linear',
}
)
gZenUIManager.motion
.animate(
groupStart,
{
marginTop: 0,
},
{
duration: 0.1,
ease: 'linear',
}
)
.then(() => {
tabsContainer.style.overflow = '';
})
);
this.#animationCount += 1;
await Promise.all(animations);
@@ -468,12 +492,15 @@
if (this.#animationCount) {
return;
}
tabsContainer.style.overflow = '';
groupItems.map((item) => {
groupItems.forEach((item) => {
// Cleanup just in case
item.style.opacity = '';
item.style.height = '';
});
itemsToHide.forEach((item) => {
item.style.opacity = '';
item.style.height = '';
});
}
#onNewFolder(event) {
@@ -1004,7 +1031,7 @@
let itemHeight = 0;
for (const item of group.allItems) {
itemHeight += item.getBoundingClientRect().height;
if (item.hasAttribute('folder-active')) {
if (item.hasAttribute('folder-active') && !item.selected) {
item.removeAttribute('folder-active');
if (!onlyIfActive) {
item.setAttribute('was-folder-active', 'true');
@@ -1132,6 +1159,7 @@
}
selectedItem.setAttribute('folder-active', 'true');
group.setAttribute('selected-tab-id', selectedItem.getAttribute('zen-pin-id'));
animations.push(...this.updateFolderIcon(group, 'close', false));