bo/worklenz
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge pull request #257 from shancds/test/row-kanban-board-v1.1.8

Browse Source 
Test/row kanban board v1.1.8
This commit is contained in:
Chamika J
2025-07-11 15:10:36 +05:30
committed by GitHub
parent e4dfae9f1d 93b67fba07
commit 5c938586b8
2 changed files with 19 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files

33
worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/EnhancedKanbanBoardNativeDnD.tsx
View File

@@ -127,9 +127,9 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
if (draggedTaskId) { if (draggedTaskId) {
setHoveredGroupId(groupId); setHoveredGroupId(groupId);
} }
if(taskIdx === null) { if (taskIdx === null) {
setHoveredTaskIdx(0); setHoveredTaskIdx(0);
}else{ } else {
setHoveredTaskIdx(taskIdx); setHoveredTaskIdx(taskIdx);
}; };
}; };
@@ -137,16 +137,16 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
if (dragType !== 'task') return; if (dragType !== 'task') return;
e.preventDefault(); e.preventDefault();
if (!draggedTaskId || !draggedTaskGroupId || hoveredGroupId === null || hoveredTaskIdx === null) return; if (!draggedTaskId || !draggedTaskGroupId || hoveredGroupId === null || hoveredTaskIdx === null) return;
// Calculate new order and dispatch // Calculate new order and dispatch
const sourceGroup = taskGroups.find(g => g.id === draggedTaskGroupId); const sourceGroup = taskGroups.find(g => g.id === draggedTaskGroupId);
const targetGroup = taskGroups.find(g => g.id === targetGroupId); const targetGroup = taskGroups.find(g => g.id === targetGroupId);
if (!sourceGroup || !targetGroup) return; if (!sourceGroup || !targetGroup) return;
const taskIdx = sourceGroup.tasks.findIndex(t => t.id === draggedTaskId); const taskIdx = sourceGroup.tasks.findIndex(t => t.id === draggedTaskId);
if (taskIdx === -1) return; if (taskIdx === -1) return;
const movedTask = sourceGroup.tasks[taskIdx]; const movedTask = sourceGroup.tasks[taskIdx];
if (groupBy === 'status' && movedTask.id) { if (groupBy === 'status' && movedTask.id) {
if (sourceGroup.id !== targetGroup.id) { if (sourceGroup.id !== targetGroup.id) {
@@ -161,23 +161,23 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
} }
} }
let insertIdx = hoveredTaskIdx; let insertIdx = hoveredTaskIdx;
// Handle same group reordering // Handle same group reordering
if (sourceGroup.id === targetGroup.id) { if (sourceGroup.id === targetGroup.id) {
// Create a single updated array for the same group // Create a single updated array for the same group
const updatedTasks = [...sourceGroup.tasks]; const updatedTasks = [...sourceGroup.tasks];
updatedTasks.splice(taskIdx, 1); // Remove from original position updatedTasks.splice(taskIdx, 1); // Remove from original position
// Adjust insert index if moving forward in the same array // Adjust insert index if moving forward in the same array
if (taskIdx < insertIdx) { if (taskIdx < insertIdx) {
insertIdx--; insertIdx--;
} }
if (insertIdx < 0) insertIdx = 0; if (insertIdx < 0) insertIdx = 0;
if (insertIdx > updatedTasks.length) insertIdx = updatedTasks.length; if (insertIdx > updatedTasks.length) insertIdx = updatedTasks.length;
updatedTasks.splice(insertIdx, 0, movedTask); // Insert at new position updatedTasks.splice(insertIdx, 0, movedTask); // Insert at new position
dispatch(reorderTasks({ dispatch(reorderTasks({
activeGroupId: sourceGroup.id, activeGroupId: sourceGroup.id,
overGroupId: targetGroup.id, overGroupId: targetGroup.id,
@@ -200,12 +200,12 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
// Handle cross-group reordering // Handle cross-group reordering
const updatedSourceTasks = [...sourceGroup.tasks]; const updatedSourceTasks = [...sourceGroup.tasks];
updatedSourceTasks.splice(taskIdx, 1); updatedSourceTasks.splice(taskIdx, 1);
const updatedTargetTasks = [...targetGroup.tasks]; const updatedTargetTasks = [...targetGroup.tasks];
if (insertIdx < 0) insertIdx = 0; if (insertIdx < 0) insertIdx = 0;
if (insertIdx > updatedTargetTasks.length) insertIdx = updatedTargetTasks.length; if (insertIdx > updatedTargetTasks.length) insertIdx = updatedTargetTasks.length;
updatedTargetTasks.splice(insertIdx, 0, movedTask); updatedTargetTasks.splice(insertIdx, 0, movedTask);
dispatch(reorderTasks({ dispatch(reorderTasks({
activeGroupId: sourceGroup.id, activeGroupId: sourceGroup.id,
overGroupId: targetGroup.id, overGroupId: targetGroup.id,
@@ -317,8 +317,11 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
<div className="enhanced-kanban-board"> <div className="enhanced-kanban-board">
{loadingGroups ? ( {loadingGroups ? (
<Card> <Card>
<div className="flex justify-center items-center py-8"> <div className="flex flex-row gap-2 h-[600px] py-2">
<Skeleton active /> <div className="rounded bg-gray-200 dark:bg-gray-700 animate-pulse w-1/4" style={{ height: '60%' }} />
<div className="rounded bg-gray-200 dark:bg-gray-700 animate-pulse w-1/4" style={{ height: '100%' }} />
<div className="rounded bg-gray-200 dark:bg-gray-700 animate-pulse w-1/4" style={{ height: '80%' }} />
<div className="rounded bg-gray-200 dark:bg-gray-700 animate-pulse w-1/4" style={{ height: '40%' }} />
</div> </div>
</Card> </Card>
) : taskGroups.length === 0 ? ( ) : taskGroups.length === 0 ? (

2
worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx
View File

@@ -437,7 +437,7 @@ const TaskCard: React.FC<TaskCardProps> = memo(({
<div className="mt-2 border-t border-gray-100 dark:border-gray-700 pt-2"> <div className="mt-2 border-t border-gray-100 dark:border-gray-700 pt-2">
{/* Loading state */} {/* Loading state */}
{task.sub_tasks_loading && ( {task.sub_tasks_loading && (
<div className="py-2 text-xs text-gray-400 dark:text-gray-500">Loading...</div> <div className="h-4 rounded bg-gray-200 dark:bg-gray-700 animate-pulse" />
)} )}
{/* Loaded subtasks */} {/* Loaded subtasks */}
{!task.sub_tasks_loading && Array.isArray(task.sub_tasks) && task.sub_tasks.length > 0 && ( {!task.sub_tasks_loading && Array.isArray(task.sub_tasks) && task.sub_tasks.length > 0 && (