From fdc4a3cba512ccb0e231c0b3645630e9c2f31690 Mon Sep 17 00:00:00 2001
From: Jake <jake@corbel.consulting>
Date: Fri, 3 Apr 2026 18:56:54 +0100
Subject: [PATCH] =?UTF-8?q?agent:=20fix=20=E2=80=94=20infinite=20reactivit?=
 =?UTF-8?q?y=20loop=20in=20TaskSidebar=20froze=20entire=20app?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

prevTaskIds was declared as $state, causing the $effect that writes to
it to re-trigger itself infinitely (effect_update_depth_exceeded). The
variable is just a comparison reference — doesn't need to be reactive.
Changed to a plain let.

Also removed debug event loggers and reverted grain z-index.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 src/lib/components/TaskSidebar.svelte |  4 +++-
 src/routes/+layout.svelte             | 13 ++++++-------
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/src/lib/components/TaskSidebar.svelte b/src/lib/components/TaskSidebar.svelte
index a1484cc..8f39929 100644
--- a/src/lib/components/TaskSidebar.svelte
+++ b/src/lib/components/TaskSidebar.svelte
@@ -20,7 +20,9 @@
   }
 
   // Track recently added tasks for highlight animation
-  let prevTaskIds = $state(new Set(tasks.map((t) => t.id)));
+  // Use a plain variable (not $state) for previous IDs to avoid
+  // read-write loop inside the $effect.
+  let prevTaskIds = new Set(tasks.map((t) => t.id));
   $effect(() => {
     const currentIds = new Set(tasks.map((t) => t.id));
     for (const id of currentIds) {
diff --git a/src/routes/+layout.svelte b/src/routes/+layout.svelte
index 8db3296..41995ec 100644
--- a/src/routes/+layout.svelte
+++ b/src/routes/+layout.svelte
@@ -14,6 +14,7 @@
 
   const prefs = getPreferences();
 
+
   // Detect secondary windows (float, viewer) — they use +layout@.svelte
   // but as a fallback, hide chrome if the URL matches
   let isSecondaryWindow = $derived(
@@ -211,13 +212,11 @@
       <div class="flex-1 overflow-hidden bg-bg">
         {@render children()}
       </div>
+      {#if page.taskSidebarOpen && page.current !== "first-run"}
+        <div class="w-[280px] min-w-[280px] shadow-xl">
+          <TaskSidebar />
+        </div>
+      {/if}
     </div>
   </div>
-
-  <!-- Task sidebar — floats over content, no blocking overlay -->
-  {#if page.taskSidebarOpen && page.current !== "first-run" && !isSecondaryWindow}
-    <div class="fixed top-[36px] right-0 bottom-0 w-[280px] z-50 shadow-xl">
-      <TaskSidebar />
-    </div>
-  {/if}
 {/if}