diff --git a/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.test.tsx b/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.test.tsx index 3fdfaf9c994..962c9c62c92 100644 --- a/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.test.tsx +++ b/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.test.tsx @@ -765,7 +765,7 @@ describe("DataTable pinned columns", () => { }); describe("DataTable row activation", () => { - it("uses full muted hover tint only for clickable rows", () => { + it("uses info hover tint only for clickable rows", () => { render( <> { ); const clickableRow = screen.getByRole("row", { name: "Open person Clickable" }); - expect(clickableRow).toHaveClass("hover:bg-muted"); + expect(clickableRow).toHaveClass("hover:bg-info/20"); expect(clickableRow).not.toHaveClass("hover:bg-muted/50"); - expect(screen.getByRole("row", { name: "Static" })).not.toHaveClass("hover:bg-muted"); + expect(screen.getByRole("row", { name: "Static" })).not.toHaveClass("hover:bg-info/20"); }); it("fires onRowClick exactly once from a plain cell but not from interactive elements", async () => { diff --git a/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.tsx b/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.tsx index dcd84188dd8..16a5a07c52b 100644 --- a/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.tsx +++ b/ui/litellm-dashboard/src/components/shared/DataTable/DataTable.tsx @@ -322,7 +322,7 @@ function DataTableBodyRow({ aria-label={clickable ? getRowLabel?.(row.original) : undefined} className={cn( clickable - ? "cursor-pointer hover:bg-muted focus-visible:outline-2 focus-visible:outline-primary focus-visible:-outline-offset-2" + ? "cursor-pointer hover:bg-info/20 focus-visible:outline-2 focus-visible:outline-primary focus-visible:-outline-offset-2" : "", size === "compact" ? "h-8" : "", rowClassName?.(row),