From b1a04fbc8cdcea631b12337c886f2220bf9bafa1 Mon Sep 17 00:00:00 2001
From: Michael Suchacz <203725896+ibetitsmike@users.noreply.github.com>
Date: Tue, 9 Dec 2025 09:48:32 +0000
Subject: [PATCH] =?UTF-8?q?=F0=9F=A4=96=20fix:=20use=20functional=20update?=
 =?UTF-8?q?=20for=20project=20expand/collapse=20state?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The toggleProject function had a stale closure issue - it read from
expandedProjects which was recreated on every render. When clicking
rapidly, subsequent clicks could use stale state.

Changed to use functional update pattern with setExpandedProjectsArray
to always get the current state directly from React.
---
 src/browser/components/ProjectSidebar.tsx | 27 +++++++++++++----------
 1 file changed, 15 insertions(+), 12 deletions(-)

diff --git a/src/browser/components/ProjectSidebar.tsx b/src/browser/components/ProjectSidebar.tsx
index 467f88a586..0f374f8bd7 100644
--- a/src/browser/components/ProjectSidebar.tsx
+++ b/src/browser/components/ProjectSidebar.tsx
@@ -231,9 +231,6 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
   const expandedProjects = new Set(
     Array.isArray(expandedProjectsArray) ? expandedProjectsArray : []
   );
-  const setExpandedProjects = (projects: Set<string>) => {
-    setExpandedProjectsArray(Array.from(projects));
-  };
 
   // Track which projects have old workspaces expanded (per-project, per-tier)
   // Key format: `${projectPath}:${tierIndex}` where tierIndex is 0, 1, 2 for 1/7/30 days
@@ -263,15 +260,21 @@ const ProjectSidebarInner: React.FC<ProjectSidebarProps> = ({
     return PlatformPaths.getProjectName(path);
   };
 
-  const toggleProject = (projectPath: string) => {
-    const newExpanded = new Set(expandedProjects);
-    if (newExpanded.has(projectPath)) {
-      newExpanded.delete(projectPath);
-    } else {
-      newExpanded.add(projectPath);
-    }
-    setExpandedProjects(newExpanded);
-  };
+  // Use functional update to avoid stale closure issues when clicking rapidly
+  const toggleProject = useCallback(
+    (projectPath: string) => {
+      setExpandedProjectsArray((prev) => {
+        const prevSet = new Set(Array.isArray(prev) ? prev : []);
+        if (prevSet.has(projectPath)) {
+          prevSet.delete(projectPath);
+        } else {
+          prevSet.add(projectPath);
+        }
+        return Array.from(prevSet);
+      });
+    },
+    [setExpandedProjectsArray]
+  );
 
   const toggleOldWorkspaces = (projectPath: string, tierIndex: number) => {
     const key = `${projectPath}:${tierIndex}`;