Changes

Co-authored-by: renee-png <262607627+renee-png@users.noreply.github.com>

src/routes/cases.index.tsx

@@ -12,6 +12,7 @@ import { Plus, Search, Archive, ArchiveRestore } from "lucide-react";
 import { formatDate, statusBadgeClass } from "@/lib/format";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "@/components/ui/select";
 import { setArchived } from "@/lib/archive";
+import { NewCaseDialog } from "@/components/cases/new-case-dialog";
 
 export const Route = createFileRoute("/cases/")({
   component: () => (
@@ -26,6 +27,7 @@ function CasesList() {
   const [q, setQ] = useState("");
   const [statusFilter, setStatusFilter] = useState<string>("all");
   const [view, setView] = useState<"active" | "archived">("active");
+  const [newOpen, setNewOpen] = useState(false);
 
   const load = async () => {
     const { data } = await supabase
@@ -60,11 +62,12 @@ function CasesList() {
         title="Cases"
         description="Matters assigned to you and ones you've created."
         actions={
-          <Button asChild>
-            <Link to="/cases/new"><Plus className="h-4 w-4 mr-2" /> New case</Link>
+          <Button onClick={() => setNewOpen(true)}>
+            <Plus className="h-4 w-4 mr-2" /> New case
           </Button>
         }
       />
+      <NewCaseDialog open={newOpen} onOpenChange={setNewOpen} />
 
       <div className="flex flex-col sm:flex-row gap-3 mb-4">
         <Tabs value={view} onValueChange={(v) => setView(v as "active" | "archived")}>