@burdenoff/microfe-cosmicintersection 2026.704.2 → 2026.704.3

package/dist/cosmicintersection/pages/datasets/DatasetsPage.js

@@ -1,27 +1,32 @@
 import { useCosmicIntersection as e } from "../../context/CosmicIntersectionContext.js";
 import { notify as t } from "../../lib/toast.js";
-import { useCosArchiveDatasetMutation as n, useCosCollectionsQuery as r, useCosDatasetsQuery as i, useCosPublishDatasetMutation as a, useCosSourcesQuery as o } from "../../api/cosmicApi.js";
-import s from "../../components/ActionMenu.js";
-import c from "../../components/EmptyState.js";
-import ee from "../../components/ErrorState.js";
-import l from "../../components/LoadingState.js";
-import u from "../../components/PageLayout.js";
-import d, { usePagination as f } from "../../components/Pagination.js";
-import p, { formatEnumLabel as m } from "../../components/StatusBadge.js";
+import { useCosArchiveDatasetMutation as n, useCosCollectionsQuery as r, useCosDatasetsQuery as i, useCosPublishDatasetMutation as a, useCosSourcesQuery as ee } from "../../api/cosmicApi.js";
+import o from "../../components/ActionMenu.js";
+import s from "../../components/EmptyState.js";
+import c from "../../components/ErrorState.js";
+import te from "../../components/LoadingState.js";
+import l from "../../components/PageLayout.js";
+import u, { usePagination as d } from "../../components/Pagination.js";
+import f, { formatEnumLabel as p } from "../../components/StatusBadge.js";
 import "../../components/index.js";
-import { useMemo as h, useState as g } from "react";
-import { Fragment as _, jsx as v, jsxs as y } from "react/jsx-runtime";
-import { Database as b, Plus as x } from "lucide-react";
-import { Badge as S, Button as C, Select as w, SelectContent as T, SelectItem as E, SelectTrigger as D, SelectValue as O, Table as k, TableBody as te, TableCell as A, TableHead as j, TableHeader as M, TableRow as N } from "@burdenoff/fe-libs/ui";
+import { useMemo as m, useState as h } from "react";
+import { Fragment as g, jsx as _, jsxs as v } from "react/jsx-runtime";
+import { Compass as ne, Database as re, Plus as y } from "lucide-react";
+import { Badge as b, Button as x, Select as S, SelectContent as C, SelectItem as w, SelectTrigger as T, SelectValue as E, Table as ie, TableBody as ae, TableCell as D, TableHead as O, TableHeader as oe, TableRow as k } from "@burdenoff/fe-libs/ui";
 //#region src/cosmicintersection/pages/datasets/DatasetsPage.tsx
-var P = [
+var se = [
 	"DRAFT",
 	"INGESTING",
 	"AVAILABLE",
 	"DEPRECATED",
 	"ARCHIVED"
-], F = "__all__";
-function I(e) {
+], ce = [
+	"PUBLIC",
+	"WORKSPACE",
+	"RESTRICTED",
+	"EMBARGOED"
+], A = "__all__", le = 200;
+function j(e) {
 	if (!e) return "—";
 	let t = Number(e);
 	if (!Number.isFinite(t) || t <= 0) return "—";
@@ -36,217 +41,370 @@ function I(e) {
 	for (; r >= 1024 && i < n.length - 1;) r /= 1024, i += 1;
 	return `${r >= 10 || i === 0 ? Math.round(r) : r.toFixed(1)} ${n[i]}`;
 }
-function L(e) {
+function M(e) {
 	if (!e) return "—";
 	let t = new Date(e);
 	return Number.isNaN(t.getTime()) ? "—" : t.toLocaleDateString();
 }
-function R() {
-	let { navigate: R } = e(), [z, B] = g(F), [V, H] = g(F), [U, W] = g(F), G = f({
+function N() {
+	let { navigate: N } = e(), [P, F] = h(A), [I, L] = h(A), [R, z] = h(A), [B, V] = h(A), [H, U] = h(A), W = d({
 		pageSize: 20,
-		resetKey: `${z}|${V}|${U}`
-	}), { data: K, loading: q, error: J, refetch: Y } = i({
-		status: z === F ? void 0 : z,
-		sourceId: V === F ? void 0 : V,
-		collectionId: U === F ? void 0 : U,
+		resetKey: `${P}|${I}|${R}|${B}|${H}`
+	}), { data: G, loading: K, error: ue, refetch: q } = i({
+		status: P === A ? void 0 : P,
+		sourceId: I === A ? void 0 : I,
+		collectionId: R === A ? void 0 : R,
+		format: B === A ? void 0 : B,
+		accessLevel: H === A ? void 0 : H,
 		pagination: {
-			limit: G.limit,
-			offset: G.offset
+			limit: W.limit,
+			offset: W.offset
 		}
-	}), X = o({ pagination: {
+	}), de = ee({ pagination: {
 		limit: 100,
 		offset: 0
-	} }), Z = r(), [ne] = a(), [re] = n(), Q = h(() => K?.cosListDatasets?.items ?? [], [K]), ie = K?.cosListDatasets?.pageInfo, ae = X.data?.cosListSources?.items ?? [], oe = Z.data?.cosListCollections ?? [], $ = z === F && V === F && U === F, se = async (e) => {
-		(await ne({ variables: { id: e.id } })).data?.cosPublishDataset && (t.success("Dataset published", `“${e.name}” is now available.`), await Y());
-	}, ce = async (e) => {
-		let n = await re({ variables: { id: e.id } });
+	} }), fe = r(), J = i({ pagination: {
+		limit: le,
+		offset: 0
+	} }), [pe] = a(), [me] = n(), Y = m(() => G?.cosListDatasets?.items ?? [], [G]), he = G?.cosListDatasets?.pageInfo, ge = de.data?.cosListSources?.items ?? [], _e = fe.data?.cosListCollections ?? [], X = m(() => {
+		let e = /* @__PURE__ */ new Set();
+		for (let t of J.data?.cosListDatasets?.items ?? []) t.format && e.add(t.format);
+		return [...e].sort((e, t) => e.localeCompare(t));
+	}, [J.data]), Z = P === A && I === A && R === A && B === A && H === A, Q = async (e) => {
+		(await pe({ variables: { id: e.id } })).data?.cosPublishDataset && (t.success("Dataset published", `“${e.name}” is now available.`), await q());
+	}, $ = async (e) => {
+		let n = await me({ variables: { id: e.id } });
 		if (n.error) throw Error(n.error.message);
 		if (!n.data?.cosArchiveDataset) throw t.error("Could not archive dataset", "The server did not confirm the change."), Error("Archive not confirmed");
-		t.success("Dataset archived"), await Y();
+		t.success("Dataset archived"), await q();
 	};
-	return /* @__PURE__ */ v(u, {
+	return /* @__PURE__ */ _(l, {
 		title: "Datasets",
 		description: "Federated science datasets — catalog, schema, lineage and access, all from live data.",
-		actions: /* @__PURE__ */ y(C, {
+		actions: /* @__PURE__ */ v(g, { children: [/* @__PURE__ */ v(x, {
+			type: "button",
+			variant: "outline",
+			onClick: () => N("discovery"),
+			children: [/* @__PURE__ */ _(ne, { className: "size-4" }), "Discover"]
+		}), /* @__PURE__ */ v(x, {
 			type: "button",
-			onClick: () => R("datasets/create"),
-			children: [/* @__PURE__ */ v(x, { className: "size-4" }), "New dataset"]
-		}),
-		children: /* @__PURE__ */ y("div", {
+			onClick: () => N("datasets/create"),
+			children: [/* @__PURE__ */ _(y, { className: "size-4" }), "New dataset"]
+		})] }),
+		children: /* @__PURE__ */ v("div", {
 			className: "space-y-4",
-			children: [/* @__PURE__ */ y("div", {
+			children: [/* @__PURE__ */ v("div", {
 				className: "flex flex-wrap items-end gap-3",
 				children: [
-					/* @__PURE__ */ y("label", {
+					/* @__PURE__ */ v("label", {
 						className: "space-y-1 text-sm",
-						children: [/* @__PURE__ */ v("span", {
+						children: [/* @__PURE__ */ _("span", {
 							className: "block font-medium text-text-primary",
 							children: "Status"
-						}), /* @__PURE__ */ y(w, {
-							value: z,
-							onValueChange: B,
-							children: [/* @__PURE__ */ v(D, {
+						}), /* @__PURE__ */ v(S, {
+							value: P,
+							onValueChange: F,
+							children: [/* @__PURE__ */ _(T, {
 								"aria-label": "Filter by status",
 								className: "w-44",
-								children: /* @__PURE__ */ v(O, {})
-							}), /* @__PURE__ */ y(T, { children: [/* @__PURE__ */ v(E, {
-								value: F,
+								children: /* @__PURE__ */ _(E, {})
+							}), /* @__PURE__ */ v(C, { children: [/* @__PURE__ */ _(w, {
+								value: A,
 								children: "All statuses"
-							}), P.map((e) => /* @__PURE__ */ v(E, {
+							}), se.map((e) => /* @__PURE__ */ _(w, {
 								value: e,
-								children: m(e)
+								children: p(e)
 							}, e))] })]
 						})]
 					}),
-					/* @__PURE__ */ y("label", {
+					/* @__PURE__ */ v("label", {
 						className: "space-y-1 text-sm",
-						children: [/* @__PURE__ */ v("span", {
+						children: [/* @__PURE__ */ _("span", {
 							className: "block font-medium text-text-primary",
 							children: "Source"
-						}), /* @__PURE__ */ y(w, {
-							value: V,
-							onValueChange: H,
-							children: [/* @__PURE__ */ v(D, {
+						}), /* @__PURE__ */ v(S, {
+							value: I,
+							onValueChange: L,
+							children: [/* @__PURE__ */ _(T, {
 								"aria-label": "Filter by source",
 								className: "w-48",
-								children: /* @__PURE__ */ v(O, {})
-							}), /* @__PURE__ */ y(T, { children: [/* @__PURE__ */ v(E, {
-								value: F,
+								children: /* @__PURE__ */ _(E, {})
+							}), /* @__PURE__ */ v(C, { children: [/* @__PURE__ */ _(w, {
+								value: A,
 								children: "All sources"
-							}), ae.map((e) => /* @__PURE__ */ v(E, {
+							}), ge.map((e) => /* @__PURE__ */ _(w, {
 								value: e.id,
 								children: e.name
 							}, e.id))] })]
 						})]
 					}),
-					/* @__PURE__ */ y("label", {
+					/* @__PURE__ */ v("label", {
 						className: "space-y-1 text-sm",
-						children: [/* @__PURE__ */ v("span", {
+						children: [/* @__PURE__ */ _("span", {
 							className: "block font-medium text-text-primary",
 							children: "Collection"
-						}), /* @__PURE__ */ y(w, {
-							value: U,
-							onValueChange: W,
-							children: [/* @__PURE__ */ v(D, {
+						}), /* @__PURE__ */ v(S, {
+							value: R,
+							onValueChange: z,
+							children: [/* @__PURE__ */ _(T, {
 								"aria-label": "Filter by collection",
 								className: "w-48",
-								children: /* @__PURE__ */ v(O, {})
-							}), /* @__PURE__ */ y(T, { children: [/* @__PURE__ */ v(E, {
-								value: F,
+								children: /* @__PURE__ */ _(E, {})
+							}), /* @__PURE__ */ v(C, { children: [/* @__PURE__ */ _(w, {
+								value: A,
 								children: "All collections"
-							}), oe.map((e) => /* @__PURE__ */ v(E, {
+							}), _e.map((e) => /* @__PURE__ */ _(w, {
 								value: e.id,
 								children: e.name
 							}, e.id))] })]
 						})]
+					}),
+					/* @__PURE__ */ v("label", {
+						className: "space-y-1 text-sm",
+						children: [/* @__PURE__ */ _("span", {
+							className: "block font-medium text-text-primary",
+							children: "Format"
+						}), /* @__PURE__ */ v(S, {
+							value: B,
+							onValueChange: V,
+							disabled: X.length === 0,
+							children: [/* @__PURE__ */ _(T, {
+								"aria-label": "Filter by format",
+								className: "w-40",
+								children: /* @__PURE__ */ _(E, {})
+							}), /* @__PURE__ */ v(C, { children: [/* @__PURE__ */ _(w, {
+								value: A,
+								children: "All formats"
+							}), X.map((e) => /* @__PURE__ */ _(w, {
+								value: e,
+								children: e
+							}, e))] })]
+						})]
+					}),
+					/* @__PURE__ */ v("label", {
+						className: "space-y-1 text-sm",
+						children: [/* @__PURE__ */ _("span", {
+							className: "block font-medium text-text-primary",
+							children: "Access"
+						}), /* @__PURE__ */ v(S, {
+							value: H,
+							onValueChange: U,
+							children: [/* @__PURE__ */ _(T, {
+								"aria-label": "Filter by access level",
+								className: "w-44",
+								children: /* @__PURE__ */ _(E, {})
+							}), /* @__PURE__ */ v(C, { children: [/* @__PURE__ */ _(w, {
+								value: A,
+								children: "All access levels"
+							}), ce.map((e) => /* @__PURE__ */ _(w, {
+								value: e,
+								children: p(e)
+							}, e))] })]
+						})]
 					})
 				]
-			}), q ? /* @__PURE__ */ v(l, {
+			}), K ? /* @__PURE__ */ _(te, {
 				variant: "rows",
 				rows: 6,
 				label: "Loading datasets…"
-			}) : J ? /* @__PURE__ */ v(ee, {
+			}) : ue ? /* @__PURE__ */ _(c, {
 				message: "We could not load datasets. Please try again.",
-				onRetry: () => void Y()
-			}) : Q.length === 0 ? /* @__PURE__ */ v(c, {
-				icon: b,
-				title: $ ? "No datasets yet." : "No datasets match these filters.",
-				description: $ ? "Register your first dataset to start federating science data across sources." : "Try a different status, source or collection.",
-				action: $ ? /* @__PURE__ */ y(C, {
+				onRetry: () => void q()
+			}) : Y.length === 0 ? /* @__PURE__ */ _(s, {
+				icon: re,
+				title: Z ? "No datasets yet." : "No datasets match these filters.",
+				description: Z ? "Register your first dataset to start federating science data across sources." : "Try a different status, source, collection, format or access level.",
+				action: Z ? /* @__PURE__ */ v(x, {
 					type: "button",
-					onClick: () => R("datasets/create"),
-					children: [/* @__PURE__ */ v(x, { className: "size-4" }), "New dataset"]
+					onClick: () => N("datasets/create"),
+					children: [/* @__PURE__ */ _(y, { className: "size-4" }), "New dataset"]
 				}) : void 0
-			}) : /* @__PURE__ */ y(_, { children: [/* @__PURE__ */ v("div", {
-				className: "rounded-card border border-border-default bg-bg-elevated",
-				children: /* @__PURE__ */ y(k, { children: [/* @__PURE__ */ v(M, { children: /* @__PURE__ */ y(N, { children: [
-					/* @__PURE__ */ v(j, { children: "Name" }),
-					/* @__PURE__ */ v(j, { children: "Status" }),
-					/* @__PURE__ */ v(j, { children: "Access" }),
-					/* @__PURE__ */ v(j, { children: "Format" }),
-					/* @__PURE__ */ v(j, {
-						className: "text-right",
-						children: "Size"
-					}),
-					/* @__PURE__ */ v(j, { children: "Tags" }),
-					/* @__PURE__ */ v(j, { children: "Updated" }),
-					/* @__PURE__ */ v(j, {
-						className: "text-right",
-						children: "Actions"
-					})
-				] }) }), /* @__PURE__ */ v(te, { children: Q.map((e) => /* @__PURE__ */ y(N, {
-					className: "cursor-pointer",
-					onClick: () => R(`datasets/${e.id}`),
-					children: [
-						/* @__PURE__ */ y(A, { children: [/* @__PURE__ */ v("span", {
-							className: "font-medium text-text-primary",
-							children: e.name
-						}), e.description ? /* @__PURE__ */ v("p", {
-							className: "mt-0.5 line-clamp-1 max-w-xs text-xs text-text-secondary",
-							children: e.description
-						}) : null] }),
-						/* @__PURE__ */ v(A, { children: /* @__PURE__ */ v(p, { status: e.status }) }),
-						/* @__PURE__ */ v(A, { children: /* @__PURE__ */ v("span", {
-							className: "text-sm text-text-secondary",
-							children: m(e.accessLevel)
-						}) }),
-						/* @__PURE__ */ v(A, { children: /* @__PURE__ */ v("span", {
-							className: "text-sm text-text-secondary",
-							children: e.format || "—"
-						}) }),
-						/* @__PURE__ */ v(A, {
-							className: "text-right text-sm tabular-nums text-text-secondary",
-							children: I(e.sizeBytes)
-						}),
-						/* @__PURE__ */ v(A, { children: /* @__PURE__ */ v("div", {
-							className: "flex max-w-[12rem] flex-wrap gap-1",
-							children: e.tags.length === 0 ? /* @__PURE__ */ v("span", {
-								className: "text-xs text-text-secondary",
-								children: "—"
-							}) : /* @__PURE__ */ y(_, { children: [e.tags.slice(0, 2).map((e) => /* @__PURE__ */ v(S, {
-								variant: "secondary",
-								children: e
-							}, e)), e.tags.length > 2 ? /* @__PURE__ */ y(S, {
-								variant: "secondary",
-								children: ["+", e.tags.length - 2]
-							}) : null] })
-						}) }),
-						/* @__PURE__ */ v(A, {
-							className: "whitespace-nowrap text-sm text-text-secondary",
-							children: L(e.updatedAt)
+			}) : /* @__PURE__ */ v(g, { children: [
+				/* @__PURE__ */ _("div", {
+					className: "hidden rounded-card border border-border-default bg-bg-elevated md:block",
+					children: /* @__PURE__ */ v(ie, { children: [/* @__PURE__ */ _(oe, { children: /* @__PURE__ */ v(k, { children: [
+						/* @__PURE__ */ _(O, { children: "Name" }),
+						/* @__PURE__ */ _(O, { children: "Status" }),
+						/* @__PURE__ */ _(O, { children: "Access" }),
+						/* @__PURE__ */ _(O, { children: "Format" }),
+						/* @__PURE__ */ _(O, {
+							className: "text-right",
+							children: "Size"
 						}),
-						/* @__PURE__ */ v(A, {
+						/* @__PURE__ */ _(O, { children: "Tags" }),
+						/* @__PURE__ */ _(O, { children: "Updated" }),
+						/* @__PURE__ */ _(O, {
 							className: "text-right",
-							children: /* @__PURE__ */ v(s, {
-								ariaLabel: `Actions for ${e.name}`,
-								entityName: e.name,
-								onView: () => R(`datasets/${e.id}`),
-								onEdit: () => R(`datasets/${e.id}/edit`),
-								extraItems: e.status === "AVAILABLE" || e.status === "ARCHIVED" ? [] : [{
-									key: "publish",
-									label: "Publish",
-									onSelect: () => void se(e)
-								}],
-								onDelete: () => ce(e),
-								deleteLabel: "Archive dataset"
-							})
+							children: "Actions"
 						})
-					]
-				}, e.id)) })] })
-			}), /* @__PURE__ */ v(d, {
-				offset: G.offset,
-				limit: G.limit,
-				loadedCount: Q.length,
-				hasMore: !!ie?.hasMore,
-				onPrev: G.prevPage,
-				onNext: G.nextPage,
-				itemLabel: "datasets",
-				loading: q
-			})] })]
+					] }) }), /* @__PURE__ */ _(ae, { children: Y.map((e) => /* @__PURE__ */ v(k, {
+						className: "cursor-pointer",
+						onClick: () => N(`datasets/${e.id}`),
+						children: [
+							/* @__PURE__ */ v(D, { children: [/* @__PURE__ */ _("span", {
+								className: "font-medium text-text-primary",
+								children: e.name
+							}), e.description ? /* @__PURE__ */ _("p", {
+								className: "mt-0.5 line-clamp-1 max-w-xs text-xs text-text-secondary",
+								children: e.description
+							}) : null] }),
+							/* @__PURE__ */ _(D, { children: /* @__PURE__ */ _(f, { status: e.status }) }),
+							/* @__PURE__ */ _(D, { children: /* @__PURE__ */ _("span", {
+								className: "text-sm text-text-secondary",
+								children: p(e.accessLevel)
+							}) }),
+							/* @__PURE__ */ _(D, { children: /* @__PURE__ */ _("span", {
+								className: "text-sm text-text-secondary",
+								children: e.format || "—"
+							}) }),
+							/* @__PURE__ */ _(D, {
+								className: "text-right text-sm tabular-nums text-text-secondary",
+								children: j(e.sizeBytes)
+							}),
+							/* @__PURE__ */ _(D, { children: /* @__PURE__ */ _("div", {
+								className: "flex max-w-[12rem] flex-wrap gap-1",
+								children: e.tags.length === 0 ? /* @__PURE__ */ _("span", {
+									className: "text-xs text-text-secondary",
+									children: "—"
+								}) : /* @__PURE__ */ v(g, { children: [e.tags.slice(0, 2).map((e) => /* @__PURE__ */ _(b, {
+									variant: "secondary",
+									children: e
+								}, e)), e.tags.length > 2 ? /* @__PURE__ */ v(b, {
+									variant: "secondary",
+									children: ["+", e.tags.length - 2]
+								}) : null] })
+							}) }),
+							/* @__PURE__ */ _(D, {
+								className: "whitespace-nowrap text-sm text-text-secondary",
+								children: M(e.updatedAt)
+							}),
+							/* @__PURE__ */ _(D, {
+								className: "text-right",
+								children: /* @__PURE__ */ _(o, {
+									ariaLabel: `Actions for ${e.name}`,
+									entityName: e.name,
+									onView: () => N(`datasets/${e.id}`),
+									onEdit: () => N(`datasets/${e.id}/edit`),
+									extraItems: e.status === "AVAILABLE" || e.status === "ARCHIVED" ? [] : [{
+										key: "publish",
+										label: "Publish",
+										onSelect: () => void Q(e)
+									}],
+									onDelete: () => $(e),
+									deleteLabel: "Archive dataset"
+								})
+							})
+						]
+					}, e.id)) })] })
+				}),
+				/* @__PURE__ */ _("ul", {
+					className: "space-y-3 md:hidden",
+					children: Y.map((e) => /* @__PURE__ */ _("li", { children: /* @__PURE__ */ v("div", {
+						role: "button",
+						tabIndex: 0,
+						"aria-label": `Open ${e.name}`,
+						onClick: () => N(`datasets/${e.id}`),
+						onKeyDown: (t) => {
+							(t.key === "Enter" || t.key === " ") && (t.preventDefault(), N(`datasets/${e.id}`));
+						},
+						className: "flex flex-col gap-3 rounded-card border border-border-default bg-bg-elevated p-4 outline-none transition-colors hover:bg-bg-sunken focus-visible:ring-2 focus-visible:ring-border-focus",
+						children: [
+							/* @__PURE__ */ v("div", {
+								className: "flex items-start justify-between gap-3",
+								children: [/* @__PURE__ */ v("div", {
+									className: "min-w-0",
+									children: [/* @__PURE__ */ _("p", {
+										className: "font-medium text-text-primary",
+										children: e.name
+									}), e.description ? /* @__PURE__ */ _("p", {
+										className: "mt-0.5 line-clamp-2 text-xs text-text-secondary",
+										children: e.description
+									}) : null]
+								}), /* @__PURE__ */ _("div", {
+									onClick: (e) => e.stopPropagation(),
+									children: /* @__PURE__ */ _(o, {
+										ariaLabel: `Actions for ${e.name}`,
+										entityName: e.name,
+										onView: () => N(`datasets/${e.id}`),
+										onEdit: () => N(`datasets/${e.id}/edit`),
+										extraItems: e.status === "AVAILABLE" || e.status === "ARCHIVED" ? [] : [{
+											key: "publish",
+											label: "Publish",
+											onSelect: () => void Q(e)
+										}],
+										onDelete: () => $(e),
+										deleteLabel: "Archive dataset"
+									})
+								})]
+							}),
+							/* @__PURE__ */ v("div", {
+								className: "flex flex-wrap items-center gap-1.5",
+								children: [/* @__PURE__ */ _(f, { status: e.status }), /* @__PURE__ */ _(f, { status: e.accessLevel })]
+							}),
+							/* @__PURE__ */ v("dl", {
+								className: "grid grid-cols-2 gap-x-4 gap-y-1 text-xs",
+								children: [
+									/* @__PURE__ */ v("div", {
+										className: "flex justify-between gap-2",
+										children: [/* @__PURE__ */ _("dt", {
+											className: "text-text-secondary",
+											children: "Format"
+										}), /* @__PURE__ */ _("dd", {
+											className: "text-text-primary",
+											children: e.format || "—"
+										})]
+									}),
+									/* @__PURE__ */ v("div", {
+										className: "flex justify-between gap-2",
+										children: [/* @__PURE__ */ _("dt", {
+											className: "text-text-secondary",
+											children: "Size"
+										}), /* @__PURE__ */ _("dd", {
+											className: "tabular-nums text-text-primary",
+											children: j(e.sizeBytes)
+										})]
+									}),
+									/* @__PURE__ */ v("div", {
+										className: "flex justify-between gap-2",
+										children: [/* @__PURE__ */ _("dt", {
+											className: "text-text-secondary",
+											children: "Updated"
+										}), /* @__PURE__ */ _("dd", {
+											className: "text-text-primary",
+											children: M(e.updatedAt)
+										})]
+									})
+								]
+							}),
+							e.tags.length > 0 ? /* @__PURE__ */ v("div", {
+								className: "flex flex-wrap gap-1",
+								children: [e.tags.slice(0, 4).map((e) => /* @__PURE__ */ _(b, {
+									variant: "secondary",
+									className: "text-xs",
+									children: e
+								}, e)), e.tags.length > 4 ? /* @__PURE__ */ v("span", {
+									className: "text-xs text-text-secondary",
+									children: ["+", e.tags.length - 4]
+								}) : null]
+							}) : null
+						]
+					}) }, e.id))
+				}),
+				/* @__PURE__ */ _(u, {
+					offset: W.offset,
+					limit: W.limit,
+					loadedCount: Y.length,
+					hasMore: !!he?.hasMore,
+					onPrev: W.prevPage,
+					onNext: W.nextPage,
+					itemLabel: "datasets",
+					loading: K
+				})
+			] })]
 		})
 	});
 }
 //#endregion
-export { R as default };
+export { N as default };
 
 //# sourceMappingURL=DatasetsPage.js.map