From 4741c894e60b9034cb949496e5defb2814a9011a Mon Sep 17 00:00:00 2001
From: kusowl <kushal.saha@outlook.com>
Date: Tue, 20 Jan 2026 19:09:29 +0530
Subject: [PATCH] fix: make sidebar state persistant

---
 resources/js/app.js     | 21 +++++++++++++------
 resources/js/sidebar.js | 46 +++++++++++++++++++++++++----------------
 2 files changed, 43 insertions(+), 24 deletions(-)

diff --git a/resources/js/app.js b/resources/js/app.js
index b626286..9ab439d 100644
--- a/resources/js/app.js
+++ b/resources/js/app.js
@@ -1,12 +1,21 @@
 import './bootstrap';
+import { setSidebarState } from '@/sidebar.js';
 
 window.addEventListener('load', () => {
     const preloader = document.getElementById('preloader');
-    const  content = document.getElementById('content');
-    preloader.style.opacity='0';
+    const content = document.getElementById('content');
+
+    preloader.style.opacity = '0';
+
     setTimeout(() => {
-        preloader.style.display='none';
-    }, 350)
+        preloader.style.display = 'none';
+    }, 350);
+
     content.style.display = 'block';
-    document.body.classList.remove('preload')
-})
+    document.body.classList.remove('preload');
+
+    const savedState = localStorage.getItem('sidebar');
+    if (savedState) {
+        setSidebarState(savedState);
+    }
+});
diff --git a/resources/js/sidebar.js b/resources/js/sidebar.js
index b4b9109..a5266e2 100644
--- a/resources/js/sidebar.js
+++ b/resources/js/sidebar.js
@@ -1,23 +1,33 @@
-const sidebarWrapper = document.getElementById('sidebarWrapper');
-const closeBtn = document.getElementById('closeSidebarBtn');
-const openBtn = document.getElementById('openSidebarBtn');
-const sidebarTexts = document.querySelectorAll('.sidebar-text');
-closeBtn.addEventListener('click', () => {
-    sidebarWrapper.classList.remove('w-64');
-    sidebarWrapper.classList.add('w-20');
+const elements = {
+    closeBtn: document.getElementById('closeSidebarBtn'),
+    openBtn: document.getElementById('openSidebarBtn'),
+    wrapper: document.getElementById('sidebarWrapper'),
+    texts: document.querySelectorAll('.sidebar-text')
+};
 
-    closeBtn.classList.add('hidden');
-    openBtn.classList.remove('hidden');
+const SIDEBAR_STATE_KEY = 'sidebar';
 
-    sidebarTexts.forEach(el => el.classList.add('opacity-0'));
-});
+const saveState = (state) => {
+    try {
+        localStorage.setItem(SIDEBAR_STATE_KEY, state);
+    } catch (e) {
+        console.error(e);
+    }
+};
 
-openBtn.addEventListener('click', () => {
-    sidebarWrapper.classList.remove('w-20');
-    sidebarWrapper.classList.add('w-64');
+export const setSidebarState = (state) => {
+    const isClosed = state === 'closed';
 
-    openBtn.classList.add('hidden');
-    closeBtn.classList.remove('hidden');
+    elements.wrapper.classList.toggle('w-64', !isClosed);
+    elements.wrapper.classList.toggle('w-20', isClosed);
 
-    sidebarTexts.forEach(el => el.classList.remove('opacity-0'));
-});
+    elements.closeBtn.classList.toggle('hidden', isClosed);
+    elements.openBtn.classList.toggle('hidden', !isClosed);
+
+    elements.texts.forEach(el => el.classList.toggle('opacity-0', isClosed));
+
+    saveState(state);
+};
+
+elements.closeBtn.addEventListener('click', () => setSidebarState('closed'));
+elements.openBtn.addEventListener('click', () => setSidebarState('opened'));