From 461e9dd6d0b54efda8188a1bcd4e12fcbef3a78f Mon Sep 17 00:00:00 2001
From: Louis Knight-Webb <louis@bloop.ai>
Date: Sat, 21 Jun 2025 23:45:43 +0100
Subject: [PATCH] Task attempt 429700b3-5d61-42fa-a7d2-944fb6f368f4 - Final
 changes

---
 .../src/components/tasks/TaskDetailsPanel.tsx | 59 +++++++++++++++----
 1 file changed, 49 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/tasks/TaskDetailsPanel.tsx b/frontend/src/components/tasks/TaskDetailsPanel.tsx
index 082f3f2f..f97866d3 100644
--- a/frontend/src/components/tasks/TaskDetailsPanel.tsx
+++ b/frontend/src/components/tasks/TaskDetailsPanel.tsx
@@ -139,6 +139,7 @@ export function TaskDetailsPanel({
   const [isDescriptionExpanded, setIsDescriptionExpanded] = useState(false);
   const [selectedExecutor, setSelectedExecutor] = useState<string>("claude");
   const [isStopping, setIsStopping] = useState(false);
+  const [expandedOutputs, setExpandedOutputs] = useState<Set<string>>(new Set());
   const { config } = useConfig();
 
   // Available executors
@@ -377,6 +378,18 @@ export function TaskDetailsPanel({
     }
   };
 
+  const toggleOutputExpansion = (processId: string) => {
+    setExpandedOutputs(prev => {
+      const newSet = new Set(prev);
+      if (newSet.has(processId)) {
+        newSet.delete(processId);
+      } else {
+        newSet.add(processId);
+      }
+      return newSet;
+    });
+  };
+
   if (!task) return null;
 
   return (
@@ -673,16 +686,42 @@ export function TaskDetailsPanel({
                                     activity.execution_process_id
                                   ] && (
                                     <div className="mt-2">
-                                      <ExecutionOutputViewer
-                                        executionProcess={
-                                          executionProcesses[
-                                            activity.execution_process_id
-                                          ]
-                                        }
-                                        executor={
-                                          selectedAttempt?.executor || undefined
-                                        }
-                                      />
+                                      <div 
+                                        className={`transition-all duration-200 ${
+                                          expandedOutputs.has(activity.execution_process_id) 
+                                            ? '' 
+                                            : 'max-h-64 overflow-hidden'
+                                        }`}
+                                      >
+                                        <ExecutionOutputViewer
+                                          executionProcess={
+                                            executionProcesses[
+                                              activity.execution_process_id
+                                            ]
+                                          }
+                                          executor={
+                                            selectedAttempt?.executor || undefined
+                                          }
+                                        />
+                                      </div>
+                                      <Button
+                                        variant="ghost"
+                                        size="sm"
+                                        onClick={() => toggleOutputExpansion(activity.execution_process_id)}
+                                        className="mt-2 p-0 h-auto text-xs text-muted-foreground hover:text-foreground"
+                                      >
+                                        {expandedOutputs.has(activity.execution_process_id) ? (
+                                          <>
+                                            <ChevronUp className="h-3 w-3 mr-1" />
+                                            Show less
+                                          </>
+                                        ) : (
+                                          <>
+                                            <ChevronDown className="h-3 w-3 mr-1" />
+                                            Show more
+                                          </>
+                                        )}
+                                      </Button>
                                     </div>
                                   )}
                               </div>