refactor(drag-and-drop): replace console logging with error logging
- Integrated an error logging utility to replace console warnings and errors in the `useDragAndDrop` hook, enhancing error tracking and debugging. - Removed unnecessary console logs related to drag-and-drop operations, streamlining the code and improving performance.
This commit is contained in:
@@ -9,6 +9,7 @@ import { useSocket } from '@/socket/socketContext';
|
|||||||
import { SocketEvents } from '@/shared/socket-events';
|
import { SocketEvents } from '@/shared/socket-events';
|
||||||
import { useParams } from 'react-router-dom';
|
import { useParams } from 'react-router-dom';
|
||||||
import { useAuthService } from '@/hooks/useAuth';
|
import { useAuthService } from '@/hooks/useAuth';
|
||||||
|
import logger from '@/utils/errorLogger';
|
||||||
|
|
||||||
export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
||||||
const dispatch = useAppDispatch();
|
const dispatch = useAppDispatch();
|
||||||
@@ -23,13 +24,13 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
const emitTaskSortChange = useCallback(
|
const emitTaskSortChange = useCallback(
|
||||||
(taskId: string, sourceGroup: TaskGroup, targetGroup: TaskGroup, insertIndex: number) => {
|
(taskId: string, sourceGroup: TaskGroup, targetGroup: TaskGroup, insertIndex: number) => {
|
||||||
if (!socket || !connected || !projectId) {
|
if (!socket || !connected || !projectId) {
|
||||||
console.warn('Socket not connected or missing project ID');
|
logger.warning('Socket not connected or missing project ID');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const task = allTasks.find(t => t.id === taskId);
|
const task = allTasks.find(t => t.id === taskId);
|
||||||
if (!task) {
|
if (!task) {
|
||||||
console.error('Task not found for socket emission:', taskId);
|
logger.error('Task not found for socket emission:', taskId);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -106,7 +107,6 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
team_id: teamId,
|
team_id: teamId,
|
||||||
};
|
};
|
||||||
|
|
||||||
console.log('Emitting TASK_SORT_ORDER_CHANGE:', socketData);
|
|
||||||
socket.emit(SocketEvents.TASK_SORT_ORDER_CHANGE.toString(), socketData);
|
socket.emit(SocketEvents.TASK_SORT_ORDER_CHANGE.toString(), socketData);
|
||||||
|
|
||||||
// Also emit the specific grouping field change event for the moved task
|
// Also emit the specific grouping field change event for the moved task
|
||||||
@@ -174,15 +174,6 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (!activeGroup || !targetGroup) return;
|
if (!activeGroup || !targetGroup) return;
|
||||||
|
|
||||||
// If dragging to a different group, we need to handle cross-group movement
|
|
||||||
if (activeGroup.id !== targetGroup.id) {
|
|
||||||
console.log('Cross-group drag detected:', {
|
|
||||||
activeTask: activeTask.id,
|
|
||||||
fromGroup: activeGroup.id,
|
|
||||||
toGroup: targetGroup.id,
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
[allTasks, groups]
|
[allTasks, groups]
|
||||||
);
|
);
|
||||||
@@ -203,14 +194,14 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
// Find the active task
|
// Find the active task
|
||||||
const activeTask = allTasks.find(task => task.id === activeId);
|
const activeTask = allTasks.find(task => task.id === activeId);
|
||||||
if (!activeTask) {
|
if (!activeTask) {
|
||||||
console.error('Active task not found:', activeId);
|
logger.error('Active task not found:', activeId);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
// Find the groups
|
// Find the groups
|
||||||
const activeGroup = groups.find(group => group.taskIds.includes(activeTask.id));
|
const activeGroup = groups.find(group => group.taskIds.includes(activeTask.id));
|
||||||
if (!activeGroup) {
|
if (!activeGroup) {
|
||||||
console.error('Could not find active group for task:', activeId);
|
logger.error('Could not find active group for task:', activeId);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -243,24 +234,13 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
if (!targetGroup) {
|
if (!targetGroup) {
|
||||||
console.error('Could not find target group');
|
logger.error('Could not find target group');
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
const isCrossGroup = activeGroup.id !== targetGroup.id;
|
const isCrossGroup = activeGroup.id !== targetGroup.id;
|
||||||
const activeIndex = activeGroup.taskIds.indexOf(activeTask.id);
|
const activeIndex = activeGroup.taskIds.indexOf(activeTask.id);
|
||||||
|
|
||||||
console.log('Drag operation:', {
|
|
||||||
activeId,
|
|
||||||
overId,
|
|
||||||
activeTask: activeTask.name || activeTask.title,
|
|
||||||
activeGroup: activeGroup.id,
|
|
||||||
targetGroup: targetGroup.id,
|
|
||||||
activeIndex,
|
|
||||||
insertIndex,
|
|
||||||
isCrossGroup,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (isCrossGroup) {
|
if (isCrossGroup) {
|
||||||
// Moving task between groups
|
// Moving task between groups
|
||||||
console.log('Moving task between groups:', {
|
console.log('Moving task between groups:', {
|
||||||
@@ -284,14 +264,6 @@ export const useDragAndDrop = (allTasks: Task[], groups: TaskGroup[]) => {
|
|||||||
// Emit socket event for persistence
|
// Emit socket event for persistence
|
||||||
emitTaskSortChange(activeId as string, activeGroup, targetGroup, insertIndex);
|
emitTaskSortChange(activeId as string, activeGroup, targetGroup, insertIndex);
|
||||||
} else {
|
} else {
|
||||||
// Reordering within the same group
|
|
||||||
console.log('Reordering task within same group:', {
|
|
||||||
task: activeTask.name || activeTask.title,
|
|
||||||
group: activeGroup.title,
|
|
||||||
from: activeIndex,
|
|
||||||
to: insertIndex,
|
|
||||||
});
|
|
||||||
|
|
||||||
if (activeIndex !== insertIndex) {
|
if (activeIndex !== insertIndex) {
|
||||||
// Reorder task within same group at drop position
|
// Reorder task within same group at drop position
|
||||||
dispatch(
|
dispatch(
|
||||||
|
|||||||
Reference in New Issue
Block a user