feat: Enable original extensions panel on hide-unified-extensions-button: false, p=#11335

* feat: Enable original extensions panel on hide-unified-extensions-button: false

* Update to fix prettier issues

* Add site-data attribute for CSS usage

* Update to set gUnifiedExtensions._panel

* Update to fix prettier issues

* Set default panel on onToolbarVisibilityChange

* Update panel initialization

* Remove extra char

* Restore unified-extensions-panel-template deletion

* Reduce reimplementation

* Update patch against Firefox 145.0.2

* Fix conflict

* Add panelUIPosition case

* Fix lint

* feat: Improve and reduce patch sizes, b=no-bug, c=common

---------

Signed-off-by: Blake Gearin <hello@blakeg.me>
Co-authored-by: mr. m <mr.m@tuta.com>
This commit is contained in:
Blake Gearin
2025-12-15 03:19:03 -07:00
committed by GitHub
parent e3d13d534e
commit e525b32c18
6 changed files with 198 additions and 51 deletions

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/browser-addons.js b/browser/base/content/browser-addons.js
index fadcbfca95ee28140579430c0371baad0e2f216a..7454b801b4ad892d6ad122277eb7c7736e976f9f 100644
index fadcbfca95ee28140579430c0371baad0e2f216a..22a92ca450ef5087610169b15d7f3344c9accddf 100644
--- a/browser/base/content/browser-addons.js
+++ b/browser/base/content/browser-addons.js
@@ -1069,7 +1069,7 @@ var gXPInstallObserver = {
@@ -38,37 +38,131 @@ index fadcbfca95ee28140579430c0371baad0e2f216a..7454b801b4ad892d6ad122277eb7c773
}
return anchorID;
@@ -2657,11 +2657,7 @@ var gUnifiedExtensions = {
// Lazy load the unified-extensions-panel panel the first time we need to
// display it.
if (!this._panel) {
- let template = document.getElementById(
- "unified-extensions-panel-template"
- );
- template.replaceWith(template.content);
- this._panel = document.getElementById("unified-extensions-panel");
+ this._panel = document.getElementById("zen-unified-site-data-panel");
let customizationArea = this._panel.querySelector(
"#unified-extensions-area"
@@ -2547,7 +2547,7 @@ var gUnifiedExtensions = {
requestAnimationFrame(() => this.updateAttention());
},
- onToolbarVisibilityChange(toolbarId, isVisible) {
+ onToolbarVisibilityChange(toolbarId, isVisible, panel = this.panel) {
// A list of extension widget IDs (possibly empty).
let widgetIDs;
@@ -2561,7 +2561,7 @@ var gUnifiedExtensions = {
}
// The list of overflowed extensions in the extensions panel.
- const overflowedExtensionsList = this.panel.querySelector(
+ const overflowedExtensionsList = panel.querySelector(
"#overflowed-extensions-list"
);
@@ -2662,37 +2662,41 @@ var gUnifiedExtensions = {
);
@@ -2714,6 +2710,7 @@ var gUnifiedExtensions = {
// and no alternative content is available for display in the panel.
const policies = this.getActivePolicies();
template.replaceWith(template.content);
this._panel = document.getElementById("unified-extensions-panel");
- let customizationArea = this._panel.querySelector(
- "#unified-extensions-area"
- );
- CustomizableUI.registerPanelNode(
- customizationArea,
- CustomizableUI.AREA_ADDONS
- );
- CustomizableUI.addPanelCloseListeners(this._panel);
-
- this._panel
- .querySelector("#unified-extensions-manage-extensions")
- .addEventListener("command", () => {
- BrowserAddonUI.openAddonsMgr("addons://list/extension");
- });
-
- // Lazy-load the l10n strings. Those strings are used for the CUI and
- // non-CUI extensions in the unified extensions panel.
- document
- .getElementById("unified-extensions-context-menu")
- .querySelectorAll("[data-lazy-l10n-id]")
- .forEach(el => {
- el.setAttribute("data-l10n-id", el.getAttribute("data-lazy-l10n-id"));
- el.removeAttribute("data-lazy-l10n-id");
- });
+ this.initializePanel(this._panel);
}
return this._panel;
},
+ initializePanel(panel) {
+ let customizationArea = panel.querySelector(
+ "#unified-extensions-area"
+ );
+ CustomizableUI.registerPanelNode(
+ customizationArea,
+ CustomizableUI.AREA_ADDONS
+ );
+ CustomizableUI.addPanelCloseListeners(panel);
+
+ panel
+ .querySelector("#unified-extensions-manage-extensions")
+ .addEventListener("command", () => {
+ BrowserAddonUI.openAddonsMgr("addons://list/extension");
+ });
+
+ // Lazy-load the l10n strings. Those strings are used for the CUI and
+ // non-CUI extensions in the unified extensions panel.
+ document
+ .getElementById("unified-extensions-context-menu")
+ .querySelectorAll("[data-lazy-l10n-id]")
+ .forEach(el => {
+ el.setAttribute("data-l10n-id", el.getAttribute("data-lazy-l10n-id"));
+ el.removeAttribute("data-lazy-l10n-id");
+ });
+ },
+
// `aEvent` and `reason` are optional. If `reason` is specified, it should be
// a valid argument to gUnifiedExtensions.recordButtonTelemetry().
- async togglePanel(aEvent, reason) {
+ async togglePanel(aEvent, reason, panel = this._panel, view = "unified-extensions-view", button = this._button) {
if (!CustomizationHandler.isCustomizing()) {
if (aEvent) {
if (
+ false &&
policies.length &&
!this.hasExtensionsInPanel(policies) &&
!this.isPrivateWindowMissingExtensionsWithoutPBMAccess() &&
@@ -2754,7 +2751,7 @@ var gUnifiedExtensions = {
@@ -2729,32 +2733,30 @@ var gUnifiedExtensions = {
this.blocklistAttentionInfo =
await AddonManager.getBlocklistAttentionInfo();
- let panel = this.panel;
-
if (!this._listView) {
this._listView = PanelMultiView.getViewNode(
document,
- "unified-extensions-view"
+ view,
);
this._listView.addEventListener("ViewShowing", this);
this._listView.addEventListener("ViewHiding", this);
}
- if (this._button.open) {
+ if (button.open) {
PanelMultiView.hidePopup(panel);
- this._button.open = false;
+ button.open = false;
} else {
// Overflow extensions placed in collapsed toolbars, if any.
for (const toolbarId of CustomizableUI.getCollapsedToolbarIds(window)) {
// We pass `false` because all these toolbars are collapsed.
- this.onToolbarVisibilityChange(toolbarId, /* isVisible */ false);
+ this.onToolbarVisibilityChange(toolbarId, /* isVisible */ false, panel);
}
panel.hidden = false;
this.recordButtonTelemetry(reason || "extensions_panel_showing");
this.ensureButtonShownBeforeAttachingPanel(panel);
PanelMultiView.openPopup(panel, this._button, {
- PanelMultiView.openPopup(panel, this._button, {
- position: "bottomright topright",
+ position: gZenUIManager.panelUIPosition(panel, this._button),
+ PanelMultiView.openPopup(panel, button, {
+ position: gZenUIManager.panelUIPosition(panel, button),
triggerEvent: aEvent,
});
}
@@ -2941,18 +2938,20 @@ var gUnifiedExtensions = {
@@ -2941,18 +2943,20 @@ var gUnifiedExtensions = {
this._maybeMoveWidgetNodeBack(widgetId);
}

View File

@@ -1,5 +1,5 @@
diff --git a/browser/base/content/navigator-toolbox.js b/browser/base/content/navigator-toolbox.js
index 7b776b15d52367a008ce6bf53dcfcbbe007b7453..d9a3404905b73db7c8f202ab166d5f3c625351f6 100644
index 7b776b15d52367a008ce6bf53dcfcbbe007b7453..da23f716c753f5a43f17bb5ed7a3d335891168c2 100644
--- a/browser/base/content/navigator-toolbox.js
+++ b/browser/base/content/navigator-toolbox.js
@@ -6,7 +6,7 @@
@@ -27,21 +27,28 @@ index 7b776b15d52367a008ce6bf53dcfcbbe007b7453..d9a3404905b73db7c8f202ab166d5f3c
gBrowser.handleNewTabMiddleClick(element, event);
break;
@@ -315,7 +317,7 @@ document.addEventListener(
#pageActionButton,
@@ -316,6 +318,7 @@ document.addEventListener(
#downloads-button,
#fxa-toolbar-menu-button,
- #unified-extensions-button,
#unified-extensions-button,
+ #zen-site-data-icon-button,
#library-button
`);
if (!element) {
@@ -394,7 +396,7 @@ document.addEventListener(
gSync.toggleAccountPanel(element, event);
break;
- case "unified-extensions-button":
+ case "zen-site-data-icon-button":
@@ -398,6 +401,16 @@ document.addEventListener(
gUnifiedExtensions.togglePanel(event);
break;
+ case "zen-site-data-icon-button":
+ gUnifiedExtensions.togglePanel(
+ event,
+ null,
+ window.gZenSiteDataPanel.unifiedPanel,
+ window.gZenSiteDataPanel.unifiedPanelView,
+ window.gZenSiteDataPanel.anchor,
+ );
+ break;
+
case "library-button":
PanelUI.showSubView("appMenu-libraryView", element, event);
break;

View File

@@ -32,7 +32,7 @@
command="Browser:AddBookmarkAs"
flex="1" />
</hbox>
<vbox class="zen-site-data-section">
<vbox id="zen-site-data-section-addons" class="zen-site-data-section">
<hbox class="zen-site-data-section-header">
<label data-l10n-id="unified-extensions-header-title" flex="1" />
<label data-l10n-id="zen-generic-manage" id="zen-site-data-manage-addons" />
@@ -72,7 +72,7 @@
# for this specific button / id
<toolbarbutton id="unified-extensions-manage-extensions"
class="subviewbutton panel-subview-footer-button unified-extensions-manage-extensions"
data-l10n-id="unified-extensions-manage-extensions"
data-l10n-id="unified-extensions-manage-extensions"
hidden="true" />
</vbox>
<vbox class="zen-site-data-section">
@@ -85,7 +85,7 @@
</vbox>
</vbox>
<hbox id="zen-site-data-footer">
<toolbarbutton id="zen-site-data-security-info"
<toolbarbutton id="zen-site-data-security-info"
class="subviewbutton zen-interactive-button" />
<toolbarbutton id="zen-site-data-actions"
class="subviewbutton zen-interactive-button"

View File

@@ -669,7 +669,9 @@ window.gZenUIManager = {
}
if (
(gZenVerticalTabsManager._hasSetSingleToolbar && gZenVerticalTabsManager._prefsRightSide) ||
(panel?.id === 'zen-unified-site-data-panel' && !gZenVerticalTabsManager._hasSetSingleToolbar)
(panel?.id === 'zen-unified-site-data-panel' &&
!gZenVerticalTabsManager._hasSetSingleToolbar) ||
(panel?.id === 'unified-extensions-panel' && gZenVerticalTabsManager._hasSetSingleToolbar)
) {
block = 'bottomright';
inline = 'topright';

View File

@@ -495,20 +495,22 @@ body > #confetti {
}
@media -moz-pref('zen.theme.hide-unified-extensions-button') {
#unified-extensions-button {
#unified-extensions-button:not([showing]) {
display: none !important;
}
}
#unified-extensions-button:not([showing]) {
display: none !important;
@media not -moz-pref('zen.theme.hide-unified-extensions-button') {
#zen-site-data-section-addons {
display: none;
}
}
#zen-site-data-header {
gap: 8px;
align-items: center;
padding: 10px 9px;
padding-bottom: 0;
padding-bottom: 8px;
:root[zen-single-toolbar='true']:not([zen-right-side='true']) & {
flex-direction: row-reverse;
@@ -520,7 +522,7 @@ body > #confetti {
-moz-context-properties: fill;
fill: currentColor;
color: light-dark(rgba(0, 0, 0, 0.8), rgba(255, 255, 255, 0.8));
max-width: 48px;
width: 48px;
height: 32px;
position: relative;

View File

@@ -4,6 +4,11 @@
import { AppConstants } from 'resource://gre/modules/AppConstants.sys.mjs';
const ADDONS_BUTTONS_HIDDEN = Services.prefs.getBoolPref(
'zen.theme.hide-unified-extensions-button',
true
);
const lazy = {};
ChromeUtils.defineESModuleGetters(lazy, {
@@ -21,7 +26,19 @@ export class nsZenSiteDataPanel {
this.window = window;
this.document = window.document;
this.panel = this.document.getElementById('zen-unified-site-data-panel');
this.unifiedPanel = this.#initUnifiedPanel();
this.unifiedPanelView = 'unified-extensions-view';
this.extensionsPanelView = 'original-unified-extensions-view';
if (ADDONS_BUTTONS_HIDDEN) {
this.window.gUnifiedExtensions._panel = this.unifiedPanel;
// Remove the old permissions dialog
this.document.getElementById('unified-extensions-panel-template').remove();
} else {
this.extensionsPanel = this.#initExtensionsPanel();
}
this.#init();
}
@@ -34,22 +51,23 @@ export class nsZenSiteDataPanel {
`);
this.anchor = button.querySelector('#zen-site-data-icon-button');
this.document.getElementById('identity-icon-box').before(button);
this.window.gUnifiedExtensions._button = this.anchor;
this.extensionsPanelButton = this.document.getElementById('unified-extensions-button');
this.window.gUnifiedExtensions._button = ADDONS_BUTTONS_HIDDEN
? this.anchor
: this.extensionsPanelButton;
this.document
.getElementById('nav-bar')
.setAttribute('addon-webext-overflowbutton', 'zen-site-data-icon-button');
// Remove the old permissions dialog
this.document.getElementById('unified-extensions-panel-template').remove();
this.#initCopyUrlButton();
this.#initEventListeners();
this.#maybeShowFeatureCallout();
}
#initEventListeners() {
this.panel.addEventListener('popupshowing', this);
this.unifiedPanel.addEventListener('popupshowing', this);
this.document.getElementById('zen-site-data-manage-addons').addEventListener('click', this);
this.document.getElementById('zen-site-data-settings-more').addEventListener('click', this);
this.anchor.addEventListener('click', this);
@@ -124,6 +142,24 @@ export class nsZenSiteDataPanel {
}
}
#initExtensionsPanel() {
const panel = this.window.gUnifiedExtensions.panel;
const extensionsView = panel?.querySelector('#unified-extensions-view');
extensionsView.setAttribute('id', this.extensionsPanelView);
const panelMultiView = panel?.querySelector('panelmultiview');
panelMultiView.setAttribute('mainViewId', this.extensionsPanelView);
return panel;
}
#initUnifiedPanel() {
const panel = this.document.getElementById('zen-unified-site-data-panel');
this.window.gUnifiedExtensions.initializePanel(panel);
return panel;
}
#preparePanel() {
this.#setSitePermissions();
this.#setSiteSecurityInfo();
@@ -498,7 +534,7 @@ export class nsZenSiteDataPanel {
this.window.gZenCommonActions.copyCurrentURLToClipboard();
}
if (AppConstants.platform !== 'macosx') {
this.panel.hidePopup();
this.unifiedPanel.hidePopup();
}
}
}
@@ -556,7 +592,13 @@ export class nsZenSiteDataPanel {
break;
}
case 'zen-site-data-icon-button': {
this.window.gUnifiedExtensions.togglePanel(event);
this.window.gUnifiedExtensions.togglePanel(
event,
null,
this.unifiedPanel,
this.unifiedPanelView,
this.anchor
);
break;
}
default: {