@baochunli/flakes 0.0.4 → 0.0.6

package/dist/node_modules/@flakes/console/.output/server/_chunks/RunsPage.mjs

@@ -1,11 +1,11 @@
 import { o as __toESM } from "../_runtime.mjs";
 import { c as require_jsx_runtime } from "../_libs/@radix-ui/react-arrow+[...].mjs";
 import { u as require_react } from "../_libs/@floating-ui/react-dom+[...].mjs";
-import { A as Inbox } from "../_libs/lucide-react.mjs";
-import { c as useRuns, t as cn } from "./utils.mjs";
-import { t as Button } from "./button.mjs";
+import { A as Inbox, r as X } from "../_libs/lucide-react.mjs";
+import { c as useProjects, m as useRuns, n as cn, t as Button } from "./button.mjs";
+import { n as projectLabelForRun } from "./project-navigation.mjs";
 import { a as CardTitle, i as CardHeader, n as CardContent, r as CardDescription, t as Card } from "./card.mjs";
-import { c as timeAgo, d as Skeleton, l as useClockTick, n as StatusBar, s as taskProgress, t as StateBadge, u as useFlash } from "./bits.mjs";
+import { c as timeAgo, d as Skeleton, f as Badge, l as useClockTick, n as StatusBar, s as taskProgress, t as StateBadge, u as useFlash } from "./bits.mjs";
 import { a as TableHeader, i as TableHead, n as TableBody, o as TableRow, r as TableCell, t as Table } from "./table.mjs";
 //#region src/views/RunsPage.tsx
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1);
@@ -30,8 +30,14 @@ var stateFilters = [
 ];
 function RunsPage(props) {
 	const filter = props.filter;
-	const allRuns = useRuns();
-	const runs = useRuns(filter);
+	const projectList = useProjects().data?.projects ?? [];
+	const selectedProject = props.projectKey === void 0 ? void 0 : projectList.find((project) => project.projectKey === props.projectKey);
+	const query = props.projectKey === void 0 ? { state: filter } : {
+		state: filter,
+		projectKey: props.projectKey
+	};
+	const allRuns = useRuns(props.projectKey === void 0 ? void 0 : { projectKey: props.projectKey });
+	const runs = useRuns(query);
 	const loadedAll = (allRuns.data?.pages ?? []).flatMap((page) => page.runs);
 	const loaded = (runs.data?.pages ?? []).flatMap((page) => page.runs);
 	useClockTick();
@@ -51,9 +57,15 @@ function RunsPage(props) {
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
 		className: "grid gap-5",
 		children: [
-			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
-				className: "text-lg font-semibold tracking-tight",
-				children: "Runs"
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+				className: "flex flex-wrap items-center gap-2",
+				children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
+					className: "text-lg font-semibold tracking-tight",
+					children: "Runs"
+				}), props.projectKey !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Badge, {
+					variant: "secondary",
+					children: selectedProject?.name ?? props.projectKey
+				}) : null]
 			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
 				className: "text-sm text-muted-foreground",
 				children: "Every run your account can read, newest first."
@@ -71,16 +83,22 @@ function RunsPage(props) {
 					baseline: rate ?? 0
 				})]
 			}),
-			/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 				className: "flex items-center gap-1.5",
-				children: stateFilters.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+				children: [stateFilters.map((entry) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
 					size: "sm",
 					"aria-pressed": filter === entry.value,
 					variant: filter === entry.value ? "secondary" : "ghost",
 					className: cn("h-7 px-2.5 font-mono text-xs uppercase tracking-[0.08em]", filter !== entry.value && "text-muted-foreground"),
 					onClick: () => props.onFilterChange(entry.value),
 					children: entry.label
-				}, entry.label))
+				}, entry.label)), props.projectKey !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button, {
+					size: "sm",
+					variant: "ghost",
+					className: "h-7 px-2.5 font-mono text-xs uppercase tracking-[0.08em] text-muted-foreground",
+					onClick: () => props.onProjectChange(void 0),
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, { className: "size-3" }), "All projects"]
+				}) : null]
 			}),
 			runs.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
 				className: "text-sm text-status-failed",
@@ -94,6 +112,10 @@ function RunsPage(props) {
 							className: "console-callout text-muted-foreground",
 							children: "Run"
 						}),
+						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+							className: "console-callout text-muted-foreground",
+							children: "Project"
+						}),
 						/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
 							className: "console-callout text-muted-foreground",
 							children: "State"
@@ -112,6 +134,7 @@ function RunsPage(props) {
 						})
 					] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableBody, { children: runs.isPending ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SkeletonRows, {}) : loaded.map((run) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunRow, {
 						run,
+						projects: projectList,
 						rising: rising.has(run.runId),
 						onOpen: () => props.onOpenRun(run.runId)
 					}, run.runId)) })] })
@@ -128,6 +151,7 @@ function RunsPage(props) {
 }
 function RunRow(props) {
 	const flash = useFlash(props.run.updatedAt);
+	const projectLabel = projectLabelForRun(props.projects, props.run);
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, {
 		"data-flash": flash,
 		className: cn("cursor-pointer", props.rising && "animate-in fade-in slide-in-from-bottom-1 duration-200"),
@@ -152,6 +176,11 @@ function RunRow(props) {
 					})
 				]
 			}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+				className: "block max-w-40 truncate font-mono text-xs text-muted-foreground",
+				title: projectLabel,
+				children: projectLabel ?? "—"
+			}) }),
 			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StateBadge, {
 				state: props.run.state,
 				id: props.run.runId
@@ -233,7 +262,8 @@ function SkeletonRows() {
 		1,
 		2,
 		3,
-		4
+		4,
+		5
 	].map((cell) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-4 w-full max-w-32" }) }, cell)) }, row)) });
 }
 function EmptyState(props) {

package/dist/node_modules/@flakes/console/.output/server/_chunks/SandboxesLens.mjs

@@ -1,5 +1,5 @@
 import { c as require_jsx_runtime } from "../_libs/@radix-ui/react-arrow+[...].mjs";
-import { t as cn } from "./utils.mjs";
+import { n as cn } from "./button.mjs";
 import { a as taskDisplayName, t as StateBadge } from "./bits.mjs";
 //#region src/views/SandboxesLens.tsx
 var import_jsx_runtime = require_jsx_runtime();

package/dist/node_modules/@flakes/console/.output/server/_chunks/SandboxesPage.mjs

@@ -1,10 +1,14 @@
+import { o as __toESM } from "../_runtime.mjs";
 import { c as require_jsx_runtime } from "../_libs/@radix-ui/react-arrow+[...].mjs";
-import { G as ArrowRight, N as ExternalLink, U as Boxes } from "../_libs/lucide-react.mjs";
-import { c as useRuns, s as useRunTasks, t as cn } from "./utils.mjs";
+import { u as require_react } from "../_libs/@floating-ui/react-dom+[...].mjs";
+import { D as LoaderCircle, I as ExternalLink, J as Boxes, X as ArrowRight, r as X, s as Trash2 } from "../_libs/lucide-react.mjs";
+import { D as managedSandboxDeleteAction, O as managedSandboxDeleteErrorMessage, h as useSandboxFleet, m as useRuns, n as cn, p as useRunTasks, r as useDeleteManagedSandbox, t as Button } from "./button.mjs";
 import { n as CardContent, t as Card } from "./card.mjs";
 import { c as timeAgo, d as Skeleton, l as useClockTick, o as taskOrdinals, t as StateBadge } from "./bits.mjs";
+import { a as TableHeader, i as TableHead, n as TableBody, o as TableRow, r as TableCell, t as Table } from "./table.mjs";
 import { t as SandboxesLens } from "./SandboxesLens.mjs";
 //#region src/views/SandboxesPage.tsx
+var import_react = /* @__PURE__ */ __toESM(require_react(), 1);
 var import_jsx_runtime = require_jsx_runtime();
 function SandboxesPage(props) {
 	const runs = useRuns();
@@ -13,26 +17,257 @@ function SandboxesPage(props) {
 	const selectedRun = loadedRuns.find((run) => run.runId === props.selectedRunId) ?? loadedRuns[0];
 	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("section", {
 		className: "grid gap-5",
-		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
-			className: "text-lg font-semibold tracking-tight",
-			children: "Sandboxes"
-		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
-			className: "text-sm text-muted-foreground",
-			children: "Sandboxes used by your runs. This is task/session context, not global fleet capacity."
-		})] }), runs.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+		children: [
+			/* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", { children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h1", {
+				className: "text-lg font-semibold tracking-tight",
+				children: "Sandboxes"
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+				className: "text-sm text-muted-foreground",
+				children: "Managed fleet state and sandbox placement by run."
+			})] }),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(ManagedSandboxFleet, {}),
+			/* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunPlacementHistory, {
+				runs,
+				loadedRuns,
+				selectedRun,
+				onSelectRun: props.onSelectRun,
+				onOpenRun: props.onOpenRun,
+				onOpenTask: props.onOpenTask
+			})
+		]
+	});
+}
+function ManagedSandboxFleet() {
+	const sandboxFleet = useSandboxFleet();
+	const deleteSandbox = useDeleteManagedSandbox();
+	const [confirmingSandboxId, setConfirmingSandboxId] = (0, import_react.useState)(null);
+	const [pendingSandboxId, setPendingSandboxId] = (0, import_react.useState)(null);
+	const [feedback, setFeedback] = (0, import_react.useState)(null);
+	async function confirmDelete(sandbox) {
+		setPendingSandboxId(sandbox.sandboxId);
+		setFeedback(null);
+		try {
+			const result = await deleteSandbox.mutateAsync(sandbox.sandboxId);
+			setConfirmingSandboxId(null);
+			setFeedback(deleteSuccessFeedback(result));
+		} catch (error) {
+			setFeedback({
+				tone: "error",
+				sandboxId: sandbox.sandboxId,
+				message: managedSandboxDeleteErrorMessage(error)
+			});
+		} finally {
+			setPendingSandboxId(null);
+		}
+	}
+	const rows = sandboxFleet.data?.sandboxes ?? [];
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Card, {
+		className: "py-0",
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(CardContent, {
+			className: "grid gap-3 p-4",
+			children: [
+				/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+					className: "flex min-w-0 flex-wrap items-center justify-between gap-2",
+					children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+						className: "min-w-0",
+						children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
+							className: "console-callout",
+							children: "Managed fleet"
+						}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+							className: "mt-1 text-xs text-muted-foreground",
+							"data-num": true,
+							children: sandboxFleet.isPending ? "Loading" : `${rows.length} sandboxes`
+						})]
+					})
+				}),
+				sandboxFleet.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+					className: "text-sm text-destructive",
+					children: ["Cannot list managed sandboxes: ", String(sandboxFleet.error)]
+				}) : sandboxFleet.isPending ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+					className: "grid gap-2",
+					children: [
+						0,
+						1,
+						2
+					].map((row) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Skeleton, { className: "h-10 w-full" }, row))
+				}) : rows.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+					className: "rounded-md border border-dashed py-8 text-center",
+					children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Boxes, { className: "mx-auto size-5 text-muted-foreground" }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("p", {
+						className: "mt-3 text-sm font-medium",
+						children: "No managed sandboxes"
+					})]
+				}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Table, { 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: "Sandbox" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Lifecycle" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Liveness" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Host" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, { children: "Updated" }),
+					/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableHead, {
+						className: "text-right",
+						children: "Delete"
+					})
+				] }) }), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableBody, { children: rows.map((sandbox) => /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ManagedSandboxRow, {
+					sandbox,
+					confirming: confirmingSandboxId === sandbox.sandboxId,
+					pending: pendingSandboxId === sandbox.sandboxId,
+					disabled: deleteSandbox.isPending,
+					onRequestDelete: () => {
+						setFeedback(null);
+						setConfirmingSandboxId(sandbox.sandboxId);
+					},
+					onCancelDelete: () => setConfirmingSandboxId(null),
+					onConfirmDelete: () => void confirmDelete(sandbox)
+				}, sandbox.sandboxId)) })] }),
+				feedback ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
+					role: feedback.tone === "error" ? "alert" : "status",
+					className: cn("text-xs", feedback.tone === "error" ? "text-destructive" : "text-muted-foreground"),
+					children: [feedback.sandboxId ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("span", {
+						className: "font-mono",
+						"data-num": true,
+						children: [
+							feedback.sandboxId,
+							":",
+							" "
+						]
+					}) : null, feedback.message]
+				}) : null
+			]
+		})
+	});
+}
+function ManagedSandboxRow(props) {
+	const action = managedSandboxDeleteAction(props.sandbox, props.pending, props.confirming);
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableRow, { children: [
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableCell, {
+			className: "max-w-[16rem]",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "truncate font-mono text-xs text-foreground",
+				title: props.sandbox.sandboxId,
+				"data-num": true,
+				children: props.sandbox.sandboxId
+			}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "mt-1 truncate font-mono text-[11px] text-muted-foreground",
+				title: props.sandbox.instanceId,
+				"data-num": true,
+				children: props.sandbox.instanceId
+			})]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StateBadge, {
+			state: props.sandbox.status,
+			id: props.sandbox.sandboxId
+		}) }),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StateBadge, {
+			state: props.sandbox.sandboxStatus ?? "unknown",
+			id: props.sandbox.sandboxId
+		}) }),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(TableCell, {
+			className: "max-w-[13rem]",
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "truncate font-mono text-xs",
+				title: props.sandbox.hostId,
+				"data-num": true,
+				children: props.sandbox.hostId
+			}), props.sandbox.hostPoolId ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", {
+				className: "mt-1 truncate font-mono text-[11px] text-muted-foreground",
+				title: props.sandbox.hostPoolId,
+				"data-num": true,
+				children: props.sandbox.hostPoolId
+			}) : null]
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+			className: "font-mono text-[11px] text-muted-foreground",
+			title: props.sandbox.updatedAt,
+			"data-num": true,
+			children: timeAgo(props.sandbox.updatedAt)
+		}),
+		/* @__PURE__ */ (0, import_jsx_runtime.jsx)(TableCell, {
+			className: "text-right",
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ManagedSandboxDeleteControls, {
+				action,
+				cleanupQueued: props.sandbox.status === "deleting",
+				disabled: props.disabled,
+				sandboxId: props.sandbox.sandboxId,
+				onRequestDelete: props.onRequestDelete,
+				onCancelDelete: props.onCancelDelete,
+				onConfirmDelete: props.onConfirmDelete
+			})
+		})
+	] });
+}
+function ManagedSandboxDeleteControls(props) {
+	if (props.action === "pending") return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button, {
+		size: "xs",
+		variant: "outline",
+		disabled: true,
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoaderCircle, { className: "size-3 animate-spin" }), "Deleting"]
+	});
+	if (props.action === "confirm") return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "flex justify-end gap-1",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(Button, {
+			type: "button",
+			size: "xs",
+			variant: "destructive",
+			disabled: props.disabled,
+			onClick: props.onConfirmDelete,
+			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Trash2, { className: "size-3" }), "Confirm delete"]
+		}), /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+			type: "button",
+			size: "icon-xs",
+			variant: "ghost",
+			"aria-label": `Cancel deleting ${props.sandboxId}`,
+			title: "Cancel",
+			disabled: props.disabled,
+			onClick: props.onCancelDelete,
+			children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(X, { className: "size-3" })
+		})]
+	});
+	if (props.action === "request") return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Button, {
+		type: "button",
+		size: "icon-xs",
+		variant: "ghost",
+		"aria-label": `Delete stale managed sandbox ${props.sandboxId}`,
+		title: "Delete stale sandbox",
+		disabled: props.disabled,
+		onClick: props.onRequestDelete,
+		children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Trash2, { className: "size-3" })
+	});
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsx)("span", {
+		className: "text-xs text-muted-foreground",
+		children: props.cleanupQueued ? "Cleanup queued" : "—"
+	});
+}
+function deleteSuccessFeedback(result) {
+	if (result.status === "cleanup_queued") return {
+		tone: "info",
+		sandboxId: result.sandboxId,
+		message: "Cleanup queued."
+	};
+	return {
+		tone: "info",
+		sandboxId: result.sandboxId,
+		message: "Deleted."
+	};
+}
+function RunPlacementHistory(props) {
+	return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+		className: "grid gap-3",
+		children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)("div", { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)("h2", {
+			className: "console-callout",
+			children: "Run placement history"
+		}) }), props.runs.isError ? /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("p", {
 			className: "text-sm text-destructive",
-			children: ["Cannot list runs: ", String(runs.error)]
-		}) : runs.isPending ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingLayout, {}) : loadedRuns.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyState, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
+			children: ["Cannot list runs: ", String(props.runs.error)]
+		}) : props.runs.isPending ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(LoadingLayout, {}) : props.loadedRuns.length === 0 ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(EmptyState, {}) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)("div", {
 			className: "grid min-w-0 gap-4 lg:grid-cols-[20rem_minmax(0,1fr)]",
 			children: [/* @__PURE__ */ (0, import_jsx_runtime.jsx)(RunChooser, {
-				runs: loadedRuns,
-				selectedRunId: selectedRun?.runId,
-				hasMore: runs.hasNextPage,
-				loadingMore: runs.isFetchingNextPage,
-				onLoadMore: () => void runs.fetchNextPage(),
+				runs: props.loadedRuns,
+				selectedRunId: props.selectedRun?.runId,
+				hasMore: props.runs.hasNextPage,
+				loadingMore: props.runs.isFetchingNextPage,
+				onLoadMore: () => void props.runs.fetchNextPage(),
 				onSelect: props.onSelectRun
-			}), selectedRun ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectedRunSandboxes, {
-				run: selectedRun,
+			}), props.selectedRun ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(SelectedRunSandboxes, {
+				run: props.selectedRun,
 				onOpenRun: props.onOpenRun,
 				onOpenTask: props.onOpenTask
 			}) : null]

package/dist/node_modules/@flakes/console/.output/server/_chunks/TranscriptPage.mjs

@@ -2,11 +2,10 @@ import { o as __toESM } from "../_runtime.mjs";
 import { c as require_jsx_runtime } from "../_libs/@radix-ui/react-arrow+[...].mjs";
 import { d as Link } from "../_libs/@tanstack/react-router+[...].mjs";
 import { u as require_react } from "../_libs/@floating-ui/react-dom+[...].mjs";
-import { B as ChevronRight, K as ArrowDown, V as ChevronLeft, g as Route, h as Save, p as SendHorizontal, r as X, v as Pencil, x as MessageSquarePlus } from "../_libs/lucide-react.mjs";
+import { G as ChevronRight, K as ChevronLeft, Z as ArrowDown, g as Route, h as Save, p as SendHorizontal, r as X, v as Pencil, x as MessageSquarePlus } from "../_libs/lucide-react.mjs";
 import { t as Markdown } from "../_libs/react-markdown+[...].mjs";
 import { t as remarkGfm } from "../_libs/remark-gfm.mjs";
-import { d as useTaskActivity, f as useTaskPiSession, h as ApiError, l as useSaveTaskWorkpad, m as useTaskWorkpad, p as useTaskPiSessionRaw, s as useRunTasks, t as cn, u as useSendTaskMessage } from "./utils.mjs";
-import { t as Button } from "./button.mjs";
+import { S as useTaskWorkpad, _ as useSendTaskMessage, b as useTaskPiSession, g as useSaveTaskWorkpad, k as ApiError, n as cn, p as useRunTasks, t as Button, x as useTaskPiSessionRaw, y as useTaskActivity } from "./button.mjs";
 import { a as taskDisplayName, d as Skeleton, f as Badge, l as useClockTick, o as taskOrdinals, r as fmtTime, t as StateBadge } from "./bits.mjs";
 //#region src/views/TranscriptView.tsx
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1);

package/dist/node_modules/@flakes/console/.output/server/_chunks/bits.mjs

@@ -2,7 +2,7 @@ import { o as __toESM } from "../_runtime.mjs";
 import { c as require_jsx_runtime, i as Slot } from "../_libs/@radix-ui/react-arrow+[...].mjs";
 import { u as require_react } from "../_libs/@floating-ui/react-dom+[...].mjs";
 import { t as cva } from "../_libs/class-variance-authority+clsx.mjs";
-import { t as cn } from "./utils.mjs";
+import { n as cn } from "./button.mjs";
 //#region src/components/ui/badge.tsx
 var import_react = /* @__PURE__ */ __toESM(require_react(), 1);
 var import_jsx_runtime = require_jsx_runtime();