feat: add global search bar and board filter chips

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-02-26 22:27:55 -05:00
parent b936d5ba7d
commit 1d7de30fa3
5 changed files with 363 additions and 12 deletions

View File

@@ -11,7 +11,6 @@ import type { DragEndEvent, DragStartEvent } from '@dnd-kit/core'
import { useState } from 'react'
import { Loader2 } from 'lucide-react'
import {
useTasks,
useStartTask,
usePauseTask,
useResumeTask,
@@ -24,11 +23,12 @@ import KanbanColumn from './KanbanColumn.tsx'
import TaskCard from './TaskCard.tsx'
interface KanbanBoardProps {
tasks: WorkTask[]
isLoading: boolean
onTaskClick: (id: number) => void
}
export default function KanbanBoard({ onTaskClick }: KanbanBoardProps) {
const { data: tasks, isLoading } = useTasks()
export default function KanbanBoard({ tasks, isLoading, onTaskClick }: KanbanBoardProps) {
const startTask = useStartTask()
const pauseTask = usePauseTask()
const resumeTask = useResumeTask()
@@ -42,7 +42,7 @@ export default function KanbanBoard({ onTaskClick }: KanbanBoardProps) {
// Filter to top-level tasks only and group by status
const columns = useMemo(() => {
const topLevel = (tasks ?? []).filter((t) => t.parentTaskId === null)
const topLevel = tasks.filter((t) => t.parentTaskId === null)
return COLUMN_CONFIG.map((col) => ({
...col,
tasks: topLevel.filter((t) => t.status === col.status),
@@ -52,7 +52,7 @@ export default function KanbanBoard({ onTaskClick }: KanbanBoardProps) {
const handleDragStart = useCallback(
(event: DragStartEvent) => {
const draggedId = Number(event.active.id)
const task = (tasks ?? []).find((t) => t.id === draggedId) ?? null
const task = tasks.find((t) => t.id === draggedId) ?? null
setActiveTask(task)
},
[tasks]
@@ -66,7 +66,7 @@ export default function KanbanBoard({ onTaskClick }: KanbanBoardProps) {
if (!over) return
const taskId = Number(active.id)
const task = (tasks ?? []).find((t) => t.id === taskId)
const task = tasks.find((t) => t.id === taskId)
if (!task) return
// Determine target status from the droppable column ID
@@ -78,7 +78,7 @@ export default function KanbanBoard({ onTaskClick }: KanbanBoardProps) {
} else {
// Dropped over another card - find which column it belongs to
const overTaskId = Number(over.id)
const overTask = (tasks ?? []).find((t) => t.id === overTaskId)
const overTask = tasks.find((t) => t.id === overTaskId)
if (overTask) {
targetStatus = overTask.status
}