diff --git a/frontend/src/components/tasks/TaskKanbanBoard.tsx b/frontend/src/components/tasks/TaskKanbanBoard.tsx index 5fa5cd2e..353614b5 100644 --- a/frontend/src/components/tasks/TaskKanbanBoard.tsx +++ b/frontend/src/components/tasks/TaskKanbanBoard.tsx @@ -12,6 +12,7 @@ type Task = TaskWithAttemptStatus; interface TaskKanbanBoardProps { tasks: Task[]; + searchQuery?: string; onDragEnd: (event: DragEndEvent) => void; onEditTask: (task: Task) => void; onDeleteTask: (taskId: string) => void; @@ -44,11 +45,25 @@ const statusBoardColors: Record = { export function TaskKanbanBoard({ tasks, + searchQuery = '', onDragEnd, onEditTask, onDeleteTask, onViewTaskDetails, }: TaskKanbanBoardProps) { + const filterTasks = (tasks: Task[]) => { + if (!searchQuery.trim()) { + return tasks; + } + + const query = searchQuery.toLowerCase(); + return tasks.filter( + (task) => + task.title.toLowerCase().includes(query) || + (task.description && task.description.toLowerCase().includes(query)) + ); + }; + const groupTasksByStatus = () => { const groups: Record = {} as Record; @@ -57,7 +72,9 @@ export function TaskKanbanBoard({ groups[status] = []; }); - tasks.forEach((task) => { + const filteredTasks = filterTasks(tasks); + + filteredTasks.forEach((task) => { // Convert old capitalized status to lowercase if needed const normalizedStatus = task.status.toLowerCase() as TaskStatus; if (groups[normalizedStatus]) { diff --git a/frontend/src/pages/project-tasks.tsx b/frontend/src/pages/project-tasks.tsx index 7b15698a..3b082417 100644 --- a/frontend/src/pages/project-tasks.tsx +++ b/frontend/src/pages/project-tasks.tsx @@ -2,6 +2,7 @@ import { useState, useEffect, useCallback } from 'react'; import { useParams, useNavigate } from 'react-router-dom'; import { Button } from '@/components/ui/button'; import { Card, CardContent } from '@/components/ui/card'; +import { Input } from '@/components/ui/input'; import { Plus, Settings, FolderOpen } from 'lucide-react'; import { makeRequest } from '@/lib/api'; import { TaskFormDialog } from '@/components/tasks/TaskFormDialog'; @@ -44,6 +45,7 @@ export function ProjectTasks() { const [isTaskDialogOpen, setIsTaskDialogOpen] = useState(false); const [editingTask, setEditingTask] = useState(null); const [isProjectSettingsOpen, setIsProjectSettingsOpen] = useState(false); + const [searchQuery, setSearchQuery] = useState(''); // Panel state const [selectedTask, setSelectedTask] = useState(null); @@ -402,10 +404,19 @@ export function ProjectTasks() { - +
+ setSearchQuery(e.target.value)} + className="w-64" + /> + +
{/* Tasks View */} @@ -428,6 +439,7 @@ export function ProjectTasks() {