@storyshelf/app 0.6.2 → 0.8.0

package/dist/pages/admin-system-targets.mjs

@@ -0,0 +1,52 @@
+import "node:path";
+import "node:url";
+import.meta.url;
+import { Badge, Meta } from "../ui/feedback.mjs";
+import { Card, SectionTitle } from "../ui/layout.mjs";
+import { Table } from "../ui/table.mjs";
+import { targetLabel } from "../targets.mjs";
+import { jsx, jsxs } from "hono/jsx/jsx-runtime";
+import { unavailableReason } from "@storyshelf/core/adapter/capture-runner";
+// src/pages/admin-system-targets.tsx
+/** The browsers the capture runner offers and whether each can render now (ADR 0007, decision 7). */
+function CaptureTargetsCard(props) {
+	const { targets } = props;
+	return /* @__PURE__ */ jsxs(Card, { children: [
+		/* @__PURE__ */ jsx(SectionTitle, { children: "Capture browsers" }),
+		/* @__PURE__ */ jsx(Meta, { children: "What the capture runner offers, default first. A project can only pick a target that is ready; a declared engine that is not installed is listed with the reason." }),
+		/* @__PURE__ */ jsx(Table, { children: /* @__PURE__ */ jsxs("table", { children: [/* @__PURE__ */ jsx("thead", { children: /* @__PURE__ */ jsxs("tr", { children: [
+			/* @__PURE__ */ jsx("th", { children: "Target" }),
+			/* @__PURE__ */ jsx("th", { children: "Reaches Storybook" }),
+			/* @__PURE__ */ jsx("th", { children: "Status" })
+		] }) }), /* @__PURE__ */ jsx("tbody", { children: targets.map((entry, index) => {
+			const reason = unavailableReason(entry.status);
+			return /* @__PURE__ */ jsxs("tr", { children: [
+				/* @__PURE__ */ jsxs("td", { children: [
+					/* @__PURE__ */ jsx("strong", { children: targetLabel(entry.target) }),
+					" ",
+					/* @__PURE__ */ jsx(Meta, {
+						as: "span",
+						mono: true,
+						children: entry.target
+					}),
+					index === 0 ? /* @__PURE__ */ jsx(Badge, { children: "default" }) : null
+				] }),
+				/* @__PURE__ */ jsx("td", { children: /* @__PURE__ */ jsx(Meta, {
+					as: "span",
+					children: entry.reach === "url" ? "signed URL" : "local server"
+				}) }),
+				/* @__PURE__ */ jsxs("td", { children: [/* @__PURE__ */ jsx(Badge, {
+					tone: reason === null ? "success" : "danger",
+					icon: true,
+					children: reason === null ? "ready" : "unavailable"
+				}), reason === null ? null : /* @__PURE__ */ jsx(Meta, {
+					as: "div",
+					children: reason
+				})] })
+			] }, entry.target);
+		}) })] }) })
+	] });
+}
+export { CaptureTargetsCard };
+
+//# sourceMappingURL=admin-system-targets.mjs.map

package/dist/pages/admin-system-targets.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"admin-system-targets.mjs","names":[],"sources":["../../src/pages/admin-system-targets.tsx"],"sourcesContent":["import { unavailableReason, type RunnerTarget } from \"@storyshelf/core/adapter/capture-runner\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport { targetLabel } from \"../targets.ts\";\nimport { Badge, Card, Meta, SectionTitle, Table } from \"../ui/components.tsx\";\n\n/* eslint-disable promise-function-async -- Hono JSX components return HtmlEscapedString | Promise<HtmlEscapedString> */\n\n/** The browsers the capture runner offers and whether each can render now (ADR 0007, decision 7). */\nexport function CaptureTargetsCard(props: {\n  targets: readonly RunnerTarget[];\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { targets } = props;\n  return (\n    <Card>\n      <SectionTitle>Capture browsers</SectionTitle>\n      <Meta>\n        What the capture runner offers, default first. A project can only pick a target that is\n        ready; a declared engine that is not installed is listed with the reason.\n      </Meta>\n      <Table>\n        <table>\n          <thead>\n            <tr>\n              <th>Target</th>\n              <th>Reaches Storybook</th>\n              <th>Status</th>\n            </tr>\n          </thead>\n          <tbody>\n            {targets.map((entry, index) => {\n              const reason = unavailableReason(entry.status);\n              return (\n                <tr key={entry.target}>\n                  <td>\n                    <strong>{targetLabel(entry.target)}</strong>{\" \"}\n                    <Meta as=\"span\" mono>\n                      {entry.target}\n                    </Meta>\n                    {index === 0 ? <Badge>default</Badge> : null}\n                  </td>\n                  <td>\n                    <Meta as=\"span\">{entry.reach === \"url\" ? \"signed URL\" : \"local server\"}</Meta>\n                  </td>\n                  <td>\n                    <Badge tone={reason === null ? \"success\" : \"danger\"} icon>\n                      {reason === null ? \"ready\" : \"unavailable\"}\n                    </Badge>\n                    {reason === null ? null : <Meta as=\"div\">{reason}</Meta>}\n                  </td>\n                </tr>\n              );\n            })}\n          </tbody>\n        </table>\n      </Table>\n    </Card>\n  );\n}\n"],"mappings":";;;;;;;;;;;AAQA,SAAgB,mBAAmB,OAEgB;CACjD,MAAM,EAAE,YAAY;CACpB,OACE,qBAAC,MAAD,EAAA,UAAA;EACE,oBAAC,cAAD,EAAA,UAAc,mBAA8B,CAAA;EAC5C,oBAAC,MAAD,EAAA,UAAM,oKAGA,CAAA;EACN,oBAAC,OAAD,EAAA,UACE,qBAAC,SAAD,EAAA,UAAA,CACE,oBAAC,SAAD,EAAA,UACE,qBAAC,MAAD,EAAA,UAAA;GACE,oBAAC,MAAD,EAAA,UAAI,SAAU,CAAA;GACd,oBAAC,MAAD,EAAA,UAAI,oBAAqB,CAAA;GACzB,oBAAC,MAAD,EAAA,UAAI,SAAU,CAAA;EACZ,EAAA,CAAA,EACC,CAAA,GACP,oBAAC,SAAD,EAAA,UACG,QAAQ,KAAK,OAAO,UAAU;GAC7B,MAAM,SAAS,kBAAkB,MAAM,MAAM;GAC7C,OACE,qBAAC,MAAD,EAAA,UAAA;IACE,qBAAC,MAAD,EAAA,UAAA;KACE,oBAAC,UAAD,EAAA,UAAS,YAAY,MAAM,MAAM,EAAU,CAAA;KAAE;KAC7C,oBAAC,MAAD;MAAM,IAAG;MAAO,MAAA;MACb,UAAA,MAAM;KACH,CAAA;KACL,UAAU,IAAI,oBAAC,OAAD,EAAA,UAAO,UAAc,CAAA,IAAI;IACtC,EAAA,CAAA;IACJ,oBAAC,MAAD,EAAA,UACE,oBAAC,MAAD;KAAM,IAAG;KAAQ,UAAA,MAAM,UAAU,QAAQ,eAAe;IAAqB,CAAA,EAC3E,CAAA;IACJ,qBAAC,MAAD,EAAA,UAAA,CACE,oBAAC,OAAD;KAAO,MAAM,WAAW,OAAO,YAAY;KAAU,MAAA;KAClD,UAAA,WAAW,OAAO,UAAU;IACxB,CAAA,GACN,WAAW,OAAO,OAAO,oBAAC,MAAD;KAAM,IAAG;KAAO,UAAA;IAAa,CAAA,CACrD,EAAA,CAAA;GACF,EAAA,GAjBK,MAAM,MAiBX;EAER,CAAC,EACI,CAAA,CACF,EAAA,CAAA,EACF,CAAA;CACH,EAAA,CAAA;AAEV"}

package/dist/pages/admin-system.mjs

@@ -8,8 +8,11 @@ import { HStack } from "../ui/stacks.mjs";
 import { Table } from "../ui/table.mjs";
 import { csrfField } from "../ui/csrf-field.mjs";
 import { DocumentLayout } from "../ui/document.mjs";
+import { PublicOriginCard } from "./admin-system-origin.mjs";
+import { CaptureTargetsCard } from "./admin-system-targets.mjs";
+import { NotificationsPausedNotice } from "./notifications-paused.mjs";
 import { Fragment, jsx, jsxs } from "hono/jsx/jsx-runtime";
-//#region src/pages/admin-system.tsx
+// src/pages/admin-system.tsx
 function healthTone(state) {
 	if (state === "ok") return "success";
 	if (state === "starting") return "info";
@@ -90,9 +93,27 @@ function AdapterTable(props) {
 		/* @__PURE__ */ jsx("th", { children: "Detail" })
 	] }) }), /* @__PURE__ */ jsx("tbody", { children: report.adapters.map((adapter) => /* @__PURE__ */ jsx(AdapterRow, { adapter }, `${adapter.category}/${adapter.kind}`)) })] }) });
 }
+/** Detected hardware and the capture concurrency it yields (auto unless configured). */
+function CaptureSizing(props) {
+	const { cpus, memoryMb, builds, pages } = props.capture;
+	return /* @__PURE__ */ jsxs(Meta, { children: [
+		"Capture host ",
+		cpus,
+		" CPU · ",
+		memoryMb,
+		" MB · builds at once ",
+		builds.value,
+		builds.auto ? " (auto)" : " (configured)",
+		" · pages per build ",
+		pages.start,
+		"–",
+		pages.max,
+		" (auto, adapts to load unless the runner pins it)"
+	] });
+}
 /** Non-secret server facts (never secret, admin token, or credentials). */
 function ServerFacts(props) {
-	const { report, authEnabled, config, authMethods } = props;
+	const { report, authEnabled, config, authMethods, capture } = props.data;
 	return /* @__PURE__ */ jsxs(Card, { children: [
 		/* @__PURE__ */ jsx(SectionTitle, { children: "Server" }),
 		/* @__PURE__ */ jsxs("div", {
@@ -115,9 +136,6 @@ function ServerFacts(props) {
 		/* @__PURE__ */ jsxs(Meta, { children: [
 			"Auth ",
 			authEnabled ? "enabled" : "disabled — all operations permitted",
-			" · Capture concurrency",
-			" ",
-			formatOptional(config.captureConcurrency),
 			" · Purge TTL",
 			" ",
 			formatOptional(config.purgeTtlDays),
@@ -126,6 +144,7 @@ function ServerFacts(props) {
 			config.branchTtlDays === null ? "disabled" : `${formatOptional(config.branchTtlDays)} days`
 		] }),
 		authMethods && authMethods.length > 0 ? /* @__PURE__ */ jsx(HStack, { children: authMethods.map((method) => /* @__PURE__ */ jsx(Badge, { children: method }, method)) }) : null,
+		capture ? /* @__PURE__ */ jsx(CaptureSizing, { capture }) : null,
 		/* @__PURE__ */ jsxs(Meta, { children: [
 			"Scratch dir ",
 			formatOptional(config.scratchDir),
@@ -188,9 +207,37 @@ function CredentialsCard(props) {
 		}) : /* @__PURE__ */ jsx(Meta, { children: rotating ? "All credentials use the current secret. Remove SECRET_PREVIOUS." : "To rotate, set SECRET to the new value and SECRET_PREVIOUS to the old one." })
 	] });
 }
+/** Notice that `testing` is off, so a misconfigured instance in a fleet is visible (ADR 0006). */
+function HostingOnlyNotice(props) {
+	const { hiddenSnapshots } = props;
+	return /* @__PURE__ */ jsx("div", {
+		class: "mt-1",
+		children: /* @__PURE__ */ jsxs(Alert, {
+			tone: "info",
+			title: "Testing is off: Storybook hosting only",
+			children: [
+				"This instance publishes and serves Storybooks, but does not capture, compare or keep baselines, and no testing status is posted. Set the ",
+				/* @__PURE__ */ jsx("code", { children: "testing" }),
+				" option to turn testing on.",
+				hiddenSnapshots > 0 ? ` ${hiddenSnapshots} existing snapshot(s) are hidden, not deleted, and reappear when testing is turned on.` : ""
+			]
+		})
+	});
+}
+/** The public origin and the capture browsers (ADR 0007), when the instance has them. */
+function CaptureCards(props) {
+	const { publicOrigin, targets } = props.data;
+	return /* @__PURE__ */ jsxs(Fragment, { children: [publicOrigin ? /* @__PURE__ */ jsx("div", {
+		class: "mt-1",
+		children: /* @__PURE__ */ jsx(PublicOriginCard, { origin: publicOrigin })
+	}) : null, targets && targets.length > 0 ? /* @__PURE__ */ jsx("div", {
+		class: "mt-1",
+		children: /* @__PURE__ */ jsx(CaptureTargetsCard, { targets })
+	}) : null] });
+}
 /** Site-admin System page: adapter inventory with in-depth health. */
 function renderAdminSystemPage(data) {
-	const { report, authEnabled, config, authMethods, credentials } = data;
+	const { report, config, credentials } = data;
 	return /* @__PURE__ */ jsxs(DocumentLayout, {
 		title: "System",
 		nav: { active: "admin" },
@@ -206,19 +253,22 @@ function renderAdminSystemPage(data) {
 					" ",
 					formatUptime(report.uptimeSecs)
 				] }),
-				actions: /* @__PURE__ */ jsx(Button, {
+				actions: /* @__PURE__ */ jsxs(HStack, { children: [data.aiEnabled ? /* @__PURE__ */ jsx(Button, {
+					variant: "secondary",
+					size: "sm",
+					href: "/admin/ai",
+					children: "AI usage"
+				}) : null, /* @__PURE__ */ jsx(Button, {
 					variant: "secondary",
 					size: "sm",
 					href: "/admin",
 					children: "Recheck"
-				})
-			}),
-			/* @__PURE__ */ jsx(ServerFacts, {
-				report,
-				authEnabled,
-				config,
-				authMethods
+				})] })
 			}),
+			/* @__PURE__ */ jsx(NotificationsPausedNotice, { paused: data.notificationsPaused }),
+			data.testing === false ? /* @__PURE__ */ jsx(HostingOnlyNotice, { hiddenSnapshots: data.hiddenSnapshots ?? 0 }) : null,
+			/* @__PURE__ */ jsx(ServerFacts, { data }),
+			/* @__PURE__ */ jsx(CaptureCards, { data }),
 			credentials ? /* @__PURE__ */ jsx("div", {
 				class: "mt-1",
 				children: /* @__PURE__ */ jsx(CredentialsCard, {
@@ -237,7 +287,6 @@ function renderAdminSystemPage(data) {
 		]
 	});
 }
-//#endregion
 export { renderAdminSystemPage };
 
 //# sourceMappingURL=admin-system.mjs.map

package/dist/pages/admin-system.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"admin-system.mjs","names":[],"sources":["../../src/pages/admin-system.tsx"],"sourcesContent":["import type { ShelfConfig } from \"@storyshelf/core/config\";\nimport type { CredentialProbe } from \"@storyshelf/core/models\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport type { HealthReport } from \"../routers/health-report.ts\";\nimport {\n  Alert,\n  Badge,\n  Button,\n  Card,\n  EmptyState,\n  HStack,\n  Meta,\n  PageHeader,\n  SectionTitle,\n  Stat,\n  Table,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\nimport { DocumentLayout, type RenderedContent } from \"../ui/document.tsx\";\n\n/* eslint-disable promise-function-async -- Hono JSX components return HtmlEscapedString | Promise<HtmlEscapedString> */\n\n/** Data for the site-admin System page (adapters, health, safe config). */\nexport interface AdminSystemData {\n  report: HealthReport;\n  authEnabled: boolean;\n  config: ShelfConfig;\n  /** Active login method labels (read-only badges; empty when auth is off). */\n  authMethods?: string[];\n  /** Stored-credential state; null/undefined when no secret is configured. */\n  credentials?: CredentialProbe | null;\n}\n\nfunction healthTone(state: string): \"success\" | \"info\" | \"danger\" | \"neutral\" {\n  if (state === \"ok\") {\n    return \"success\";\n  }\n  if (state === \"starting\") {\n    return \"info\";\n  }\n  if (state === \"failed\" || state === \"degraded\") {\n    return \"danger\";\n  }\n  return \"neutral\";\n}\n\nfunction formatUptime(uptimeSecs: number): string {\n  if (uptimeSecs < 60) {\n    return `${uptimeSecs}s`;\n  }\n  const minutes = Math.floor(uptimeSecs / 60);\n  if (minutes < 60) {\n    return `${minutes}m ${uptimeSecs % 60}s`;\n  }\n  return `${Math.floor(minutes / 60)}h ${minutes % 60}m`;\n}\n\nfunction formatLatency(latencyMs: number | undefined): string {\n  return latencyMs === undefined ? \"—\" : `${latencyMs} ms`;\n}\n\nfunction formatOptional(value: string | number | null | undefined): string {\n  if (value === undefined || value === null || value === \"\") {\n    return \"—\";\n  }\n  return String(value);\n}\n\n/** One adapter row: identity, version, live probe state, latency, detail. */\nfunction AdapterRow(props: {\n  adapter: HealthReport[\"adapters\"][number];\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { adapter } = props;\n  return (\n    <tr key={`${adapter.category}/${adapter.kind}`}>\n      <td>\n        <strong>{adapter.name}</strong>\n        {adapter.description ? <Meta as=\"div\">{adapter.description}</Meta> : null}\n        {adapter.hasLifecycle ? null : <Meta as=\"div\">No lifecycle hooks</Meta>}\n      </td>\n      <td>\n        <Meta as=\"span\">{adapter.category}</Meta>\n      </td>\n      <td>\n        <Meta as=\"span\" mono>\n          {adapter.kind}\n        </Meta>\n      </td>\n      <td>\n        <Meta as=\"span\" mono>\n          {adapter.version}\n        </Meta>\n      </td>\n      <td>\n        <Badge tone={healthTone(adapter.state)} icon>\n          {adapter.state}\n        </Badge>\n      </td>\n      <td class=\"nowrap\">\n        <Meta as=\"span\">{formatLatency(adapter.latencyMs)}</Meta>\n      </td>\n      <td>\n        <Meta as=\"span\">{adapter.detail ?? \"—\"}</Meta>\n      </td>\n    </tr>\n  );\n}\n\ninterface AdapterTableProps {\n  report: HealthReport;\n}\n\n/** Adapter inventory with live health states. */\nfunction AdapterTable(props: AdapterTableProps): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { report } = props;\n  if (report.adapters.length === 0) {\n    return <EmptyState description=\"No adapters wired.\" />;\n  }\n  return (\n    <Table>\n      <table>\n        <thead>\n          <tr>\n            <th>Adapter</th>\n            <th>Category</th>\n            <th>Kind</th>\n            <th>Version</th>\n            <th>Health</th>\n            <th>Latency</th>\n            <th>Detail</th>\n          </tr>\n        </thead>\n        <tbody>\n          {report.adapters.map((adapter) => (\n            <AdapterRow key={`${adapter.category}/${adapter.kind}`} adapter={adapter} />\n          ))}\n        </tbody>\n      </table>\n    </Table>\n  );\n}\n\ninterface ServerFactsProps {\n  report: HealthReport;\n  authEnabled: boolean;\n  config: ShelfConfig;\n  authMethods?: string[];\n}\n\n/** Non-secret server facts (never secret, admin token, or credentials). */\nfunction ServerFacts(props: ServerFactsProps): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { report, authEnabled, config, authMethods } = props;\n  return (\n    <Card>\n      <SectionTitle>Server</SectionTitle>\n      <div class=\"grid grid--3\">\n        <Stat label=\"Status\" value={report.status} />\n        <Stat label=\"Uptime\" value={formatUptime(report.uptimeSecs)} />\n        <Stat label=\"Version\" value={report.version} />\n      </div>\n      <Meta>\n        Auth {authEnabled ? \"enabled\" : \"disabled — all operations permitted\"} · Capture concurrency{\" \"}\n        {formatOptional(config.captureConcurrency)} · Purge TTL{\" \"}\n        {formatOptional(config.purgeTtlDays)} days · Branch TTL{\" \"}\n        {config.branchTtlDays === null\n          ? \"disabled\"\n          : `${formatOptional(config.branchTtlDays)} days`}\n      </Meta>\n      {authMethods && authMethods.length > 0 ? (\n        <HStack>\n          {authMethods.map((method) => (\n            <Badge key={method}>{method}</Badge>\n          ))}\n        </HStack>\n      ) : null}\n      <Meta>\n        Scratch dir {formatOptional(config.scratchDir)} · Published domain{\" \"}\n        {formatOptional(config.publishedBaseDomain)} · Max upload{\" \"}\n        {formatOptional(config.maxUploadBytes)} bytes\n      </Meta>\n    </Card>\n  );\n}\n\n/** Credential encryption state with the admin-only re-encrypt action. */\nfunction CredentialsCard(props: {\n  probe: CredentialProbe;\n  config: ShelfConfig;\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { probe, config } = props;\n  const rotating = Boolean(config.previousSecret);\n  return (\n    <Card>\n      <SectionTitle>Stored credentials</SectionTitle>\n      <Meta>\n        Webhook secrets, git tokens and notification secrets are encrypted with the server secret.\n      </Meta>\n      <div class=\"grid grid--3\">\n        <Stat label=\"Current secret\" value={String(probe.current)} />\n        <Stat label=\"Previous secret\" value={String(probe.previous)} />\n        <Stat label=\"Unreadable\" value={String(probe.unreadable.length)} />\n      </div>\n      {probe.unreadable.length > 0 ? (\n        <Alert tone=\"danger\" title=\"Some credentials cannot be decrypted\">\n          No configured secret matches {probe.unreadable.length} stored credential(s) (\n          {[...new Set(probe.unreadable.map((row) => row.source))].join(\", \")}). Check that SECRET\n          and SECRET_PREVIOUS are correct, or recreate them.\n        </Alert>\n      ) : null}\n      {rotating && probe.previous > 0 ? (\n        <form\n          method=\"post\"\n          action=\"/admin/credentials/reencrypt\"\n          hx-post=\"/admin/credentials/reencrypt\"\n          hx-target=\"body\"\n        >\n          {csrfField()}\n          <Button type=\"submit\" variant=\"secondary\" size=\"sm\">\n            Re-encrypt with current secret\n          </Button>\n        </form>\n      ) : (\n        <Meta>\n          {rotating\n            ? \"All credentials use the current secret. Remove SECRET_PREVIOUS.\"\n            : \"To rotate, set SECRET to the new value and SECRET_PREVIOUS to the old one.\"}\n        </Meta>\n      )}\n    </Card>\n  );\n}\n\n/** Site-admin System page: adapter inventory with in-depth health. */\nexport function renderAdminSystemPage(data: AdminSystemData): RenderedContent {\n  const { report, authEnabled, config, authMethods, credentials } = data;\n  return (\n    <DocumentLayout title=\"System\" nav={{ active: \"admin\" }}>\n      <PageHeader\n        title=\"System\"\n        description=\"Adapter inventory with in-depth health. Visible to site admins only.\"\n        meta={\n          <>\n            {report.adapters.length} adapters · {report.status} · up{\" \"}\n            {formatUptime(report.uptimeSecs)}\n          </>\n        }\n        actions={\n          <Button variant=\"secondary\" size=\"sm\" href=\"/admin\">\n            Recheck\n          </Button>\n        }\n      />\n      <ServerFacts\n        report={report}\n        authEnabled={authEnabled}\n        config={config}\n        authMethods={authMethods}\n      />\n      {credentials ? (\n        <div class=\"mt-1\">\n          <CredentialsCard probe={credentials} config={config} />\n        </div>\n      ) : null}\n      <div class=\"mt-1\">\n        <Card>\n          <SectionTitle>Adapters</SectionTitle>\n          <Meta>\n            Live probe per adapter (2s timeout, parallel). Setup failures surface as failed rows;\n            adapters without lifecycle hooks report their wired state.\n          </Meta>\n          <AdapterTable report={report} />\n        </Card>\n      </div>\n    </DocumentLayout>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"admin-system.mjs","names":[],"sources":["../../src/pages/admin-system.tsx"],"sourcesContent":["import type { RunnerTarget } from \"@storyshelf/core/adapter/capture-runner\";\nimport type { ShelfConfig } from \"@storyshelf/core/config\";\nimport type { CredentialProbe } from \"@storyshelf/core/models\";\nimport type { CaptureHostSummary } from \"@storyshelf/core/utils\";\nimport type { HtmlEscapedString } from \"hono/utils/html\";\nimport type { HealthReport } from \"../routers/health-report.ts\";\nimport {\n  Alert,\n  Badge,\n  Button,\n  Card,\n  EmptyState,\n  HStack,\n  Meta,\n  PageHeader,\n  SectionTitle,\n  Stat,\n  Table,\n} from \"../ui/components.tsx\";\nimport { csrfField } from \"../ui/csrf-field.tsx\";\nimport { DocumentLayout, type RenderedContent } from \"../ui/document.tsx\";\nimport { PublicOriginCard, type PublicOriginView } from \"./admin-system-origin.tsx\";\nimport { CaptureTargetsCard } from \"./admin-system-targets.tsx\";\nimport { NotificationsPausedNotice } from \"./notifications-paused.tsx\";\n\n/* eslint-disable promise-function-async -- Hono JSX components return HtmlEscapedString | Promise<HtmlEscapedString> */\n\n/** Data for the site-admin System page (adapters, health, safe config). */\nexport interface AdminSystemData {\n  report: HealthReport;\n  authEnabled: boolean;\n  config: ShelfConfig;\n  /** Active login method labels (read-only badges; empty when auth is off). */\n  authMethods?: string[];\n  /** Stored-credential state; null/undefined when no secret is configured. */\n  credentials?: CredentialProbe | null;\n  /** True when AI is configured (shows the AI usage link). */\n  aiEnabled?: boolean;\n  /** Whether `options.testing` is set; false shows the hosting-only notice. */\n  testing?: boolean;\n  /** Snapshots hidden because `testing` is off (only meaningful when it is). */\n  hiddenSnapshots?: number;\n  /** Detected host budget and effective capture concurrency; null when capture runs elsewhere. */\n  capture?: CaptureHostSummary | null;\n  /** The browsers the capture runner offers (ADR 0007); omitted without a runner list. */\n  targets?: readonly RunnerTarget[] | undefined;\n  /** The public origin and where it came from; omitted when the store has no resolver. */\n  publicOrigin?: PublicOriginView | undefined;\n  /** Notifiers are wired but no public origin resolves, so nothing is sent (ADR 0014, decision 11). */\n  notificationsPaused?: boolean | undefined;\n}\n\nfunction healthTone(state: string): \"success\" | \"info\" | \"danger\" | \"neutral\" {\n  if (state === \"ok\") {\n    return \"success\";\n  }\n  if (state === \"starting\") {\n    return \"info\";\n  }\n  if (state === \"failed\" || state === \"degraded\") {\n    return \"danger\";\n  }\n  return \"neutral\";\n}\n\nfunction formatUptime(uptimeSecs: number): string {\n  if (uptimeSecs < 60) {\n    return `${uptimeSecs}s`;\n  }\n  const minutes = Math.floor(uptimeSecs / 60);\n  if (minutes < 60) {\n    return `${minutes}m ${uptimeSecs % 60}s`;\n  }\n  return `${Math.floor(minutes / 60)}h ${minutes % 60}m`;\n}\n\nfunction formatLatency(latencyMs: number | undefined): string {\n  return latencyMs === undefined ? \"—\" : `${latencyMs} ms`;\n}\n\nfunction formatOptional(value: string | number | null | undefined): string {\n  if (value === undefined || value === null || value === \"\") {\n    return \"—\";\n  }\n  return String(value);\n}\n\n/** One adapter row: identity, version, live probe state, latency, detail. */\nfunction AdapterRow(props: {\n  adapter: HealthReport[\"adapters\"][number];\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { adapter } = props;\n  return (\n    <tr key={`${adapter.category}/${adapter.kind}`}>\n      <td>\n        <strong>{adapter.name}</strong>\n        {adapter.description ? <Meta as=\"div\">{adapter.description}</Meta> : null}\n        {adapter.hasLifecycle ? null : <Meta as=\"div\">No lifecycle hooks</Meta>}\n      </td>\n      <td>\n        <Meta as=\"span\">{adapter.category}</Meta>\n      </td>\n      <td>\n        <Meta as=\"span\" mono>\n          {adapter.kind}\n        </Meta>\n      </td>\n      <td>\n        <Meta as=\"span\" mono>\n          {adapter.version}\n        </Meta>\n      </td>\n      <td>\n        <Badge tone={healthTone(adapter.state)} icon>\n          {adapter.state}\n        </Badge>\n      </td>\n      <td class=\"nowrap\">\n        <Meta as=\"span\">{formatLatency(adapter.latencyMs)}</Meta>\n      </td>\n      <td>\n        <Meta as=\"span\">{adapter.detail ?? \"—\"}</Meta>\n      </td>\n    </tr>\n  );\n}\n\ninterface AdapterTableProps {\n  report: HealthReport;\n}\n\n/** Adapter inventory with live health states. */\nfunction AdapterTable(props: AdapterTableProps): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { report } = props;\n  if (report.adapters.length === 0) {\n    return <EmptyState description=\"No adapters wired.\" />;\n  }\n  return (\n    <Table>\n      <table>\n        <thead>\n          <tr>\n            <th>Adapter</th>\n            <th>Category</th>\n            <th>Kind</th>\n            <th>Version</th>\n            <th>Health</th>\n            <th>Latency</th>\n            <th>Detail</th>\n          </tr>\n        </thead>\n        <tbody>\n          {report.adapters.map((adapter) => (\n            <AdapterRow key={`${adapter.category}/${adapter.kind}`} adapter={adapter} />\n          ))}\n        </tbody>\n      </table>\n    </Table>\n  );\n}\n\n/** Detected hardware and the capture concurrency it yields (auto unless configured). */\nfunction CaptureSizing(props: {\n  capture: CaptureHostSummary;\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { cpus, memoryMb, builds, pages } = props.capture;\n  return (\n    <Meta>\n      Capture host {cpus} CPU · {memoryMb} MB · builds at once {builds.value}\n      {builds.auto ? \" (auto)\" : \" (configured)\"} · pages per build {pages.start}–{pages.max} (auto,\n      adapts to load unless the runner pins it)\n    </Meta>\n  );\n}\n\ninterface ServerFactsProps {\n  data: AdminSystemData;\n}\n\n/** Non-secret server facts (never secret, admin token, or credentials). */\nfunction ServerFacts(props: ServerFactsProps): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { report, authEnabled, config, authMethods, capture } = props.data;\n  return (\n    <Card>\n      <SectionTitle>Server</SectionTitle>\n      <div class=\"grid grid--3\">\n        <Stat label=\"Status\" value={report.status} />\n        <Stat label=\"Uptime\" value={formatUptime(report.uptimeSecs)} />\n        <Stat label=\"Version\" value={report.version} />\n      </div>\n      <Meta>\n        Auth {authEnabled ? \"enabled\" : \"disabled — all operations permitted\"} · Purge TTL{\" \"}\n        {formatOptional(config.purgeTtlDays)} days · Branch TTL{\" \"}\n        {config.branchTtlDays === null\n          ? \"disabled\"\n          : `${formatOptional(config.branchTtlDays)} days`}\n      </Meta>\n      {authMethods && authMethods.length > 0 ? (\n        <HStack>\n          {authMethods.map((method) => (\n            <Badge key={method}>{method}</Badge>\n          ))}\n        </HStack>\n      ) : null}\n      {capture ? <CaptureSizing capture={capture} /> : null}\n      <Meta>\n        Scratch dir {formatOptional(config.scratchDir)} · Published domain{\" \"}\n        {formatOptional(config.publishedBaseDomain)} · Max upload{\" \"}\n        {formatOptional(config.maxUploadBytes)} bytes\n      </Meta>\n    </Card>\n  );\n}\n\n/** Credential encryption state with the admin-only re-encrypt action. */\nfunction CredentialsCard(props: {\n  probe: CredentialProbe;\n  config: ShelfConfig;\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { probe, config } = props;\n  const rotating = Boolean(config.previousSecret);\n  return (\n    <Card>\n      <SectionTitle>Stored credentials</SectionTitle>\n      <Meta>\n        Webhook secrets, git tokens and notification secrets are encrypted with the server secret.\n      </Meta>\n      <div class=\"grid grid--3\">\n        <Stat label=\"Current secret\" value={String(probe.current)} />\n        <Stat label=\"Previous secret\" value={String(probe.previous)} />\n        <Stat label=\"Unreadable\" value={String(probe.unreadable.length)} />\n      </div>\n      {probe.unreadable.length > 0 ? (\n        <Alert tone=\"danger\" title=\"Some credentials cannot be decrypted\">\n          No configured secret matches {probe.unreadable.length} stored credential(s) (\n          {[...new Set(probe.unreadable.map((row) => row.source))].join(\", \")}). Check that SECRET\n          and SECRET_PREVIOUS are correct, or recreate them.\n        </Alert>\n      ) : null}\n      {rotating && probe.previous > 0 ? (\n        <form\n          method=\"post\"\n          action=\"/admin/credentials/reencrypt\"\n          hx-post=\"/admin/credentials/reencrypt\"\n          hx-target=\"body\"\n        >\n          {csrfField()}\n          <Button type=\"submit\" variant=\"secondary\" size=\"sm\">\n            Re-encrypt with current secret\n          </Button>\n        </form>\n      ) : (\n        <Meta>\n          {rotating\n            ? \"All credentials use the current secret. Remove SECRET_PREVIOUS.\"\n            : \"To rotate, set SECRET to the new value and SECRET_PREVIOUS to the old one.\"}\n        </Meta>\n      )}\n    </Card>\n  );\n}\n\n/** Notice that `testing` is off, so a misconfigured instance in a fleet is visible (ADR 0006). */\nfunction HostingOnlyNotice(props: {\n  hiddenSnapshots: number;\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { hiddenSnapshots } = props;\n  return (\n    <div class=\"mt-1\">\n      <Alert tone=\"info\" title=\"Testing is off: Storybook hosting only\">\n        This instance publishes and serves Storybooks, but does not capture, compare or keep\n        baselines, and no testing status is posted. Set the <code>testing</code> option to turn\n        testing on.\n        {hiddenSnapshots > 0\n          ? ` ${hiddenSnapshots} existing snapshot(s) are hidden, not deleted, and reappear when testing is turned on.`\n          : \"\"}\n      </Alert>\n    </div>\n  );\n}\n\n/** The public origin and the capture browsers (ADR 0007), when the instance has them. */\nfunction CaptureCards(props: {\n  data: AdminSystemData;\n}): HtmlEscapedString | Promise<HtmlEscapedString> {\n  const { publicOrigin, targets } = props.data;\n  return (\n    <>\n      {publicOrigin ? (\n        <div class=\"mt-1\">\n          <PublicOriginCard origin={publicOrigin} />\n        </div>\n      ) : null}\n      {targets && targets.length > 0 ? (\n        <div class=\"mt-1\">\n          <CaptureTargetsCard targets={targets} />\n        </div>\n      ) : null}\n    </>\n  );\n}\n\n/** Site-admin System page: adapter inventory with in-depth health. */\nexport function renderAdminSystemPage(data: AdminSystemData): RenderedContent {\n  const { report, config, credentials } = data;\n  return (\n    <DocumentLayout title=\"System\" nav={{ active: \"admin\" }}>\n      <PageHeader\n        title=\"System\"\n        description=\"Adapter inventory with in-depth health. Visible to site admins only.\"\n        meta={\n          <>\n            {report.adapters.length} adapters · {report.status} · up{\" \"}\n            {formatUptime(report.uptimeSecs)}\n          </>\n        }\n        actions={\n          <HStack>\n            {data.aiEnabled ? (\n              <Button variant=\"secondary\" size=\"sm\" href=\"/admin/ai\">\n                AI usage\n              </Button>\n            ) : null}\n            <Button variant=\"secondary\" size=\"sm\" href=\"/admin\">\n              Recheck\n            </Button>\n          </HStack>\n        }\n      />\n      <NotificationsPausedNotice paused={data.notificationsPaused} />\n      {data.testing === false ? (\n        <HostingOnlyNotice hiddenSnapshots={data.hiddenSnapshots ?? 0} />\n      ) : null}\n      <ServerFacts data={data} />\n      <CaptureCards data={data} />\n      {credentials ? (\n        <div class=\"mt-1\">\n          <CredentialsCard probe={credentials} config={config} />\n        </div>\n      ) : null}\n      <div class=\"mt-1\">\n        <Card>\n          <SectionTitle>Adapters</SectionTitle>\n          <Meta>\n            Live probe per adapter (2s timeout, parallel). Setup failures surface as failed rows;\n            adapters without lifecycle hooks report their wired state.\n          </Meta>\n          <AdapterTable report={report} />\n        </Card>\n      </div>\n    </DocumentLayout>\n  );\n}\n"],"mappings":"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"}

package/dist/pages/build-detail.mjs

@@ -1,21 +1,32 @@
 import "node:path";
 import "node:url";
 import.meta.url;
-import { getStore } from "../store.mjs";
+import { catalogOf, getStore, testingEnabled } from "../store.mjs";
 import { Button } from "../ui/buttons.mjs";
 import { Badge, EmptyState, Meta, Stat, statusTone } from "../ui/feedback.mjs";
-import { TextareaField } from "../ui/forms.mjs";
 import { Card, PageHeader, SectionTitle } from "../ui/layout.mjs";
 import { HStack, VStack } from "../ui/stacks.mjs";
 import { Thumbnail } from "../ui/thumbnail.mjs";
 import { DocumentLayout } from "../ui/document.mjs";
 import { loadBaselineView } from "../routers/baseline-guard.mjs";
-import { reviewComment, reviewCommentBody, reviewCommentHead, snapshotCard, snapshotCardBody, snapshotCardHead, snapshotCardMeta, snapshotGrid } from "../ui/styles/review.mjs";
+import { designUrlsFor, loadDesignResolutions, providerNameFor } from "../routers/design.handlers.mjs";
+import { loadReviewSection } from "../routers/review-section.handlers.mjs";
+import { snapshotCard, snapshotCardBody, snapshotCardHead, snapshotCardMeta, snapshotGrid } from "../ui/styles/review.mjs";
+import { a11ySummaryNote, a11ySummaryOf } from "./a11y-violations.mjs";
+import { snapshotVariant } from "./build-diff-model.mjs";
 import { StaleBaselineNotice } from "./build-diff-stale.mjs";
-import { BuildModel, CaptureAttemptModel, CaptureLogModel, CommentModel, ProjectModel, SnapshotModel } from "@storyshelf/core/models";
+import { LinkedUsage } from "./build-diff-usage.mjs";
+import { TestsCard } from "./build-tests.mjs";
+import { DesignButtons } from "./design-links.mjs";
+import { ChangesetCard } from "./review-changeset.mjs";
+import { CommentsCard } from "./review-comments.mjs";
+import { VerdictCard } from "./review-verdict.mjs";
+import { groupComponents, parseTestResults } from "@storyshelf/core/capture";
+import { BuildModel, CaptureAttemptModel, CaptureLogModel, LabelModel, ProjectModel, SnapshotModel } from "@storyshelf/core/models";
+import { CANCELLABLE_BUILD_STATUSES } from "@storyshelf/core/types";
 import { Fragment, jsx, jsxs } from "hono/jsx/jsx-runtime";
 import { createUrlBuilder } from "@storyshelf/core/urls";
-//#region src/pages/build-detail.tsx
+// src/pages/build-detail.tsx
 /** Map a capture log level to its badge tone. */
 function logTone(level) {
 	if (level === "error") return "danger";
@@ -24,22 +35,29 @@ function logTone(level) {
 	return "neutral";
 }
 /** Build overview page: snapshot grid, bulk actions, and build comments. */
-async function renderBuildDetailPage(buildId) {
+async function renderBuildDetailPage(buildId, usageByStory = /* @__PURE__ */ new Map()) {
 	const { db } = getStore();
 	const build = await new BuildModel(db).get(buildId);
 	if (!build) return null;
 	const project = await new ProjectModel(db).get(build.projectId);
 	if (!project) return null;
 	const snapshots = await new SnapshotModel(db).listByBuild(build.id);
-	const comments = await new CommentModel(db).listByBuild(build.id);
 	const attempts = await new CaptureAttemptModel(db).listByBuild(build.id);
 	const logs = new CaptureLogModel(db);
 	const attemptLogs = /* @__PURE__ */ new Map();
 	for (const attempt of attempts) attemptLogs.set(attempt.id, await logs.listByAttempt(attempt.id));
 	const canReview = !getStore().authEnabled || Boolean(getStore().user);
 	const { drifted } = await loadBaselineView(project, build, snapshots);
+	const designs = await loadDesignResolutions(project, snapshots).catch(() => /* @__PURE__ */ new Map());
 	const staleCount = Object.keys(drifted).length;
 	const urls = createUrlBuilder("/", getStore().config.publishedBaseDomain);
+	const testing = testingEnabled();
+	const cancelled = build.status === "cancelled";
+	const published = build.status === "approved" && attempts.length === 0;
+	const [catalog, labels] = await Promise.all([catalogOf().load(project.id, build.id).catch(() => null), new LabelModel(db).listForBuild(build.id)]);
+	const review = await loadReviewSection(project, build, catalog);
+	const components = catalog ? groupComponents(catalog.entries) : [];
+	const storyCount = catalog?.entries.filter((entry) => entry.type === "story").length ?? 0;
 	const grouped = /* @__PURE__ */ new Map();
 	for (const snap of snapshots) {
 		const key = snap.status;
@@ -47,7 +65,7 @@ async function renderBuildDetailPage(buildId) {
 		list.push(snap);
 		grouped.set(key, list);
 	}
-	const inheritedCount = snapshots.filter((snap) => snap.inherited).length;
+	const a11y = a11ySummaryOf(snapshots);
 	const selective = build.affectedOnly && build.affectedImportPaths !== null;
 	return /* @__PURE__ */ jsxs(DocumentLayout, {
 		title: `Build ${build.gitBranch}`,
@@ -69,16 +87,24 @@ async function renderBuildDetailPage(buildId) {
 					" ",
 					/* @__PURE__ */ jsx(Badge, {
 						tone: statusTone(build.status),
-						children: build.status
+						children: published ? "Published" : build.status
 					}),
-					selective ? /* @__PURE__ */ jsxs(Fragment, { children: [" ", /* @__PURE__ */ jsx(Badge, {
+					testing && selective ? /* @__PURE__ */ jsxs(Fragment, { children: [" ", /* @__PURE__ */ jsx(Badge, {
 						tone: "info",
 						children: "affected capture"
 					})] }) : null,
-					!build.affectedOnly ? /* @__PURE__ */ jsxs(Fragment, { children: [" ", /* @__PURE__ */ jsx(Badge, {
+					testing && !build.affectedOnly ? /* @__PURE__ */ jsxs(Fragment, { children: [" ", /* @__PURE__ */ jsx(Badge, {
 						tone: "neutral",
 						children: "full capture"
-					})] }) : null
+					})] }) : null,
+					labels.map((label) => /* @__PURE__ */ jsxs("span", { children: [" ", /* @__PURE__ */ jsxs(Badge, {
+						tone: "neutral",
+						children: [
+							label.typeKey,
+							": ",
+							label.value
+						]
+					})] }, `${label.typeKey}:${label.value}`))
 				] }),
 				description: /* @__PURE__ */ jsxs(Fragment, { children: [
 					build.message ?? "No message",
@@ -87,27 +113,28 @@ async function renderBuildDetailPage(buildId) {
 					" ",
 					"· ",
 					new Date(build.createdAt).toLocaleString(),
-					selective ? /* @__PURE__ */ jsxs(Fragment, { children: [
+					testing && selective ? /* @__PURE__ */ jsxs(Fragment, { children: [
 						" ",
 						"· ",
-						snapshots.length - inheritedCount,
+						build.snapshotCount - build.inheritedCount,
 						" rendered, ",
-						inheritedCount,
-						" inherited"
+						build.inheritedCount,
+						" ",
+						"inherited"
 					] }) : null
 				] }),
 				actions: /* @__PURE__ */ jsxs(Fragment, { children: [
-					/* @__PURE__ */ jsx(Button, {
+					testing ? /* @__PURE__ */ jsx(Button, {
 						variant: "primary",
 						href: urls.buildDiff(project.slug, build.id),
 						children: "Review diffs"
-					}),
+					}) : null,
 					/* @__PURE__ */ jsx(Button, {
-						variant: "ghost",
+						variant: testing ? "ghost" : "primary",
 						href: urls.short(build.id),
 						children: "View Storybook"
 					}),
-					/* @__PURE__ */ jsx("form", {
+					testing ? /* @__PURE__ */ jsx("form", {
 						method: "post",
 						action: `/api/v1/projects/${project.slug}/builds/${build.id}/retry`,
 						"hx-post": `/api/v1/projects/${project.slug}/builds/${build.id}/retry`,
@@ -117,10 +144,22 @@ async function renderBuildDetailPage(buildId) {
 							type: "submit",
 							children: "Retry capture"
 						})
-					})
+					}) : null,
+					testing && CANCELLABLE_BUILD_STATUSES.includes(build.status) ? /* @__PURE__ */ jsx("form", {
+						method: "post",
+						action: `/api/v1/projects/${project.slug}/builds/${build.id}/cancel`,
+						"hx-post": `/api/v1/projects/${project.slug}/builds/${build.id}/cancel`,
+						"hx-target": "body",
+						children: /* @__PURE__ */ jsx(Button, {
+							variant: "danger",
+							size: "sm",
+							type: "submit",
+							children: "Cancel build"
+						})
+					}) : null
 				] })
 			}),
-			staleCount > 0 ? /* @__PURE__ */ jsx(StaleBaselineNotice, {
+			testing && staleCount > 0 ? /* @__PURE__ */ jsx(StaleBaselineNotice, {
 				project,
 				build,
 				staleCount,
@@ -130,11 +169,21 @@ async function renderBuildDetailPage(buildId) {
 				class: "mb-1",
 				children: /* @__PURE__ */ jsxs("div", {
 					class: "grid grid--3",
-					children: [
+					children: [catalog ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(Stat, {
+						label: "Components",
+						value: components.length
+					}) }), /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(Stat, {
+						label: "Stories",
+						value: storyCount
+					}) })] }) : null, testing ? /* @__PURE__ */ jsxs(Fragment, { children: [
 						/* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(Stat, {
 							label: "Snapshots",
 							value: snapshots.length
 						}) }),
+						/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(Stat, {
+							label: "Inherited",
+							value: build.inheritedCount
+						}), /* @__PURE__ */ jsx(Meta, { children: "Reused from the baseline without rendering." })] }),
 						/* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsx(Stat, {
 							label: "Changed / new",
 							value: build.changedCount,
@@ -144,11 +193,16 @@ async function renderBuildDetailPage(buildId) {
 							label: "Approved / unchanged",
 							value: build.approvedCount,
 							tone: "success"
-						}) })
-					]
+						}) }),
+						/* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(Stat, {
+							label: "Accessibility findings",
+							value: a11y.findings,
+							tone: a11y.findings > 0 ? "warning" : "neutral"
+						}), /* @__PURE__ */ jsx(Meta, { children: a11ySummaryNote(a11y) })] })
+					] }) : null]
 				})
 			}),
-			attempts.length > 0 ? /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(SectionTitle, { children: "Capture attempts" }), attempts.map((attempt, index) => /* @__PURE__ */ jsxs("details", {
+			testing && attempts.length > 0 ? /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(SectionTitle, { children: "Capture attempts" }), attempts.map((attempt, index) => /* @__PURE__ */ jsxs("details", {
 				open: index === attempts.length - 1,
 				children: [
 					/* @__PURE__ */ jsxs("summary", { children: [
@@ -193,7 +247,8 @@ async function renderBuildDetailPage(buildId) {
 					})
 				]
 			}, attempt.id))] }) : null,
-			canReview && (build.status === "reviewing" || build.status === "comparing") ? /* @__PURE__ */ jsx("div", {
+			/* @__PURE__ */ jsx(TestsCard, { results: parseTestResults(build.testResults) }),
+			testing && canReview && (build.status === "reviewing" || build.status === "comparing") ? /* @__PURE__ */ jsx("div", {
 				class: "mb-1",
 				children: /* @__PURE__ */ jsx(Card, { children: /* @__PURE__ */ jsxs(HStack, { children: [
 					/* @__PURE__ */ jsx(Meta, {
@@ -235,7 +290,11 @@ async function renderBuildDetailPage(buildId) {
 					})
 				] }) })
 			}) : null,
-			snapshots.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
+			review ? /* @__PURE__ */ jsx("div", {
+				class: "mb-1",
+				children: /* @__PURE__ */ jsxs(VStack, { children: [testing || cancelled ? null : /* @__PURE__ */ jsx(VerdictCard, { data: review }), /* @__PURE__ */ jsx(ChangesetCard, { data: review })] })
+			}) : null,
+			!testing ? null : snapshots.length === 0 ? /* @__PURE__ */ jsx(EmptyState, {
 				title: "No snapshots yet",
 				description: "Capture is pending or failed. Try retrying capture."
 			}) : /* @__PURE__ */ jsx("div", {
@@ -256,7 +315,7 @@ async function renderBuildDetailPage(buildId) {
 							/* @__PURE__ */ jsxs("span", {
 								class: snapshotCardMeta,
 								children: [
-									snap.viewportName,
+									snapshotVariant(snap),
 									" · ",
 									snap.viewportWidth,
 									"×",
@@ -290,6 +349,10 @@ async function renderBuildDetailPage(buildId) {
 									snap.diffPixels === null || snap.diffPixels === void 0 ? "" : ` · ${snap.diffPixels} px`
 								]
 							}),
+							snap.storyImportPath && usageByStory.has(snap.storyImportPath) ? /* @__PURE__ */ jsx(LinkedUsage, {
+								usage: usageByStory.get(snap.storyImportPath) ?? [],
+								publishedBaseDomain: getStore().config.publishedBaseDomain
+							}) : null,
 							/* @__PURE__ */ jsxs(HStack, { children: [
 								/* @__PURE__ */ jsx(Button, {
 									variant: "secondary",
@@ -303,6 +366,16 @@ async function renderBuildDetailPage(buildId) {
 									href: urls.short(build.id),
 									children: "View Storybook"
 								}),
+								snap.storyImportPath ? /* @__PURE__ */ jsx(Button, {
+									variant: "ghost",
+									size: "sm",
+									href: `${urls.component(project.slug, snap.storyImportPath)}#${snap.storyId}`,
+									children: "Component"
+								}) : null,
+								/* @__PURE__ */ jsx(DesignButtons, {
+									urls: designUrlsFor(designs, snap),
+									providerName: providerNameFor
+								}),
 								canReview && (snap.status === "new" || snap.status === "changed") ? /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("form", {
 									method: "post",
 									action: `/api/v1/projects/${project.slug}/builds/${build.id}/snapshots/${snap.id}/approve`,
@@ -334,59 +407,13 @@ async function renderBuildDetailPage(buildId) {
 					})]
 				}, snap.id))
 			}),
-			/* @__PURE__ */ jsx("div", {
+			review ? /* @__PURE__ */ jsx("div", {
 				class: "mt-1",
-				children: /* @__PURE__ */ jsxs(Card, { children: [
-					/* @__PURE__ */ jsx(SectionTitle, { children: "Comments" }),
-					comments.length === 0 ? /* @__PURE__ */ jsx(Meta, { children: "No comments. Add one in the diff review page for a specific snapshot." }) : null,
-					/* @__PURE__ */ jsx(VStack, { children: comments.map((comment) => /* @__PURE__ */ jsxs("div", {
-						class: reviewComment,
-						children: [/* @__PURE__ */ jsxs("div", {
-							class: reviewCommentHead,
-							children: [
-								/* @__PURE__ */ jsx("strong", { children: comment.userId ?? "anonymous" }),
-								/* @__PURE__ */ jsxs("span", { children: ["· ", new Date(comment.createdAt).toLocaleString()] }),
-								comment.snapshotId ? /* @__PURE__ */ jsx(Badge, {
-									tone: "neutral",
-									children: snapshots.find((snapshot) => snapshot.id === comment.snapshotId)?.storyName ?? comment.snapshotId.slice(0, 6)
-								}) : /* @__PURE__ */ jsx(Badge, {
-									tone: "neutral",
-									children: "build"
-								}),
-								comment.resolved ? /* @__PURE__ */ jsx(Badge, {
-									tone: "success",
-									children: "resolved"
-								}) : null
-							]
-						}), /* @__PURE__ */ jsx("p", {
-							class: reviewCommentBody,
-							children: comment.body
-						})]
-					}, comment.id)) }),
-					/* @__PURE__ */ jsx("form", {
-						method: "post",
-						action: `/api/v1/projects/${project.slug}/builds/${build.id}/comments`,
-						"hx-post": `/api/v1/projects/${project.slug}/builds/${build.id}/comments`,
-						"hx-target": "body",
-						class: "mt-1 max-w-prose",
-						children: /* @__PURE__ */ jsxs(VStack, { children: [/* @__PURE__ */ jsx(TextareaField, {
-							label: "Add build comment",
-							name: "body",
-							rows: 3,
-							required: true,
-							placeholder: "Leave a comment on this build…"
-						}), /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Button, {
-							variant: "primary",
-							type: "submit",
-							children: "Comment"
-						}) })] })
-					})
-				] })
-			})
+				children: /* @__PURE__ */ jsxs(VStack, { children: [testing && !cancelled ? /* @__PURE__ */ jsx(VerdictCard, { data: review }) : null, /* @__PURE__ */ jsx(CommentsCard, { data: review })] })
+			}) : null
 		]
 	});
 }
-//#endregion
 export { renderBuildDetailPage };
 
 //# sourceMappingURL=build-detail.mjs.map