feat: add "View logs" menu item to customer, team, and virtual key tables

ui/app/main.tsx

@@ -1,4 +1,4 @@
-import { RouterProvider, createRouter, parseSearchWith } from "@tanstack/react-router";
+import { RouterProvider, createRouter, parseSearchWith, stringifySearchWith } from "@tanstack/react-router";
 import { StrictMode } from "react";
 import { createRoot } from "react-dom/client";
 
@@ -23,6 +23,17 @@ function safeJsonParse(value: string): unknown {
 	return value;
 }
 
+// Keep query params compatible with nuqs parsers: primitive strings stay raw
+// (so numeric-looking IDs are not JSON-quoted), while arrays use comma lists.
+function stringifySearchValue(value: unknown): string {
+	if (Array.isArray(value)) return value.map(String).join(",");
+	if (value === null || value === undefined) return "";
+	if (typeof value === "string" || typeof value === "number" || typeof value === "boolean") {
+		return String(value);
+	}
+	return JSON.stringify(value);
+}
+
 const router = createRouter({
 	routeTree,
 	defaultPreload: "intent",
@@ -31,6 +42,7 @@ const router = createRouter({
 	defaultNotFoundComponent: NotFoundComponent,
 	defaultErrorComponent: ErrorComponent,
 	parseSearch: parseSearchWith(safeJsonParse),
+	stringifySearch: stringifySearchWith(stringifySearchValue),
 });
 
 declare module "@tanstack/react-router" {
@@ -46,4 +58,4 @@ createRoot(rootEl).render(
 	<StrictMode>
 		<RouterProvider router={router} />
 	</StrictMode>,
-);
+);

ui/app/workspace/governance/views/customerTable.tsx

@@ -23,7 +23,8 @@ import { cn } from "@/lib/utils";
 import { formatCurrency } from "@/lib/utils/governance";
 import { CustomerDetailSheet } from "@enterprise/components/user-groups/sheets/customerDetailSheet";
 import { RbacOperation, RbacResource, useRbac } from "@enterprise/lib";
-import { ChevronLeft, ChevronRight, Edit, MoreHorizontal, Plus, Search, Trash2 } from "lucide-react";
+import { Link } from "@tanstack/react-router";
+import { ChevronLeft, ChevronRight, Edit, MoreHorizontal, Plus, ScrollText, Search, Trash2 } from "lucide-react";
 import { useState } from "react";
 import { toast } from "sonner";
 import { CustomersEmptyState } from "./customersEmptyState";
@@ -67,7 +68,7 @@ function CustomerActionsMenu({ customer, canUpdate, canDelete, onEdit, onDelete
 					disabled={!canUpdate}
 					data-testid={`customer-button-edit-${customer.id}`}
 					onSelect={(e) => {
-						e.stopPropagation()
+						e.stopPropagation();
 						e.preventDefault();
 						onEdit(customer);
 						setIsOpen(false);
@@ -78,6 +79,20 @@ function CustomerActionsMenu({ customer, canUpdate, canDelete, onEdit, onDelete
 					<Edit className="h-4 w-4" />
 					Edit
 				</DropdownMenuItem>
+				<DropdownMenuItem asChild className="cursor-pointer" data-testid={`customer-button-view-logs-${customer.id}`}>
+					<Link
+						to="/workspace/logs"
+						search={{ customer_ids: [customer.id] }}
+						onClick={(e) => {
+							e.stopPropagation();
+							setIsOpen(false);
+						}}
+						onPointerDown={(e) => e.stopPropagation()}
+					>
+						<ScrollText className="h-4 w-4" />
+						View logs
+					</Link>
+				</DropdownMenuItem>
 				<DropdownMenuItem
 					variant="destructive"
 					disabled={!canDelete}
@@ -562,4 +577,4 @@ export default function CustomersTable({
 			</TooltipProvider>
 		</>
 	);
-}
+}

ui/app/workspace/governance/views/teamsTable.tsx

@@ -22,7 +22,8 @@ import { Customer, Team, VirtualKey } from "@/lib/types/governance";
 import { cn } from "@/lib/utils";
 import { formatCurrency } from "@/lib/utils/governance";
 import { RbacOperation, RbacResource, useRbac } from "@enterprise/lib";
-import { ChevronLeft, ChevronRight, Edit, MoreHorizontal, Plus, Search, Trash2 } from "lucide-react";
+import { Link } from "@tanstack/react-router";
+import { ChevronLeft, ChevronRight, Edit, MoreHorizontal, Plus, ScrollText, Search, Trash2 } from "lucide-react";
 import { useEffect, useState } from "react";
 import { toast } from "sonner";
 import TeamSheet from "./teamSheet";
@@ -79,6 +80,12 @@ function TeamActionsMenu({
 						<Edit className="h-4 w-4" />
 						Edit
 					</DropdownMenuItem>
+					<DropdownMenuItem asChild className="cursor-pointer" data-testid={`team-view-logs-btn-${team.name}`}>
+						<Link to="/workspace/logs" search={{ team_ids: [team.id] }} onClick={() => setIsOpen(false)}>
+							<ScrollText className="h-4 w-4" />
+							View logs
+						</Link>
+					</DropdownMenuItem>
 					<DropdownMenuItem
 						variant="destructive"
 						className="cursor-pointer"
@@ -509,4 +516,4 @@ export default function TeamsTable({
 			</TooltipProvider>
 		</>
 	);
-}
+}

ui/app/workspace/virtual-keys/views/virtualKeysTable.tsx

@@ -36,6 +36,7 @@ import { Customer, Team, VirtualKey } from "@/lib/types/governance";
 import { cn } from "@/lib/utils";
 import { formatCurrency } from "@/lib/utils/governance";
 import { RbacOperation, RbacResource, useRbac } from "@enterprise/lib";
+import { Link } from "@tanstack/react-router";
 import {
 	ArrowDown,
 	ArrowUp,
@@ -53,6 +54,7 @@ import {
 	RotateCcw,
 	Search,
 	ShieldCheck,
+	ScrollText,
 	Trash2,
 } from "lucide-react";
 import { useQueryState } from "nuqs";
@@ -215,6 +217,16 @@ function VKActionsMenu({
 						<Edit className="h-4 w-4" />
 						Edit
 					</DropdownMenuItem>
+					<DropdownMenuItem
+						asChild
+						className="cursor-pointer"
+						data-testid={`vk-view-logs-btn-${vk.name}`}
+					>
+						<Link to="/workspace/logs" search={{ virtual_key_ids: [vk.id] }} onClick={() => setIsOpen(false)}>
+							<ScrollText className="h-4 w-4" />
+							View logs
+						</Link>
+					</DropdownMenuItem>
 					<DropdownMenuItem
 						variant="destructive"
 						className="cursor-pointer"
@@ -971,4 +983,4 @@ export default function VirtualKeysTable({
 			</div>
 		</>
 	);
-}
+}