feat(task-management): add all_labels support and improve label handling

- Introduced all_labels property in task management to provide a complete list of labels for selection logic.
- Updated TasksControllerV2, TaskRow, and LabelsSelector components to utilize all_labels for enhanced label management.
- Improved checkbox handling in LabelsSelector to prevent event propagation and ensure better user interaction.
- Enhanced useTaskSocketHandlers to manage temporary subtasks effectively, preventing duplication during optimistic updates.

worklenz-frontend/src/components/LabelsSelector.tsx

@@ -223,16 +223,21 @@ const LabelsSelector: React.FC<LabelsSelectorProps> = ({ task, isDarkMode = fals
                   <div
                     key={label.id}
                     className={`
-                    flex items-center gap-2 p-2 cursor-pointer transition-colors
+                    flex items-center gap-2 px-2 py-1 cursor-pointer transition-colors
                     ${isDarkMode ? 'hover:bg-gray-700' : 'hover:bg-gray-50'}
                   `}
-                    onClick={() => handleLabelToggle(label)}
+                    onClick={(e) => {
+                      e.stopPropagation();
+                      handleLabelToggle(label);
+                    }}
                   >
-                    <Checkbox
-                      checked={checkLabelSelected(label.id || '')}
-                      onChange={() => handleLabelToggle(label)}
-                      isDarkMode={isDarkMode}
-                    />
+                    <div style={{ pointerEvents: 'none' }}>
+                      <Checkbox
+                        checked={checkLabelSelected(label.id || '')}
+                        onChange={() => {}} // Empty handler since we handle click on the div
+                        isDarkMode={isDarkMode}
+                      />
+                    </div>
 
                     <div
                       className="w-3 h-3 rounded-full shrink-0"

worklenz-frontend/src/components/task-list-v2/TaskRow.tsx

@@ -180,17 +180,17 @@ const TaskRow: React.FC<TaskRowProps> = memo(({ taskId, projectId, visibleColumn
     name: task.title || task.name,
     parent_task_id: task.parent_task_id,
     manual_progress: false,
-    all_labels: task.labels?.map(label => ({
+    all_labels: task.all_labels?.map(label => ({
       id: label.id,
       name: label.name,
-      color_code: label.color,
+      color_code: label.color_code,
     })) || [],
     labels: task.labels?.map(label => ({
       id: label.id,
       name: label.name,
       color_code: label.color,
     })) || [],
-  }), [task.id, task.title, task.name, task.parent_task_id, task.labels, task.labels?.length]);
+  }), [task.id, task.title, task.name, task.parent_task_id, task.all_labels, task.labels, task.all_labels?.length, task.labels?.length]);
 
   // Handle checkbox change
   const handleCheckboxChange = useCallback((e: any) => {
@@ -556,7 +556,7 @@ const TaskRow: React.FC<TaskRowProps> = memo(({ taskId, projectId, visibleColumn
 
       case 'labels':
         return (
-          <div className="flex items-center gap-0.5 flex-wrap min-w-0" style={{ ...baseStyle, minWidth: '150px' }}>
+          <div className="flex items-center gap-0.5 flex-wrap min-w-0" style={{ ...baseStyle, minWidth: '150px', width: 'auto', flexGrow: 1 }}>
             <TaskLabelsCell labels={task.labels} isDarkMode={isDarkMode} />
             <LabelsSelector task={labelsAdapter} isDarkMode={isDarkMode} />
           </div>