add: Space Overview dashboard (PoC)

locales/en-US/browser/browser/zen-vertical-tabs.ftl

@@ -26,6 +26,10 @@ zen-toolbar-context-new-folder =
 sidebar-zen-expand =
   .label = Expand Sidebar
 
+zen-overview-button =
+  .label = Space Overview
+  .tooltiptext = Space Overview
+
 sidebar-zen-create-new =
   .label = Create New...
 

locales/en-US/browser/browser/zen-workspaces.ftl

@@ -98,3 +98,24 @@ zen-panel-ui-workspaces-change-forward =
 
 zen-panel-ui-workspaces-change-back =
     .label = Previous Space
+
+zen-space-overview-title = Space Overview
+zen-space-overview-search =
+    .placeholder = Search tabs\u2026
+zen-space-overview-tab-count =
+    { $count ->
+        [one] { $count } tab
+       *[other] { $count } tabs
+    }
+zen-space-overview-bookmarks = Bookmarks
+zen-space-overview-empty = No tabs in this space
+zen-space-overview-new-space = + New Space
+zen-space-overview-more-tabs = and { $count } more\u2026
+zen-space-overview-error = Open this page from within Zen Browser
+zen-space-overview-create-space = Create Space
+zen-space-overview-delete-space =
+    .title = Delete Space
+zen-space-overview-close-tab =
+    .title = Close tab
+zen-space-overview-rename-placeholder =
+    .placeholder = Space name

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

@@ -50,6 +50,7 @@
   <command id="cmd_zenPinnedTabResetNoTab" />
 
   <command id="cmd_zenToggleSidebar" />
+  <command id="cmd_zenOpenSpaceOverview" />
 
   <command id="cmd_zenCopyCurrentURL" />
   <command id="cmd_zenCopyCurrentURLMarkdown" />

src/browser/base/content/zen-sidebar-icons.inc.xhtml

@@ -14,6 +14,7 @@
   context="toolbar-context-menu"
   mode="icons">
   <toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-expand-sidebar-button" command="cmd_zenToggleSidebar" data-l10n-id="sidebar-zen-expand"></toolbarbutton>
+  <toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-overview-button" command="cmd_zenOpenSpaceOverview" data-l10n-id="zen-overview-button"></toolbarbutton>
   <zen-workspace-icons id="zen-workspaces-button" overflows="false" removable="false"></zen-workspace-icons>
   <toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-create-new-button" context="zenCreateNewPopup" data-l10n-id="sidebar-zen-create-new"></toolbarbutton>
 </toolbar>

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

@@ -411,6 +411,10 @@
   list-style-image: url("expand-sidebar.svg") !important;
 }
 
+#zen-overview-button {
+  list-style-image: url("selectable/grid-2x2.svg") !important;
+}
+
 .panel-header > .subviewbutton-back,
 #PanelUI-zen-gradient-generator-color-page-left {
   list-style-image: url("arrow-left.svg") !important;

src/zen/common/zen-sets.js

@@ -56,6 +56,9 @@ document.addEventListener(
           case "cmd_zenToggleSidebar":
             gZenVerticalTabsManager.toggleExpand();
             break;
+          case "cmd_zenOpenSpaceOverview":
+            gZenWorkspaces.openSpaceOverview();
+            break;
           case "cmd_zenOpenZenThemePicker":
             gZenThemePicker.openThemePicker(event);
             break;

src/zen/spaces/ZenSpaceManager.mjs

@@ -1463,6 +1463,45 @@ class nsZenWorkspaces {
     createForm.finishSetup();
   }
 
+  static OVERVIEW_URL =
+    "chrome://browser/content/zen-components/zen-space-overview.html";
+
+  openSpaceOverview() {
+    // Avoid a full Array.from allocation — break early once found.
+    for (const t of gBrowser.tabs) {
+      if (t.hasAttribute("zen-overview-tab")) {
+        gBrowser.selectedTab = t;
+        return;
+      }
+    }
+
+    // addTrustedTab returns the new tab synchronously, which avoids a race
+    // where gBrowser.selectedTab could point to a different tab if the user
+    // preference opens tabs in the background or a focus change races us.
+    const tab = gBrowser.addTrustedTab(nsZenWorkspaces.OVERVIEW_URL, {
+      triggeringPrincipal:
+        Services.scriptSecurityManager.getSystemPrincipal(),
+    });
+    gBrowser.selectedTab = tab;
+    tab.setAttribute("zen-overview-tab", "true");
+
+    // Place the tab in the essentials section so it is always visible in the
+    // pinned bar regardless of which space is active.
+    tab.setAttribute("zen-essential", "true");
+    tab.removeAttribute("zen-workspace-id");
+    if (!tab.pinned) {
+      gBrowser.pinTab(tab);
+    }
+    this.getEssentialsSection(tab).appendChild(tab);
+
+    document.documentElement.setAttribute("zen-overview-active", "true");
+  }
+
+  _updateOverviewTabActive() {
+    const isOverview = gBrowser.selectedTab?.hasAttribute("zen-overview-tab");
+    document.documentElement.toggleAttribute("zen-overview-active", isOverview);
+  }
+
   #unpinnedTabsInWorkspace(workspaceID) {
     return Array.from(this.allStoredTabs).filter(
       tab =>
@@ -2325,6 +2364,10 @@ class nsZenWorkspaces {
       return true; // Always show glance tabs
     }
 
+    if (tab.hasAttribute("zen-overview-tab")) {
+      return true; // Overview tab is always visible across all spaces
+    }
+
     // See https://github.com/zen-browser/desktop/issues/10666, we should never
     // show closing tabs and consider them as not part of any workspace. This will
     // invalidate the `lastSelectedTab[previousWorkspaceId]` logic in `_handleTabSelection`
@@ -2804,6 +2847,10 @@ class nsZenWorkspaces {
       return;
     }
 
+    if (tab.hasAttribute("zen-overview-tab")) {
+      return; // Overview tab workspace placement is managed by openSpaceOverview
+    }
+
     if (workspaceID) {
       if (
         tab.hasAttribute("change-workspace") &&
@@ -2845,6 +2892,7 @@ class nsZenWorkspaces {
   async onLocationChange(event) {
     let tab = event.target;
     this.#changeToEmptyTab();
+    this._updateOverviewTabActive();
     if (
       !this.workspaceEnabled ||
       this.#inChangingWorkspace ||
@@ -2864,6 +2912,21 @@ class nsZenWorkspaces {
       return;
     }
 
+    if (tab.hasAttribute("zen-overview-tab")) {
+      // If the user navigated away from the overview page, clear the attribute
+      // so the URL bar is restored and workspace routing resumes normally.
+      const uri = tab.linkedBrowser?.currentURI?.spec;
+      if (uri && uri !== nsZenWorkspaces.OVERVIEW_URL) {
+        tab.removeAttribute("zen-overview-tab");
+        // zen-essential was set solely to keep the tab visible across spaces;
+        // reclaim normal workspace routing now that the URL has changed.
+        tab.removeAttribute("zen-essential");
+        document.documentElement.removeAttribute("zen-overview-active");
+      } else {
+        return; // Still on the overview page — no workspace switch needed
+      }
+    }
+
     if (!isEssential) {
       const activeWorkspace = this.getActiveWorkspace();
       if (!activeWorkspace) {

src/zen/spaces/jar.inc.mn

@@ -3,5 +3,8 @@
 # file, You can obtain one at http://mozilla.org/MPL/2.0/.
 
         content/browser/zen-components/ZenSpaceBookmarksStorage.js              (../../zen/spaces/ZenSpaceBookmarksStorage.js)
+        content/browser/zen-components/zen-space-overview.html                  (../../zen/spaces/zen-space-overview.html)
+        content/browser/zen-components/zen-space-overview.css                   (../../zen/spaces/zen-space-overview.css)
+        content/browser/zen-components/zen-space-overview.js                    (../../zen/spaces/zen-space-overview.js)
 *       content/browser/zen-styles/zen-workspaces.css                           (../../zen/spaces/zen-workspaces.css)
         content/browser/zen-styles/zen-gradient-generator.css                   (../../zen/spaces/zen-gradient-generator.css)