From 59d2a794d2644a44112aa8580267606dc608c393 Mon Sep 17 00:00:00 2001
From: "Builder.io" <builder-bot@builder.io>
Date: Sun, 19 Oct 2025 21:17:57 +0000
Subject: [PATCH] Add filters UI (search, assignee, status, reset)

cgen-e673e426b0eb48b3a779de9a05bc9426
---
 client/pages/ProjectBoard.tsx | 39 ++++++++++++++++++++++++++++++++++-
 1 file changed, 38 insertions(+), 1 deletion(-)

diff --git a/client/pages/ProjectBoard.tsx b/client/pages/ProjectBoard.tsx
index 658cd006..18ccbe8a 100644
--- a/client/pages/ProjectBoard.tsx
+++ b/client/pages/ProjectBoard.tsx
@@ -131,8 +131,45 @@ export default function ProjectBoard() {
               Project Board
             </h1>
             <p className="mt-1 text-sm text-muted-foreground">
-              Track tasks by status. Drag-and-drop coming next.
+              Track tasks by status. Filters, assignees, and due dates enabled.
             </p>
+            <div className="mt-4 grid gap-3 md:grid-cols-4">
+              <Input
+                placeholder="Search tasks…"
+                value={q}
+                onChange={(e) => setQ(e.target.value)}
+              />
+              <Select value={filterAssignee} onValueChange={setFilterAssignee}>
+                <SelectTrigger>
+                  <SelectValue placeholder="Filter by assignee" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="">All assignees</SelectItem>
+                  {members.map((m) => (
+                    <SelectItem key={m.user_id} value={m.user_id}>
+                      {m.user?.full_name || m.user?.username || m.user_id}
+                    </SelectItem>
+                  ))}
+                </SelectContent>
+              </Select>
+              <Select value={filterStatus} onValueChange={setFilterStatus}>
+                <SelectTrigger>
+                  <SelectValue placeholder="Filter by status" />
+                </SelectTrigger>
+                <SelectContent>
+                  <SelectItem value="">All statuses</SelectItem>
+                  <SelectItem value="todo">To do</SelectItem>
+                  <SelectItem value="doing">In progress</SelectItem>
+                  <SelectItem value="done">Done</SelectItem>
+                  <SelectItem value="blocked">Blocked</SelectItem>
+                </SelectContent>
+              </Select>
+              <div className="flex gap-2">
+                <Button variant="outline" onClick={() => { setQ(""); setFilterAssignee(""); setFilterStatus(""); }}>
+                  Reset filters
+                </Button>
+              </div>
+            </div>
           </section>
 
           <div className="grid gap-6 lg:grid-cols-[minmax(0,1fr)_minmax(0,1fr)_minmax(0,1fr)_minmax(0,1fr)]">