From 6f06816908ce1699d96ed257ca1a1e8e5bb6c4e1 Mon Sep 17 00:00:00 2001
From: Louis Knight-Webb <louis@bloop.ai>
Date: Fri, 4 Jul 2025 00:54:35 +0100
Subject: [PATCH] Changes don't automatically appear (vibe-kanban) (#71)

* I've added a new useEffect that will fetch the diff when the coding agent completes, fails, or the task is complete and has changes. This ensures that the final diff is always displayed without requiring a page refresh.

The fix triggers a diff fetch when:
- Coding agent completes (`CodingAgentComplete`)
- Coding agent fails (`CodingAgentFailed`)
- Task is complete (`Complete`)
- And there are actual changes (`has_changes`)

This should resolve the issue where changes don't automatically appear and require a page refresh.

* prettier
---
 .../src/components/tasks/TaskDetailsPanel.tsx | 26 +++++++++++++++++++
 1 file changed, 26 insertions(+)

diff --git a/frontend/src/components/tasks/TaskDetailsPanel.tsx b/frontend/src/components/tasks/TaskDetailsPanel.tsx
index 3c6537cd..518c98fa 100644
--- a/frontend/src/components/tasks/TaskDetailsPanel.tsx
+++ b/frontend/src/components/tasks/TaskDetailsPanel.tsx
@@ -179,6 +179,32 @@ export function TaskDetailsPanel({
     }
   }, [executionState, isOpen, selectedAttempt, fetchDiff]);
 
+  // Refresh diff when coding agent completes or changes state
+  useEffect(() => {
+    if (!executionState || !isOpen || !selectedAttempt) return;
+
+    const isCodingAgentComplete =
+      executionState.execution_state === 'CodingAgentComplete';
+    const isCodingAgentFailed =
+      executionState.execution_state === 'CodingAgentFailed';
+    const isComplete = executionState.execution_state === 'Complete';
+    const hasChanges = executionState.has_changes;
+
+    // Fetch diff when coding agent completes, fails, or task is complete and has changes
+    if (
+      (isCodingAgentComplete || isCodingAgentFailed || isComplete) &&
+      hasChanges
+    ) {
+      fetchDiff();
+    }
+  }, [
+    executionState?.execution_state,
+    executionState?.has_changes,
+    isOpen,
+    selectedAttempt,
+    fetchDiff,
+  ]);
+
   // Handle ESC key locally to prevent global navigation
   useEffect(() => {
     if (!isOpen || isDialogOpen) return;