fix(enhanced-kanban): improve code readability and loading state visuals
- Refactored conditional statements for better clarity and consistency. - Enhanced loading state visuals by replacing static text with a dynamic skeleton loader, improving user experience during data fetching.
This commit is contained in:
@@ -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);
|
||||||
};
|
};
|
||||||
};
|
};
|
||||||
@@ -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 ? (
|
||||||
|
|||||||
Reference in New Issue
Block a user