julienfroidefond/towercontrol
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: add compact view and swimlanes toggle to HomePageContent

Browse Source 
- Introduced toggle buttons for compact view and swimlanes by tags in HomePageContent, enhancing user preferences management.
- Removed redundant compact view toggle from KanbanFilters to streamline functionality.
This commit is contained in:
Julien Froidefond
2025-09-17 11:39:48 +02:00
parent ed001ea74a
commit 60a9d0807e
2 changed files with 50 additions and 27 deletions
Download Patch File Download Diff File Expand all files Collapse all files

50
components/HomePageClient.tsx
View File

@@ -26,6 +26,8 @@ function HomePageContent() {
// Extraire les préférences du context
const showFilters = preferences.viewPreferences.showFilters;
const showObjectives = preferences.viewPreferences.showObjectives;
const compactView = preferences.viewPreferences.compactView;
const swimlanesByTags = preferences.viewPreferences.swimlanesByTags;
// Handlers pour les toggles (sauvegarde automatique via le context)
const handleToggleFilters = () => {
@@ -36,6 +38,14 @@ function HomePageContent() {
updateViewPreferences({ showObjectives: !showObjectives });
};
const handleToggleCompactView = () => {
updateViewPreferences({ compactView: !compactView });
};
const handleToggleSwimlanes = () => {
updateViewPreferences({ swimlanesByTags: !swimlanesByTags });
};
// Handler pour la création de tâche depuis la barre de contrôles
const handleCreateTask = async (data: CreateTaskData) => {
await createTask(data);
@@ -86,6 +96,46 @@ function HomePageContent() {
</button>
</div>
<div className="flex items-center gap-2 border-l border-[var(--border)] pl-4">
<button
onClick={handleToggleCompactView}
className={`flex items-center gap-2 px-3 py-1.5 rounded-md text-sm font-mono transition-all ${
compactView
? 'bg-[var(--secondary)]/20 text-[var(--secondary)] border border-[var(--secondary)]/30'
: 'bg-[var(--card)] text-[var(--muted-foreground)] border border-[var(--border)] hover:border-[var(--secondary)]/50'
}`}
title={compactView ? "Vue détaillée" : "Vue compacte"}
>
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
{compactView ? (
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 10h16M4 14h16M4 18h16" />
) : (
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 6h16M4 12h16M4 18h16" />
)}
</svg>
{compactView ? 'Détaillée' : 'Compacte'}
</button>
<button
onClick={handleToggleSwimlanes}
className={`flex items-center gap-2 px-3 py-1.5 rounded-md text-sm font-mono transition-all ${
swimlanesByTags
? 'bg-[var(--warning)]/20 text-[var(--warning)] border border-[var(--warning)]/30'
: 'bg-[var(--card)] text-[var(--muted-foreground)] border border-[var(--border)] hover:border-[var(--warning)]/50'
}`}
title={swimlanesByTags ? "Vue standard" : "Vue swimlanes"}
>
<svg className="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
{swimlanesByTags ? (
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M4 5a1 1 0 011-1h14a1 1 0 011 1v2a1 1 0 01-1 1H5a1 1 0 01-1-1V5zM4 13a1 1 0 011-1h6a1 1 0 011 1v6a1 1 0 01-1 1H5a1 1 0 01-1-1v-6zM16 13a1 1 0 011-1h2a1 1 0 011 1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-6z" />
) : (
<path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M19 11H5m14-7H5m14 14H5" />
)}
</svg>
{swimlanesByTags ? 'Standard' : 'Swimlanes'}
</button>
</div>
</div>
{/* Bouton d'ajout de tâche */}