From e20ab86d6eebb95277cc09cdf235984c14a7d2eb Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Fri, 11 Jul 2025 15:12:22 +0530
Subject: [PATCH 1/3] fix(enhanced-kanban): refine loading state visuals in
 EnhancedKanbanBoardNativeDnD

- Removed unnecessary Card wrapper around loading skeletons for a cleaner layout.
- Adjusted loading state visuals to enhance user experience during data fetching.
---
 .../EnhancedKanbanBoardNativeDnD.tsx                          | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/EnhancedKanbanBoardNativeDnD.tsx b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/EnhancedKanbanBoardNativeDnD.tsx
index 460fb056..a1a08105 100644
--- a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/EnhancedKanbanBoardNativeDnD.tsx
+++ b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/EnhancedKanbanBoardNativeDnD.tsx
@@ -316,14 +316,12 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
       </div>
       <div className="enhanced-kanban-board">
         {loadingGroups ? (
-          <Card>
-            <div className="flex flex-row gap-2 h-[600px] py-2">
+            <div className="flex flex-row gap-2 h-[600px]">
               <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>
-          </Card>
         ) : taskGroups.length === 0 ? (
           <Card>
             <Empty description="No tasks found" image={Empty.PRESENTED_IMAGE_SIMPLE} />

From 295d7a92df3e5d08cf3eb8d61339f87da366c555 Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Fri, 11 Jul 2025 15:45:47 +0530
Subject: [PATCH 2/3] fix(kanban-group): update empty drop zone behavior and
 visuals

- Modified the condition for rendering the empty drop zone to exclude the currently hovered group.
- Updated the background gradient colors for the empty drop zone to enhance visual appeal and consistency with the theme.
---
 .../KanbanGroup.tsx                           | 19 +++----------------
 1 file changed, 3 insertions(+), 16 deletions(-)

diff --git a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/KanbanGroup.tsx b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/KanbanGroup.tsx
index 705c467a..f5e443d2 100644
--- a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/KanbanGroup.tsx
+++ b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/KanbanGroup.tsx
@@ -480,15 +480,15 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
                     )}
 
                     {/* If group is empty, render a drop zone */}
-                    {group.tasks.length === 0 && !showNewCardTop && !showNewCardBottom && (
+                    {group.tasks.length === 0 && !showNewCardTop && !showNewCardBottom && hoveredGroupId !== group.id && (
                         <div
                             className="empty-drop-zone"
                             style={{
                                 padding: 8,
                                 height: 500,
                                 background: themeWiseColor(
-                                    'linear-gradient( 180deg, #fafafa, rgba(245, 243, 243, 0))',
-                                    'linear-gradient( 180deg, #2a2b2d, rgba(42, 43, 45, 0))',
+                                    'linear-gradient( 180deg,#E2EAF4, rgba(245, 243, 243, 0))',
+                                    'linear-gradient( 180deg, #2a2a2a, rgba(42, 43, 45, 0))',
                                     themeMode
                                 ),
                                 borderRadius: 6,
@@ -503,12 +503,6 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
                             onDragOver={e => { e.preventDefault(); onTaskDragOver(e, group.id, 0); }}
                             onDrop={e => { e.preventDefault(); onTaskDrop(e, group.id, 0); }}
                         >
-                            {/* Drop indicator at the end of the group */}
-                            {hoveredGroupId === group.id && hoveredTaskIdx === group.tasks.length && (
-                                <div className="drop-preview-indicator">
-                                    <div className="drop-line" />
-                                </div>
-                            )}
                             {(isOwnerOrAdmin || isProjectManager) && !showNewCardTop && !showNewCardBottom && (
                                 <button
                                     type="button"
@@ -603,13 +597,6 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
                             {t('addTask')}
                         </button>
                     )}
-
-                    {/* Drop indicator at the end of the group */}
-                    {hoveredGroupId === group.id && hoveredTaskIdx === group.tasks.length && (
-                        <div className="drop-preview-indicator">
-                            <div className="drop-line" />
-                        </div>
-                    )}
                 </div>
             </div>
         </div>

From 6226ae35ff470afb948d5286ebf1f464f2fbe345 Mon Sep 17 00:00:00 2001
From: shancds <shancds1@gmail.com>
Date: Fri, 11 Jul 2025 16:01:01 +0530
Subject: [PATCH 3/3] fix(task-card): add title attribute for better
 accessibility

- Added a title attribute to the task name div in TaskCard component to improve accessibility and provide additional context on hover.
---
 .../enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx   | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx
index 236d9245..4046a8f2 100644
--- a/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx
+++ b/worklenz-frontend/src/components/enhanced-kanban/EnhancedKanbanBoardNativeDnD/TaskCard.tsx
@@ -245,7 +245,7 @@ const TaskCard: React.FC<TaskCardProps> = memo(({
                                 className="w-2 h-2 rounded-full inline-block"
                                 style={{ backgroundColor: themeMode === 'dark' ? (task.priority_color_dark || task.priority_color || '#d9d9d9') : (task.priority_color || '#d9d9d9') }}
                             ></span>
-                            <div className="task-title" style={{ marginLeft: 8 }}>{task.name}</div>
+                            <div className="task-title" title={task.name} style={{ marginLeft: 8 }}>{task.name}</div>
                         </div>
 
                         <div className="task-assignees-row" style={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between', width: '100%' }}>