Changes

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

src/routes/clients.index.tsx

@@ -1,4 +1,4 @@
-import { createFileRoute, Link } from "@tanstack/react-router";
+import { createFileRoute, Link, useNavigate } from "@tanstack/react-router";
 import { useEffect, useState } from "react";
 import { ProtectedLayout } from "@/components/protected-layout";
 import { PageContainer, PageHeader } from "@/components/app-shell";
@@ -22,6 +22,7 @@ export const Route = createFileRoute("/clients/")({
 });
 
 function ClientsList() {
+  const navigate = useNavigate();
   const [clients, setClients] = useState<any[]>([]);
   const [q, setQ] = useState("");
   const [open, setOpen] = useState(false);
@@ -119,12 +120,17 @@ function ClientsList() {
               {filtered.map((c) => {
                 const Icon = typeIcon(c.client_type);
                 return (
-                  <tr key={c.id} className="border-t hover:bg-muted/30 transition-colors">
+                  <tr
+                    key={c.id}
+                    className="border-t hover:bg-muted/30 cursor-pointer transition-colors"
+                    onClick={() => navigate({ to: "/clients/$clientId", params: { clientId: c.id } })}
+                  >
                     <td className="px-4 py-3">
                       <Link
                         to="/clients/$clientId"
                         params={{ clientId: c.id }}
                         className="flex items-center gap-2 font-medium text-foreground hover:text-primary"
+                        onClick={(e) => e.stopPropagation()}
                       >
                         <Icon className="h-4 w-4 text-muted-foreground" />
                         {c.name}
@@ -144,7 +150,7 @@ function ClientsList() {
                     </td>
                     <td className="px-4 py-3 text-muted-foreground">{c.num_units ?? "—"}</td>
                     <td className="px-4 py-3 text-muted-foreground">{formatDate(c.created_at)}</td>
-                    <td className="px-4 py-3 text-right">
+                    <td className="px-4 py-3 text-right" onClick={(e) => e.stopPropagation()}>
                       <Button
                         size="icon"
                         variant="ghost"