From 411147efcea361670ed3bfdc2d3d392d240ed1ec Mon Sep 17 00:00:00 2001 From: chamiakJ Date: Mon, 7 Jul 2025 05:07:05 +0530 Subject: [PATCH] fix(task-list): update styling and improve task handling - Adjusted color styling for the CreateStatusButton based on theme mode. - Enhanced TaskGroupHeader with improved border styling and spacing for better visual consistency. - Increased width and padding for the AddCustomColumnButton to improve usability. - Updated TaskRow to include additional dependencies for task labels and phase updates in socket handling. - Refactored task management slice to ensure accurate label and phase updates during real-time interactions. - Removed unnecessary debug logging from CustomColumnModal and SelectionTypeColumn components for cleaner code. --- .../create-status-button.tsx | 2 +- .../task-list-v2/TaskGroupHeader.tsx | 4 +- .../components/task-list-v2/TaskListV2.tsx | 2 +- .../src/components/task-list-v2/TaskRow.tsx | 7 +- .../components/CustomColumnComponents.tsx | 4 +- .../task-management/improved-task-filters.tsx | 1 - .../singleProject/phase/PhaseDrawer.tsx | 4 + .../task-management/task-management.slice.ts | 4 +- .../src/hooks/useTaskSocketHandlers.ts | 197 +++++++++++------- .../custom-column-modal.tsx | 37 +--- .../selection-type-column.tsx | 10 +- 11 files changed, 141 insertions(+), 131 deletions(-) diff --git a/worklenz-frontend/src/components/project-task-filters/create-status-button/create-status-button.tsx b/worklenz-frontend/src/components/project-task-filters/create-status-button/create-status-button.tsx index 04b1d134..64ac806b 100644 --- a/worklenz-frontend/src/components/project-task-filters/create-status-button/create-status-button.tsx +++ b/worklenz-frontend/src/components/project-task-filters/create-status-button/create-status-button.tsx @@ -21,7 +21,7 @@ const CreateStatusButton = () => { onClick={() => dispatch(toggleDrawer())} icon={ } /> diff --git a/worklenz-frontend/src/components/task-list-v2/TaskGroupHeader.tsx b/worklenz-frontend/src/components/task-list-v2/TaskGroupHeader.tsx index dcddc6d8..32456b86 100644 --- a/worklenz-frontend/src/components/task-list-v2/TaskGroupHeader.tsx +++ b/worklenz-frontend/src/components/task-list-v2/TaskGroupHeader.tsx @@ -235,7 +235,7 @@ const TaskGroupHeader: React.FC = ({ group, isCollapsed, o return (
= ({ group, isCollapsed, o {/* Group name and count */}
{group.name} diff --git a/worklenz-frontend/src/components/task-list-v2/TaskListV2.tsx b/worklenz-frontend/src/components/task-list-v2/TaskListV2.tsx index 5a95db6e..6c89515c 100644 --- a/worklenz-frontend/src/components/task-list-v2/TaskListV2.tsx +++ b/worklenz-frontend/src/components/task-list-v2/TaskListV2.tsx @@ -491,7 +491,7 @@ const TaskListV2: React.FC = () => {
); })} -
+
diff --git a/worklenz-frontend/src/components/task-list-v2/TaskRow.tsx b/worklenz-frontend/src/components/task-list-v2/TaskRow.tsx index 3a25e61c..152340d1 100644 --- a/worklenz-frontend/src/components/task-list-v2/TaskRow.tsx +++ b/worklenz-frontend/src/components/task-list-v2/TaskRow.tsx @@ -49,6 +49,7 @@ interface TaskLabelsCellProps { } const TaskLabelsCell: React.FC = memo(({ labels, isDarkMode }) => { + console.log('labels', labels); if (!labels) { return null; } @@ -190,7 +191,7 @@ const TaskRow: React.FC = memo(({ taskId, projectId, visibleColumn name: label.name, color_code: label.color, })) || [], - }), [task.id, task.title, task.name, task.parent_task_id, task.labels]); + }), [task.id, task.title, task.name, task.parent_task_id, task.labels, task.labels?.length]); // Handle checkbox change const handleCheckboxChange = useCallback((e: any) => { @@ -654,8 +655,10 @@ const TaskRow: React.FC = memo(({ taskId, projectId, visibleColumn isDarkMode, projectId, - // Task data + // Task data - include specific fields that might update via socket task, + task.labels, // Explicit dependency for labels updates + task.phase, // Explicit dependency for phase updates taskDisplayName, convertedTask, diff --git a/worklenz-frontend/src/components/task-list-v2/components/CustomColumnComponents.tsx b/worklenz-frontend/src/components/task-list-v2/components/CustomColumnComponents.tsx index 12ff6f73..8df48ff2 100644 --- a/worklenz-frontend/src/components/task-list-v2/components/CustomColumnComponents.tsx +++ b/worklenz-frontend/src/components/task-list-v2/components/CustomColumnComponents.tsx @@ -29,7 +29,7 @@ export const AddCustomColumnButton: React.FC = memo(() => {