@crvouga/atlas 0.12.0 → 0.14.0

package/packages/server/openapi.json

@@ -7575,6 +7575,36 @@
                         "modified"
                       ]
                     },
+                    "run": {
+                      "description": "The execution the producer named for it (one local or manual invocation). Grouping and display only; never part of the slot",
+                      "type": "object",
+                      "properties": {
+                        "id": {
+                          "type": "string",
+                          "minLength": 1,
+                          "maxLength": 256,
+                          "description": "The execution's identity within a project, chosen by the producer: a UUID, a timestamped name. Layers with the same id are one run; it never changes after it is recorded"
+                        },
+                        "title": {
+                          "description": "A human name for the run. Presentation only: it is not part of the identity and does not hide the commit or `freshness`",
+                          "type": "string"
+                        },
+                        "startedAtMs": {
+                          "description": "When the execution started, epoch milliseconds",
+                          "type": "number",
+                          "minimum": 0
+                        },
+                        "endedAtMs": {
+                          "description": "When the execution ended, epoch milliseconds",
+                          "type": "number",
+                          "minimum": 0
+                        }
+                      },
+                      "required": [
+                        "id"
+                      ],
+                      "additionalProperties": {}
+                    },
                     "recording": {
                       "anyOf": [
                         {},
@@ -8018,6 +8048,36 @@
                         "modified"
                       ]
                     },
+                    "run": {
+                      "description": "The execution the producer named for it (one local or manual invocation). Grouping and display only; never part of the slot",
+                      "type": "object",
+                      "properties": {
+                        "id": {
+                          "type": "string",
+                          "minLength": 1,
+                          "maxLength": 256,
+                          "description": "The execution's identity within a project, chosen by the producer: a UUID, a timestamped name. Layers with the same id are one run; it never changes after it is recorded"
+                        },
+                        "title": {
+                          "description": "A human name for the run. Presentation only: it is not part of the identity and does not hide the commit or `freshness`",
+                          "type": "string"
+                        },
+                        "startedAtMs": {
+                          "description": "When the execution started, epoch milliseconds",
+                          "type": "number",
+                          "minimum": 0
+                        },
+                        "endedAtMs": {
+                          "description": "When the execution ended, epoch milliseconds",
+                          "type": "number",
+                          "minimum": 0
+                        }
+                      },
+                      "required": [
+                        "id"
+                      ],
+                      "additionalProperties": {}
+                    },
                     "recording": {
                       "anyOf": [
                         {},
@@ -9683,6 +9743,36 @@
               "modified"
             ]
           },
+          "run": {
+            "description": "Name the execution these checks belong to, so repeated local runs at one commit stay separate runs and shards of one execution stay together",
+            "type": "object",
+            "properties": {
+              "id": {
+                "type": "string",
+                "minLength": 1,
+                "maxLength": 256,
+                "description": "The execution's identity within a project, chosen by the producer: a UUID, a timestamped name. Layers with the same id are one run; it never changes after it is recorded"
+              },
+              "title": {
+                "description": "A human name for the run. Presentation only: it is not part of the identity and does not hide the commit or `freshness`",
+                "type": "string"
+              },
+              "startedAtMs": {
+                "description": "When the execution started, epoch milliseconds",
+                "type": "number",
+                "minimum": 0
+              },
+              "endedAtMs": {
+                "description": "When the execution ended, epoch milliseconds",
+                "type": "number",
+                "minimum": 0
+              }
+            },
+            "required": [
+              "id"
+            ],
+            "additionalProperties": {}
+          },
           "specs": {
             "default": [],
             "type": "array",
@@ -10171,6 +10261,36 @@
                     "modified"
                   ]
                 },
+                "run": {
+                  "description": "The execution the producer named for it (one local or manual invocation). Grouping and display only; never part of the slot",
+                  "type": "object",
+                  "properties": {
+                    "id": {
+                      "type": "string",
+                      "minLength": 1,
+                      "maxLength": 256,
+                      "description": "The execution's identity within a project, chosen by the producer: a UUID, a timestamped name. Layers with the same id are one run; it never changes after it is recorded"
+                    },
+                    "title": {
+                      "description": "A human name for the run. Presentation only: it is not part of the identity and does not hide the commit or `freshness`",
+                      "type": "string"
+                    },
+                    "startedAtMs": {
+                      "description": "When the execution started, epoch milliseconds",
+                      "type": "number",
+                      "minimum": 0
+                    },
+                    "endedAtMs": {
+                      "description": "When the execution ended, epoch milliseconds",
+                      "type": "number",
+                      "minimum": 0
+                    }
+                  },
+                  "required": [
+                    "id"
+                  ],
+                  "additionalProperties": {}
+                },
                 "recording": {
                   "anyOf": [
                     {},
@@ -13747,7 +13867,23 @@
               "properties": {
                 "key": {
                   "type": "string",
-                  "description": "The run URL, or `branch@sha`. Pass it to `/api/reports/runs/detail?key=` or `/api/reports/tests?run=`"
+                  "description": "`run:<id>` for an execution a producer named, else the run URL, else `branch@sha`. Pass it to `/api/reports/runs/detail?key=` or `/api/reports/tests?run=`"
+                },
+                "runId": {
+                  "description": "The execution id the producer named, when it did. Layers that share it are one run however many uploads they took",
+                  "type": "string"
+                },
+                "title": {
+                  "description": "The human title of the execution (the newest layer's). Presentation only: the key, commit and `freshness` are unaffected",
+                  "type": "string"
+                },
+                "freshness": {
+                  "description": "`modified` when any layer of the run was recorded from a checkout with uncommitted changes; `unknown` when an origin was not captured; absent when all are clean. Shown beside the commit, never replaced by the title",
+                  "type": "string",
+                  "enum": [
+                    "unknown",
+                    "modified"
+                  ]
                 },
                 "runUrl": {
                   "type": [
@@ -13901,7 +14037,23 @@
             "properties": {
               "key": {
                 "type": "string",
-                "description": "The run URL, or `branch@sha`. Pass it to `/api/reports/runs/detail?key=` or `/api/reports/tests?run=`"
+                "description": "`run:<id>` for an execution a producer named, else the run URL, else `branch@sha`. Pass it to `/api/reports/runs/detail?key=` or `/api/reports/tests?run=`"
+              },
+              "runId": {
+                "description": "The execution id the producer named, when it did. Layers that share it are one run however many uploads they took",
+                "type": "string"
+              },
+              "title": {
+                "description": "The human title of the execution (the newest layer's). Presentation only: the key, commit and `freshness` are unaffected",
+                "type": "string"
+              },
+              "freshness": {
+                "description": "`modified` when any layer of the run was recorded from a checkout with uncommitted changes; `unknown` when an origin was not captured; absent when all are clean. Shown beside the commit, never replaced by the title",
+                "type": "string",
+                "enum": [
+                  "unknown",
+                  "modified"
+                ]
               },
               "runUrl": {
                 "type": [

package/packages/visualizer/src/evidence/check-detail.tsx

@@ -268,6 +268,10 @@ type Props = {
   reads: 'steps' | 'trace';
   /** The check as written, shown until a recording is read or when there is none. */
   written?: ReactNode;
+  /** An exact earlier result the caller found (for example on a server that only sends winners). It wins over `layerId`. */
+  pinned?: HistoryEntry;
+  /** Choosing a run in the history always names its layer, even when that result is a current one, so the choice stays pinned. */
+  pin?: boolean;
 };
 /** Everything recorded for one check: the chosen result, how it went, and every other run of it. */
 export function CheckDetail(props: Props) {
@@ -298,13 +302,13 @@ export function CheckDetail(props: Props) {
     </>
   );
 }
-function RecordedCheckDetail({ slot, layerId, select, reads, written }: Props) {
+function RecordedCheckDetail({ slot, layerId, select, reads, written, pinned, pin }: Props) {
   const { evidence, backends } = useEvidence();
   const now = useNow();
   const [variant, setVariant] = useState(0);
   const history = useMemo(() => checkHistory(evidence, slot.specPath, slot.id), [evidence, slot.specPath, slot.id]);
   const winner = slot.outcomes[Math.min(variant, slot.outcomes.length - 1)]!;
-  const earlier = layerId ? history.find((entry) => entry.layer.id === layerId) : undefined;
+  const earlier = pinned ?? (layerId ? history.find((entry) => entry.layer.id === layerId) : undefined);
   const chosen: HistoryEntry = earlier ?? { layer: winner.layer, row: winner.row };
   const superseded = !slot.outcomes.some((outcome) => outcome.layer.id === chosen.layer.id);
   const { paths, report } = useRecordedReport(chosen);
@@ -397,7 +401,7 @@ function RecordedCheckDetail({ slot, layerId, select, reads, written }: Props) {
           {moments > 0 && (
             <Button
               type="button"
-              onClick={() => select({ view: 'recording', check: slot.id, layer: earlier ? chosen.layer.id : null })}
+              onClick={() => select({ view: 'recording', check: slot.id, layer: earlier || variant > 0 ? chosen.layer.id : null })}
               variant="filled"
             >
               Open recording{' '}
@@ -428,7 +432,9 @@ function RecordedCheckDetail({ slot, layerId, select, reads, written }: Props) {
                       type="button"
                       aria-current={current || undefined}
                       onClick={() =>
-                        select({ layer: slot.outcomes.some((outcome) => outcome.layer.id === entry.layer.id) ? null : entry.layer.id })
+                        select({
+                          layer: !pin && slot.outcomes.some((outcome) => outcome.layer.id === entry.layer.id) ? null : entry.layer.id
+                        })
                       }
                       variant="light"
                     >

package/packages/visualizer/src/evidence/recording-page.tsx

@@ -15,6 +15,8 @@ type Props = {
   /** The check whose recording is open, once the combined report holds it. */
   slot: CheckSlot | undefined;
   layerId: string | undefined;
+  /** The exact result to play, when the caller already found it (it wins over `layerId` and the combined winner). */
+  entry?: HistoryEntry | undefined;
   label: string;
   back: string;
   moment: number | null;
@@ -36,14 +38,15 @@ function needsStylesheet(report: RunReport | undefined): boolean {
   return visit(report.steps) || (report.artifacts ?? []).some((artifact) => artifact.media === 'html');
 }
 /** One recorded test, opened in place of its spec. */
-export function RecordingPage({ slot, layerId, label, back, moment, onMoment, onClose }: Props) {
+export function RecordingPage({ slot, layerId, entry, label, back, moment, onMoment, onClose }: Props) {
   const progress = useTestProgress(slot ?? null);
   const { evidence, backends, pending, ready, unavailable } = useEvidence();
   const now = useNow();
   const history = useMemo(() => (slot ? checkHistory(evidence, slot.specPath, slot.id) : []), [evidence, slot]);
   const winner = slot?.outcomes[0];
   const chosen: HistoryEntry | null =
-    (layerId ? history.find((entry) => entry.layer.id === layerId) : undefined) ??
+    entry ??
+    (layerId ? history.find((earlier) => earlier.layer.id === layerId) : undefined) ??
     (winner ? { layer: winner.layer, row: winner.row } : null);
   const { paths, report } = useRecordedReport(chosen);
   const wantsCss = needsStylesheet(report.data);

package/packages/visualizer/src/explorer/Explorer.tsx

@@ -143,7 +143,7 @@ export function Explorer() {
           {model && model.tests.length > 0 && (
             <Tabs
               value={search.tab ?? 'tests'}
-              onChange={(value) => go({ tab: value === 'runs' ? 'runs' : undefined, test: undefined, openRun: undefined })}
+              onChange={(value) => go({ tab: value === 'runs' ? 'runs' : undefined, test: undefined, openRun: undefined, layer: undefined })}
             >
               <Tabs.List aria-label="Explorer view">
                 <Tabs.Tab
@@ -247,7 +247,7 @@ export function Explorer() {
             </>
           ))}
       </Box>
-      <Drawer opened={split} onClose={() => go({ test: undefined })} title="Test detail" size="xl">
+      <Drawer opened={split} onClose={() => go({ test: undefined, layer: undefined })} title="Test detail" size="xl">
         <Box aria-label="Test detail" component="aside">
           {selected ? (
             <TestDetail test={selected} slot={slots.get(selected.key)} />
@@ -258,7 +258,7 @@ export function Explorer() {
               </Alert>
               <Anchor
                 renderRoot={(props) => (
-                  <Link {...props} to="/" search={patched({ test: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
+                  <Link {...props} to="/" search={patched({ test: undefined, layer: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
                 )}
               >
                 Close
@@ -358,7 +358,7 @@ function InsightStrip({ model, scope, search }: { model: CatalogModel; scope: re
                 <Link
                   {...props}
                   to="/"
-                  search={patched({ tab: 'runs', test: undefined })}
+                  search={patched({ tab: 'runs', test: undefined, layer: undefined })}
                   resetScroll={false}
                   activeOptions={{ exact: true }}
                 />
@@ -443,7 +443,7 @@ function MoreInsights({ scope }: { scope: readonly TestSummary[] }) {
             <List.Item key={test.key}>
               <Anchor
                 renderRoot={(props) => (
-                  <Link {...props} to="/" search={patched({ test: test.key })} resetScroll={false} activeOptions={{ exact: true }} />
+                  <Link {...props} to="/" search={patched({ test: test.key, layer: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
                 )}
               >
                 <StatusMark status={test.status} size={12} />
@@ -819,7 +819,7 @@ function TestRow({ test, selected, now }: { test: TestSummary; selected: boolean
           <Link
             {...props}
             to="/"
-            search={patched({ test: selected ? undefined : test.key })}
+            search={patched({ test: selected ? undefined : test.key, layer: undefined })}
             resetScroll={false}
             activeOptions={{ exact: true }}
           />

package/packages/visualizer/src/explorer/RunsView.tsx

@@ -23,6 +23,19 @@ export function RunsView() {
   const search = useExplorerSearch();
   return search.openRun ? <RunDetailView runKey={search.openRun} /> : <RunTable />;
 }
+/** What a run is called: the title its producer gave it, else its CI run number or `branch@sha`. */
+function runLabel(run: RunSummary): string {
+  return run.title ?? runName(run.key);
+}
+/** Beside a commit: said whenever the run was not recorded from a clean checkout, whatever the run is titled. */
+function Freshness({ run }: { run: RunSummary }) {
+  if (!run.freshness) return null;
+  return (
+    <Text span inherit c="dimmed">
+      {run.freshness === 'modified' ? 'with local changes' : 'origin not captured'}
+    </Text>
+  );
+}
 function Counts({ run }: { run: RunSummary }) {
   return (
     <Text span inherit>
@@ -98,19 +111,24 @@ function RunTable() {
               <Table.Tr key={run.key} data-status={run.counts.failed ? 'failed' : 'passed'}>
                 <Table.Td title={exactTime(run.endedAtMs)}>
                   <Anchor
-                    aria-label={`Open run ${runName(run.key)}`}
+                    aria-label={`Open run ${runLabel(run)}`}
                     renderRoot={(props) => (
                       <Link {...props} to="/" search={patched({ openRun: run.key })} resetScroll={false} activeOptions={{ exact: true }} />
                     )}
                   >
                     {ago(run.endedAtMs, now)}
                   </Anchor>
+                  {run.title && (
+                    <Text c="dimmed" fz="xs">
+                      {run.title}
+                    </Text>
+                  )}
                 </Table.Td>
                 <Table.Td title={run.branch ?? ''} c="dimmed">
                   {run.branch ?? '—'}
                 </Table.Td>
                 <Table.Td>
-                  <Code>{shortSha(run.sha) ?? '—'}</Code>
+                  <Code>{shortSha(run.sha) ?? '—'}</Code> <Freshness run={run} />
                 </Table.Td>
                 <Table.Td>{run.environments.map((env) => environmentLabel(env)).join(', ') || '—'}</Table.Td>
                 <Table.Td>{run.tests}</Table.Td>
@@ -215,10 +233,10 @@ function RunDetailView({ runKey }: { runKey: string }) {
     );
   const { run } = detail.data;
   return (
-    <Box aria-label={`Run ${runName(run.key)}`} component="section" mb="lg">
+    <Box aria-label={`Run ${runLabel(run)}`} component="section" mb="lg">
       {back}
       <Title order={2} mb="sm">
-        Run {runName(run.key)}
+        Run {runLabel(run)}
       </Title>
       <Text component="div">
         {run.branch && (
@@ -227,6 +245,7 @@ function RunDetailView({ runKey }: { runKey: string }) {
           </Text>
         )}
         {run.sha && <Code>{shortSha(run.sha)}</Code>}
+        <Freshness run={run} />
         <Text title={exactTime(run.endedAtMs)} span inherit>
           ended {ago(run.endedAtMs, now)}
         </Text>
@@ -262,7 +281,7 @@ function RunDetailView({ runKey }: { runKey: string }) {
             <Link
               {...props}
               to="/"
-              search={patched({ tab: undefined, openRun: undefined, inRun: run.key, test: undefined })}
+              search={patched({ tab: undefined, openRun: undefined, inRun: run.key, test: undefined, layer: undefined })}
               resetScroll={false}
               activeOptions={{ exact: true }}
             />
@@ -328,7 +347,7 @@ function RunDetailView({ runKey }: { runKey: string }) {
                     <Link
                       {...props}
                       to="/"
-                      search={patched({ tab: undefined, openRun: undefined, test: result.key })}
+                      search={patched({ tab: undefined, openRun: undefined, test: result.key, layer: result.layer })}
                       resetScroll={false}
                       activeOptions={{ exact: true }}
                     />

package/packages/visualizer/src/explorer/TestDetail.tsx

@@ -1,5 +1,5 @@
 import { IconX, IconCircleFilled } from '@tabler/icons-react';
-import { Alert, Anchor, Box, Button, Code, Flex, SimpleGrid, Stack, Table, Text, Title, VisuallyHidden } from '@mantine/core';
+import { Alert, Anchor, Badge, Box, Button, Code, Flex, SimpleGrid, Stack, Table, Text, Title, VisuallyHidden } from '@mantine/core';
 /**
  * @module Test detail
  *
@@ -10,27 +10,127 @@ import { Alert, Anchor, Box, Button, Code, Flex, SimpleGrid, Stack, Table, Text,
  */
 import type { CheckSlot } from '@crvouga/atlas/reports/evidence-view';
 import { environmentLabel } from '@crvouga/atlas/reports/layer-axes';
-import { formatMs, type TestResultEntry, type TestSummary } from '@crvouga/atlas/reports/test-catalog';
+import { formatMs, runKey, type TestResultEntry, type TestSummary } from '@crvouga/atlas/reports/test-catalog';
 import { Link } from '@tanstack/react-router';
 import { lazy, Suspense, useState } from 'react';
-import { CheckDetail, type CheckSelection } from '../evidence/check-detail';
+import { CheckDetail } from '../evidence/check-detail';
 import { ago, exactTime, plural, shortSha, statusWord, useNow } from '../evidence/format';
-import { StatusMark } from '../evidence/marks';
+import { useEvidence } from '../evidence/evidence-context';
+import { Origin, StatusMark } from '../evidence/marks';
 import { useTestHistory } from './catalog';
-import { patched } from './navigate';
-import { Badges } from './parts';
+import { patched, useExplorerNavigate, useExplorerSearch } from './navigate';
+import { Badges, runName } from './parts';
+import { usePinnedResult, type PinnedResult } from './pinned';
 const RecordingPage = lazy(() => import('../evidence/recording-page').then((module) => ({ default: module.RecordingPage })));
 /** Results the history table shows before "Show more". */
 const HISTORY_ROWS = 20;
 function percent(rate: number | null): string {
   return rate === null ? '—' : `${Math.round(rate * 100)}%`;
 }
+/** Switches the detail from one pinned result back to the latest combined evidence. */
+function LatestLink({ children }: { children: string }) {
+  return (
+    <Anchor
+      renderRoot={(props) => (
+        <Link {...props} to="/" search={patched({ layer: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
+      )}
+    >
+      {children}
+    </Anchor>
+  );
+}
+
+/**
+ * Says which evidence the detail shows: this one run's result (pinned by the address), or the latest combined evidence.
+ * The change from one to the other is always an explicit link, so a result never turns into another silently.
+ */
+function Scope({ pinned, slot }: { pinned: PinnedResult; slot: CheckSlot | undefined }) {
+  const { backends } = useEvidence();
+  const now = useNow();
+  if (pinned.state === 'none')
+    return (
+      <Flex aria-label="Evidence scope" role="group" gap="xs" align="center" wrap="wrap" mb="lg">
+        <Badge variant="light">Latest combined evidence</Badge>
+        <Text span inherit c="dimmed">
+          The newest result of each environment, which can come from different runs. Open a run to see exactly what it recorded.
+        </Text>
+      </Flex>
+    );
+  if (pinned.state === 'loading')
+    return (
+      <Text role="status" component="div" c="dimmed" mb="lg">
+        Reading the result of the run you opened…
+      </Text>
+    );
+  if (pinned.state === 'missing')
+    return (
+      <Alert color="blue" title="That result is not available" mb="lg">
+        <Stack gap="xs">
+          <Text span inherit>
+            {pinned.reason} No other result is shown in its place.
+          </Text>
+          <LatestLink>Show latest combined evidence</LatestLink>
+        </Stack>
+      </Alert>
+    );
+  const { layer } = pinned.entry;
+  const newer = slot?.outcomes.find(
+    (outcome) =>
+      outcome.layer.id !== layer.id &&
+      outcome.layer.recordedAtMs > layer.recordedAtMs &&
+      outcome.layer.producer === layer.producer &&
+      outcome.layer.environment === layer.environment &&
+      JSON.stringify(outcome.parameters) === JSON.stringify(pinned.entry.row.variant)
+  );
+  const key = runKey(layer);
+  return (
+    <Alert color="blue" title={`This run: ${runName(key)}`} mb="lg">
+      <Stack gap="xs">
+        <Flex gap="xs" align="center" wrap="wrap">
+          <Text span inherit fw={600}>
+            {layer.producer}
+          </Text>
+          <Origin layer={layer} backends={backends} now={now} />
+        </Flex>
+        <Text span inherit>
+          The evidence below is what this run recorded. The current results, statistics and history are about the latest combined evidence
+          across runs.
+        </Text>
+        {newer && (
+          <Text span inherit role="status">
+            A newer result exists: {statusWord(newer.row.status)} {ago(newer.layer.recordedAtMs, now)}.
+          </Text>
+        )}
+        <Flex gap="md" align="center" wrap="wrap">
+          <LatestLink>Show latest combined evidence</LatestLink>
+          <Anchor
+            renderRoot={(props) => (
+              <Link
+                {...props}
+                to="/"
+                search={patched({ tab: 'runs', openRun: key, test: undefined, layer: undefined })}
+                resetScroll={false}
+                activeOptions={{ exact: true }}
+              />
+            )}
+          >
+            Back to run {runName(key)}
+          </Anchor>
+        </Flex>
+      </Stack>
+    </Alert>
+  );
+}
+
 /** The open test. `slot` is the report's check for it, when the page holds one, for its evidence. */
 export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot | undefined }) {
   const now = useNow();
   const history = useTestHistory(test.key);
-  const [selection, setSelection] = useState<CheckSelection>({});
+  const { layer } = useExplorerSearch();
+  const go = useExplorerNavigate();
+  const pinned = usePinnedResult(layer, test.key);
   const [recording, setRecording] = useState(false);
+  const [recordingLayer, setRecordingLayer] = useState<string | undefined>(undefined);
   const [moment, setMoment] = useState<number | null>(null);
   const [rows, setRows] = useState(HISTORY_ROWS);
   const entries = history.data?.history ?? [];
@@ -47,7 +147,8 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
       >
         <RecordingPage
           slot={slot}
-          layerId={selection.layer}
+          layerId={recordingLayer ?? layer}
+          entry={pinned.state === 'ready' && (recordingLayer ?? layer) === pinned.entry.layer.id ? pinned.entry : undefined}
           label={test.title}
           back="Test detail"
           moment={moment}
@@ -63,7 +164,7 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
         <Anchor
           aria-label="Close the test"
           renderRoot={(props) => (
-            <Link {...props} to="/" search={patched({ test: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
+            <Link {...props} to="/" search={patched({ test: undefined, layer: undefined })} resetScroll={false} activeOptions={{ exact: true }} />
           )}
         >
           <IconX size={20} aria-hidden="true" />
@@ -123,6 +224,8 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
         </Code>
       </Box>
 
+      <Scope pinned={pinned} slot={slot} />
+
       <Box aria-label="Current results" component="section" mb="lg">
         <Title order={3} mb="sm" c="dimmed">
           Current result per environment
@@ -314,21 +417,26 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
 
       <Box aria-label="Evidence" component="section" mb="lg">
         <Title order={3} mb="sm" c="dimmed">
-          What the current result carries
+          {layer ? 'What this run recorded' : 'What the current result carries'}
         </Title>
-        {slot ? (
+        {slot && (!layer || pinned.state === 'ready') ? (
           <CheckDetail
             slot={slot}
-            layerId={selection.layer}
+            layerId={layer}
+            {...(pinned.state === 'ready' ? { pinned: pinned.entry, pin: true } : {})}
             reads="steps"
             select={(patch) => {
-              setSelection({ check: patch.check ?? slot.id, layer: patch.layer ?? undefined });
               if (patch.view === 'recording') {
+                setRecordingLayer(patch.layer ?? undefined);
                 setRecording(true);
                 setMoment(null);
-              }
+              } else go({ layer: patch.layer ?? undefined });
             }}
           />
+        ) : layer ? (
+          <Text component="div" c="dimmed">
+            {pinned.state === 'missing' ? 'There is no evidence to show for that run.' : 'Reading the evidence of that run…'}
+          </Text>
         ) : (
           <Text component="div" c="dimmed">
             The evidence of this result is not loaded in this page.
@@ -362,6 +470,9 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
                   <Table.Th scope="col">Branch</Table.Th>
                   <Table.Th scope="col">Commit</Table.Th>
                   <Table.Th scope="col">Detail</Table.Th>
+                  <Table.Th scope="col">
+                    <VisuallyHidden>Evidence</VisuallyHidden>
+                  </Table.Th>
                 </Table.Tr>
               </Table.Thead>
               <Table.Tbody>
@@ -396,6 +507,23 @@ export function TestDetail({ test, slot }: { test: TestSummary; slot: CheckSlot
                     <Table.Td title={entry.detail} c="dimmed">
                       {entry.detail.split('\n')[0]}
                     </Table.Td>
+                    <Table.Td>
+                      <Anchor
+                        aria-label={`Open the ${statusWord(entry.status)} result recorded ${ago(entry.at, now)} in ${environmentLabel(entry.environment)}`}
+                        aria-current={entry.layer === layer ? 'true' : undefined}
+                        renderRoot={(props) => (
+                          <Link
+                            {...props}
+                            to="/"
+                            search={patched({ layer: entry.layer })}
+                            resetScroll={false}
+                            activeOptions={{ exact: true }}
+                          />
+                        )}
+                      >
+                        Open this result
+                      </Anchor>
+                    </Table.Td>
                   </Table.Tr>
                 ))}
               </Table.Tbody>

package/packages/visualizer/src/explorer/parts.tsx

@@ -21,8 +21,9 @@ export function projectTitle(): string {
       .join(' ') || 'Project reports'
   );
 }
-/** A run key for a person: its CI run number, or `branch@sha` shortened. */
+/** A run key for a person: the execution id a producer named, its CI run number, or `branch@sha` shortened. */
 export function runName(key: string): string {
+  if (key.startsWith('run:')) return key.slice(4);
   const actions = /\/actions\/runs\/(\d+)/.exec(key);
   if (actions) return `#${actions[1]}`;
   if (/^https?:/.test(key)) return key.replace(/^https?:\/\//, '').slice(0, 40);