feat: Start implementing Zen Library, b=no-bug, c=common, folders

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

@@ -19,3 +19,4 @@
 #include ../../../zen/vendor/jar.inc.mn
 #include ../../../zen/fonts/jar.inc.mn
 #include ../../../zen/live-folders/jar.inc.mn
+#include ../../../zen/library/jar.inc.mn

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

@@ -65,4 +65,6 @@
   <command id="cmd_zenNewNavigatorUnsynced" />
 
   <command id="cmd_zenNewLiveFolder" />
+
+  <command id="cmd_zenToggleLibrary" />
 </commandset>

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

@@ -13,6 +13,7 @@
   skipintoolbarset="true"
   context="toolbar-context-menu"
   mode="icons">
+  <toolbarbutton removable="true" class="chromeclass-toolbar-additional toolbarbutton-1 zen-sidebar-action-button" id="zen-library-button" command="cmd_zenToggleLibrary"></toolbarbutton>
   <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>
   <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>

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

@@ -289,7 +289,8 @@
   display: none;
 }
 
-#library-button {
+#library-button,
+#zen-library-button {
   list-style-image: url("library.svg") !important;
 }
 

src/zen/common/sys/ZenCustomizableUI.sys.mjs

@@ -8,7 +8,7 @@ export const ZenCustomizableUI = new (class {
   constructor() {}
 
   TYPE_TOOLBAR = "toolbar";
-  defaultSidebarIcons = ["downloads-button", "zen-workspaces-button", "zen-create-new-button"];
+  defaultSidebarIcons = ["zen-library-button", "zen-workspaces-button", "zen-create-new-button"];
 
   startup(CustomizableUIInternal) {
     CustomizableUIInternal.registerArea(

src/zen/common/zen-sets.js

@@ -137,6 +137,14 @@ document.addEventListener(
           ZenLiveFoldersManager.handleEvent(event);
           break;
         }
+        case "cmd_zenToggleLibrary": {
+          const { ZenLibrary } = ChromeUtils.importESModule(
+            "moz-src:///zen/library/ZenLibrary.mjs",
+            { global: "current" }
+          );
+          ZenLibrary.toggle();
+          break;
+        }
         default:
           gZenGlanceManager.handleMainCommandSet(event);
           if (event.target.id.startsWith("cmd_zenWorkspaceSwitch")) {

src/zen/library/ZenLibrary.mjs

@@ -0,0 +1,86 @@
+// 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/.
+
+import { html } from "chrome://global/content/vendor/lit.all.mjs";
+import { MozLitElement } from "chrome://global/content/lit-utils.mjs";
+
+let gZenLibraryInstance = null;
+
+/**
+ * The ZenLibrary class is responsible for managing the UI for the library feature.
+ * This feature allows users to view and manage their browsing history, downloads,
+ * spaces, and other related data in a unified interface.
+ */
+export class ZenLibrary extends MozLitElement {
+  #initialized = false;
+
+  static properties = {
+    activeTab: { type: String },
+  };
+
+  static queries = {
+    content: "#zen-library-content",
+    tabs: { all: "#zen-library-sidebar-tabs > .library-tab" },
+  };
+
+  constructor() {
+    super();
+    this.activeTab = "history";
+  }
+
+  connectedCallback() {
+    super.connectedCallback();
+    if (this.#initialized) {
+      return;
+    }
+    window.addEventListener("keydown", this);
+    this.#initialized = true;
+  }
+
+  disconnectedCallback() {
+    super.disconnectedCallback();
+    window.removeEventListener("keydown", this);
+    this.#initialized = false;
+  }
+
+  render() {
+    return html`
+      <link rel="stylesheet" href="chrome://browser/content/zen-styles/zen-library.css" />
+      <hbox>
+        <vbox id="zen-library-sidebar">
+          <vbox id="zen-library-sidebar-header"></vbox>
+          <vbox id="zen-library-sidebar-tabs"></vbox>
+          <vbox id="zen-library-sidebar-footer"></vbox>
+        </vbox>
+        <vbox id="zen-library-content"> test </vbox>
+      </hbox>
+    `;
+  }
+
+  handleEvent() {
+    // Handle events related to the library UI here
+  }
+
+  static getInstance() {
+    if (!gZenLibraryInstance) {
+      gZenLibraryInstance = new ZenLibrary();
+      gNavToolbox.before(gZenLibraryInstance);
+    }
+    return gZenLibraryInstance;
+  }
+
+  static clearInstance() {
+    if (gZenLibraryInstance) {
+      gZenLibraryInstance.remove();
+      gZenLibraryInstance = null;
+    }
+  }
+
+  static toggle() {
+    let instance = this.getInstance();
+    instance.toggleAttribute("open");
+  }
+}
+
+customElements.define("zen-library", ZenLibrary);

src/zen/library/jar.inc.mn

@@ -0,0 +1,5 @@
+# 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/.
+
+        content/browser/zen-components/zen-library.css                 (../../zen/library/zen-library.css)

src/zen/library/moz.build

@@ -0,0 +1,7 @@
+# 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/.
+
+MOZ_SRC_FILES += [
+  "ZenLibrary.mjs",
+]

src/zen/library/zen-library.css

@@ -0,0 +1,8 @@
+/*
+ * 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/.
+ */
+
+:host {
+}

src/zen/live-folders/ZenLiveFolder.sys.mjs

@@ -1,6 +1,7 @@
 // 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/.
+
 const lazy = {};
 ChromeUtils.defineESModuleGetters(lazy, {
   NetUtil: "resource://gre/modules/NetUtil.sys.mjs",

src/zen/moz.build

@@ -17,4 +17,5 @@ DIRS += [
     "toolkit",
     "sessionstore",
     "share",
+    "library",
 ]