perf: Remove smooth scroll features, b=no-bug, c=common, workspaces

src/browser/app/profile/smoothscroll.inc

@@ -1,17 +0,0 @@
-// This Source Code Form is subject to the terms of the Mozilla Public
-// License, v. 2.0. If a copy of the MPL was not distributed with this
-// file, You can obtain one at http://mozilla.org/MPL/2.0/.
-
-pref("apz.overscroll.enabled", true);
-pref("general.smoothScroll", true);
-pref("general.smoothScroll.msdPhysics.enabled", true);
-pref("general.smoothScroll.currentVelocityWeighting", "0.15");
-pref("general.smoothScroll.stopDecelerationWeighting", "0.6");
-pref("mousewheel.min_line_scroll_amount", 10);
-pref("general.smoothScroll.mouseWheel.durationMinMS", 80);
-pref("general.smoothScroll.msdPhysics.continuousMotionMaxDeltaMS", 12);
-pref("general.smoothScroll.msdPhysics.motionBeginSpringConstant", 600);
-pref("general.smoothScroll.msdPhysics.regularSpringConstant", 650);
-pref("general.smoothScroll.msdPhysics.slowdownMinDeltaMS", 25);
-pref("general.smoothScroll.msdPhysics.slowdownSpringConstant", 250);
-pref("mousewheel.default.delta_multiplier_y", 200);

src/browser/app/profile/zen-browser.js

@@ -36,9 +36,5 @@ pref('toolkit.legacyUserProfileCustomizations.stylesheets', true);
 
 #include features.inc
 
-#ifndef XP_MACOSX
-#include smoothscroll.inc
-#endif
-
 #include performance.inc
 #include pip.inc

src/browser/base/content/zen-assets.jar.inc.mn

@@ -8,7 +8,6 @@
         content/browser/zen-sets.js                                             (../../zen/common/zen-sets.js)
         content/browser/ZenUIManager.mjs                                        (../../zen/common/ZenUIManager.mjs)
         content/browser/zen-components/ZenActorsManager.mjs                     (../../zen/common/ZenActorsManager.mjs)
-        content/browser/zen-components/ZenEmojis.mjs                            (../../zen/common/ZenEmojis.mjs)
         content/browser/ZenCustomizableUI.sys.mjs                               (../../zen/common/ZenCustomizableUI.sys.mjs)
         content/browser/zen-components/ZenUIMigration.mjs                       (../../zen/common/ZenUIMigration.mjs)
         content/browser/zen-components/ZenCommonUtils.mjs                       (../../zen/common/ZenCommonUtils.mjs)

src/browser/base/content/zen-keysets.inc.xhtml

@@ -36,6 +36,9 @@
   <command id="cmd_contextZenAddToEssentials" />
   <command id="cmd_contextZenRemoveFromEssentials" />
 
+  <command id="cmd_zenCtxDeleteWorkspace" />
+  <command id="cmd_zenChangeWorkspaceName" />
+
   <command id="cmd_zenPinnedTabReset" />
   <command id="cmd_zenPinnedTabResetNoTab" />
 

src/browser/base/content/zen-popupset.inc.xhtml

@@ -74,50 +74,14 @@
       <html:div id="PanelUI-zen-workspaces-list">
       </html:div>
     </panelview>
-    <panelview id="PanelUI-zen-workspaces-create" class="PanelUI-subView" role="document" mainview-with-header="true" has-custom-header="true">
-      <vbox class="PanelUI-zen-workspaces-user-create">
-        <h1 data-l10n-id="zen-panel-ui-workspaces-create-text"></h1>
-        <hbox class="PanelUI-zen-workspaces-creation-wraper">
-          <hbox class="PanelUI-zen-workspaces-icons-container create"></hbox>
-          <html:input autofocus="true" id="PanelUI-zen-workspaces-create-input" type="text" placeholder="Enter workspace name" />
-        </hbox>
-      </vbox>
-      <html:moz-button-group class="panel-footer" id="PanelUI-zen-workspaces-create-footer">
-        <button disabled="true" default="true" slot="primary" id="PanelUI-zen-workspaces-create-save" class="footer-button" data-l10n-id="zen-panel-ui-workspaces-create-save">
-        </button>
-        <button id="PanelUI-zen-workspaces-create-cancel" class="footer-button" data-l10n-id="zen-panel-ui-workspaces-create-cancel">
-        </button>
-      </html:moz-button-group>
-    </panelview>
-    <panelview id="PanelUI-zen-workspaces-edit" class="PanelUI-subView" role="document" mainview-with-header="true" has-custom-header="true">
-      <vbox class="PanelUI-zen-workspaces-user-create">
-        <h1 data-l10n-id="zen-panel-ui-workspaces-edit-text"></h1>
-        <hbox class="PanelUI-zen-workspaces-creation-wraper">
-          <hbox class="PanelUI-zen-workspaces-icons-container edit"></hbox>
-          <html:input autofocus="true" id="PanelUI-zen-workspaces-edit-input" type="text" placeholder="Enter workspace name" />
-        </hbox>
-      </vbox>
-      <html:moz-button-group class="panel-footer" id="PanelUI-zen-workspaces-edit-footer">
-        <button disabled="true" default="true" slot="primary" id="PanelUI-zen-workspaces-edit-save" class="footer-button" data-l10n-id="zen-panel-ui-workspaces-edit-save">
-        </button>
-        <button id="PanelUI-zen-workspaces-edit-cancel" class="footer-button" data-l10n-id="zen-panel-ui-workspaces-edit-cancel">
-        </button>
-      </html:moz-button-group>
-    </panelview>
-    <panelview id="PanelUI-zen-workspaces-icon-picker" class="PanelUI-subView" role="document" mainview-with-header="true" has-custom-header="true">
-      <vbox id="PanelUI-zen-workspaces-icon-picker-wrapper">
-        <html:div id="PanelUI-zen-workspaces-icon-search-bar">
-          <html:input autofocus="true" type="text" id="PanelUI-zen-workspaces-icon-search-input"/>
-        </html:div>
-      </vbox>
-    </panelview>
   </panelmultiview>
 </panel>
 
-<menupopup id="zenWorkspaceActionsMenu">
+<menupopup id="zenWorkspaceMoreActions">
-  <menuitem id="context_zenOpenWorkspace" data-l10n-id="zen-workspaces-panel-context-open"/>
+  <menuitem id="context_zenEditWorkspace" data-l10n-id="zen-workspaces-panel-change-name" command="cmd_zenChangeWorkspaceName"/>
-  <menuseparator/>
+  <menuitem class="zenToolbarThemePicker"
-  <menuitem id="context_zenEditWorkspace" data-l10n-id="zen-workspaces-panel-context-edit"/>
+          data-l10n-id="zen-workspaces-change-gradient"
+          command="cmd_zenOpenZenThemePicker"/>
   <menu id="context_zenWorkspacesOpenInContainerTab"
     data-l10n-id="zen-workspaces-panel-context-open-in-container-tab"
     selection-type="single"
@@ -127,5 +91,5 @@
     <menupopup />
   </menu>
   <menuseparator/>
-  <menuitem id="context_zenDeleteWorkspace" data-l10n-id="zen-workspaces-panel-context-delete"/>
+  <menuitem id="context_zenDeleteWorkspace" data-l10n-id="zen-workspaces-panel-context-delete" command="cmd_zenCtxDeleteWorkspace"/>
 </menupopup>

src/browser/themes/shared/zen-icons/icons.css

@@ -107,6 +107,7 @@
 
 #PanelUI-menu-button,
 #appMenu-more-button2,
+.zen-workspaces-actions,
 #zen-workspace-actions-menu-icon {
   list-style-image: url('menu.svg') !important;
 }

src/zen/common/ZenUIManager.mjs

@@ -1084,7 +1084,9 @@ var gZenVerticalTabsManager = {
       !gZenVerticalTabsManager._prefsSidebarExpanded
     )
       return;
-    this._tabEdited = event.target.closest('.tabbrowser-tab');
+    this._tabEdited =
+      event.target.closest('.tabbrowser-tab') ||
+      event.target.closest('.zen-current-workspace-indicator-name');
     if (
       !this._tabEdited ||
       ((!this._tabEdited.pinned || this._tabEdited.hasAttribute('zen-essential')) && isTab)

src/zen/common/zen-sets.js

@@ -88,6 +88,12 @@ document.addEventListener(
           case 'cmd_contextZenRemoveFromEssentials':
             gZenPinnedTabManager.removeEssentials();
             break;
+          case 'cmd_zenCtxDeleteWorkspace':
+            gZenWorkspaces.contextDeleteWorkspace(event);
+            break;
+          case 'cmd_zenChangeWorkspaceName':
+            gZenVerticalTabsManager.renameTabStart(event);
+            break;
           default:
             if (event.target.id.startsWith('cmd_zenWorkspaceSwitch')) {
               const index = parseInt(event.target.id.replace('cmd_zenWorkspaceSwitch', ''), 10) - 1;

src/zen/workspaces/ZenWorkspace.mjs

@@ -8,6 +8,7 @@
         <vbox class="zen-workspace-tabs-section zen-current-workspace-indicator" flex="1">
           <hbox class="zen-current-workspace-indicator-icon"></hbox>
           <hbox class="zen-current-workspace-indicator-name"></hbox>
+          <toolbarbutton class="toolbarbutton-1 chromeclass-toolbar-additional zen-workspaces-actions" context="zenWorkspaceMoreActions"></toolbarbutton>
         </vbox>
         <arrowscrollbox orient="vertical" class="workspace-arrowscrollbox">
           <vbox class="zen-workspace-tabs-section zen-workspace-pinned-tabs-section">
@@ -64,6 +65,13 @@
       this.scrollbox.addEventListener('underflow', this);
       this.scrollbox.addEventListener('overflow', this);
 
+      this.indicator.querySelector('.zen-current-workspace-indicator-name').onRenameFinished =
+        this.onIndicatorRenameFinished.bind(this);
+
+      this.indicator
+        .querySelector('.zen-workspaces-actions')
+        .addEventListener('click', this.onActionsCommand.bind(this));
+
       this.scrollbox._getScrollableElements = () => {
         const children = [...this.pinnedTabsContainer.children, ...this.tabsContainer.children];
         if (Services.prefs.getBoolPref('zen.view.show-newtab-button-top', false)) {
@@ -171,6 +179,38 @@
         gBrowser.tabContainer.handleEvent(event);
       }
     }
+
+    get workspaceUuid() {
+      return this.id;
+    }
+
+    async onIndicatorRenameFinished(newName) {
+      if (newName === '') {
+        return;
+      }
+      let workspaces = (await gZenWorkspaces._workspaces()).workspaces;
+      let workspaceData = workspaces.find((workspace) => workspace.uuid === this.workspaceUuid);
+      workspaceData.name = newName;
+      await gZenWorkspaces.saveWorkspace(workspaceData);
+      this.indicator.querySelector('.zen-current-workspace-indicator-name').textContent = newName;
+      gZenUIManager.showToast('zen-workspace-renamed-toast');
+    }
+
+    onActionsCommand(event) {
+      event.stopPropagation();
+      const popup = document.getElementById('zenWorkspaceMoreActions');
+      event.target.setAttribute('open', 'true');
+      this.indicator.setAttribute('open', 'true');
+      popup.addEventListener(
+        'popuphidden',
+        () => {
+          event.target.removeAttribute('open');
+          this.indicator.removeAttribute('open');
+        },
+        { once: true }
+      );
+      popup.openPopup(event.target, 'after_start');
+    }
   }
 
   customElements.define('zen-workspace', ZenWorkspace);

src/zen/workspaces/ZenWorkspaces.mjs

@@ -17,7 +17,11 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     lastDelta: 0,
     direction: null,
   };
+
   _lastScrollTime = 0;
+
+  #workspaceCreationArgs = {};
+  
   bookmarkMenus = [
     'PlacesToolbar',
     'bookmarks-menu-button',
@@ -136,7 +140,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     await this.promiseSectionsInitialized;
 
     // Non UI related initializations
-    this._initializeWorkspaceCreationIcons();
     this._initializeWorkspaceTabContextMenus();
     if (
       Services.prefs.getBoolPref('zen.workspaces.swipe-actions', false) &&
@@ -995,7 +998,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       this.openWorkspacesDialog(event);
     };
     indicator.addEventListener('contextmenu', th);
-    indicator.addEventListener('click', th);
   }
 
   shouldCloseWindow() {
@@ -1068,39 +1070,38 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
   addPopupListeners() {
     const popup = document.getElementById('PanelUI-zen-workspaces');
-    const contextMenu = document.getElementById('zenWorkspaceActionsMenu');
 
     popup.addEventListener('popuphidden', this.handlePanelHidden.bind(this));
     popup.addEventListener('command', this.handlePanelCommand.bind(this));
 
-    contextMenu.addEventListener('popuphidden', (event) => {
+    const workspaceActions = document.getElementById('zenWorkspaceMoreActions');
-      if (event.target === contextMenu) {
+    workspaceActions.addEventListener('popupshowing', this.updateWorkspaceActionsMenu.bind(this));
-        this.onContextMenuClose(event);
-      }
-    });
-    contextMenu.addEventListener('popupshowing', this.updateContextMenu.bind(this));
-    contextMenu.addEventListener('command', this.handleContextMenuCommand.bind(this));
 
-    const submenu = document.querySelector('#context_zenWorkspacesOpenInContainerTab > menupopup');
+    const contextChangeContainerTabMenu = document.getElementById(
-    if (submenu) {
+      'context_zenWorkspacesOpenInContainerTab'
-      submenu.addEventListener('popupshowing', this.createContainerTabMenu.bind(this));
+    );
-      submenu.addEventListener('command', this.contextChangeContainerTab.bind(this));
+    contextChangeContainerTabMenu.addEventListener(
+      'popupshowing',
+      this.updateWorkspaceActionsMenuContainer.bind(this)
+    );
+    contextChangeContainerTabMenu.addEventListener(
+      'command',
+      this.contextChangeContainerTab.bind(this)
+    );
   }
 
-    const onWorkspaceIconContainerClick = this.onWorkspaceIconContainerClick.bind(this);
+  updateWorkspaceActionsMenu(event) {
-    for (const element of document.querySelectorAll('.PanelUI-zen-workspaces-icons-container')) {
+    if (event.target.id !== 'zenWorkspaceMoreActions') {
-      element.addEventListener('click', onWorkspaceIconContainerClick);
+      return;
+    }
+    const openInContainerMenuItem = document.getElementById(
+      'context_zenWorkspacesOpenInContainerTab'
+    );
+    if (this.shouldShowContainers) {
+      openInContainerMenuItem.removeAttribute('hidden');
+    } else {
+      openInContainerMenuItem.setAttribute('hidden', 'true');
     }
-
-    document
-      .getElementById('PanelUI-zen-workspaces-create-input')
-      .addEventListener('input', this.onWorkspaceCreationNameChange.bind(this));
-    document
-      .getElementById('PanelUI-zen-workspaces-edit-input')
-      .addEventListener('input', this.onWorkspaceEditChange.bind(this));
-    document
-      .getElementById('PanelUI-zen-workspaces-icon-search-input')
-      .addEventListener('input', this.conductSearch.bind(this));
   }
 
   handlePanelCommand(event) {
@@ -1113,161 +1114,16 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       case 'PanelUI-zen-workspaces-reorder-mode':
         this.toggleReorderMode();
         break;
-      case 'PanelUI-zen-workspaces-new':
-        this.openSaveDialog();
-        break;
-      case 'PanelUI-zen-workspaces-create-save':
-        this.saveWorkspaceFromCreate();
-        break;
-      case 'PanelUI-zen-workspaces-edit-cancel':
-      case 'PanelUI-zen-workspaces-create-cancel':
-        this.closeWorkspacesSubView();
-        break;
-      case 'PanelUI-zen-workspaces-edit-save':
-        this.saveWorkspaceFromEdit();
-        break;
     }
   }
 
-  handleContextMenuCommand(event) {
+  updateWorkspaceActionsMenuContainer(event) {
-    const target = event.target.closest('menuitem');
+    const workspace = this.getActiveWorkspaceFromCache();
-    if (!target) {
+    let containerTabId = workspace.containerTabId;
-      return;
+    return window.createUserContextMenu(event, {
-    }
+      isContextMenu: true,
-    switch (target.id) {
+      excludeUserContextId: containerTabId,
-      case 'context_zenOpenWorkspace':
+      showDefaultTab: true,
-        this.openWorkspace();
-        break;
-      case 'context_zenEditWorkspace':
-        this.contextEdit(event);
-        break;
-      case 'context_zenDeleteWorkspace':
-        this.contextDelete(event);
-        break;
-    }
-  }
-
-  searchIcons(input, icons) {
-    input = input.toLowerCase();
-
-    if (input === ':' || input === '') {
-      return icons;
-    }
-    const emojiScores = [];
-
-    function calculateSearchScore(inputLength, targetLength, weight = 100) {
-      return parseInt((inputLength / targetLength) * weight);
-    }
-
-    for (let currentEmoji of icons) {
-      let alignmentScore = -1;
-
-      let normalizedEmojiName = currentEmoji[1].toLowerCase();
-      let keywordList = currentEmoji[2].split(',').map((keyword) => keyword.trim().toLowerCase());
-      if (input[0] === ':') {
-        let searchTerm = input.slice(1);
-        let nameMatchIndex = normalizedEmojiName.indexOf(searchTerm);
-
-        if (nameMatchIndex !== -1 && nameMatchIndex === 0) {
-          alignmentScore = calculateSearchScore(searchTerm.length, normalizedEmojiName.length, 100);
-        }
-      } else {
-        if (input === currentEmoji[0]) {
-          alignmentScore = 999;
-        }
-        let nameMatchIndex = normalizedEmojiName.replace(/_/g, ' ').indexOf(input);
-        if (nameMatchIndex !== -1) {
-          if (nameMatchIndex === 0) {
-            alignmentScore = calculateSearchScore(input.length, normalizedEmojiName.length, 150);
-          } else if (input[input.length - 1] !== ' ') {
-            alignmentScore += calculateSearchScore(input.length, normalizedEmojiName.length, 40);
-          }
-        }
-        for (let keyword of keywordList) {
-          let keywordMatchIndex = keyword.indexOf(input);
-          if (keywordMatchIndex !== -1) {
-            if (keywordMatchIndex === 0) {
-              alignmentScore += calculateSearchScore(input.length, keyword.length, 50);
-            } else if (input[input.length - 1] !== ' ') {
-              alignmentScore += calculateSearchScore(input.length, keyword.length, 5);
-            }
-          }
-        }
-      }
-
-      //if match score is not -1, add it
-      if (alignmentScore !== -1) {
-        emojiScores.push({ emoji: currentEmoji[0], score: alignmentScore });
-      }
-    }
-    // Sort the emojis by their score in descending order
-    emojiScores.sort((a, b) => b.score - a.score);
-
-    // Return the emojis in the order of their rank
-    let filteredEmojiScores = emojiScores;
-    return filteredEmojiScores.map((score) => score.emoji);
-  }
-
-  resetWorkspaceIconSearch() {
-    let container = document.getElementById('PanelUI-zen-workspaces-icon-picker-wrapper');
-    let searchInput = document.getElementById('PanelUI-zen-workspaces-icon-search-input');
-
-    // Clear the search input field
-    searchInput.value = '';
-    for (let button of container.querySelectorAll('.toolbarbutton-1')) {
-      button.style.display = '';
-    }
-  }
-
-  _initializeWorkspaceCreationIcons() {
-    let container = document.getElementById('PanelUI-zen-workspaces-icon-picker-wrapper');
-    let searchInput = document.getElementById('PanelUI-zen-workspaces-icon-search-input');
-    searchInput.value = '';
-    for (let iconData of this.emojis) {
-      const icon = iconData[0];
-      let button = document.createXULElement('toolbarbutton');
-      button.className = 'toolbarbutton-1 workspace-icon-button';
-      button.setAttribute('label', icon);
-      button.onclick = (event) => {
-        const button = event.target;
-        let wasSelected = button.hasAttribute('selected');
-        for (let button of container.children) {
-          button.removeAttribute('selected');
-        }
-        if (!wasSelected) {
-          button.setAttribute('selected', 'true');
-        }
-        if (this.onIconChangeConnectedCallback) {
-          this.onIconChangeConnectedCallback(icon);
-        } else {
-          this.onWorkspaceIconChangeInner('create', icon);
-        }
-      };
-      container.appendChild(button);
-    }
-  }
-
-  conductSearch() {
-    const container = document.getElementById('PanelUI-zen-workspaces-icon-picker-wrapper');
-    const searchInput = document.getElementById('PanelUI-zen-workspaces-icon-search-input');
-    const query = searchInput.value.toLowerCase();
-
-    if (query === '') {
-      this.resetWorkspaceIconSearch();
-      return;
-    }
-
-    const buttons = Array.from(container.querySelectorAll('.toolbarbutton-1'));
-    buttons.forEach((button) => (button.style.display = 'none'));
-
-    const filteredIcons = this.searchIcons(query, this.emojis);
-
-    filteredIcons.forEach((emoji) => {
-      const matchingButton = buttons.find((button) => button.getAttribute('label') === emoji);
-      if (matchingButton) {
-        matchingButton.style.display = '';
-        container.appendChild(matchingButton);
-      }
     });
   }
 
@@ -1317,83 +1173,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     );
   }
   // Workspaces dialog UI management
-
-  openSaveDialog() {
-    let parentPanel = document.getElementById('PanelUI-zen-workspaces-multiview');
-
-    // randomly select an icon
-    let icon = this.emojis[Math.floor(Math.random() * (this.emojis.length - 257))][0];
-    this._workspaceCreateInput.textContent = '';
-    this._workspaceCreateInput.value = '';
-    this._workspaceCreateInput.setAttribute('data-initial-value', '');
-    document
-      .querySelectorAll('#PanelUI-zen-workspaces-icon-picker-wrapper toolbarbutton')
-      .forEach((button) => {
-        if (button.label === icon) {
-          button.setAttribute('selected', 'true');
-        } else {
-          button.removeAttribute('selected');
-        }
-      });
-    document.querySelector('.PanelUI-zen-workspaces-icons-container.create').textContent = icon;
-
-    PanelUI.showSubView('PanelUI-zen-workspaces-create', parentPanel);
-  }
-
-  async openEditDialog(workspaceUuid) {
-    this._workspaceEditDialog.setAttribute('data-workspace-uuid', workspaceUuid);
-    document.getElementById('PanelUI-zen-workspaces-edit-save').setAttribute('disabled', 'true');
-    let workspaces = (await this._workspaces()).workspaces;
-    let workspaceData = workspaces.find((workspace) => workspace.uuid === workspaceUuid);
-    this._workspaceEditInput.textContent = workspaceData.name;
-    this._workspaceEditInput.value = workspaceData.name;
-    this._workspaceEditInput.setAttribute('data-initial-value', workspaceData.name);
-    this._workspaceEditIconsContainer.setAttribute('data-initial-value', workspaceData.icon);
-    this.onIconChangeConnectedCallback = (...args) => {
-      this.onWorkspaceIconChangeInner('edit', ...args);
-      this.onWorkspaceEditChange(...args);
-    };
-    document
-      .querySelectorAll('#PanelUI-zen-workspaces-icon-picker-wrapper toolbarbutton')
-      .forEach((button) => {
-        if (button.label === workspaceData.icon) {
-          button.setAttribute('selected', 'true');
-        } else {
-          button.removeAttribute('selected');
-        }
-      });
-    document.querySelector('.PanelUI-zen-workspaces-icons-container.edit').textContent =
-      this.getWorkspaceIcon(workspaceData);
-    let parentPanel = document.getElementById('PanelUI-zen-workspaces-multiview');
-    PanelUI.showSubView('PanelUI-zen-workspaces-edit', parentPanel);
-  }
-
-  onWorkspaceIconChangeInner(type = 'create', icon) {
-    const container = document.querySelector(`.PanelUI-zen-workspaces-icons-container.${type}`);
-    if (container.textContent !== icon) {
-      container.textContent = icon;
-    }
-    this.goToPreviousSubView();
-  }
-
-  onWorkspaceIconContainerClick(event) {
-    event.preventDefault();
-    const parentPanel = document.getElementById('PanelUI-zen-workspaces-edit');
-    PanelUI.showSubView('PanelUI-zen-workspaces-icon-picker', parentPanel);
-
-    const container = parentPanel.parentNode.querySelector('.panel-viewcontainer');
-    setTimeout(() => {
-      if (container) {
-        container.style.minHeight = 'unset';
-      }
-    });
-  }
-
-  goToPreviousSubView() {
-    const parentPanel = document.getElementById('PanelUI-zen-workspaces-multiview');
-    parentPanel.goBack();
-  }
-
   workspaceHasIcon(workspace) {
     return workspace.icon && workspace.icon !== '';
   }
@@ -1536,9 +1315,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
             </div>
           </vbox>
             <image class="toolbarbutton-icon zen-workspace-actions-reorder-icon" ></image>
-          <toolbarbutton closemenu="none" class="toolbarbutton-1 zen-workspace-actions">
-            <image class="toolbarbutton-icon" id="zen-workspace-actions-menu-icon"></image>
-          </toolbarbutton>
         `);
 
       // use text content instead of innerHTML to avoid XSS
@@ -1550,25 +1326,11 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
           ContextualIdentityService.getUserContextLabel(containerGroup.userContextId);
       }
 
-      childs.querySelector('.zen-workspace-actions').addEventListener(
-        'command',
-        ((event) => {
-          let button = event.target;
-          this._contextMenuId = button
-            .closest('toolbarbutton[zen-workspace-id]')
-            .getAttribute('zen-workspace-id');
-          const popup = button.ownerDocument.getElementById('zenWorkspaceActionsMenu');
-          popup.openPopup(button, 'after_end');
-        }).bind(browser.gZenWorkspaces)
-      );
       element.appendChild(childs);
       element.onclick = (async () => {
         if (this.isReorderModeOn(browser)) {
           return; // Return early if reorder mode is on
         }
-        if (event.target.closest('.zen-workspace-actions')) {
-          return; // Ignore clicks on the actions button
-        }
         const workspaceId = element.getAttribute('zen-workspace-id');
         const workspaces = await this._workspaces();
         const workspace = workspaces.workspaces.find((w) => w.uuid === workspaceId);
@@ -1640,6 +1402,9 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
       browser.gZenWorkspaces._workspaceBookmarksCache = null;
     }
     let workspaces = await browser.gZenWorkspaces._workspaces();
+    browser.document
+      .getElementById('cmd_zenCtxDeleteWorkspace')
+      .setAttribute('disabled', workspaces.workspaces.length <= 1);
     if (clearCache) {
       browser.dispatchEvent(
         new CustomEvent('ZenWorkspacesUIUpdate', {
@@ -1700,8 +1465,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
     workspacesList?.removeAttribute('reorder-mode');
     reorderModeButton?.removeAttribute('active');
-    this.resetWorkspaceIconSearch();
-    this.clearEmojis();
   }
 
   async moveWorkspaceToEnd(draggedWorkspaceId) {
@@ -1781,22 +1544,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
 
   // Workspaces management
 
-  get _workspaceCreateInput() {
-    return document.getElementById('PanelUI-zen-workspaces-create-input');
-  }
-
-  get _workspaceEditDialog() {
-    return document.getElementById('PanelUI-zen-workspaces-edit');
-  }
-
-  get _workspaceEditInput() {
-    return document.getElementById('PanelUI-zen-workspaces-edit-input');
-  }
-
-  get _workspaceEditIconsContainer() {
-    return document.getElementById('PanelUI-zen-workspaces-icon-picker');
-  }
-
   _deleteAllTabsInWorkspace(workspaceID) {
     gBrowser.removeTabs(
       Array.from(this.allStoredTabs).filter(
@@ -1862,57 +1609,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     }
   }
 
-  async saveWorkspaceFromCreate() {
-    let workspaceName = this._workspaceCreateInput.value;
-    if (!workspaceName) {
-      return;
-    }
-    this._workspaceCreateInput.value = '';
-    let icon = document.querySelector('#PanelUI-zen-workspaces-icon-picker-wrapper [selected]');
-    icon?.removeAttribute('selected');
-    await this.createAndSaveWorkspace(workspaceName, icon?.label);
-    this.goToPreviousSubView();
-  }
-
-  async saveWorkspaceFromEdit() {
-    let workspaceUuid = this._workspaceEditDialog.getAttribute('data-workspace-uuid');
-    let workspaceName = this._workspaceEditInput.value;
-    if (!workspaceName) {
-      return;
-    }
-    this._workspaceEditInput.value = '';
-    let icon = document.querySelector('#PanelUI-zen-workspaces-icon-picker-wrapper [selected]');
-    icon?.removeAttribute('selected');
-    let workspaces = (await this._workspaces()).workspaces;
-    let workspaceData = workspaces.find((workspace) => workspace.uuid === workspaceUuid);
-    workspaceData.name = workspaceName;
-    workspaceData.icon = icon?.label;
-    await this.saveWorkspace(workspaceData);
-    this.goToPreviousSubView();
-  }
-
-  onWorkspaceCreationNameChange() {
-    let button = document.getElementById('PanelUI-zen-workspaces-create-save');
-    if (this._workspaceCreateInput.value === '') {
-      button.setAttribute('disabled', 'true');
-      return;
-    }
-    button.removeAttribute('disabled');
-  }
-
-  onWorkspaceEditChange(icon) {
-    let button = document.getElementById('PanelUI-zen-workspaces-edit-save');
-    let name = this._workspaceEditInput.value;
-    if (
-      name === this._workspaceEditInput.getAttribute('data-initial-value') &&
-      icon === this._workspaceEditIconsContainer.getAttribute('data-initial-value')
-    ) {
-      button.setAttribute('disabled', 'true');
-      return;
-    }
-    button.removeAttribute('disabled');
-  }
-
   addChangeListeners(func) {
     if (!this._changeListeners) {
       this._changeListeners = [];
@@ -2821,68 +2517,19 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   // Context menu management
-
-  _contextMenuId = null;
-  async updateContextMenu(_) {
-    console.assert(this._contextMenuId, 'No context menu ID set');
-    document
-      .querySelector(
-        `#PanelUI-zen-workspaces [zen-workspace-id="${this._contextMenuId}"] .zen-workspace-actions`
-      )
-      .setAttribute('active', 'true');
-    const workspaces = await this._workspaces();
-    let deleteMenuItem = document.getElementById('context_zenDeleteWorkspace');
-    if (workspaces.workspaces.length <= 1) {
-      deleteMenuItem.setAttribute('disabled', 'true');
-    } else {
-      deleteMenuItem.removeAttribute('disabled');
-    }
-    let openMenuItem = document.getElementById('context_zenOpenWorkspace');
-    if (
-      workspaces.workspaces.find(
-        (workspace) => workspace.uuid === this._contextMenuId && this.isWorkspaceActive(workspace)
-      )
-    ) {
-      openMenuItem.setAttribute('disabled', 'true');
-    } else {
-      openMenuItem.removeAttribute('disabled');
-    }
-    const openInContainerMenuItem = document.getElementById(
-      'context_zenWorkspacesOpenInContainerTab'
-    );
-    if (this.shouldShowContainers) {
-      openInContainerMenuItem.removeAttribute('hidden');
-    } else {
-      openInContainerMenuItem.setAttribute('hidden', 'true');
-    }
-  }
-
   async contextChangeContainerTab(event) {
     this._organizingWorkspaceStrip = true;
     let workspaces = await this._workspaces();
     let workspace = workspaces.workspaces.find(
-      (workspace) => workspace.uuid === this._contextMenuId
+      (workspace) => workspace.uuid === this.activeWorkspace
     );
     let userContextId = parseInt(event.target.getAttribute('data-usercontextid'));
     workspace.containerTabId = userContextId + 0; // +0 to convert to number
     await this.saveWorkspace(workspace);
-    window.requestAnimationFrame(async () => {
-      if (workspace.uuid === this.activeWorkspace) {
-        await this.changeWorkspace(workspace, {
-          alwaysChange: true,
-        });
-      }
-    }, 0);
   }
 
-  onContextMenuClose() {
+  async contextDeleteWorkspace() {
-    let target = document.querySelector(
+    await this.removeWorkspace(this.activeWorkspace, true);
-      `#PanelUI-zen-workspaces [zen-workspace-id="${this._contextMenuId}"] .zen-workspace-actions`
-    );
-    if (target) {
-      target.removeAttribute('active');
-    }
-    this._contextMenuId = null;
   }
 
   findTabToBlur(tab) {
@@ -2892,44 +2539,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
     return tab;
   }
 
-  async openWorkspace() {
-    let workspaces = await this._workspaces();
-    let workspace = workspaces.workspaces.find(
-      (workspace) => workspace.uuid === this._contextMenuId
-    );
-    await this.changeWorkspace(workspace);
-  }
-
-  async contextDelete(event) {
-    this.__contextIsDelete = true;
-    event.stopPropagation();
-    await this.removeWorkspace(this._contextMenuId);
-    this.__contextIsDelete = false;
-  }
-
-  async contextEdit(event) {
-    event.stopPropagation();
-    await this.openEditDialog(this._contextMenuId);
-  }
-
-  get emojis() {
-    if (this._emojis) {
-      return this._emojis;
-    }
-    const lazy = {};
-    Services.scriptloader.loadSubScript(
-      'chrome://browser/content/zen-components/ZenEmojis.mjs',
-      lazy
-    );
-    this._emojis = lazy.zenGlobalEmojis();
-    return this._emojis;
-  }
-
-  clearEmojis() {
-    // Unload from memory
-    this._emojis = null;
-  }
-
   async changeWorkspaceShortcut(offset = 1, whileScrolling = false) {
     // Cycle through workspaces
     let workspaces = await this._workspaces();
@@ -2991,16 +2600,6 @@ var gZenWorkspaces = new (class extends ZenMultiWindowFeature {
   }
 
   // Tab browser utilities
-  createContainerTabMenu(event) {
-    let window = event.target.ownerGlobal;
-    const workspace = this.getWorkspaceFromId(this._contextMenuId);
-    let containerTabId = workspace.containerTabId;
-    return window.createUserContextMenu(event, {
-      isContextMenu: true,
-      excludeUserContextId: containerTabId,
-      showDefaultTab: true,
-    });
-  }
 
   getContextIdIfNeeded(userContextId, fromExternal, allowInheritPrincipal) {
     if (!this.workspaceEnabled) {

src/zen/workspaces/zen-workspaces.css

@@ -141,55 +141,6 @@
   width: var(--panel-width);
 }
 
-#PanelUI-zen-workspaces-icon-picker toolbarbutton {
-  width: 30px;
-  height: 30px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  border: 2px solid transparent;
-  border-radius: 7px;
-}
-
-#PanelUI-zen-workspaces-icon-picker toolbarbutton[selected='true'] {
-  border-color: var(--zen-colors-secondary);
-}
-
-#PanelUI-zen-workspaces-icon-picker toolbarbutton .toolbarbutton-icon {
-  display: none;
-}
-
-#PanelUI-zen-workspaces-icon-picker toolbarbutton .toolbarbutton-text {
-  min-width: unset;
-}
-
-#PanelUI-zen-workspaces-icon-picker {
-  padding: 5px !important;
-}
-
-#PanelUI-zen-workspaces-icon-picker-wrapper {
-  overflow-x: hidden;
-  justify-items: center;
-  overflow-y: auto;
-
-  display: flex;
-
-  flex-direction: row;
-  flex-wrap: wrap;
-
-  justify-content: space-between;
-  align-content: space-between;
-  max-height: 250px;
-
-  .workspace-icon-button {
-    min-width: 24px;
-    min-height: 24px;
-    font-size: 16px;
-    margin: 2px;
-    padding: 4px;
-  }
-}
-
 #PanelUI-zen-workspaces-list {
   display: flex;
   flex-direction: column;
@@ -231,36 +182,6 @@
   }
 }
 
-/* Workspace icon picker styles */
-#PanelUI-zen-workspaces-icon-picker-wrapper {
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: flex-start;
-  gap: 5px;
-}
-
-#PanelUI-zen-workspaces-icon-search-bar {
-  display: flex;
-  position: sticky;
-  top: 0;
-  background-color: inherit;
-  z-index: 1000;
-  padding: 8px;
-  width: 100%;
-  margin: 0;
-  box-sizing: border-box;
-}
-
-#PanelUI-zen-workspaces-icon-search-input {
-  width: 100%;
-  padding: 8px 12px;
-  font-size: 14px;
-  border: 1px solid var(--panel-separator-color, #ccc);
-  border-radius: 4px;
-  box-sizing: border-box;
-  margin: 0;
-}
-
 #PanelUI-zen-workspaces-list toolbarbutton {
   padding: 5px;
   border-radius: var(--zen-button-border-radius);
@@ -313,7 +234,6 @@
     font-weight: normal;
   }
 
-  & .zen-workspace-actions,
   .zen-workspace-actions-reorder-icon {
     display: none;
     margin: 0;
@@ -383,13 +303,6 @@
   color: var(--toolbarbutton-icon-fill-attention) !important;
 }
 
-#PanelUI-zen-workspaces-list:not([reorder-mode='true']) toolbarbutton {
-  &:hover .zen-workspace-actions,
-  & .zen-workspace-actions[active='true'] {
-    display: flex;
-  }
-}
-
 #PanelUI-zen-workspaces-list[reorder-mode='true'] toolbarbutton {
   .zen-workspace-actions-reorder-icon {
     display: flex;
@@ -421,28 +334,13 @@
   height: 24px;
 }
 
-#PanelUI-zen-workspaces-create-footer,
-#PanelUI-zen-workspaces-edit-footer {
-  padding-bottom: 0 !important;
-  margin-top: 10px;
-  margin-left: 0;
-  margin-bottom: 0 !important;
-  width: 100%;
-}
-
-#PanelUI-zen-workspaces-create-footer button[default='true'],
-#PanelUI-zen-workspaces-edit-footer button[default='true'] {
-  width: 100%;
-}
-
 #PanelUI-zen-workspaces-header {
   margin-right: auto;
 }
 
 /* Mark workspaces indicator */
 .zen-current-workspace-indicator {
-  padding: calc(15px + var(--zen-toolbox-padding))
+padding: calc(4px + var(--tab-inline-padding) + var(--zen-toolbox-padding));
-    calc(4px + var(--tab-inline-padding) + var(--zen-toolbox-padding));
   font-weight: 600;
   position: relative;
   max-height: var(--zen-workspace-indicator-height);
@@ -452,6 +350,8 @@
   flex-direction: row !important;
   max-width: 100%;
   width: 100%;
+  font-size: small;
+  padding-right: 10px;
 
   &::before {
     border-radius: var(--border-radius-medium);
@@ -486,8 +386,23 @@
     white-space: nowrap;
     overflow: hidden;
     text-overflow: ellipsis;
-    pointer-events: none;
+cursor: text;
-    font-size: small;
+  }
+
+    .zen-workspaces-actions {
+    --toolbarbutton-inner-padding: 4px;
+    margin-left: auto !important;
+    opacity: 0;
+    visibility: collapse;
+    transition: opacity 0.1s;
+    order: 5;
+  }
+
+  :root:not([zen-private-window]) &:hover .zen-workspaces-actions,
+  & .zen-workspaces-actions[open='true'] {
+    visibility: visible;
+    pointer-events: auto;
+    opacity: 1;
   }
 }