From 19bb1a1ce13028685a124ecdbfab7b51b93a13df Mon Sep 17 00:00:00 2001
From: Mohammad Kazemi <mokazemi@disroot.org>
Date: Mon, 17 Feb 2025 15:58:54 +0330
Subject: [PATCH] add `pinned="true"` attribute to web panel pin icon, also
 keep the pinned state of the panel and the button in sync

---
 src/browser/base/content/zen-sidebar-panel.inc.xhtml |  2 +-
 .../base/zen-components/ZenSidebarManager.mjs        | 12 ++++++++++++
 2 files changed, 13 insertions(+), 1 deletion(-)

diff --git a/src/browser/base/content/zen-sidebar-panel.inc.xhtml b/src/browser/base/content/zen-sidebar-panel.inc.xhtml
index e1137b01..e089825f 100644
--- a/src/browser/base/content/zen-sidebar-panel.inc.xhtml
+++ b/src/browser/base/content/zen-sidebar-panel.inc.xhtml
@@ -10,7 +10,7 @@
       </hbox>
       <hbox>
         <toolbarbutton id="zen-sidebar-web-panel-home" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.home();"/>
-        <toolbarbutton id="zen-sidebar-web-panel-pinned" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.togglePinned(this);"/>
+        <toolbarbutton id="zen-sidebar-web-panel-pinned" class="toolbarbutton-1 chromeclass-toolbar-additional" pinned="true" oncommand="gZenBrowserManagerSidebar.togglePinned(this);"/>
         <toolbarbutton id="zen-sidebar-web-panel-close" class="toolbarbutton-1 chromeclass-toolbar-additional" oncommand="gZenBrowserManagerSidebar.close();"/>
       </hbox>
     </toolbar>
diff --git a/src/browser/base/zen-components/ZenSidebarManager.mjs b/src/browser/base/zen-components/ZenSidebarManager.mjs
index dd891d07..f4b2c4ab 100644
--- a/src/browser/base/zen-components/ZenSidebarManager.mjs
+++ b/src/browser/base/zen-components/ZenSidebarManager.mjs
@@ -33,6 +33,7 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
     this.listenForPrefChanges();
     this.insertIntoContextMenu();
     this.addPositioningListeners();
+    this.syncPinnedState();
   }
 
   onlySafeWidthAndHeight() {
@@ -98,6 +99,17 @@ class ZenBrowserManagerSidebar extends ZenDOMOperatedFeature {
     window.addEventListener('resize', this.onWindowResize.bind(this));
   }
 
+  syncPinnedState() {
+    const sidebar = document.getElementById('zen-sidebar-web-panel');
+    const pinButton = document.getElementById('zen-sidebar-web-panel-pinned');
+    
+    if (sidebar.hasAttribute('pinned')) {
+      pinButton.setAttribute('pinned', 'true');
+    } else {
+      pinButton.removeAttribute('pinned');
+    }
+  }
+
   handleSplitterMouseDown(mouseDownEvent) {
     if (this._isDragging) return;
     this._isDragging = true;