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

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

Browse Source 
- 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
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -434,7 +434,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
)} )}
<div className="enhanced-kanban-group-tasks"> <div className="enhanced-kanban-group-tasks">
{/* Create card at top */} {/* Create card at top */}
{showNewCardTop && (isOwnerOrAdmin || isProjectManager) && ( {showNewCardTop && (
<EnhancedKanbanCreateTaskCard <EnhancedKanbanCreateTaskCard
sectionId={group.id} sectionId={group.id}
setShowNewCard={setShowNewCardTop} setShowNewCard={setShowNewCardTop}
@@ -513,7 +513,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
))} ))}
{/* Create card at bottom */} {/* Create card at bottom */}
{showNewCardBottom && (isOwnerOrAdmin || isProjectManager) && ( {showNewCardBottom && (
<EnhancedKanbanCreateTaskCard <EnhancedKanbanCreateTaskCard
sectionId={group.id} sectionId={group.id}
setShowNewCard={setShowNewCardBottom} setShowNewCard={setShowNewCardBottom}
@@ -522,7 +522,7 @@ const KanbanGroup: React.FC<KanbanGroupProps> = memo(({
)} )}
{/* Footer Add Task Button */} {/* Footer Add Task Button */}
{(isOwnerOrAdmin || isProjectManager) && !showNewCardTop && !showNewCardBottom && group.tasks.length > 0 && ( {!showNewCardTop && !showNewCardBottom && group.tasks.length > 0 && (
<button <button
type="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" 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"

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

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