From 6d0e151b5fc727ab990a4682392e9d6f70c9c266 Mon Sep 17 00:00:00 2001
From: Anish Sarkar <104695310+AnishSarkar22@users.noreply.github.com>
Date: Tue, 14 Jul 2026 03:14:49 +0530
Subject: [PATCH] feat(layout-shell): implement local storage for playground
 sidebar state management

---
 .../layout/ui/shell/LayoutShell.tsx           | 23 +++++++++++++++++--
 1 file changed, 21 insertions(+), 2 deletions(-)

diff --git a/surfsense_web/components/layout/ui/shell/LayoutShell.tsx b/surfsense_web/components/layout/ui/shell/LayoutShell.tsx
index c9bbe8efc..aec472f84 100644
--- a/surfsense_web/components/layout/ui/shell/LayoutShell.tsx
+++ b/surfsense_web/components/layout/ui/shell/LayoutShell.tsx
@@ -2,7 +2,7 @@
 
 import { useAtomValue } from "jotai";
 import dynamic from "next/dynamic";
-import { useMemo, useState } from "react";
+import { useEffect, useMemo, useState } from "react";
 import { activeTabAtom, type Tab } from "@/atoms/tabs/tabs.atom";
 import { Logo } from "@/components/Logo";
 import { Spinner } from "@/components/ui/spinner";
@@ -41,6 +41,8 @@ const DocumentTabContent = dynamic(
 	}
 );
 
+const PLAYGROUND_SIDEBAR_COLLAPSED_STORAGE_KEY = "surfsense:layout:v1:playground-sidebar-collapsed";
+
 function MacDesktopTitleBar({
 	isSidebarCollapsed,
 	onToggleSidebar,
@@ -232,8 +234,25 @@ export function LayoutShell({
 		() => ({ isCollapsed, setIsCollapsed, toggleCollapsed }),
 		[isCollapsed, setIsCollapsed, toggleCollapsed]
 	);
+	useEffect(() => {
+		try {
+			setIsPlaygroundSidebarCollapsed(
+				window.localStorage.getItem(PLAYGROUND_SIDEBAR_COLLAPSED_STORAGE_KEY) === "true"
+			);
+		} catch {}
+	}, []);
+
 	const handlePlaygroundSidebarToggle = () => {
-		setIsPlaygroundSidebarCollapsed((collapsed) => !collapsed);
+		setIsPlaygroundSidebarCollapsed((collapsed) => {
+			const nextCollapsed = !collapsed;
+			try {
+				window.localStorage.setItem(
+					PLAYGROUND_SIDEBAR_COLLAPSED_STORAGE_KEY,
+					String(nextCollapsed)
+				);
+			} catch {}
+			return nextCollapsed;
+		});
 	};
 
 	// Mobile layout