feat: integrate task creation functionality in HomePageClient and Kanban components

- Added task creation modal in HomePageClient with state management for visibility.
- Implemented `handleCreateTask` function to handle task submissions.
- Updated Kanban components to accept `onCreateTask` prop for task creation, ensuring consistent task management across the application.
- Removed unused task creation UI elements from Kanban components to streamline the interface.
This commit is contained in:
Julien Froidefond
2025-09-15 21:39:56 +02:00
parent 44df8c89b8
commit c6a9e87329
6 changed files with 82 additions and 126 deletions

View File

@@ -3,8 +3,6 @@
import { Task, TaskStatus } from '@/lib/types';
import { TaskCard } from './TaskCard';
import { QuickAddTask } from './QuickAddTask';
import { CreateTaskForm } from '@/components/forms/CreateTaskForm';
import { Button } from '@/components/ui/Button';
import { CreateTaskData } from '@/clients/tasks-client';
import { useState } from 'react';
import { useColumnVisibility } from '@/hooks/useColumnVisibility';
@@ -115,21 +113,18 @@ export interface SwimlaneData {
interface SwimlanesBaseProps {
tasks: Task[];
title: string;
swimlanes: SwimlaneData[];
onCreateTask?: (data: CreateTaskData) => Promise<Task | null>;
onCreateTask?: (data: CreateTaskData) => Promise<void>;
onDeleteTask?: (taskId: string) => Promise<void>;
onEditTask?: (task: Task) => void;
onUpdateTitle?: (taskId: string, newTitle: string) => Promise<void>;
onUpdateStatus?: (taskId: string, newStatus: TaskStatus) => Promise<void>;
compactView?: boolean;
visibleStatuses?: TaskStatus[];
loading?: boolean;
}
export function SwimlanesBase({
tasks,
title,
swimlanes,
onCreateTask,
onDeleteTask,
@@ -137,12 +132,10 @@ export function SwimlanesBase({
onUpdateTitle,
onUpdateStatus,
compactView = false,
visibleStatuses,
loading = false
visibleStatuses
}: SwimlanesBaseProps) {
const [activeTask, setActiveTask] = useState<Task | null>(null);
const [collapsedSwimlanes, setCollapsedSwimlanes] = useState<Set<string>>(new Set());
const [isCreateModalOpen, setIsCreateModalOpen] = useState(false);
const [showQuickAdd, setShowQuickAdd] = useState<{ [key: string]: boolean }>({});
// Gestion de la visibilité des colonnes
@@ -194,12 +187,6 @@ export function SwimlanesBase({
};
// Handlers pour la création de tâches
const handleCreateTask = async (data: CreateTaskData) => {
if (onCreateTask) {
await onCreateTask(data);
setIsCreateModalOpen(false);
}
};
const handleQuickAdd = async (data: CreateTaskData, columnId: string) => {
if (onCreateTask) {
@@ -220,24 +207,8 @@ export function SwimlanesBase({
onDragEnd={handleDragEnd}
>
<div className="flex flex-col h-full bg-[var(--background)]">
{/* Header */}
<div className="flex-shrink-0 px-6 py-4 border-b border-[var(--border)]/50">
<div className="flex items-center justify-between">
<h2 className="text-lg font-mono font-bold text-[var(--foreground)] uppercase tracking-wider">
{title}
</h2>
{onCreateTask && (
<Button
variant="primary"
onClick={() => setIsCreateModalOpen(true)}
disabled={loading}
>
+ Nouvelle tâche
</Button>
)}
</div>
</div>
{/* Espacement supérieur */}
<div className="flex-shrink-0 py-2"></div>
{/* Headers des colonnes visibles */}
@@ -341,15 +312,6 @@ export function SwimlanesBase({
)}
</DragOverlay>
{/* Modal de création complète */}
{onCreateTask && (
<CreateTaskForm
isOpen={isCreateModalOpen}
onClose={() => setIsCreateModalOpen(false)}
onSubmit={handleCreateTask}
loading={loading}
/>
)}
</DndContext>
);
}