@dxos/plugin-github 0.13.0 → 0.16.0-next-60712ab191a99ba90316cc4be753e9e11b17100a

package/dist/lib/chunk-PullRequestArticle.mjs

@@ -14,11 +14,11 @@ import * as Schema from "effect/Schema";
 import * as AppCapabilities from "@dxos/app-toolkit/AppCapabilities";
 import * as LayoutOperation from "@dxos/app-toolkit/LayoutOperation";
 import { log } from "@dxos/log";
+import { useObject, useQuery } from "@dxos/echo-react";
 import * as Card from "@dxos/react-ui/Card";
 import * as Hooks from "@dxos/react-ui/Hooks";
 import * as Layout from "@dxos/react-ui/Layout";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { useObject, useQuery } from "@dxos/echo-react";
 import * as Hooks$1 from "@dxos/app-framework/Hooks";
 import * as ToolkitHooks from "@dxos/app-toolkit/Hooks";
 import * as EffectEx from "@dxos/effect/EffectEx";
@@ -40,6 +40,7 @@ import { TextEditor } from "@dxos/react-ui-editor";
 import { DxAnchor } from "@dxos/lit-ui/react";
 import { MarkdownLink, MarkdownView } from "@dxos/react-ui-markdown";
 import * as Icon from "@dxos/react-ui/Icon";
+import * as Typography from "@dxos/react-ui/Typography";
 import { Masonry } from "@dxos/react-ui-masonry";
 //#region src/components/PullRequestFiles/files.ts
 /** Id of the synthetic root the tree model anchors its top-level rows to; never rendered. */
@@ -575,7 +576,7 @@ var ArtifactPill = ({ artifact, children }) => {
 				size: "sm",
 				classNames: "bg-input-surface text-fg font-normal ring-inset ring ring-neutral-border hover:bg-hover-surface hover:ring-info-border align-baseline",
 				icon: artifactIcon[artifact.kind],
-				iconClassNames: artifact.kind === "video" ? "text-violet-500" : "text-sky-500",
+				iconClassNames: artifact.kind === "video" ? "text-violet-text" : "text-sky-text",
 				label,
 				"data-testid": "pull-request.artifact.pill"
 			})
@@ -619,50 +620,85 @@ var outcomeOrder = [
 	"neutral",
 	"skipped"
 ];
-/** `4m 12s`, or undefined for a run that has not both started and finished. */
-var formatDuration = (startedAt, completedAt) => {
-	if (!startedAt || !completedAt) return;
-	const seconds = Math.max(0, Math.round((Date.parse(completedAt) - Date.parse(startedAt)) / 1e3));
+/**
+* `4m 12s` from start to finish, or to `now` for a run still in progress;
+* undefined for a run that has not started, or has not finished when no `now` is given.
+*/
+var formatDuration = (startedAt, completedAt, now) => {
+	const end = completedAt ? Date.parse(completedAt) : now;
+	if (!startedAt || end === void 0) return;
+	const seconds = Math.max(0, Math.round((end - Date.parse(startedAt)) / 1e3));
 	if (Number.isNaN(seconds)) return;
 	const minutes = Math.floor(seconds / 60);
 	return minutes > 0 ? `${minutes}m ${seconds % 60}s` : `${seconds}s`;
 };
+/** The current time, re-rendering once a second while `active` so elapsed times stay current. */
+var useNow = (active) => {
+	const [now, setNow] = useState(() => Date.now());
+	useEffect(() => {
+		if (!active) return;
+		setNow(Date.now());
+		const interval = setInterval(() => setNow(Date.now()), 1e3);
+		return () => clearInterval(interval);
+	}, [active]);
+	return now;
+};
+/** The row's value: GitHub's run id, or its name and URL for a run recorded without one. */
+var checkRunId = (run) => run.id !== void 0 ? String(run.id) : `${run.name}-${run.url ?? ""}`;
 /** Sorts runs by what needs attention, then by name so shards read in order. */
 var sortCheckRuns = (runs) => [...runs].sort((a, b) => outcomeOrder.indexOf(a.outcome) - outcomeOrder.indexOf(b.outcome) || a.name.localeCompare(b.name, void 0, { numeric: true }));
-/** Every check on the head commit: its outcome, how long it took, and its logs a click away. */
+/** Every check on the head commit: its outcome, how long it took, and a button to its logs. */
 var CheckRunList = ({ runs }) => {
 	const { t } = Hooks.useTranslation(meta.profile.key);
 	const sorted = useMemo(() => runs ? sortCheckRuns(runs) : void 0, [runs]);
 	const summary = useCheckSummary(runs);
+	const now = useNow(runs?.some((run) => run.outcome === "pending" && run.startedAt) ?? false);
+	const [current, setCurrent] = useState();
 	if (!sorted || sorted.length === 0) return /* @__PURE__ */ jsx(Status.Empty, { children: t(sorted ? "no-checks.message" : "checks-loading.message") });
 	return /* @__PURE__ */ jsx(Listbox.Root, {
 		items: sorted.map((run) => ({
-			value: `${run.name}-${run.url ?? ""}`,
+			value: checkRunId(run),
 			label: run.name
 		})),
+		columns: "var(--dx-block-size) minmax(0, 1fr) max-content var(--dx-block-size)",
+		onHighlightChange: (value) => value && setCurrent(value),
 		children: /* @__PURE__ */ jsx(Listbox.Content, {
 			"aria-label": summary,
 			"data-testid": "pull-request.checks",
 			children: sorted.map((run) => {
 				const { icon, classNames } = outcomeIcon[run.outcome];
-				const duration = formatDuration(run.startedAt, run.completedAt);
+				const duration = formatDuration(run.startedAt, run.completedAt, run.outcome === "pending" ? now : void 0);
 				const detail = run.conclusion && run.conclusion !== run.outcome && run.conclusion !== "failure" ? run.conclusion.replace(/_/g, " ") : void 0;
-				const outcome = run.outcome === "skipped" ? t("check-outcome.skipped.label") : duration ?? t(`check-outcome.${run.outcome}.label`);
+				const outcome = run.outcome === "skipped" ? t("check-outcome.skipped.label") : run.outcome === "pending" ? [t("check-outcome.pending.label"), duration].filter(Boolean).join(" · ") : duration ?? t(`check-outcome.${run.outcome}.label`);
 				const url = run.url;
+				const id = checkRunId(run);
 				return /* @__PURE__ */ jsxs(Listbox.Item, {
-					id: `${run.name}-${url ?? ""}`,
+					id,
+					current: id === current,
+					highlightOnHover: false,
+					classNames: "dx-hover",
 					"data-outcome": run.outcome,
 					"data-testid": "pull-request.check",
-					onClick: url ? () => window.open(url, "_blank", "noopener,noreferrer") : void 0,
 					children: [
 						/* @__PURE__ */ jsx(Listbox.ItemIcon, {
 							icon,
 							classNames
 						}),
 						/* @__PURE__ */ jsx(Listbox.ItemText, { children: run.name }),
-						/* @__PURE__ */ jsx(Listbox.ItemDescription, { children: [detail, outcome].filter(Boolean).join(" · ") })
+						/* @__PURE__ */ jsx(Listbox.ItemDescription, {
+							classNames: "text-right tabular-nums",
+							children: [detail, outcome].filter(Boolean).join(" · ")
+						}),
+						url ? /* @__PURE__ */ jsx(Button.Root, {
+							iconOnly: true,
+							variant: "ghost",
+							icon: "ph--arrow-square-out--regular",
+							label: t("open-link.label"),
+							"data-testid": "pull-request.check.open",
+							onClick: () => window.open(url, "_blank", "noopener,noreferrer")
+						}) : /* @__PURE__ */ jsx("span", {})
 					]
-				}, `${run.name}-${url ?? ""}`);
+				}, id);
 			})
 		})
 	});
@@ -944,9 +980,12 @@ var PullRequestOverview = ({ body, details, runs }) => {
 					label: t("related.label"),
 					children: /* @__PURE__ */ jsx(RelatedCards, { items: related })
 				}),
-				/* @__PURE__ */ jsx(Form.FieldSet, {
-					label: checkSummary,
-					children: /* @__PURE__ */ jsx(CheckRunList, { runs })
+				/* @__PURE__ */ jsxs(Form.FieldSet, {
+					label: t("checks.label"),
+					children: [runs && runs.length > 0 && /* @__PURE__ */ jsx(Typography.Text, {
+						"data-testid": "pull-request.checks.summary",
+						children: checkSummary
+					}), /* @__PURE__ */ jsx(CheckRunList, { runs })]
 				})
 			] })
 		})
@@ -1004,9 +1043,11 @@ var ciHue = {
 /** One line answering where the pull request stands: open or merged, approved or not, CI green or red. */
 var PullRequestStatus = ({ reference, title, state, review, ci }) => {
 	const { t } = Hooks.useTranslation(meta.profile.key);
-	return /* @__PURE__ */ jsxs("div", {
+	return /* @__PURE__ */ jsxs(Layout.Flex, {
+		align: "center",
+		gap: "sm",
 		role: "status",
-		className: "flex items-center gap-2 px-3 py-1.5 border-b border-separator-subtle text-sm min-w-0",
+		classNames: "px-3 py-1.5 border-b border-separator-subtle text-sm min-w-0",
 		"data-testid": "pull-request.status",
 		children: [
 			/* @__PURE__ */ jsx("span", {
@@ -1018,8 +1059,10 @@ var PullRequestStatus = ({ reference, title, state, review, ci }) => {
 				className: "truncate grow",
 				children: title
 			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-2 shrink-0 ml-auto",
+			/* @__PURE__ */ jsxs(Layout.Flex, {
+				align: "center",
+				gap: "sm",
+				classNames: "shrink-0 ml-auto",
 				children: [
 					state && /* @__PURE__ */ jsx("span", {
 						className: "dx-tag dx-tag-inline",