From ad5af0f7677c73fc159a3036b9479d1d847adf97 Mon Sep 17 00:00:00 2001
From: soryu <soryu@soryu.co>
Date: Fri, 13 Feb 2026 20:35:22 +0000
Subject: Directive page improvements

---
 .../frontend/src/components/directives/DirectiveDetail.tsx   | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

(limited to 'makima/frontend/src/components/directives')

diff --git a/makima/frontend/src/components/directives/DirectiveDetail.tsx b/makima/frontend/src/components/directives/DirectiveDetail.tsx
index f9e7eed..b73463d 100644
--- a/makima/frontend/src/components/directives/DirectiveDetail.tsx
+++ b/makima/frontend/src/components/directives/DirectiveDetail.tsx
@@ -54,6 +54,16 @@ export function DirectiveDetail({
   const hasTerminalTasks = directive.steps.some((s) => s.taskId && terminalStatuses.has(s.status));
 
   // Build task map from directive steps and orchestrator
+  // Derive a stable key from the actual task IDs to avoid recreating the map on every poll
+  const taskMapKey = useMemo(() => {
+    const parts: string[] = [];
+    if (directive.orchestratorTaskId) parts.push(`o:${directive.orchestratorTaskId}`);
+    for (const step of directive.steps) {
+      if (step.taskId) parts.push(`${step.id}:${step.taskId}`);
+    }
+    return parts.join(",");
+  }, [directive.orchestratorTaskId, directive.steps]);
+
   const taskMap = useMemo(() => {
     const map = new Map<string, string>();
     if (directive.orchestratorTaskId) {
@@ -65,7 +75,7 @@ export function DirectiveDetail({
       }
     }
     return map;
-  }, [directive.orchestratorTaskId, directive.steps]);
+  }, [taskMapKey]); // eslint-disable-line react-hooks/exhaustive-deps
 
   // Subscribe to all task outputs
   const { connected, entries, clearEntries } = useMultiTaskSubscription({
-- 
cgit v1.2.3