@post-print/agent-test 2.0.8 → 2.0.10

package/dist/viewer/styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/viewer/styles.ts"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,IAAI,MAAM,CA+FlC"}
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../../src/viewer/styles.ts"],"names":[],"mappings":"AAAA,wBAAgB,SAAS,IAAI,MAAM,CAkHlC"}

package/dist/viewer/styles.js

@@ -92,6 +92,25 @@ export function viewerCss() {
     button:disabled { cursor: not-allowed; opacity: 0.5; }
     summary { list-style: none; }
     summary::-webkit-details-marker { display: none; }
+    dialog[data-mobile-drawer="true"]::backdrop {
+      background: oklch(0.07 0.02 258 / 0.72);
+      animation: viewer-drawer-backdrop-in 160ms ease-out;
+    }
+    dialog[data-mobile-drawer="true"][open] {
+      animation: viewer-drawer-in 180ms ease-out;
+    }
+    @keyframes viewer-drawer-in {
+      from { transform: translateX(-100%); }
+      to { transform: translateX(0); }
+    }
+    @keyframes viewer-drawer-backdrop-in {
+      from { background: transparent; }
+      to { background: oklch(0.07 0.02 258 / 0.72); }
+    }
+    @media (prefers-reduced-motion: reduce) {
+      dialog[data-mobile-drawer="true"][open],
+      dialog[data-mobile-drawer="true"]::backdrop { animation: none; }
+    }
   `;
 }
 //# sourceMappingURL=styles.js.map

package/dist/viewer/styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/viewer/styles.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,SAAS;IACxB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6FL,CAAC;AACJ,CAAC"}
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../src/viewer/styles.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,SAAS;IACxB,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAgHL,CAAC;AACJ,CAAC"}

package/dist/viewer/stylex.css

@@ -114,6 +114,10 @@
     padding: .65rem .7rem;
   }
 
+  .x1ri45tz {
+    padding: .65rem .85rem;
+  }
+
   .x1i4hug3 {
     padding: .65rem .8rem;
   }
@@ -571,6 +575,11 @@
     box-shadow: 0 1px 2px lab(.441307% .0500679 -1.52896 / .35);
   }
 
+  .x11t4c4f {
+    box-shadow: 0 1rem 3rem #00010373;
+    box-shadow: 0 1rem 3rem lab(.180326% .0797361 -.947684 / .45);
+  }
+
   .x1gnnqk1 {
     box-shadow: none;
   }
@@ -758,6 +767,14 @@
     font-size: 1.08rem;
   }
 
+  .x1gqo1bu {
+    font-size: 1.15rem;
+  }
+
+  .x1jchvi3 {
+    font-size: 1rem;
+  }
+
   .x1t69poc {
     font-size: clamp(1.08rem, 1.5vw, 1.3rem);
   }
@@ -838,6 +855,10 @@
     grid-template-columns: minmax(0, 1fr) max-content;
   }
 
+  .x1mkdm3x {
+    grid-template-columns: minmax(0, 1fr);
+  }
+
   .x190l7ji {
     grid-template-columns: minmax(7.5rem, .3fr) minmax(0, 1fr);
   }
@@ -850,6 +871,10 @@
     grid-template-columns: repeat(auto-fit, minmax(6rem, 1fr));
   }
 
+  .x16p6thf {
+    grid-template-rows: auto minmax(0, 1fr);
+  }
+
   .xl56j7k {
     justify-content: center;
   }
@@ -886,6 +911,10 @@
     letter-spacing: -.025em;
   }
 
+  .x72az59 {
+    letter-spacing: -.02em;
+  }
+
   .x1yf5rgg {
     letter-spacing: .01em;
   }
@@ -978,6 +1007,10 @@
     position: fixed;
   }
 
+  .x7wzq59 {
+    position: sticky;
+  }
+
   .x1rohswg {
     scrollbar-width: none;
   }
@@ -1018,6 +1051,10 @@
     z-index: 10;
   }
 
+  .xhtitgo {
+    z-index: 2;
+  }
+
   .x784prv:focus-visible {
     outline-width: 2px;
   }
@@ -1088,8 +1125,8 @@
     }
   }
 
-  @media (width >= 620.01px) and (width <= 820px) {
-    .xoh86gq.xoh86gq {
+  @media (width <= 820px) {
+    .x17wzt7p.x17wzt7p {
       grid-template-columns: 14rem minmax(0, 1fr);
     }
   }
@@ -1183,10 +1220,18 @@
     height: 1.8rem;
   }
 
+  .x5yr21d {
+    height: 100%;
+  }
+
   .xtdtrs8 {
     height: 100dvh;
   }
 
+  .x12hms15 {
+    height: 2.75rem;
+  }
+
   .x1hagigm {
     height: 7px;
   }
@@ -1259,6 +1304,10 @@
     max-width: 88rem;
   }
 
+  .x1x1rfll {
+    max-width: none;
+  }
+
   .x2lwn1j {
     min-height: 0;
   }
@@ -1319,6 +1368,10 @@
     top: .75rem;
   }
 
+  .x13vifvy {
+    top: 0;
+  }
+
   .x1tkjwfh {
     width: .28rem;
   }
@@ -1347,6 +1400,10 @@
     width: 100%;
   }
 
+  .xb1qrhf {
+    width: 2.75rem;
+  }
+
   .x1xb5dxl {
     width: 2.8rem;
   }
@@ -1359,18 +1416,12 @@
     width: fit-content;
   }
 
-  .xgfx6k7 {
-    width: min(86%, 46rem);
+  .x2u06rm {
+    width: min(22rem, 100vw - 2.75rem);
   }
 
-  @media (width <= 620px) {
-    .xvfkbv4.xvfkbv4 {
-      height: auto;
-    }
-
-    .xjkoizw.xjkoizw {
-      max-height: 18rem;
-    }
+  .xgfx6k7 {
+    width: min(86%, 46rem);
   }
 }
 

package/dist/viewer/v2-client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"v2-client.d.ts","sourceRoot":"","sources":["../../src/viewer/v2-client.tsx"],"names":[],"mappings":"AA4DA,KAAK,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AA2ChD,eAAO,MAAM,YAAY,uuCAnBC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAA;CAAE,msDAqBzF,CAAC"}
+{"version":3,"file":"v2-client.d.ts","sourceRoot":"","sources":["../../src/viewer/v2-client.tsx"],"names":[],"mappings":"AAgEA,KAAK,QAAQ,GAAG,SAAS,GAAG,OAAO,GAAG,SAAS,CAAC;AA4ChD,eAAO,MAAM,YAAY,uuCAnBC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAG;IAAE,SAAS,CAAC,EAAE,MAAM,CAAC;IAAC,IAAI,CAAC,EAAE,QAAQ,CAAA;CAAE,msDAqBzF,CAAC"}

package/dist/viewer/v2-client.js

@@ -2,7 +2,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
 import * as stylex from "@stylexjs/stylex";
 import { useMutation, useQueries, useQuery, useQueryClient } from "@tanstack/react-query";
 import { createRootRoute, createRoute, createRouter, Link, Outlet, useNavigate, } from "@tanstack/react-router";
-import { createContext, useContext, useId, useState, } from "react";
+import { createContext, useCallback, useContext, useEffect, useId, useRef, useState, } from "react";
 import Markdown from "react-markdown";
 import { viewerApi } from "./generated-api.js";
 import { assertionComparison, conversationPlaceholder, preferredExecutionId, stripAnsi, } from "./presentation.js";
@@ -14,6 +14,7 @@ const runningPulse = stylex.keyframes({
 });
 const CAMEL_CASE_BOUNDARY = /([a-z])([A-Z])/g;
 const INITIAL_CHARACTER = /^./;
+const NARROW_VIEWER_QUERY = "(max-width: 820px)";
 const WorkerContext = createContext({ workers: 1, setWorkers: () => undefined });
 const rootRoute = createRootRoute({ component: ViewerLayout });
 const indexRoute = createRoute({
@@ -69,11 +70,11 @@ const styles = stylex.create({
         gridTemplateColumns: {
             default: "18rem minmax(0, 1fr)",
             "@media (max-width: 820px)": "14rem minmax(0, 1fr)",
-            "@media (max-width: 620px)": "1fr",
         },
         height: "100dvh",
         minHeight: 0,
     },
+    shellNarrow: { gridTemplateColumns: "minmax(0, 1fr)", gridTemplateRows: "auto minmax(0, 1fr)" },
     shellCollapsed: { gridTemplateColumns: "3.75rem minmax(0, 1fr)" },
     sidebar: {
         borderRight: "1px solid var(--border)",
@@ -83,10 +84,54 @@ const styles = stylex.create({
         padding: "1rem 0 0",
         backgroundColor: "var(--sidebar)",
         minHeight: 0,
-        height: { default: "100dvh", "@media (max-width: 620px)": "auto" },
-        maxHeight: { default: "none", "@media (max-width: 620px)": "18rem" },
+        height: "100dvh",
     },
     sidebarCollapsed: { paddingTop: "1rem", height: "100dvh", maxHeight: "none" },
+    mobileHeader: {
+        position: "sticky",
+        top: 0,
+        zIndex: 2,
+        display: "flex",
+        alignItems: "center",
+        gap: "0.75rem",
+        minWidth: 0,
+        padding: "0.65rem 0.85rem",
+        borderBottom: "1px solid var(--border)",
+        backgroundColor: "var(--sidebar)",
+    },
+    mobileMenuButton: {
+        width: "2.75rem",
+        height: "2.75rem",
+        padding: 0,
+        borderRadius: 9,
+        backgroundColor: { default: "var(--panel-2)", ":hover": "var(--panel-3)" },
+        color: "var(--text)",
+        fontSize: "1.15rem",
+        cursor: "pointer",
+    },
+    mobileHeaderIdentity: { display: "flex", alignItems: "center", gap: "0.6rem", minWidth: 0 },
+    mobileHeaderTitle: { fontSize: "1rem", fontWeight: 720, letterSpacing: "-0.02em" },
+    mobileDrawerDialog: {
+        width: "min(22rem, calc(100vw - 2.75rem))",
+        maxWidth: "none",
+        height: "100dvh",
+        maxHeight: "none",
+        margin: 0,
+        padding: 0,
+        borderWidth: 0,
+        backgroundColor: "var(--sidebar)",
+        color: "var(--text)",
+        overflow: "hidden",
+    },
+    mobileDrawerSurface: {
+        display: "flex",
+        flexDirection: "column",
+        height: "100%",
+        minHeight: 0,
+        paddingTop: "1rem",
+        backgroundColor: "var(--sidebar)",
+        boxShadow: "0 1rem 3rem oklch(0.06 0.02 258 / 0.45)",
+    },
     main: {
         overflow: "auto",
         minWidth: 0,
@@ -139,6 +184,7 @@ const styles = stylex.create({
         lineHeight: 1,
         boxShadow: "none",
     },
+    mobileCloseButton: { width: "2.75rem", height: "2.75rem", fontSize: "1.15rem" },
     sidebarTitleRow: {
         display: "flex",
         alignItems: "center",
@@ -1102,20 +1148,74 @@ const styles = stylex.create({
 });
 function ViewerLayout() {
     const [sidebarOpen, setSidebarOpen] = useState(true);
+    const [drawerOpen, setDrawerOpen] = useState(false);
     const [workers, setWorkers] = useState(1);
-    return (_jsx(WorkerContext.Provider, { value: { workers, setWorkers }, children: _jsxs("div", { ...stylex.props(styles.shell, !sidebarOpen && styles.shellCollapsed), children: [_jsx("a", { href: "#viewer-main", ...stylex.props(styles.skipLink), children: "Skip to content" }), _jsx(ViewerSidebar, { open: sidebarOpen, onToggle: () => setSidebarOpen((open) => !open) }), _jsx("main", { id: "viewer-main", tabIndex: -1, ...stylex.props(styles.main), children: _jsx(Outlet, {}) })] }) }));
+    const narrow = useNarrowViewer();
+    const menuButton = useRef(null);
+    const closeDrawer = useCallback(() => setDrawerOpen(false), []);
+    useEffect(() => {
+        if (!narrow)
+            setDrawerOpen(false);
+    }, [narrow]);
+    return (_jsx(WorkerContext.Provider, { value: { workers, setWorkers }, children: _jsxs("div", { ...stylex.props(styles.shell, narrow && styles.shellNarrow, !narrow && !sidebarOpen && styles.shellCollapsed), children: [_jsx("a", { href: "#viewer-main", ...stylex.props(styles.skipLink), children: "Skip to content" }), narrow ? (_jsxs(_Fragment, { children: [_jsx(MobileViewerHeader, { buttonRef: menuButton, open: drawerOpen, onOpen: () => setDrawerOpen(true) }), _jsx(MobileTestDrawer, { open: drawerOpen, onClose: closeDrawer })] })) : (_jsx(ViewerSidebar, { open: sidebarOpen, onToggle: () => setSidebarOpen((open) => !open) })), _jsx("main", { id: "viewer-main", tabIndex: -1, ...stylex.props(styles.main), children: _jsx(Outlet, {}) })] }) }));
+}
+function useNarrowViewer() {
+    const [narrow, setNarrow] = useState(() => window.matchMedia(NARROW_VIEWER_QUERY).matches);
+    useEffect(() => {
+        const query = window.matchMedia(NARROW_VIEWER_QUERY);
+        const update = () => setNarrow(query.matches);
+        update();
+        query.addEventListener("change", update);
+        return () => query.removeEventListener("change", update);
+    }, []);
+    return narrow;
 }
 function useCatalog() {
     return useQuery({ queryKey: ["test-catalog"], queryFn: fetchTestCatalog });
 }
+function MobileViewerHeader({ buttonRef, open, onOpen, }) {
+    const catalog = useCatalog();
+    return (_jsxs("header", { ...stylex.props(styles.mobileHeader), children: [_jsx("button", { ref: buttonRef, type: "button", "aria-haspopup": "dialog", "aria-controls": "mobile-test-drawer", "aria-expanded": open, "aria-label": "Open test menu", ...stylex.props(styles.buttonReset, styles.mobileMenuButton), onClick: onOpen, children: _jsx("span", { "aria-hidden": "true", children: "\u2630" }) }), _jsxs("div", { ...stylex.props(styles.mobileHeaderIdentity), children: [_jsx("span", { ...stylex.props(styles.mobileHeaderTitle), children: "Tests" }), _jsx("span", { ...stylex.props(styles.countBadge), children: catalog.data?.tests.length ?? 0 })] })] }));
+}
+function MobileTestDrawer({ open, onClose }) {
+    const dialog = useRef(null);
+    useEffect(() => {
+        const element = dialog.current;
+        if (!element)
+            return;
+        const closeOnBackdrop = (event) => {
+            if (event.target === element)
+                onClose();
+        };
+        element.addEventListener("click", closeOnBackdrop);
+        let focusFrame;
+        if (open && !element.open) {
+            element.showModal();
+            focusFrame = requestAnimationFrame(() => {
+                element.querySelector("[data-drawer-close]")?.focus();
+            });
+        }
+        if (!open && element.open)
+            element.close();
+        return () => {
+            element.removeEventListener("click", closeOnBackdrop);
+            if (focusFrame !== undefined)
+                cancelAnimationFrame(focusFrame);
+        };
+    }, [onClose, open]);
+    return (_jsx("dialog", { ref: dialog, id: "mobile-test-drawer", "data-mobile-drawer": "true", "aria-labelledby": "mobile-tests-title", ...stylex.props(styles.mobileDrawerDialog), onCancel: onClose, onClose: onClose, children: _jsx("div", { ...stylex.props(styles.mobileDrawerSurface), children: _jsx(ViewerSidebarContent, { mode: "mobile", headingId: "mobile-tests-title", navigationId: "mobile-test-navigation", onClose: onClose }) }) }));
+}
 function ViewerSidebar({ open, onToggle }) {
+    return (_jsx("aside", { ...stylex.props(styles.sidebar, !open && styles.sidebarCollapsed), children: _jsx(ViewerSidebarContent, { mode: "desktop", open: open, navigationId: "test-navigation", onToggle: onToggle }) }));
+}
+function ViewerSidebarContent({ mode, open = true, headingId, navigationId, onToggle, onClose, }) {
     const catalog = useCatalog();
     const history = useExecutionHistory();
     const groups = groupTests(catalog.data?.tests ?? []);
     const statuses = latestTestStatuses(history.data ?? []);
-    return (_jsxs("aside", { ...stylex.props(styles.sidebar, !open && styles.sidebarCollapsed), children: [_jsx(SidebarHeader, { open: open, count: catalog.data?.tests.length ?? 0, onToggle: onToggle }), open ? (_jsx(SidebarNavigation, { groups: groups, statuses: statuses, error: catalog.isError })) : null] }));
+    return (_jsxs(_Fragment, { children: [_jsx(SidebarHeader, { mode: mode, open: open, count: catalog.data?.tests.length ?? 0, headingId: headingId, navigationId: navigationId, onToggle: mode === "mobile" ? onClose : onToggle, onNavigate: onClose }), open ? (_jsx(SidebarNavigation, { groups: groups, statuses: statuses, error: catalog.isError, navigationId: navigationId, onNavigate: onClose })) : null] }));
 }
-function SidebarHeader({ open, count, onToggle, }) {
+function SidebarHeader({ mode, open, count, headingId, navigationId, onToggle, onNavigate, }) {
     const { workers } = useContext(WorkerContext);
     const navigate = useNavigate();
     const client = useQueryClient();
@@ -1124,9 +1224,10 @@ function SidebarHeader({ open, count, onToggle, }) {
         onSuccess: ({ executionId }) => {
             void client.invalidateQueries({ queryKey: ["execution-history"] });
             void navigate({ to: "/executions/$executionId", params: { executionId } });
+            onNavigate?.();
         },
     });
-    return (_jsx("header", { ...stylex.props(styles.sidebarHeader, !open && styles.sidebarHeaderCollapsed), children: open ? (_jsxs(_Fragment, { children: [_jsxs("div", { ...stylex.props(styles.sidebarTitleRow), children: [_jsxs("div", { ...stylex.props(styles.sidebarTitleIdentity), children: [_jsx("h1", { ...stylex.props(styles.title, styles.sidebarTitle), children: "Tests" }), _jsx("span", { ...stylex.props(styles.countBadge), children: count })] }), _jsx(SidebarToggle, { open: open, onToggle: onToggle })] }), _jsxs("div", { ...stylex.props(styles.suiteControls), children: [_jsxs("button", { type: "button", ...stylex.props(styles.buttonReset, styles.suiteRunButton), onClick: () => run.mutate(), disabled: run.isPending || count === 0, children: [_jsx("span", { "aria-hidden": "true", children: run.isPending ? "●" : "▶" }), run.isPending ? "Starting suite…" : "Run all tests"] }), _jsx(WorkerControl, {})] }), run.isError ? _jsx("p", { role: "alert", children: run.error.message }) : null] })) : (_jsx(SidebarToggle, { open: open, onToggle: onToggle })) }));
+    return (_jsx("header", { ...stylex.props(styles.sidebarHeader, !open && styles.sidebarHeaderCollapsed), children: open ? (_jsxs(_Fragment, { children: [_jsxs("div", { ...stylex.props(styles.sidebarTitleRow), children: [_jsxs("div", { ...stylex.props(styles.sidebarTitleIdentity), children: [_jsx("h1", { id: headingId, ...stylex.props(styles.title, styles.sidebarTitle), children: "Tests" }), _jsx("span", { ...stylex.props(styles.countBadge), children: count })] }), _jsx(SidebarToggle, { mode: mode, open: open, navigationId: navigationId, onToggle: onToggle })] }), _jsxs("div", { ...stylex.props(styles.suiteControls), children: [_jsxs("button", { type: "button", ...stylex.props(styles.buttonReset, styles.suiteRunButton), onClick: () => run.mutate(), disabled: run.isPending || count === 0, children: [_jsx("span", { "aria-hidden": "true", children: run.isPending ? "●" : "▶" }), run.isPending ? "Starting suite…" : "Run all tests"] }), _jsx(WorkerControl, {})] }), run.isError ? _jsx("p", { role: "alert", children: run.error.message }) : null] })) : (_jsx(SidebarToggle, { mode: mode, open: open, navigationId: navigationId, onToggle: onToggle })) }));
 }
 function WorkerControl() {
     const { workers, setWorkers } = useContext(WorkerContext);
@@ -1136,13 +1237,14 @@ function WorkerControl() {
                         setWorkers(Math.min(32, Math.max(1, next)));
                 } })] }));
 }
-function SidebarToggle({ open, onToggle }) {
-    return (_jsx("button", { type: "button", "aria-controls": "test-navigation", "aria-expanded": open, "aria-label": open ? "Collapse test sidebar" : "Expand test sidebar", ...stylex.props(styles.buttonReset, styles.toggleButton), onClick: onToggle, children: open ? "←" : "→" }));
+function SidebarToggle({ mode, open, navigationId, onToggle, }) {
+    const mobile = mode === "mobile";
+    return (_jsx("button", { type: "button", "data-drawer-close": mobile ? "true" : undefined, "aria-controls": navigationId, "aria-expanded": open, "aria-label": mobile ? "Close test menu" : open ? "Collapse test sidebar" : "Expand test sidebar", ...stylex.props(styles.buttonReset, styles.toggleButton, mobile && styles.mobileCloseButton), onClick: onToggle, children: mobile ? "×" : open ? "←" : "→" }));
 }
-function SidebarNavigation({ groups, statuses, error, }) {
-    return (_jsxs(_Fragment, { children: [error ? _jsx("p", { role: "alert", children: "Test discovery is unavailable." }) : null, _jsx("nav", { id: "test-navigation", "aria-label": "Tests", ...stylex.props(styles.navigation), children: [...groups].map(([name, tests]) => (_jsxs("section", { "aria-label": `${name} tests`, ...stylex.props(styles.navSection), children: [_jsxs("div", { ...stylex.props(styles.groupHeader), children: [_jsx("strong", { ...stylex.props(styles.groupLabel), children: name }), _jsxs("div", { ...stylex.props(styles.groupHeaderActions), children: [_jsx("span", { ...stylex.props(styles.groupCount), children: tests.length }), _jsx(RunTestGroupButton, { name: name, tests: tests })] })] }), tests.map((test) => (_jsx(TestLink, { test: test, status: statuses.get(test.id) }, test.id)))] }, name))) })] }));
+function SidebarNavigation({ groups, statuses, error, navigationId, onNavigate, }) {
+    return (_jsxs(_Fragment, { children: [error ? _jsx("p", { role: "alert", children: "Test discovery is unavailable." }) : null, _jsx("nav", { id: navigationId, "aria-label": "Tests", ...stylex.props(styles.navigation), children: [...groups].map(([name, tests]) => (_jsxs("section", { "aria-label": `${name} tests`, ...stylex.props(styles.navSection), children: [_jsxs("div", { ...stylex.props(styles.groupHeader), children: [_jsx("strong", { ...stylex.props(styles.groupLabel), children: name }), _jsxs("div", { ...stylex.props(styles.groupHeaderActions), children: [_jsx("span", { ...stylex.props(styles.groupCount), children: tests.length }), _jsx(RunTestGroupButton, { name: name, tests: tests, onNavigate: onNavigate })] })] }), tests.map((test) => (_jsx(TestLink, { test: test, status: statuses.get(test.id), onNavigate: onNavigate }, test.id)))] }, name))) })] }));
 }
-function RunTestGroupButton({ name, tests }) {
+function RunTestGroupButton({ name, tests, onNavigate, }) {
     const { workers } = useContext(WorkerContext);
     const navigate = useNavigate();
     const client = useQueryClient();
@@ -1151,12 +1253,13 @@ function RunTestGroupButton({ name, tests }) {
         onSuccess: ({ executionId }) => {
             void client.invalidateQueries({ queryKey: ["execution-history"] });
             void navigate({ to: "/executions/$executionId", params: { executionId } });
+            onNavigate?.();
         },
     });
     return (_jsx("button", { type: "button", "aria-label": `Run ${name} suite`, title: `Run ${name} suite`, ...stylex.props(styles.buttonReset, styles.groupRunButton), onClick: () => run.mutate(), disabled: run.isPending, children: run.isPending ? "●" : "▶" }));
 }
-function TestLink({ test, status }) {
-    return (_jsxs(Link, { to: "/tests/$testId", params: { testId: test.id }, search: {}, ...stylex.props(styles.navLink), activeProps: stylex.props(styles.navLink, styles.active), children: [_jsxs("div", { ...stylex.props(styles.navItemHeader), children: [status ? _jsx(TestStatus, { status: status }) : _jsx("span", { "aria-hidden": "true" }), _jsx("span", { ...stylex.props(styles.navItemTitle), children: test.title.at(-1) })] }), test.project !== "default" ? _jsx("div", { ...stylex.props(styles.meta), children: test.project }) : null] }));
+function TestLink({ test, status, onNavigate, }) {
+    return (_jsxs(Link, { to: "/tests/$testId", params: { testId: test.id }, search: {}, ...stylex.props(styles.navLink), activeProps: stylex.props(styles.navLink, styles.active), onClick: onNavigate, children: [_jsxs("div", { ...stylex.props(styles.navItemHeader), children: [status ? _jsx(TestStatus, { status: status }) : _jsx("span", { "aria-hidden": "true" }), _jsx("span", { ...stylex.props(styles.navItemTitle), children: test.title.at(-1) })] }), test.project !== "default" ? _jsx("div", { ...stylex.props(styles.meta), children: test.project }) : null] }));
 }
 function TestStatus({ status }) {
     return (_jsx("span", { role: "img", "aria-label": `Latest execution: ${status}`, title: `Latest execution: ${status}`, ...stylex.props(styles.navStatus), children: _jsx("span", { "aria-hidden": "true", ...stylex.props(styles.navStatusDot, status === "passed" && styles.navStatusDotPass, status === "failed" && styles.navStatusDotFail, status === "running" && styles.navStatusDotRunning) }) }));