feat: add compact view feature to Kanban components
- Introduced `compactView` prop in `KanbanBoard`, `KanbanColumn`, and `TaskCard` for a streamlined task display. - Updated `KanbanFilters` to include a toggle for compact view, enhancing user experience. - Adjusted rendering logic in `TaskCard` to conditionally display task details based on the compact view state.
This commit is contained in:
@@ -16,9 +16,10 @@ interface KanbanColumnProps {
|
||||
onDeleteTask?: (taskId: string) => Promise<void>;
|
||||
onEditTask?: (task: Task) => void;
|
||||
onUpdateTitle?: (taskId: string, newTitle: string) => Promise<void>;
|
||||
compactView?: boolean;
|
||||
}
|
||||
|
||||
export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle }: KanbanColumnProps) {
|
||||
export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle, compactView = false }: KanbanColumnProps) {
|
||||
const [showQuickAdd, setShowQuickAdd] = useState(false);
|
||||
|
||||
// Configuration de la zone droppable
|
||||
@@ -125,7 +126,7 @@ export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTa
|
||||
</div>
|
||||
) : (
|
||||
tasks.map((task) => (
|
||||
<TaskCard key={task.id} task={task} onDelete={onDeleteTask} onEdit={onEditTask} onUpdateTitle={onUpdateTitle} />
|
||||
<TaskCard key={task.id} task={task} onDelete={onDeleteTask} onEdit={onEditTask} onUpdateTitle={onUpdateTitle} compactView={compactView} />
|
||||
))
|
||||
)}
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user