feat: jira and synchro

components/kanban/KanbanFilters.tsx

@@ -21,6 +21,11 @@ export interface KanbanFilters {
   swimlanesMode?: 'tags' | 'priority'; // Mode des swimlanes
   pinnedTag?: string; // Tag pour les objectifs principaux
   sortBy?: string; // Clé de l'option de tri sélectionnée
+  // Filtres spécifiques Jira
+  showJiraOnly?: boolean; // Afficher seulement les tâches Jira
+  hideJiraTasks?: boolean; // Masquer toutes les tâches Jira
+  jiraProjects?: string[]; // Filtrer par projet Jira
+  jiraTypes?: string[]; // Filtrer par type Jira (Story, Task, Bug, etc.)
 }
 
 interface KanbanFiltersProps {
@@ -135,11 +140,88 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
     setIsSortExpanded(!isSortExpanded);
   };
 
+  const handleJiraToggle = (mode: 'show' | 'hide' | 'all') => {
+    const updates: Partial<KanbanFilters> = {};
+    
+    switch (mode) {
+      case 'show':
+        updates.showJiraOnly = true;
+        updates.hideJiraTasks = false;
+        break;
+      case 'hide':
+        updates.showJiraOnly = false;
+        updates.hideJiraTasks = true;
+        break;
+      case 'all':
+        updates.showJiraOnly = false;
+        updates.hideJiraTasks = false;
+        break;
+    }
+    
+    onFiltersChange({ ...filters, ...updates });
+  };
+
+  const handleJiraProjectToggle = (project: string) => {
+    const currentProjects = filters.jiraProjects || [];
+    const newProjects = currentProjects.includes(project)
+      ? currentProjects.filter(p => p !== project)
+      : [...currentProjects, project];
+    
+    onFiltersChange({ 
+      ...filters, 
+      jiraProjects: newProjects.length > 0 ? newProjects : undefined 
+    });
+  };
+
+  const handleJiraTypeToggle = (type: string) => {
+    const currentTypes = filters.jiraTypes || [];
+    const newTypes = currentTypes.includes(type)
+      ? currentTypes.filter(t => t !== type)
+      : [...currentTypes, type];
+    
+    onFiltersChange({ 
+      ...filters, 
+      jiraTypes: newTypes.length > 0 ? newTypes : undefined 
+    });
+  };
+
   const handleClearFilters = () => {
     onFiltersChange({});
   };
 
-  const activeFiltersCount = (filters.tags?.length || 0) + (filters.priorities?.length || 0) + (filters.search ? 1 : 0);
+  // Récupérer les projets et types Jira disponibles dans TOUTES les tâches (pas seulement les filtrées)
+  // regularTasks est déjà disponible depuis la ligne 39
+  const availableJiraProjects = useMemo(() => {
+    const projects = new Set<string>();
+    regularTasks.forEach(task => {
+      if (task.source === 'jira' && task.jiraProject) {
+        projects.add(task.jiraProject);
+      }
+    });
+    return Array.from(projects).sort();
+  }, [regularTasks]);
+
+  const availableJiraTypes = useMemo(() => {
+    const types = new Set<string>();
+    regularTasks.forEach(task => {
+      if (task.source === 'jira' && task.jiraType) {
+        types.add(task.jiraType);
+      }
+    });
+    return Array.from(types).sort();
+  }, [regularTasks]);
+
+  // Vérifier s'il y a des tâches Jira dans le système (même masquées)
+  const hasJiraTasks = regularTasks.some(task => task.source === 'jira');
+
+  const activeFiltersCount = 
+    (filters.tags?.filter(Boolean).length || 0) + 
+    (filters.priorities?.filter(Boolean).length || 0) + 
+    (filters.search ? 1 : 0) + 
+    (filters.jiraProjects?.filter(Boolean).length || 0) + 
+    (filters.jiraTypes?.filter(Boolean).length || 0) + 
+    (filters.showJiraOnly ? 1 : 0) + 
+    (filters.hideJiraTasks ? 1 : 0);
 
   // Calculer les compteurs pour les priorités
   const priorityCounts = useMemo(() => {
@@ -310,7 +392,7 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
         {/* Filtres étendus */}
         {isExpanded && (
           <div className="mt-4 border-t border-[var(--border)]/50 pt-4">
-            {/* Grille responsive pour les filtres */}
+            {/* Grille responsive pour les filtres principaux */}
             <div className="grid grid-cols-1 lg:grid-cols-[auto_1fr] gap-6 lg:gap-8">
               {/* Filtres par priorité */}
               <div className="space-y-3">
@@ -318,7 +400,7 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
                   Priorités
                 </label>
                 <div className="grid grid-cols-2 gap-2">
-                  {priorityOptions.map((priority) => (
+                  {priorityOptions.filter(priority => priority.count > 0).map((priority) => (
                     <button
                       key={priority.value}
                       onClick={() => handlePriorityToggle(priority.value)}
@@ -345,7 +427,7 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
                     Tags
                   </label>
                   <div className="flex flex-wrap gap-2 max-h-32 overflow-y-auto">
-                    {sortedTags.map((tag) => (
+                    {sortedTags.filter(tag => (tagCounts[tag.name] || 0) > 0).map((tag) => (
                       <button
                         key={tag.id}
                         onClick={() => handleTagToggle(tag.name)}
@@ -359,7 +441,7 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
                           className="w-2 h-2 rounded-full" 
                           style={{ backgroundColor: tag.color }}
                         />
-                        {tag.name} ({tagCounts[tag.name] || 0})
+                        {tag.name} ({tagCounts[tag.name]})
                       </button>
                     ))}
                   </div>
@@ -367,6 +449,102 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
               )}
             </div>
 
+            {/* Filtres Jira - Ligne séparée mais intégrée */}
+            {hasJiraTasks && (
+              <div className="border-t border-[var(--border)]/30 pt-4 mt-4">
+                <div className="flex items-center gap-4 mb-3">
+                  <label className="block text-xs font-mono font-medium text-[var(--muted-foreground)] uppercase tracking-wider">
+                    🔌 Jira
+                  </label>
+                  
+                  {/* Toggle Jira Show/Hide - inline avec le titre */}
+                  <div className="flex gap-1">
+                    <Button
+                      variant={filters.showJiraOnly ? "primary" : "ghost"}
+                      onClick={() => handleJiraToggle('show')}
+                      size="sm"
+                      className="text-xs px-2 py-1 h-auto"
+                    >
+                      🔹 Seul
+                    </Button>
+                    <Button
+                      variant={filters.hideJiraTasks ? "danger" : "ghost"}
+                      onClick={() => handleJiraToggle('hide')}
+                      size="sm"
+                      className="text-xs px-2 py-1 h-auto"
+                    >
+                      🚫 Mask
+                    </Button>
+                    <Button
+                      variant={(!filters.showJiraOnly && !filters.hideJiraTasks) ? "primary" : "ghost"}
+                      onClick={() => handleJiraToggle('all')}
+                      size="sm"
+                      className="text-xs px-2 py-1 h-auto"
+                    >
+                      📋 All
+                    </Button>
+                  </div>
+                </div>
+
+                {/* Projets et Types en 2 colonnes */}
+                <div className="grid grid-cols-1 lg:grid-cols-2 gap-4">
+                  {/* Projets Jira */}
+                  {availableJiraProjects.length > 0 && (
+                    <div>
+                      <label className="block text-xs font-medium text-[var(--muted-foreground)] mb-2">
+                        Projets
+                      </label>
+                      <div className="flex flex-wrap gap-1">
+                        {availableJiraProjects.map((project) => (
+                          <button
+                            key={project}
+                            onClick={() => handleJiraProjectToggle(project)}
+                            className={`px-2 py-1 rounded border transition-all text-xs font-medium ${
+                              filters.jiraProjects?.includes(project)
+                                ? 'border-blue-400 bg-blue-400/10 text-blue-400'
+                                : 'border-[var(--border)] bg-[var(--card)] text-[var(--muted-foreground)] hover:border-[var(--border)]'
+                            }`}
+                          >
+                            📋 {project}
+                          </button>
+                        ))}
+                      </div>
+                    </div>
+                  )}
+
+                  {/* Types Jira */}
+                  {availableJiraTypes.length > 0 && (
+                    <div>
+                      <label className="block text-xs font-medium text-[var(--muted-foreground)] mb-2">
+                        Types
+                      </label>
+                      <div className="flex flex-wrap gap-1">
+                        {availableJiraTypes.map((type) => (
+                          <button
+                            key={type}
+                            onClick={() => handleJiraTypeToggle(type)}
+                            className={`px-2 py-1 rounded border transition-all text-xs font-medium ${
+                              filters.jiraTypes?.includes(type)
+                                ? 'border-purple-400 bg-purple-400/10 text-purple-400'
+                                : 'border-[var(--border)] bg-[var(--card)] text-[var(--muted-foreground)] hover:border-[var(--border)]'
+                            }`}
+                          >
+                            {type === 'Feature' && '✨ '} 
+                            {type === 'Story' && '📖 '} 
+                            {type === 'Task' && '📝 '} 
+                            {type === 'Bug' && '🐛 '} 
+                            {type === 'Support' && '🛠️ '} 
+                            {type === 'Enabler' && '🔧 '} 
+                            {type}
+                          </button>
+                        ))}
+                      </div>
+                    </div>
+                  )}
+                </div>
+              </div>
+            )}
+
             {/* Visibilité des colonnes */}
             <div className="col-span-full border-t border-[var(--border)]/50 pt-6 mt-4">
               <ColumnVisibilityToggle
@@ -379,7 +557,7 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
 
             {/* Résumé des filtres actifs */}
             {activeFiltersCount > 0 && (
-              <div className="bg-[var(--card)]/30 rounded-lg p-3 border border-[var(--border)]/50">
+              <div className="bg-[var(--card)]/30 rounded-lg p-3 border border-[var(--border)]/50 mt-4">
                 <div className="text-xs text-[var(--muted-foreground)] font-mono uppercase tracking-wider mb-2">
                   Filtres actifs
                 </div>
@@ -389,14 +567,34 @@ export function KanbanFilters({ filters, onFiltersChange, hiddenStatuses: propsH
                       Recherche: <span className="text-cyan-400">&ldquo;{filters.search}&rdquo;</span>
                     </div>
                   )}
-                  {filters.priorities?.length && (
+                  {(filters.priorities?.filter(Boolean).length || 0) > 0 && (
                     <div className="text-[var(--muted-foreground)]">
-                      Priorités: <span className="text-cyan-400">{filters.priorities.join(', ')}</span>
+                      Priorités: <span className="text-cyan-400">{filters.priorities?.filter(Boolean).join(', ')}</span>
                     </div>
                   )}
-                  {filters.tags?.length && (
+                  {(filters.tags?.filter(Boolean).length || 0) > 0 && (
                     <div className="text-[var(--muted-foreground)]">
-                      Tags: <span className="text-cyan-400">{filters.tags.join(', ')}</span>
+                      Tags: <span className="text-cyan-400">{filters.tags?.filter(Boolean).join(', ')}</span>
+                    </div>
+                  )}
+                  {filters.showJiraOnly && (
+                    <div className="text-[var(--muted-foreground)]">
+                      Affichage: <span className="text-blue-400">Jira seulement</span>
+                    </div>
+                  )}
+                  {filters.hideJiraTasks && (
+                    <div className="text-[var(--muted-foreground)]">
+                      Affichage: <span className="text-red-400">Masquer Jira</span>
+                    </div>
+                  )}
+                  {(filters.jiraProjects?.filter(Boolean).length || 0) > 0 && (
+                    <div className="text-[var(--muted-foreground)]">
+                      Projets Jira: <span className="text-blue-400">{filters.jiraProjects?.filter(Boolean).join(', ')}</span>
+                    </div>
+                  )}
+                  {(filters.jiraTypes?.filter(Boolean).length || 0) > 0 && (
+                    <div className="text-[var(--muted-foreground)]">
+                      Types Jira: <span className="text-purple-400">{filters.jiraTypes?.filter(Boolean).join(', ')}</span>
                     </div>
                   )}
                 </div>