feat(drag-and-drop): enhance task grouping updates and socket event handling

- Updated the `useDragAndDrop` hook to emit specific grouping field change events (phase, priority, status) when tasks are moved between groups.
- Refactored the task management slice to prevent direct updates to task grouping fields during drag-and-drop operations, ensuring these updates are handled via socket events after backend confirmation.
- Introduced a new socket handler for task sort order changes to update task properties based on backend responses, improving synchronization between frontend and backend task states.
This commit is contained in:
chamikaJ
2025-07-15 14:22:27 +05:30
parent a03d9ef6a4
commit 17371200ca
3 changed files with 101 additions and 42 deletions

View File

@@ -660,7 +660,7 @@ const taskManagementSlice = createSlice({
const [removed] = newTasks.splice(newTasks.indexOf(sourceTaskId), 1);
newTasks.splice(newTasks.indexOf(destinationTaskId), 0, removed);
group.taskIds = newTasks;
// Update order for affected tasks using the appropriate sort field
const sortField = getSortOrderField(state.grouping?.id);
newTasks.forEach((id, index) => {
@@ -673,11 +673,11 @@ const taskManagementSlice = createSlice({
// Moving between different groups
const sourceGroup = state.groups.find(g => g.id === sourceGroupId);
const destinationGroup = state.groups.find(g => g.id === destinationGroupId);
if (sourceGroup && destinationGroup) {
// Remove from source group
sourceGroup.taskIds = sourceGroup.taskIds.filter(id => id !== sourceTaskId);
// Add to destination group at the correct position relative to destinationTask
const destinationIndex = destinationGroup.taskIds.indexOf(destinationTaskId);
if (destinationIndex !== -1) {
@@ -685,44 +685,10 @@ const taskManagementSlice = createSlice({
} else {
destinationGroup.taskIds.push(sourceTaskId); // Add to end if destination task not found
}
// Update task's grouping field to reflect new group (e.g., status, priority, phase)
// This assumes the group ID directly corresponds to the task's field value
if (sourceTask) {
let updatedTask = { ...sourceTask };
switch (state.grouping?.id) {
case IGroupBy.STATUS:
updatedTask.status = destinationGroup.id;
break;
case IGroupBy.PRIORITY:
updatedTask.priority = destinationGroup.id;
break;
case IGroupBy.PHASE:
// Handle unmapped group specially
if (destinationGroup.id === 'Unmapped' || destinationGroup.title === 'Unmapped') {
updatedTask.phase = ''; // Clear phase for unmapped group
} else {
updatedTask.phase = destinationGroup.id;
}
break;
case IGroupBy.MEMBERS:
// If moving to a member group, ensure task is assigned to that member
// This assumes the group ID is the member ID
if (!updatedTask.assignees) {
updatedTask.assignees = [];
}
if (!updatedTask.assignees.includes(destinationGroup.id)) {
updatedTask.assignees.push(destinationGroup.id);
}
// If moving from a member group, and the task is no longer in any member group,
// consider removing the assignment (more complex logic might be needed here)
break;
default:
break;
}
newEntities[sourceTaskId] = updatedTask;
}
// Do NOT update the task's grouping field (priority, phase, status) here.
// This will be handled by the socket event handler after backend confirmation.
// Update order for affected tasks in both groups using the appropriate sort field
const sortField = getSortOrderField(state.grouping?.id);
sourceGroup.taskIds.forEach((id, index) => {