feat: add task editing and title updating features

- Introduced `onEditTask` and `onUpdateTitle` props in `KanbanBoard`, `KanbanColumn`, and `TaskCard` components for enhanced task management.
- Implemented editing functionality in `TaskCard` to allow users to update task titles directly.
- Added `EditTaskForm` in `KanbanBoardContainer` to handle task editing state and submission.
- Updated `TasksService` to ensure all task properties can be modified during updates.

components/kanban/Board.tsx

@@ -11,10 +11,12 @@ interface KanbanBoardProps {
   tasks: Task[];
   onCreateTask?: (data: CreateTaskData) => Promise<Task | null>;
   onDeleteTask?: (taskId: string) => Promise<void>;
+  onEditTask?: (task: Task) => void;
+  onUpdateTitle?: (taskId: string, newTitle: string) => Promise<void>;
   loading?: boolean;
 }
 
-export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, loading = false }: KanbanBoardProps) {
+export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle, loading = false }: KanbanBoardProps) {
   const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
   // Organiser les tâches par statut
   const tasksByStatus = useMemo(() => {
@@ -101,6 +103,8 @@ export function KanbanBoard({ tasks, onCreateTask, onDeleteTask, loading = false
             tasks={column.tasks}
             onCreateTask={onCreateTask ? handleCreateTask : undefined}
             onDeleteTask={onDeleteTask}
+            onEditTask={onEditTask}
+            onUpdateTitle={onUpdateTitle}
           />
         ))}
       </div>

components/kanban/BoardContainer.tsx

@@ -1,8 +1,11 @@
 'use client';
 
+import { useState } from 'react';
 import { KanbanBoard } from './Board';
+import { EditTaskForm } from '@/components/forms/EditTaskForm';
 import { useTasks } from '@/hooks/useTasks';
 import { Task } from '@/lib/types';
+import { UpdateTaskData } from '@/clients/tasks-client';
 
 interface BoardContainerProps {
   initialTasks: Task[];
@@ -16,17 +19,47 @@ interface BoardContainerProps {
 }
 
 export function KanbanBoardContainer({ initialTasks, initialStats }: BoardContainerProps) {
-  const { tasks, loading, createTask, deleteTask } = useTasks(
+  const { tasks, loading, createTask, deleteTask, updateTask } = useTasks(
     { limit: 20 }, 
     { tasks: initialTasks, stats: initialStats }
   );
 
+  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
+    });
+  };
+
   return (
-    <KanbanBoard 
-      tasks={tasks}
-      onCreateTask={createTask}
-      onDeleteTask={deleteTask}
-      loading={loading}
-    />
+    <>
+      <KanbanBoard 
+        tasks={tasks}
+        onCreateTask={createTask}
+        onDeleteTask={deleteTask}
+        onEditTask={handleEditTask}
+        onUpdateTitle={handleUpdateTitle}
+        loading={loading}
+      />
+      
+      <EditTaskForm
+        isOpen={!!editingTask}
+        onClose={() => setEditingTask(null)}
+        onSubmit={handleUpdateTask}
+        task={editingTask}
+        loading={loading}
+      />
+    </>
   );
 }

components/kanban/Column.tsx

@@ -13,9 +13,11 @@ interface KanbanColumnProps {
   tasks: Task[];
   onCreateTask?: (data: CreateTaskData) => Promise<void>;
   onDeleteTask?: (taskId: string) => Promise<void>;
+  onEditTask?: (task: Task) => void;
+  onUpdateTitle?: (taskId: string, newTitle: string) => Promise<void>;
 }
 
-export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTask }: KanbanColumnProps) {
+export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTask, onEditTask, onUpdateTitle }: KanbanColumnProps) {
   const [showQuickAdd, setShowQuickAdd] = useState(false);
   // Couleurs tech/cyberpunk
   const techStyles = {
@@ -111,7 +113,7 @@ export function KanbanColumn({ id, title, color, tasks, onCreateTask, onDeleteTa
               </div>
             ) : (
               tasks.map((task) => (
-                <TaskCard key={task.id} task={task} onDelete={onDeleteTask} />
+                <TaskCard key={task.id} task={task} onDelete={onDeleteTask} onEdit={onEditTask} onUpdateTitle={onUpdateTitle} />
               ))
             )}
           </div>

components/kanban/TaskCard.tsx

@@ -1,3 +1,4 @@
+import { useState, useEffect } from 'react';
 import { Task } from '@/lib/types';
 import { formatDistanceToNow } from 'date-fns';
 import { fr } from 'date-fns/locale';
@@ -7,9 +8,18 @@ import { Badge } from '@/components/ui/Badge';
 interface TaskCardProps {
   task: Task;
   onDelete?: (taskId: string) => Promise<void>;
+  onEdit?: (task: Task) => void;
+  onUpdateTitle?: (taskId: string, newTitle: string) => Promise<void>;
 }
 
-export function TaskCard({ task, onDelete }: TaskCardProps) {
+export function TaskCard({ task, onDelete, onEdit, onUpdateTitle }: TaskCardProps) {
+  const [isEditingTitle, setIsEditingTitle] = useState(false);
+  const [editTitle, setEditTitle] = useState(task.title);
+
+  // Mettre à jour le titre local quand la tâche change
+  useEffect(() => {
+    setEditTitle(task.title);
+  }, [task.title]);
   const handleDelete = async (e: React.MouseEvent) => {
     e.preventDefault();
     e.stopPropagation();
@@ -17,6 +27,45 @@ export function TaskCard({ task, onDelete }: TaskCardProps) {
       await onDelete(task.id);
     }
   };
+
+  const handleEdit = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (onEdit) {
+      onEdit(task);
+    }
+  };
+
+  const handleTitleClick = (e: React.MouseEvent) => {
+    e.preventDefault();
+    e.stopPropagation();
+    if (onUpdateTitle) {
+      setIsEditingTitle(true);
+    }
+  };
+
+  const handleTitleSave = async () => {
+    const trimmedTitle = editTitle.trim();
+    if (trimmedTitle && trimmedTitle !== task.title && onUpdateTitle) {
+      await onUpdateTitle(task.id, trimmedTitle);
+    }
+    setIsEditingTitle(false);
+  };
+
+  const handleTitleCancel = () => {
+    setEditTitle(task.title);
+    setIsEditingTitle(false);
+  };
+
+  const handleTitleKeyPress = (e: React.KeyboardEvent) => {
+    if (e.key === 'Enter') {
+      e.preventDefault();
+      handleTitleSave();
+    } else if (e.key === 'Escape') {
+      e.preventDefault();
+      handleTitleCancel();
+    }
+  };
   // Extraire les emojis du titre pour les afficher comme tags visuels
   const emojiRegex = /[\u{1F600}-\u{1F64F}]|[\u{1F300}-\u{1F5FF}]|[\u{1F680}-\u{1F6FF}]|[\u{1F1E0}-\u{1F1FF}]|[\u{2600}-\u{26FF}]|[\u{2700}-\u{27BF}]/gu;
   const emojis = task.title.match(emojiRegex) || [];
@@ -37,11 +86,38 @@ export function TaskCard({ task, onDelete }: TaskCardProps) {
           </div>
         )}
         
-        <h4 className="font-mono text-sm font-medium text-slate-100 leading-tight line-clamp-2 flex-1">
-          {titleWithoutEmojis}
-        </h4>
+        {isEditingTitle ? (
+          <input
+            type="text"
+            value={editTitle}
+            onChange={(e) => setEditTitle(e.target.value)}
+            onKeyDown={handleTitleKeyPress}
+            onBlur={handleTitleSave}
+            autoFocus
+            className="flex-1 bg-transparent border-none outline-none text-slate-100 font-mono text-sm font-medium leading-tight"
+          />
+        ) : (
+          <h4 
+            className="font-mono text-sm font-medium text-slate-100 leading-tight line-clamp-2 flex-1 cursor-pointer hover:text-cyan-300 transition-colors"
+            onClick={handleTitleClick}
+            title={onUpdateTitle ? "Cliquer pour éditer" : undefined}
+          >
+            {titleWithoutEmojis}
+          </h4>
+        )}
         
-        <div className="flex items-center gap-2 flex-shrink-0">
+        <div className="flex items-center gap-1 flex-shrink-0">
+          {/* Bouton d'édition discret */}
+          {onEdit && (
+            <button
+              onClick={handleEdit}
+              className="opacity-0 group-hover:opacity-100 w-4 h-4 rounded-full bg-blue-900/50 hover:bg-blue-800/80 border border-blue-500/30 hover:border-blue-400/50 flex items-center justify-center transition-all duration-200 text-blue-400 hover:text-blue-300 text-xs"
+              title="Modifier la tâche"
+            >
+              ✎
+            </button>
+          )}
+          
           {/* Bouton de suppression discret */}
           {onDelete && (
             <button