diff --git a/frontend/src/components/tasks/TaskDetailsPanel.tsx b/frontend/src/components/tasks/TaskDetailsPanel.tsx index aa0f35fc..8ebfb767 100644 --- a/frontend/src/components/tasks/TaskDetailsPanel.tsx +++ b/frontend/src/components/tasks/TaskDetailsPanel.tsx @@ -4,7 +4,6 @@ import { X, History, Clock, - FileText, Code, ChevronDown, ChevronUp, @@ -15,6 +14,7 @@ import { Send, AlertCircle, Play, + GitCompare, } from "lucide-react"; import { Button } from "@/components/ui/button"; import { Alert, AlertDescription } from "@/components/ui/alert"; @@ -684,300 +684,397 @@ export function TaskDetailsPanel({
{/* Header */} -
-
-
-

- {task.title} -

-
- - {statusLabels[task.status]} - +
+ {/* Title and Task Actions */} +
+
+
+

+ {task.title} +

+
+ + {statusLabels[task.status]} + +
-
-
- {onEditTask && ( - - )} - {onDeleteTask && ( - - )} - -
-
- - {/* Description */} -
-
- {task.description ? ( -
-

200 - ? "line-clamp-6" - : "" - }`} - > - {task.description} -

- {task.description.length > 200 && ( - - )} -
- ) : ( -

- No description provided -

- )} -
-
- - {/* Attempt Selection */} -
-
- {selectedAttempt && ( -
- - - Current attempt:{" "} - - {new Date( - selectedAttempt.created_at - ).toLocaleDateString()}{" "} - {new Date( - selectedAttempt.created_at - ).toLocaleTimeString()} - -
- )} -
- {taskAttempts.length > 1 && ( - - - - - - {taskAttempts.map((attempt) => ( - handleAttemptChange(attempt.id)} - className={ - selectedAttempt?.id === attempt.id - ? "bg-accent" - : "" - } +
+ {onEditTask && ( + + + + + + +

Edit task

+ + + )} -
- - - - - - - {availableExecutors.map((executor) => ( - setSelectedExecutor(executor.id)} - className={ - selectedExecutor === executor.id - ? "bg-accent" - : "" - } + {onDeleteTask && ( + + + +
-
-
- - {selectedAttempt && ( -
- {(isAttemptRunning || isStopping) && ( - + + + + +

Delete task

+ + + )} - setIsHoveringDevServer(true)} - onMouseLeave={() => setIsHoveringDevServer(false)} - > - - + - - {!project?.dev_script ? ( -

- Configure a dev server command in project - settings -

- ) : runningDevServer && devServerDetails ? ( -
-

- Dev Server Logs (Last 10 lines): -

- 
-                                  {(() => {
-                                    const stdout =
-                                      devServerDetails.stdout || "";
-                                    const stderr =
-                                      devServerDetails.stderr || "";
-                                    const allOutput =
-                                      stdout + (stderr ? "\n" + stderr : "");
-                                    const lines = allOutput
-                                      .split("\n")
-                                      .filter((line) => line.trim());
-                                    const lastLines = lines.slice(-10);
-                                    return lastLines.length > 0
-                                      ? lastLines.join("\n")
-                                      : "No output yet...";
-                                  })()}
-
-
- ) : null} + +

Close panel

 - -
- )} +
+ + {/* Description */} +
+
+ {task.description ? ( +
+

200 + ? "line-clamp-6" + : "" + }`} + > + {task.description} +

+ {task.description.length > 200 && ( + + )} +
+ ) : ( +

+ No description provided +

+ )} +
+
+
+ + {/* Integrated Toolbar */} +
+
+ {/* Current Attempt Info */} +
+ {selectedAttempt ? ( + <> +
+ + {new Date(selectedAttempt.created_at).toLocaleDateString()}{" "} + {new Date(selectedAttempt.created_at).toLocaleTimeString([], { + hour: "2-digit", + minute: "2-digit", + })} + + + ({selectedAttempt.executor || "executor"}) + +
+
+ + ) : ( +
+ No attempts yet +
+ )} +
+ + {/* Action Button Groups */} +
+ {/* Attempt Management Group */} +
+ {taskAttempts.length > 1 && ( + + + + + + + + + +

View attempt history

+ + + + + {taskAttempts.map((attempt) => ( + handleAttemptChange(attempt.id)} + className={ + selectedAttempt?.id === attempt.id + ? "bg-accent" + : "" + } + > +
+ + {new Date( + attempt.created_at + ).toLocaleDateString()}{" "} + {new Date( + attempt.created_at + ).toLocaleTimeString()} + + + {attempt.executor || "executor"} + +
+ + ))} + + + )} +
+ + + + + + +

{selectedAttempt ? "Retry task with current executor" : "Start task with current executor"}

+ + + + + + + + + + + + +

Choose executor

+ + + + + {availableExecutors.map((executor) => ( + setSelectedExecutor(executor.id)} + className={ + selectedExecutor === executor.id + ? "bg-accent" + : "" + } + > + {executor.name} + {config?.executor.type === executor.id && + " (Default)"} + + ))} + + +
+
+ + {selectedAttempt && ( + <> +
+ + {/* Execution Control Group */} +
+ {(isAttemptRunning || isStopping) && ( + + + + + + +

{isStopping ? "Stopping execution..." : "Stop execution"}

+ + + + )} + + + + setIsHoveringDevServer(true)} + onMouseLeave={() => setIsHoveringDevServer(false)} + > + + + + + {!project?.dev_script ? ( +

+ Configure a dev server command in project + settings +

+ ) : runningDevServer && devServerDetails ? ( +
+

+ Dev Server Logs (Last 10 lines): +

+ 
+                                        {(() => {
+                                          const stdout =
+                                            devServerDetails.stdout || "";
+                                          const stderr =
+                                            devServerDetails.stderr || "";
+                                          const allOutput =
+                                            stdout + (stderr ? "\n" + stderr : "");
+                                          const lines = allOutput
+                                            .split("\n")
+                                            .filter((line) => line.trim());
+                                          const lastLines = lines.slice(-10);
+                                          return lastLines.length > 0
+                                            ? lastLines.join("\n")
+                                            : "No output yet...";
+                                        })()}
+
+
+ ) : runningDevServer ? ( +

Stop the running dev server

+ ) : ( +

Start the dev server

+ )} + + + +
+ +
+ + {/* Code Actions Group */} +
+ + + + + + +

Open in editor

+ + + + + + + + + +

View code changes

+ + + +
+ + )} +
+