- Introduced `swimlanesByTags` filter in `KanbanFilters` to toggle between swimlanes and standard Kanban view. - Updated `BoardContainer` to conditionally render `SwimlanesBoard` or `KanbanBoard` based on the selected filter. - Enhanced UI with a button to switch views, improving task organization and user experience.
89 lines
2.3 KiB
TypeScript
89 lines
2.3 KiB
TypeScript
'use client';
|
|
|
|
import { useState } from 'react';
|
|
import { KanbanBoard } from './Board';
|
|
import { SwimlanesBoard } from './SwimlanesBoard';
|
|
import { KanbanFilters } from './KanbanFilters';
|
|
import { EditTaskForm } from '@/components/forms/EditTaskForm';
|
|
import { useTasksContext } from '@/contexts/TasksContext';
|
|
import { Task, TaskStatus } from '@/lib/types';
|
|
import { UpdateTaskData } from '@/clients/tasks-client';
|
|
|
|
export function KanbanBoardContainer() {
|
|
const {
|
|
filteredTasks,
|
|
loading,
|
|
createTask,
|
|
deleteTask,
|
|
updateTask,
|
|
updateTaskOptimistic,
|
|
kanbanFilters,
|
|
setKanbanFilters
|
|
} = useTasksContext();
|
|
|
|
const [editingTask, setEditingTask] = useState<Task | null>(null);
|
|
|
|
const handleEditTask = (task: Task) => {
|
|
setEditingTask(task);
|
|
};
|
|
|
|
const handleUpdateTask = async (data: UpdateTaskData) => {
|
|
await updateTask(data);
|
|
setEditingTask(null);
|
|
};
|
|
|
|
const handleUpdateTitle = async (taskId: string, newTitle: string) => {
|
|
await updateTask({
|
|
taskId,
|
|
title: newTitle
|
|
});
|
|
};
|
|
|
|
const handleUpdateStatus = async (taskId: string, newStatus: TaskStatus) => {
|
|
// Utiliser la mise à jour optimiste pour le drag & drop
|
|
await updateTaskOptimistic({
|
|
taskId,
|
|
status: newStatus
|
|
});
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<KanbanFilters
|
|
filters={kanbanFilters}
|
|
onFiltersChange={setKanbanFilters}
|
|
/>
|
|
|
|
{kanbanFilters.swimlanesByTags ? (
|
|
<SwimlanesBoard
|
|
tasks={filteredTasks}
|
|
onDeleteTask={deleteTask}
|
|
onEditTask={handleEditTask}
|
|
onUpdateTitle={handleUpdateTitle}
|
|
onUpdateStatus={handleUpdateStatus}
|
|
compactView={kanbanFilters.compactView}
|
|
/>
|
|
) : (
|
|
<KanbanBoard
|
|
tasks={filteredTasks}
|
|
onCreateTask={createTask}
|
|
onDeleteTask={deleteTask}
|
|
onEditTask={handleEditTask}
|
|
onUpdateTitle={handleUpdateTitle}
|
|
onUpdateStatus={handleUpdateStatus}
|
|
loading={loading}
|
|
compactView={kanbanFilters.compactView}
|
|
/>
|
|
)}
|
|
|
|
<EditTaskForm
|
|
isOpen={!!editingTask}
|
|
onClose={() => setEditingTask(null)}
|
|
onSubmit={handleUpdateTask}
|
|
task={editingTask}
|
|
loading={loading}
|
|
/>
|
|
</>
|
|
);
|
|
}
|