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] 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>