load in optimization and error correction

src/hooks/useDelayedSort.ts

@@ -1,5 +1,5 @@
 import { createSignal, createEffect, onCleanup, untrack } from "solid-js";
-import type { Task } from "@/store";
+import { store, type Task } from "@/store";
 
 export function useDelayedSort(
     sourceTasks: () => Task[],
@@ -16,6 +16,20 @@ export function useDelayedSort(
         const sorted = [...sourceTasks()].sort(sortFn);
         const currentDisplayed = untrack(() => displayedTasks());
 
+        // Startup hydration loads tasks in stages; animating each reorder causes
+        // the entire visible list to flash even when only later-stage tasks changed.
+        if (store.isInitializing) {
+            if (timer) {
+                clearTimeout(timer);
+                timer = undefined;
+            }
+            if (shakingTaskIds().length > 0) {
+                setShakingTaskIds([]);
+            }
+            setDisplayedTasks(sorted);
+            return;
+        }
+
         // Initial load (though now handled by initial state, kept for safety if it resets)
         if (currentDisplayed.length === 0 && sorted.length > 0) {
             setDisplayedTasks(sorted);

src/hooks/useTaskListAutoAnimate.ts

@@ -0,0 +1,17 @@
+import autoAnimate from "@formkit/auto-animate";
+import { createEffect } from "solid-js";
+import { store } from "@/store";
+
+export function useTaskListAutoAnimate(getElement: () => HTMLElement | undefined) {
+    let hasInitialized = false;
+
+    createEffect(() => {
+        if (hasInitialized || store.isInitializing) return;
+
+        const element = getElement();
+        if (!element) return;
+
+        autoAnimate(element, { duration: 300, easing: "ease-out" });
+        hasInitialized = true;
+    });
+}