From 389e46c2516cb2a3a72aa1d61c5188f0eac5cb79 Mon Sep 17 00:00:00 2001
From: Will Miao <willmiao.dev@gmail.com>
Date: Mon, 3 Nov 2025 07:15:29 +0800
Subject: [PATCH] feat(sidebar): add force initialization option and improve
 state management

- Add `forceInitialize` option to sidebar initialization to bypass disabled setting
- Refactor sidebar toggle logic to handle initialization promises more reliably
- Improve cleanup behavior when sidebar is disabled
- Ensure proper DOM updates when sidebar state changes
- Maintain container layout consistency during sidebar operations
---
 static/js/components/SidebarManager.js | 59 ++++++++++++++------------
 1 file changed, 33 insertions(+), 26 deletions(-)

diff --git a/static/js/components/SidebarManager.js b/static/js/components/SidebarManager.js
index 5140c142..f4ed13bb 100644
--- a/static/js/components/SidebarManager.js
+++ b/static/js/components/SidebarManager.js
@@ -62,8 +62,10 @@ export class SidebarManager {
         this.lastPageControls = pageControls;
     }
 
-    async initialize(pageControls) {
-        if (this.isDisabledBySetting) {
+    async initialize(pageControls, options = {}) {
+        const { forceInitialize = false } = options;
+
+        if (this.isDisabledBySetting && !forceInitialize) {
             return;
         }
 
@@ -85,7 +87,7 @@ export class SidebarManager {
         this.updateSidebarTitle();
         this.restoreSidebarState();
         await this.loadFolderTree();
-        if (this.isDisabledBySetting) {
+        if (this.isDisabledBySetting && !forceInitialize) {
             this.cleanup();
             return;
         }
@@ -773,17 +775,39 @@ export class SidebarManager {
         this.isDisabledBySetting = !enabled;
         this.updateDomVisibility(enabled);
 
+        const shouldForceInitialization = !enabled && !this.isInitialized;
+        const needsInitialization = !this.isInitialized || shouldForceInitialization;
+
+        if (this.lastPageControls && needsInitialization) {
+            if (!this.initializationPromise) {
+                this.initializationPromise = this.initialize(this.lastPageControls, {
+                    forceInitialize: shouldForceInitialization,
+                })
+                    .catch((error) => {
+                        console.error('Sidebar initialization failed:', error);
+                    })
+                    .finally(() => {
+                        this.initializationPromise = null;
+                    });
+            }
+
+            await this.initializationPromise;
+        } else if (this.initializationPromise) {
+            await this.initializationPromise;
+        }
+
         if (!enabled) {
             this.isHovering = false;
             this.isVisible = false;
 
+            const container = document.querySelector('.container');
+            if (container) {
+                container.style.marginLeft = '';
+            }
+
             if (this.isInitialized) {
-                this.cleanup();
-            } else {
-                const container = document.querySelector('.container');
-                if (container) {
-                    container.style.marginLeft = '';
-                }
+                this.updateBreadcrumbs();
+                this.updateSidebarHeader();
             }
 
             return;
@@ -791,24 +815,7 @@ export class SidebarManager {
 
         if (this.isInitialized) {
             this.updateAutoHideState();
-            return;
         }
-
-        if (!this.lastPageControls) {
-            return;
-        }
-
-        if (!this.initializationPromise) {
-            this.initializationPromise = this.initialize(this.lastPageControls)
-                .catch((error) => {
-                    console.error('Sidebar initialization failed:', error);
-                })
-                .finally(() => {
-                    this.initializationPromise = null;
-                });
-        }
-
-        await this.initializationPromise;
     }
 
     updatePinButton() {