expand sub tasks

worklenz-frontend/src/components/enhanced-kanban/VirtualizedTaskList.tsx

@@ -22,45 +22,54 @@ const VirtualizedTaskList: React.FC<VirtualizedTaskListProps> = ({
   onTaskRender,
 }) => {
   // Memoize task data to prevent unnecessary re-renders
-  const taskData = useMemo(() => ({
-    tasks,
-    activeTaskId,
-    overId,
-    onTaskRender,
-  }), [tasks, activeTaskId, overId, onTaskRender]);
+  const taskData = useMemo(
+    () => ({
+      tasks,
+      activeTaskId,
+      overId,
+      onTaskRender,
+    }),
+    [tasks, activeTaskId, overId, onTaskRender]
+  );
 
   // Row renderer for virtualized list
-  const Row = useCallback(({ index, style }: { index: number; style: React.CSSProperties }) => {
-    const task = tasks[index];
-    if (!task) return null;
+  const Row = useCallback(
+    ({ index, style }: { index: number; style: React.CSSProperties }) => {
+      const task = tasks[index];
+      if (!task) return null;
 
-    // Call onTaskRender callback if provided
-    onTaskRender?.(task, index);
+      // Call onTaskRender callback if provided
+      onTaskRender?.(task, index);
 
-    return (
+      return (
         <EnhancedKanbanTaskCard
           task={task}
           isActive={task.id === activeTaskId}
           isDropTarget={overId === task.id}
           sectionId={task.status || 'default'}
         />
-    );
-  }, [tasks, activeTaskId, overId, onTaskRender]);
+      );
+    },
+    [tasks, activeTaskId, overId, onTaskRender]
+  );
 
   // Memoize the list component to prevent unnecessary re-renders
-  const VirtualizedList = useMemo(() => (
-    <List
-      height={height}
-      width="100%"
-      itemCount={tasks.length}
-      itemSize={itemHeight}
-      itemData={taskData}
-      overscanCount={10} // Increased overscan for smoother scrolling experience
-      className="virtualized-task-list"
-    >
-      {Row}
-    </List>
-  ), [height, tasks.length, itemHeight, taskData, Row]);
+  const VirtualizedList = useMemo(
+    () => (
+      <List
+        height={height}
+        width="100%"
+        itemCount={tasks.length}
+        itemSize={itemHeight}
+        itemData={taskData}
+        overscanCount={10} // Increased overscan for smoother scrolling experience
+        className="virtualized-task-list"
+      >
+        {Row}
+      </List>
+    ),
+    [height, tasks.length, itemHeight, taskData, Row]
+  );
 
   if (tasks.length === 0) {
     return (
@@ -73,4 +82,4 @@ const VirtualizedTaskList: React.FC<VirtualizedTaskListProps> = ({
   return VirtualizedList;
 };
 
-export default React.memo(VirtualizedTaskList); 
+export default React.memo(VirtualizedTaskList);