@hot-updater/console 1.1.4 → 1.2.0-rc.1

package/.output/server/_ssr/native-builds_._buildId-GHpGaYyE.mjs

@@ -0,0 +1,813 @@
+import { i as __toESM } from "../_runtime.mjs";
+import { bt as require_react, yt as require_jsx_runtime } from "../_libs/@base-ui/react+[...].mjs";
+import { B as Download, J as ChevronLeft, M as HardDrive, P as GitBranch, S as PackageOpen, W as CircleCheck, _ as RefreshCw, i as TriangleAlert, j as History, q as ChevronRight, tt as ArrowUpRight } from "../_libs/lucide-react.mjs";
+import { C as Skeleton, O as buttonVariants, S as SidebarTrigger, k as cn, t as Button$1 } from "./sidebar-DB2YQlok.mjs";
+import { a as Badge, d as CardTitle, i as AlertTitle, n as AlertAction, o as Card, r as AlertDescription, s as CardContent, t as Alert, u as CardHeader } from "./badge-CEdVRgyl.mjs";
+import { a as TableHeader, i as TableHead, n as TableBody, o as TableRow, r as TableCell, t as Table } from "./table-P4TnAZhl.mjs";
+import { h as Link } from "../_libs/@tanstack/react-router+[...].mjs";
+import { a as EmptyMedia, i as EmptyHeader, n as EmptyContent, o as EmptyTitle, r as EmptyDescription, t as Empty } from "./empty-CkdEAvCY.mjs";
+import { i as NUMERIC_COHORT_SIZE } from "./dist-TEpM_UAD.mjs";
+import { c as nativeBuildFileName, d as platformLabel, i as nativeBuildArtifacts, p as simulatorInstallCommand, r as formatByteSize, s as nativeBuildDownloadPath, t as apkInstallCommand, u as nativeBuildTarget } from "./native-builds-DhXL5zf_.mjs";
+import { t as PlatformIcon } from "./PlatformIcon-CFLiTjh1.mjs";
+import { d as useNativeBuildPatchesQuery, l as useNativeBuildDetailQuery, u as useNativeBuildDownloadUrlQuery } from "./api-0vtwA5vY.mjs";
+import { t as TimestampDisplay } from "./git-CTA8Aqr0.mjs";
+import { a as isSubmitted, i as StoreSubmissionBadge, n as CopyableText, r as ShortHash, t as CommitLink } from "./StoreSubmission-JZ2Zltak.mjs";
+import { t as qrCodePath } from "./qr-code-C7kNRIDX.mjs";
+import { t as Route } from "./native-builds_._buildId-CMp1h8dT.mjs";
+import { t as RolloutPercentageBadge } from "./RolloutPercentageBadge-g0Bhfl3M.mjs";
+//#region node_modules/.nitro/vite/services/ssr/assets/native-builds_._buildId-GHpGaYyE.js
+var import_react = /* @__PURE__ */ __toESM(require_react());
+var import_jsx_runtime = require_jsx_runtime();
+function Row({ label, children }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "grid gap-1 sm:grid-cols-[10rem_minmax(0,1fr)] sm:gap-4",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("dt", {
+			className: "text-xs font-medium text-muted-foreground",
+			children: label
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("dd", {
+			className: "min-w-0 text-sm",
+			children
+		})]
+	});
+}
+/** Whether new deploys patch from this build, or from a newer one of its scope. */
+function BaselineStatus({ detail }) {
+	const { build, newestInScope } = detail;
+	if (newestInScope === null) return null;
+	if (newestInScope.id === build.id) return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "flex items-start gap-2 rounded-md border bg-muted/40 p-3 text-xs",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CircleCheck, {
+			"aria-hidden": "true",
+			className: "mt-0.5 size-3.5 shrink-0 text-muted-foreground"
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+			className: "font-medium",
+			children: "Current baseline."
+		}), " New deploys to this scope add a patch from this build's bundle."] })]
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "flex items-start gap-2 rounded-md border bg-muted/40 p-3 text-xs",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(History, {
+			"aria-hidden": "true",
+			className: "mt-0.5 size-3.5 shrink-0 text-muted-foreground"
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", { children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: "font-medium",
+				children: "Superseded"
+			}),
+			" by",
+			" ",
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+				className: "inline-flex items-center gap-0.5 font-medium underline underline-offset-4",
+				params: { buildId: newestInScope.id },
+				to: "/native-builds/$buildId",
+				children: [
+					platformLabel(newestInScope.platform),
+					" ",
+					nativeBuildArtifacts[newestInScope.artifact_kind].label,
+					" ·",
+					" ",
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimestampDisplay, { uuid: newestInScope.id }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowUpRight, {
+						"aria-hidden": "true",
+						className: "size-3"
+					})
+				]
+			}),
+			". New deploys patch from that build, so this one gets no new patches."
+		] })]
+	});
+}
+/**
+* The build's built-in bundle: the bundle every install runs until its
+* first OTA, and the base that OTA's patch starts from.
+*/
+function BuiltInBundleCard({ detail }) {
+	const { build, builtInBundle, channel } = detail;
+	const target = nativeBuildTarget(build);
+	const childCount = builtInBundle?.childCount ?? 0;
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, {
+		className: "overflow-hidden shadow-sm",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, {
+			className: "border-b px-4 py-3",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, {
+				className: "text-sm",
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: "Built-in bundle" })
+			})
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, {
+			className: "flex flex-col gap-4 p-4 sm:p-6",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("dl", {
+					className: "flex flex-col gap-3",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Bundle ID",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+								className: "break-all font-mono text-xs",
+								translate: "no",
+								children: build.min_bundle_id
+							})
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "OTAs patching from it",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+								className: "tabular-nums",
+								children: childCount === 1 ? "1 bundle" : `${childCount} bundles`
+							})
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Scope",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+								className: "flex flex-wrap items-center gap-1.5",
+								children: [
+									/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
+										"aria-label": `Show the builds that embed ${channel}`,
+										search: { channel },
+										to: "/native-builds",
+										children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, {
+											translate: "no",
+											variant: "outline",
+											children: channel
+										})
+									}),
+									/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+										className: "text-xs",
+										children: platformLabel(build.platform)
+									}),
+									/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+										className: "text-xs text-muted-foreground",
+										children: ["· ", target.label]
+									}),
+									build.fingerprint_hash === null ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+										className: "font-mono text-xs",
+										translate: "no",
+										children: target.value
+									}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ShortHash, {
+										label: "fingerprint",
+										length: 12,
+										value: build.fingerprint_hash
+									})
+								]
+							})
+						}),
+						!build.build_number ? null : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Build number",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+								className: "font-mono text-xs tabular-nums",
+								translate: "no",
+								children: build.build_number
+							})
+						}),
+						isSubmitted(build) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Store",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StoreSubmissionBadge, {
+								build,
+								withTime: true
+							})
+						}) : null,
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Commit",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CommitLink, { hash: build.git_commit_hash })
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Row, {
+							label: "Created",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimestampDisplay, {
+								format: "both",
+								uuid: build.id
+							})
+						})
+					]
+				}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(BaselineStatus, { detail }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+					className: "text-xs text-muted-foreground",
+					children: "A store or test install of this build runs this bundle until its first OTA. That OTA downloads as a patch from this bundle when one exists, and as the full bundle otherwise."
+				})
+			]
+		})]
+	});
+}
+/**
+* A QR code of `value`, drawn as one SVG path with the standard four-module
+* quiet zone. Phone cameras read dark modules on a light ground, so the code
+* keeps its own two colors in both themes instead of the theme's tokens.
+*/
+function QrCode({ value, label, className }) {
+	const { size, path } = (0, import_react.useMemo)(() => qrCodePath(value), [value]);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("svg", {
+		"aria-label": label,
+		className: cn("aspect-square rounded-md", className),
+		role: "img",
+		shapeRendering: "crispEdges",
+		viewBox: `0 0 ${size} ${size}`,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("rect", {
+			fill: "#fff",
+			height: size,
+			width: size
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("path", {
+			d: path,
+			fill: "#000"
+		})]
+	});
+}
+/**
+* What an artifact installs on, where the file alone isn't enough: the card
+* says it once, under the QR code, or without one, in its place.
+*/
+var INSTALL_LIMITS = {
+	ipa: "The .ipa installs only on devices its signing profile allows (development or ad hoc); an App Store export reaches testers through TestFlight.",
+	aab: "The .aab installs through Google Play or bundletool, not from the file."
+};
+/**
+* What scanning a build's QR code gets, by its artifact. The install steps
+* beside it add only what this doesn't say, so the card says each thing once.
+*/
+var QR_CAPTIONS = {
+	apk: "Scan with an Android phone's camera, then open the APK to install it.",
+	ipa: `Scan to download. ${INSTALL_LIMITS.ipa}`,
+	aab: `Scan to download. ${INSTALL_LIMITS.aab}`,
+	app: "Scan to download the .app.zip on a Mac."
+};
+/**
+* The QR code of the build's download: the storage's URL, which a phone
+* opens without the console's sign-in, read again before it expires.
+*/
+function DownloadQrCode({ build }) {
+	const downloadUrl = useNativeBuildDownloadUrlQuery(build.id, true);
+	const url = downloadUrl.data?.url;
+	if (url === null) {
+		const limits = INSTALL_LIMITS[build.artifact_kind];
+		return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex flex-col gap-2 text-xs text-muted-foreground",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: "This storage gives no download link a phone can open without signing in, so there is no QR code. Download the build here, or open this page on the phone signed in to the console." }), limits ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", { children: limits }) : null]
+		});
+	}
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "flex flex-col items-center gap-2",
+		children: [url === void 0 ? downloadUrl.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Alert, {
+			variant: "destructive",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TriangleAlert, {}),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertTitle, { children: "The download link couldn't be created" }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertDescription, { children: downloadUrl.error.message })
+			]
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "size-48" }) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(QrCode, {
+			className: "size-48",
+			label: `Download ${nativeBuildFileName(build)}`,
+			value: url
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+			className: "max-w-56 text-center text-xs text-muted-foreground",
+			children: QR_CAPTIONS[build.artifact_kind]
+		})]
+	});
+}
+/** The store's label of a submitted build. */
+function SubmittedVersion({ build }) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+		className: "font-mono text-foreground",
+		translate: "no",
+		children: build.submitted_version ?? "this build"
+	});
+}
+/**
+* How else the artifact installs, beside its QR code's caption and its
+* download: none of it repeats the caption.
+*/
+function InstallSteps({ build }) {
+	switch (build.artifact_kind) {
+		case "apk": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex min-w-0 flex-col gap-2",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+				className: "text-xs text-muted-foreground",
+				children: "On an emulator or a phone over USB, download the APK and install it:"
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CopyableText, {
+				label: "the install command",
+				value: apkInstallCommand(build)
+			})]
+		});
+		case "app": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex min-w-0 flex-col gap-2",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+				className: "text-xs text-muted-foreground",
+				children: "It runs only in the iOS Simulator. Install it on the booted one:"
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CopyableText, {
+				label: "the install command",
+				value: simulatorInstallCommand(build)
+			})]
+		});
+		case "aab": return isSubmitted(build) ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+			className: "text-xs text-muted-foreground",
+			children: [
+				"Submitted to Google Play internal testing as",
+				" ",
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubmittedVersion, { build }),
+				". Testers get it once its release is rolled out; on an app Play Console hasn't published, the release is a draft you roll out in Play Console."
+			]
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex min-w-0 flex-col gap-2",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+				className: "text-xs text-muted-foreground",
+				children: "For testers, build and release to internal testing:"
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CopyableText, {
+				label: "the Google Play command",
+				value: "npx hot-updater google-play upload"
+			})]
+		});
+		case "ipa": return isSubmitted(build) ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+			className: "text-xs text-muted-foreground",
+			children: [
+				"On TestFlight as ",
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SubmittedVersion, { build }),
+				"."
+			]
+		}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			className: "flex min-w-0 flex-col gap-2",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+				className: "text-xs text-muted-foreground",
+				children: "Over USB, Xcode or Apple Configurator installs it. For testers:"
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CopyableText, {
+				label: "the TestFlight command",
+				value: "npx hot-updater testflight"
+			})]
+		});
+	}
+}
+/**
+* Installs one native build: every artifact by a QR code of its download,
+* which a phone scans, and by download here; an APK also with `adb`, a
+* simulator app with `xcrun simctl`, and an IPA's or an AAB's testers through
+* its store.
+*/
+function InstallCard({ build }) {
+	const fileName = nativeBuildFileName(build);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, {
+		className: "overflow-hidden shadow-sm",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, {
+			className: "border-b px-4 py-3",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, {
+				className: "text-sm",
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: "Install" })
+			})
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, {
+			className: "grid gap-6 p-4 sm:grid-cols-[12rem_minmax(0,1fr)] sm:p-6",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(DownloadQrCode, { build }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: "flex min-w-0 flex-col gap-4",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(InstallSteps, { build }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
+					className: buttonVariants({
+						className: "h-auto min-h-11 w-full min-w-0 py-2 whitespace-normal sm:min-h-8 sm:w-fit",
+						variant: "outline"
+					}),
+					download: true,
+					href: nativeBuildDownloadPath(build.id),
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Download, { "data-icon": "inline-start" }), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+						className: "text-left [overflow-wrap:anywhere]",
+						children: ["Download ", fileName]
+					})]
+				})]
+			})]
+		})]
+	});
+}
+var BUNDLE_DIFFING_GUIDE_URL = "https://hot-updater.dev/docs/guides/bundle-diffing#first-ota-update";
+/**
+* The bundles that patch from the build's built-in bundle, newest first, a
+* page at a time: the newest page comes with the build's page, and others
+* are read as they are asked for.
+*/
+function PatchesCard({ detail, page, onPage }) {
+	const paged = page.before !== void 0 || page.after !== void 0;
+	const query = useNativeBuildPatchesQuery(detail.build.min_bundle_id, page, paged);
+	const patches = paged ? query.data : detail.patches;
+	const { next, previous } = patches ?? {};
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, {
+		className: "overflow-hidden shadow-sm",
+		id: "patches",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, {
+			className: "border-b px-4 py-3",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, {
+				className: "text-sm",
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: "Patches from this build" })
+			})
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, {
+			className: "p-0",
+			children: [paged && query.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "p-4",
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Alert, {
+					variant: "destructive",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TriangleAlert, {}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertTitle, { children: "Patches couldn't be loaded" }),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertDescription, { children: query.error.message }),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertAction, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button$1, {
+							onClick: () => void query.refetch(),
+							size: "xs",
+							variant: "outline",
+							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(RefreshCw, { "data-icon": "inline-start" }), "Retry"]
+						}) })
+					]
+				})
+			}) : patches === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: "flex flex-col gap-2 p-4",
+				children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+						className: "sr-only",
+						children: "Loading patches"
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-4 w-full" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-4 w-2/3" })
+				]
+			}) : patches.data.length === 0 ? paged ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Empty, {
+				className: "py-10",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyTitle, { children: "No more patches" }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button$1, {
+					className: "min-h-11 sm:min-h-8",
+					onClick: () => onPage({}),
+					variant: "outline",
+					children: "Show the newest patches"
+				})]
+			}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Empty, {
+				className: "py-10",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyHeader, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyMedia, {
+						variant: "icon",
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GitBranch, {})
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyTitle, { children: "No patches from this build" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyDescription, { children: [
+						"A deploy adds a patch from this build's bundle while it is its scope's newest build and the deploy config turns patches on, with ",
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+							className: "font-mono",
+							children: "patch"
+						}),
+						" in",
+						" ",
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+							className: "font-mono",
+							children: "hot-updater.config.ts"
+						}),
+						"."
+					] })
+				] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("a", {
+					className: buttonVariants({
+						className: "min-h-11 sm:min-h-8",
+						variant: "outline"
+					}),
+					href: BUNDLE_DIFFING_GUIDE_URL,
+					rel: "noreferrer",
+					target: "_blank",
+					children: ["Bundle diffing guide", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowUpRight, { "data-icon": "inline-end" })]
+				}) })]
+			}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Table, {
+				"aria-busy": paged && query.isPlaceholderData,
+				"aria-label": "Patches from this build",
+				className: "table-fixed",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Target bundle" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "w-28",
+						children: "Patch size"
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "hidden w-32 sm:table-cell",
+						children: "Created"
+					})
+				] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableBody, { children: patches.data.map((patch) => /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+						className: "py-3 whitespace-normal",
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
+							className: "block font-mono text-xs [overflow-wrap:anywhere] underline-offset-4 hover:underline",
+							search: { bundleId: patch.bundleId },
+							title: patch.bundleId,
+							to: "/",
+							translate: "no",
+							children: patch.bundleId
+						})
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+						className: "text-xs tabular-nums",
+						children: formatByteSize(patch.byteSize)
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+						className: "hidden sm:table-cell",
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimestampDisplay, { uuid: patch.bundleId })
+					})
+				] }, patch.bundleId)) })]
+			}), next !== void 0 || previous !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("nav", {
+				"aria-label": "Patch pages",
+				className: "flex items-center justify-end gap-2 border-t px-4 py-2",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button$1, {
+					className: "min-h-11 sm:min-h-7",
+					disabled: previous === void 0 || paged && query.isPlaceholderData,
+					onClick: () => onPage({ after: previous }),
+					size: "sm",
+					variant: "ghost",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronLeft, { "data-icon": "inline-start" }), "Newer"]
+				}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button$1, {
+					className: "min-h-11 sm:min-h-7",
+					disabled: next === void 0 || paged && query.isPlaceholderData,
+					onClick: () => onPage({ before: next }),
+					size: "sm",
+					variant: "ghost",
+					children: ["Older", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronRight, { "data-icon": "inline-end" })]
+				})]
+			}) : null]
+		})]
+	});
+}
+/**
+* How an install of the build downloads `bundleId` as its first OTA: as the
+* patch from the built-in bundle when one exists, else the full bundle. The
+* newest page of patches decides it for every bundle down to the page's
+* oldest; an older bundle is unknown only when the page is full.
+*/
+var firstDownloadOf = (patches, bundleId) => {
+	const patch = patches.data.find((row) => row.bundleId === bundleId);
+	if (patch !== void 0) return {
+		kind: "patch",
+		byteSize: patch.byteSize
+	};
+	const oldest = patches.data.at(-1)?.bundleId;
+	return patches.next !== void 0 && oldest !== void 0 && bundleId < oldest ? { kind: "unknown" } : { kind: "full" };
+};
+function FirstDownloadCell({ download }) {
+	switch (download.kind) {
+		case "patch": return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+			className: "text-xs",
+			children: [
+				"Patch",
+				" ",
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+					className: "text-muted-foreground tabular-nums",
+					children: [
+						"(",
+						formatByteSize(download.byteSize),
+						")"
+					]
+				})
+			]
+		});
+		case "full": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+			className: "text-xs text-muted-foreground",
+			children: "Full bundle"
+		});
+		case "unknown": return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("a", {
+			className: "text-xs underline-offset-4 hover:underline",
+			href: "#patches",
+			children: "See patches"
+		});
+	}
+}
+/**
+* What the update check offers an install of the build now: its scope's
+* catalog at the build's app version, down to the built-in bundle, newest
+* first. It is the catalog of now, not the history.
+*/
+function ServedNowCard({ detail }) {
+	const { servedNow, patches, catalogScopeKey } = detail;
+	const scopeLink = /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+		className: "inline-flex items-center gap-0.5 underline-offset-4 hover:underline",
+		search: { scopeKey: catalogScopeKey },
+		to: "/",
+		children: ["All releases in this scope", /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ArrowUpRight, {
+			"aria-hidden": "true",
+			className: "size-3"
+		})]
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Card, {
+		className: "overflow-hidden shadow-sm",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardHeader, {
+			className: "border-b px-4 py-3",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardTitle, {
+				className: "text-sm",
+				children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", { children: "Served now" })
+			})
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CardContent, {
+			className: "p-0",
+			children: servedNow.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Empty, {
+				className: "py-10",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyHeader, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyMedia, {
+						variant: "icon",
+						children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PackageOpen, {})
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyTitle, { children: "No OTA for this build yet" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyDescription, { children: [
+						"No release in this build's scope is newer than its built-in bundle. Deploy one with",
+						" ",
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+							className: "font-mono",
+							children: "hot-updater deploy"
+						}),
+						", and it shows here."
+					] })
+				] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
+					className: buttonVariants({
+						className: "min-h-11 sm:min-h-8",
+						variant: "outline"
+					}),
+					search: { scopeKey: catalogScopeKey },
+					to: "/",
+					children: "All releases in this scope"
+				}) })]
+			}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Table, {
+				"aria-label": "Served now",
+				className: "table-fixed",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHeader, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Bundle" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "hidden w-40 md:table-cell",
+						children: "Rollout"
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "hidden w-32 sm:table-cell",
+						children: "Created"
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "w-32",
+						children: "First OTA download"
+					})
+				] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableBody, { children: servedNow.map((release) => {
+					const bundleId = release.bundleId;
+					const percentage = release.rolloutCohortCount / NUMERIC_COHORT_SIZE * 100;
+					return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, { children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+							className: "py-3 whitespace-normal",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+								className: "flex min-w-0 flex-col gap-1",
+								children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
+									className: "font-mono text-xs [overflow-wrap:anywhere] underline-offset-4 hover:underline",
+									search: { releaseId: release.releaseId },
+									title: bundleId,
+									to: "/",
+									translate: "no",
+									children: bundleId
+								}), release.message ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+									className: "text-xs text-muted-foreground",
+									children: release.message
+								}) : null]
+							})
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+							className: "hidden md:table-cell",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+								className: "flex flex-wrap gap-1",
+								children: [release.targetCohorts.length > 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, {
+									variant: "secondary",
+									children: release.targetCohorts.length === 1 ? "1 cohort" : `${release.targetCohorts.length} cohorts`
+								}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RolloutPercentageBadge, { percentage }), release.shouldForceUpdate ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, {
+									variant: "outline",
+									children: "Forced"
+								}) : null]
+							})
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+							className: "hidden sm:table-cell",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TimestampDisplay, { uuid: bundleId })
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(FirstDownloadCell, { download: firstDownloadOf(patches, bundleId) }) })
+					] }, release.releaseId);
+				}) })]
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+				className: "border-t px-4 py-3 text-xs text-muted-foreground",
+				children: ["What the update check serves an install of this build now, newest first: not the history. ", scopeLink]
+			})] })
+		})]
+	});
+}
+/**
+* One native build: how to install it, its built-in bundle as the base its
+* OTAs patch from, what an install is served now, and the patches from it.
+* The patch page is in the URL, so a link opens it.
+*/
+function NativeBuildDetailPage({ buildId, search, onSearchChange }) {
+	const query = useNativeBuildDetailQuery(buildId);
+	const detail = query.data;
+	const page = {
+		...search.patchesBefore === void 0 ? {} : { before: search.patchesBefore },
+		...search.patchesAfter === void 0 ? {} : { after: search.patchesAfter }
+	};
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "flex h-svh min-h-0 flex-col",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("header", {
+			className: "sticky top-0 z-10 flex shrink-0 items-center gap-x-2 border-b bg-background px-3 py-3 sm:min-h-12 sm:bg-card/70 sm:px-4 sm:backdrop-blur-sm",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)(SidebarTrigger, { className: "-ml-1 size-11 lg:size-7" }),
+				/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Link, {
+					className: buttonVariants({
+						className: "min-h-11 sm:min-h-7",
+						size: "sm",
+						variant: "ghost"
+					}),
+					to: "/native-builds",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ChevronLeft, { "data-icon": "inline-start" }), "Native builds"]
+				}),
+				detail ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("h1", {
+					className: "flex min-w-0 items-center gap-1.5 text-sm font-medium",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(PlatformIcon, {
+							className: "size-3.5 shrink-0 text-muted-foreground",
+							platform: detail.build.platform
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+							className: "min-w-0 [overflow-wrap:anywhere]",
+							children: [
+								platformLabel(detail.build.platform),
+								" ",
+								nativeBuildArtifacts[detail.build.artifact_kind].label,
+								" ·",
+								" ",
+								/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+									translate: "no",
+									children: detail.channel
+								})
+							]
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+							className: "hidden text-xs font-normal text-muted-foreground tabular-nums sm:inline",
+							children: formatByteSize(detail.build.byte_size)
+						})
+					]
+				}) : /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
+					className: "sr-only",
+					children: "Native build"
+				})
+			]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+			className: "min-h-0 min-w-0 flex-1 overflow-y-auto bg-muted/5 p-3 sm:p-6",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "mx-auto flex w-full max-w-5xl flex-col gap-4 sm:gap-6",
+				children: query.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Alert, {
+					variant: "destructive",
+					children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TriangleAlert, {}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertTitle, { children: "The native build couldn't be loaded" }),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertDescription, { children: query.error.message }),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(AlertAction, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button$1, {
+							onClick: () => void query.refetch(),
+							size: "xs",
+							variant: "outline",
+							children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(RefreshCw, { "data-icon": "inline-start" }), "Retry"]
+						}) })
+					]
+				}) : detail === void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+						className: "sr-only",
+						children: "Loading the native build"
+					}),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-56 w-full rounded-xl" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-64 w-full rounded-xl" })
+				] }) : detail === null ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Empty, {
+					className: "border py-16",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyHeader, { children: [
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyMedia, {
+							variant: "icon",
+							children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HardDrive, {})
+						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyTitle, { children: "Native build not found" }),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(EmptyDescription, { children: [
+							"No native build has this ID. It may have been deleted with",
+							" ",
+							/* @__PURE__ */ (0, import_jsx_runtime.jsx)("code", {
+								className: "font-mono",
+								children: "native-build delete"
+							}),
+							", or be from another console."
+						] })
+					] }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyContent, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Link, {
+						className: buttonVariants({
+							className: "min-h-11 sm:min-h-8",
+							variant: "outline"
+						}),
+						to: "/native-builds",
+						children: "Show all native builds"
+					}) })]
+				}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(InstallCard, { build: detail.build }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(BuiltInBundleCard, { detail }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ServedNowCard, { detail }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(PatchesCard, {
+						detail,
+						onPage: (next) => onSearchChange({
+							...next.before === void 0 ? {} : { patchesBefore: next.before },
+							...next.after === void 0 ? {} : { patchesAfter: next.after }
+						}),
+						page
+					})
+				] })
+			})
+		})]
+	});
+}
+function NativeBuildDetailRoute() {
+	const { buildId } = Route.useParams();
+	const search = Route.useSearch();
+	const navigate = Route.useNavigate();
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NativeBuildDetailPage, {
+		buildId,
+		onSearchChange: (next) => void navigate({
+			search: next,
+			replace: true
+		}),
+		search
+	});
+}
+//#endregion
+export { NativeBuildDetailRoute as component };