refactor(KanbanGroup, TaskCard): simplify card creation logic and enhance drag-and-drop functionality

- Removed conditional checks for user roles when displaying the new task card options in KanbanGroup, streamlining the UI for task creation.
- Updated TaskCard component to improve the drag-and-drop indicator styling and structure, enhancing the user experience during task interactions.
This commit is contained in:
shancds
2025-07-07 10:11:56 +05:30
parent 2cf91bddea
commit b500c801ee
2 changed files with 11 additions and 9 deletions

View File

@@ -434,7 +434,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
)}
<div className="enhanced-kanban-group-tasks">
{/* Create card at top */}
{showNewCardTop && (isOwnerOrAdmin || isProjectManager) && (
{showNewCardTop && (
<EnhancedKanbanCreateTaskCard
sectionId={group.id}
setShowNewCard={setShowNewCardTop}
@@ -513,7 +513,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
))}
{/* Create card at bottom */}
{showNewCardBottom && (isOwnerOrAdmin || isProjectManager) && (
{showNewCardBottom && (
<EnhancedKanbanCreateTaskCard
sectionId={group.id}
setShowNewCard={setShowNewCardBottom}
@@ -522,7 +522,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
)}
{/* Footer Add Task Button */}
{(isOwnerOrAdmin || isProjectManager) && !showNewCardTop && !showNewCardBottom && group.tasks.length > 0 && (
{!showNewCardTop && !showNewCardBottom && group.tasks.length > 0 && (
<button
type="button"
className="h-10 w-full rounded-md border-2 border-dashed border-gray-300 dark:border-gray-600 hover:border-gray-400 dark:hover:border-gray-500 transition-colors flex items-center justify-center gap-2 text-gray-500 hover:text-gray-700 dark:text-gray-400 dark:hover:text-gray-300 mt-2"

View File

@@ -203,16 +203,18 @@ const TaskCard: React.FC<TaskCardProps> = memo(({
<>
{isDropIndicator && (
<div
style={{
onDragStart={e => onTaskDragStart(e, task.id!, groupId)}
onDragOver={e => onTaskDragOver(e, groupId, idx)}
onDrop={e => onTaskDrop(e, groupId, idx)}
>
<div className="w-full h-full bg-red-500"style={{
height: 80,
background: themeMode === 'dark' ? '#2a2a2a' : '#f0f0f0',
borderRadius: 6,
border: `5px`
}}
onDragStart={e => onTaskDragStart(e, task.id!, groupId)}
onDragOver={e => onTaskDragOver(e, groupId, idx)}
onDrop={e => onTaskDrop(e, groupId, idx)}
/>
}}></div>
</div>
)}
<div className="enhanced-kanban-task-card" style={{ background, color, display: 'block' }} >
<div