feat: enhance Kanban components with visibleStatuses prop

- Added `visibleStatuses` prop to `KanbanBoard`, `PrioritySwimlanesBoard`, `SwimlanesBase`, and `SwimlanesBoard` for improved column visibility control.
- Updated `KanbanBoardContainer` to derive `visibleStatuses` from `useColumnVisibility`, allowing dynamic filtering of displayed statuses.
- Refactored `KanbanFilters` to accept `hiddenStatuses` and `onToggleStatusVisibility` props, enabling better integration with column visibility management.
- Cleaned up visibility logic across components to ensure consistent behavior and user experience.
This commit is contained in:
Julien Froidefond
2025-09-15 11:05:11 +02:00
parent 2f18c08b55
commit 1a21f9b88b
6 changed files with 47 additions and 20 deletions

View File

@@ -28,15 +28,16 @@ interface KanbanBoardProps {
onUpdateStatus?: (taskId: string, newStatus: TaskStatus) => Promise<void>;
loading?: boolean;
compactView?: boolean;
visibleStatuses?: TaskStatus[];
}
export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle, onUpdateStatus, loading = false, compactView = false }: KanbanBoardProps) {
export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle, onUpdateStatus, loading = false, compactView = false, visibleStatuses }: KanbanBoardProps) {
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
const [activeTask, setActiveTask] = useState<Task | null>(null);
// Gestion de la visibilité des colonnes
const { hiddenStatuses, toggleStatusVisibility, getVisibleStatuses } = useColumnVisibility();
// Gestion de la visibilité des colonnes (utilise les props si disponibles)
const { getVisibleStatuses } = useColumnVisibility();
// Configuration des capteurs pour le drag & drop
const sensors = useSensors(
useSensor(PointerSensor, {
@@ -67,7 +68,9 @@ export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, onEditTask, onU
}, [tasksByStatus]);
// Filtrer les colonnes visibles
const visibleColumns = getVisibleStatuses(allColumns);
const visibleColumns = visibleStatuses ?
allColumns.filter(column => visibleStatuses.includes(column.id)) :
getVisibleStatuses(allColumns);
const handleCreateTask = async (data: CreateTaskData) => {
if (onCreateTask) {