From 5bab0a158c13af474a4bd6ca3e1eefe8ce7a3924 Mon Sep 17 00:00:00 2001
From: Adam Malczewski <github@tradam.dev>
Date: Sun, 28 Jun 2026 20:15:10 +0900
Subject: fix(tasks): keep fixed 60vh height even with 0 tasks

---
 src/app/App.svelte                           |  9 +++------
 src/features/surface-host/ui/TodoList.svelte | 15 +++++++++------
 2 files changed, 12 insertions(+), 12 deletions(-)

diff --git a/src/app/App.svelte b/src/app/App.svelte
index b2cfd2d..7e5ac7d 100644
--- a/src/app/App.svelte
+++ b/src/app/App.svelte
@@ -773,13 +773,10 @@
 			/>
 		{/key}
 	{:else if kind === "tasks"}
-		<!-- Re-mount per conversation so the task list is isolated per conversation. -->
+		<!-- Re-mount per conversation so the task list is isolated per conversation.
+		     TodoList always reserves its fixed 60vh height (empty or full). -->
 		{#key store.activeConversationId}
-			{#if todoData !== null && todoData.todos.length > 0}
-				<TodoList payload={todoData} />
-			{:else}
-				<p class="text-xs opacity-60">No tasks yet.</p>
-			{/if}
+			<TodoList payload={todoData} />
 		{/key}
 	{:else if kind === "compaction"}
 		<!-- Message compaction is per-conversation (keyed so the percent + feedback
diff --git a/src/features/surface-host/ui/TodoList.svelte b/src/features/surface-host/ui/TodoList.svelte
index 466cc2d..30cdf8f 100644
--- a/src/features/surface-host/ui/TodoList.svelte
+++ b/src/features/surface-host/ui/TodoList.svelte
@@ -6,10 +6,11 @@
   const data = $derived(parseTodoPayload(payload));
 </script>
 
-{#if data !== null && data.todos.length > 0}
-  <!-- Fixed at 60% of the viewport height so a long task list scrolls inside
-       this region instead of growing the whole sidebar (mirrors the tabs view). -->
-  <ul class="flex h-[60vh] flex-col gap-1 overflow-y-auto pr-1">
+<!-- Fixed at 60% of the viewport height so the region is consistent whether the
+     list is empty or overflowing — it always reserves the space and scrolls
+     internally (mirrors the tabs view). -->
+<ul class="flex h-[60vh] flex-col gap-1 overflow-y-auto pr-1">
+  {#if data !== null && data.todos.length > 0}
     {#each data.todos as todo, i (i)}
       <li class="flex items-start gap-2 rounded-box bg-base-200 px-3 py-2 text-sm">
         <!-- Status indicator -->
@@ -59,5 +60,7 @@
         </span>
       </li>
     {/each}
-  </ul>
-{/if}
+  {:else}
+    <li class="text-xs opacity-60">No tasks yet.</li>
+  {/if}
+</ul>
-- 
cgit v1.2.3