diff --git a/src/browser/base/content/browser-addons-js.patch b/src/browser/base/content/browser-addons-js.patch index 63afb40df..6e89d9b92 100644 --- a/src/browser/base/content/browser-addons-js.patch +++ b/src/browser/base/content/browser-addons-js.patch @@ -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); } diff --git a/src/browser/base/content/navigator-toolbox-js.patch b/src/browser/base/content/navigator-toolbox-js.patch index 9dc57d082..19790013b 100644 --- a/src/browser/base/content/navigator-toolbox-js.patch +++ b/src/browser/base/content/navigator-toolbox-js.patch @@ -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; diff --git a/src/browser/base/content/zen-panels/site-data.inc b/src/browser/base/content/zen-panels/site-data.inc index e149df52e..4929a1645 100644 --- a/src/browser/base/content/zen-panels/site-data.inc +++ b/src/browser/base/content/zen-panels/site-data.inc @@ -32,7 +32,7 @@ command="Browser:AddBookmarkAs" flex="1" /> - + @@ -85,7 +85,7 @@ - #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; diff --git a/src/zen/urlbar/ZenSiteDataPanel.sys.mjs b/src/zen/urlbar/ZenSiteDataPanel.sys.mjs index 48b94bace..e6869da6a 100644 --- a/src/zen/urlbar/ZenSiteDataPanel.sys.mjs +++ b/src/zen/urlbar/ZenSiteDataPanel.sys.mjs @@ -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: {