feat: add swimlanes view toggle to Kanban board
- 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.
This commit is contained in:
@@ -12,6 +12,7 @@ export interface KanbanFilters {
|
||||
priorities?: TaskPriority[];
|
||||
showCompleted?: boolean;
|
||||
compactView?: boolean;
|
||||
swimlanesByTags?: boolean;
|
||||
}
|
||||
|
||||
interface KanbanFiltersProps {
|
||||
@@ -58,6 +59,13 @@ export function KanbanFilters({ filters, onFiltersChange }: KanbanFiltersProps)
|
||||
});
|
||||
};
|
||||
|
||||
const handleSwimlanesToggle = () => {
|
||||
onFiltersChange({
|
||||
...filters,
|
||||
swimlanesByTags: !filters.swimlanesByTags
|
||||
});
|
||||
};
|
||||
|
||||
const handleClearFilters = () => {
|
||||
onFiltersChange({});
|
||||
};
|
||||
@@ -86,6 +94,28 @@ export function KanbanFilters({ filters, onFiltersChange }: KanbanFiltersProps)
|
||||
/>
|
||||
</div>
|
||||
|
||||
{/* Bouton swimlanes par tags */}
|
||||
<Button
|
||||
variant={filters.swimlanesByTags ? "primary" : "ghost"}
|
||||
onClick={handleSwimlanesToggle}
|
||||
className="flex items-center gap-2"
|
||||
title={filters.swimlanesByTags ? "Vue normale" : "Lignes par tags"}
|
||||
>
|
||||
<svg
|
||||
className="w-4 h-4"
|
||||
fill="none"
|
||||
stroke="currentColor"
|
||||
viewBox="0 0 24 24"
|
||||
>
|
||||
{filters.swimlanesByTags ? (
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 10h16M4 14h16M4 18h16" />
|
||||
) : (
|
||||
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M7 7h.01M7 3h5c.512 0 1.024.195 1.414.586l7 7a2 2 0 010 2.828l-7 7a2 2 0 01-2.828 0l-7-7A1.994 1.994 0 013 12V7a4 4 0 014-4z" />
|
||||
)}
|
||||
</svg>
|
||||
{filters.swimlanesByTags ? 'Normal' : 'Swimlanes'}
|
||||
</Button>
|
||||
|
||||
{/* Bouton vue compacte */}
|
||||
<Button
|
||||
variant={filters.compactView ? "primary" : "ghost"}
|
||||
|
||||
Reference in New Issue
Block a user