feat(AssigneeSelector): add kanbanMode prop for enhanced task assignment
- Introduced kanbanMode prop to AssigneeSelector and LazyAssigneeSelectorWrapper for improved functionality in Kanban view. - Updated EnhancedKanbanTaskCard and TaskCard components to utilize the new kanbanMode prop. - Adjusted task sorting logic to handle cases where sort_order may be undefined, ensuring robust behavior during task updates.
This commit is contained in:
@@ -22,12 +22,14 @@ interface AssigneeSelectorProps {
|
||||
task: IProjectTask;
|
||||
groupId?: string | null;
|
||||
isDarkMode?: boolean;
|
||||
kanbanMode?: boolean; // <-- Add this prop
|
||||
}
|
||||
|
||||
const AssigneeSelector: React.FC<AssigneeSelectorProps> = ({
|
||||
task,
|
||||
groupId = null,
|
||||
isDarkMode = false,
|
||||
kanbanMode = false, // <-- Default to false
|
||||
}) => {
|
||||
const [isOpen, setIsOpen] = useState(false);
|
||||
const [searchQuery, setSearchQuery] = useState('');
|
||||
@@ -212,6 +214,9 @@ const AssigneeSelector: React.FC<AssigneeSelectorProps> = ({
|
||||
assigneeIds: newAssigneeIds,
|
||||
assigneeNames: updatedAssigneeNames,
|
||||
}));
|
||||
if (kanbanMode) {
|
||||
dispatch(updateEnhancedKanbanTaskAssignees(data));
|
||||
}
|
||||
});
|
||||
|
||||
// Remove from pending changes after a short delay (optimistic)
|
||||
|
||||
@@ -216,18 +216,17 @@ const EnhancedKanbanBoardNativeDnD: React.FC<{ projectId: string }> = ({ project
|
||||
toSortOrder = -1;
|
||||
toLastIndex = true;
|
||||
} else if (targetGroup.tasks[insertIdx]) {
|
||||
toSortOrder = typeof targetGroup.tasks[insertIdx].sort_order === 'number'
|
||||
? targetGroup.tasks[insertIdx].sort_order
|
||||
: -1;
|
||||
const sortOrder = targetGroup.tasks[insertIdx].sort_order;
|
||||
toSortOrder = typeof sortOrder === 'number' ? sortOrder : 0;
|
||||
toLastIndex = false;
|
||||
} else if (targetGroup.tasks.length > 0) {
|
||||
const lastSortOrder = targetGroup.tasks[targetGroup.tasks.length - 1].sort_order;
|
||||
toSortOrder = typeof lastSortOrder === 'number' ? lastSortOrder : -1;
|
||||
toSortOrder = typeof lastSortOrder === 'number' ? lastSortOrder : 0;
|
||||
toLastIndex = false;
|
||||
}
|
||||
socket.emit(SocketEvents.TASK_SORT_ORDER_CHANGE.toString(), {
|
||||
project_id: projectId,
|
||||
from_index: movedTask.sort_order,
|
||||
from_index: movedTask.sort_order ?? 0,
|
||||
to_index: toSortOrder,
|
||||
to_last_index: toLastIndex,
|
||||
from_group: sourceGroup.id,
|
||||
|
||||
@@ -381,7 +381,7 @@ const TaskCard: React.FC<TaskCardProps> = memo(({
|
||||
isDarkMode={themeMode === 'dark'}
|
||||
size={24}
|
||||
/>
|
||||
<LazyAssigneeSelectorWrapper task={task} groupId={groupId} isDarkMode={themeMode === 'dark'} />
|
||||
<LazyAssigneeSelectorWrapper task={task} groupId={groupId} isDarkMode={themeMode === 'dark'} kanbanMode={true} />
|
||||
{(task.sub_tasks_count ?? 0) > 0 && (
|
||||
<button
|
||||
type="button"
|
||||
|
||||
@@ -182,11 +182,7 @@ const EnhancedKanbanTaskCard: React.FC<EnhancedKanbanTaskCardProps> = React.memo
|
||||
isDarkMode={themeMode === 'dark'}
|
||||
size={24}
|
||||
/>
|
||||
<LazyAssigneeSelectorWrapper
|
||||
task={task}
|
||||
groupId={sectionId}
|
||||
isDarkMode={themeMode === 'dark'}
|
||||
/>
|
||||
<LazyAssigneeSelectorWrapper task={task} groupId={sectionId} isDarkMode={themeMode === 'dark'} kanbanMode={true} />
|
||||
</Flex>
|
||||
<Flex gap={4} align="center">
|
||||
<CustomDueDatePicker task={task} onDateChange={setDueDate} />
|
||||
|
||||
@@ -11,6 +11,7 @@ interface LazyAssigneeSelectorProps {
|
||||
task: IProjectTask;
|
||||
groupId?: string | null;
|
||||
isDarkMode?: boolean;
|
||||
kanbanMode?: boolean; // <-- Add this prop
|
||||
}
|
||||
|
||||
// Lightweight loading placeholder
|
||||
@@ -34,6 +35,7 @@ const LazyAssigneeSelectorWrapper: React.FC<LazyAssigneeSelectorProps> = ({
|
||||
task,
|
||||
groupId = null,
|
||||
isDarkMode = false,
|
||||
kanbanMode = false, // <-- Default to false
|
||||
}) => {
|
||||
const [hasLoadedOnce, setHasLoadedOnce] = useState(false);
|
||||
const [showComponent, setShowComponent] = useState(false);
|
||||
@@ -74,7 +76,7 @@ const LazyAssigneeSelectorWrapper: React.FC<LazyAssigneeSelectorProps> = ({
|
||||
// Once loaded, show the full component
|
||||
return (
|
||||
<Suspense fallback={<LoadingPlaceholder isDarkMode={isDarkMode} />}>
|
||||
<LazyAssigneeSelector task={task} groupId={groupId} isDarkMode={isDarkMode} />
|
||||
<LazyAssigneeSelector task={task} groupId={groupId} isDarkMode={isDarkMode} kanbanMode={kanbanMode} />
|
||||
</Suspense>
|
||||
);
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user