fix: add key prop to React.Fragment in TaskList to resolve warning

- Changed Fragment wrapper to React.Fragment with key prop
- Fixes React console warning about missing keys in list

apps/web/src/app/components/TaskList.tsx

@@ -5,7 +5,7 @@ import {
   TrashIcon
 } from "@heroicons/react/24/outline";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { useEffect, useMemo, useState } from "react";
+import React, { useEffect, useMemo, useState } from "react";
 import toast from "react-hot-toast";
 import { del, get } from "../../lib/api";
 import ConfirmationDialog from "./ConfirmationDialog";
@@ -33,17 +33,31 @@ export default function TaskList({
     const handleTaskUpdate = (event: CustomEvent) => {
       const taskData = event.detail;
 
+      console.log("[TaskList] Received task update:", taskData);
+
       // For progress updates, update the cache directly instead of refetching
       if (taskData.type === "progress" && taskData.taskId !== undefined) {
+        console.log(
+          `[TaskList] Updating progress for task ${taskData.taskId} to ${taskData.progress}%`
+        );
         queryClient.setQueryData(["tasks"], (oldData: any) => {
-          if (!oldData) return oldData;
-          return oldData.map((task: any) =>
+          if (!oldData) {
+            console.log("[TaskList] No cached task data available");
+            return oldData;
+          }
+          const updated = oldData.map((task: any) =>
             task.id === taskData.taskId
               ? { ...task, progress: taskData.progress }
               : task
           );
+          console.log(
+            "[TaskList] Updated task cache:",
+            updated.find((t: any) => t.id === taskData.taskId)
+          );
+          return updated;
         });
       } else {
+        console.log("[TaskList] Non-progress update, refetching tasks");
         // For other task updates (created, completed, failed), do a full refetch
         queryClient.refetchQueries({ queryKey: ["tasks"] });
       }
@@ -699,8 +713,8 @@ export default function TaskList({
                   const taskId = task.id.toString();
                   const isExpanded = expandedRows.has(taskId);
                   return (
-                    <>
-                      <tr key={task.id}>
+                    <React.Fragment key={task.id}>
+                      <tr>
                         {context === "tasks" && (
                           <td className="px-4 py-2 whitespace-nowrap">
                             <button
@@ -822,7 +836,7 @@ export default function TaskList({
                           </td>
                         </tr>
                       )}
-                    </>
+                    </React.Fragment>
                   );
                 })
               ) : (