@burdenoff/microfe-bigconsole 2026.805.3 → 2026.812.2

package/dist/bigconsole/pages/DataSinksPage.js

@@ -1,181 +1,126 @@
 import { useDataSinkStore as e } from "../store/dataSinkStore.js";
 import { useAppNavigate as t } from "../contexts/NavigationContext.js";
 import "../contexts/index.js";
-import n from "../hooks/useDataSinkOperations.js";
-import ee from "../hooks/useExportDataSink.js";
-import { BIGCONSOLE_PERMISSIONS as r } from "../../constants/permissions.js";
-import te from "../components/datasink/DataSinkStatusBadge.js";
-import { isNative as i, nativeNotify as a } from "../../utils/nativeBridge.js";
-import ne from "../components/datasink/DataSinkCard.js";
-import re from "../components/datasink/DataSinkDeleteDialog.js";
-import ie from "../components/datasink/DataSinkRefreshDialog.js";
-import ae from "../components/datasink/ImportDataSinkDialog.js";
-import oe from "../components/datasink/SetupStateBadge.js";
-import { memo as o, useCallback as s, useMemo as c, useState as l } from "react";
-import { AccessDenied as se, PermissionButton as ce } from "@burdenoff/fe-libs/shared/components";
-import { usePermissions as le } from "@burdenoff/fe-libs/shared/providers/shell";
-import { AlertCircle as ue, Container as de, Download as fe, Eye as pe, LayoutGrid as me, Pencil as he, Plus as u, RefreshCw as ge, Search as _e, Table2 as ve, Trash2 as ye, Upload as be, X as xe } from "lucide-react";
-import { useI18n as Se } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AuroraBackground as Ce, Badge as we, Button as d, CTAOverflowMenu as Te, Card as Ee, CardContent as De, GlassCard as f, GradientText as Oe, IllustratedEmptyState as p, Input as ke, PagePurpose as Ae, Select as m, SelectContent as h, SelectItem as g, SelectTrigger as _, SelectValue as v, Spinner as je } from "@burdenoff/fe-libs/ui";
-import { getProfileScopedKey as y } from "@burdenoff/fe-libs/shared/utils";
-import { Fragment as Me, jsx as b, jsxs as x } from "react/jsx-runtime";
+import { SECTION_FOCUS_RING as n } from "../components/common/sectionStyles.js";
+import { Section as r, SectionStack as ee } from "../components/common/Section.js";
+import "../components/common/index.js";
+import te from "../hooks/useDataSinkOperations.js";
+import ne from "../hooks/useExportDataSink.js";
+import { BIGCONSOLE_PERMISSIONS as i } from "../../constants/permissions.js";
+import re from "../components/datasink/DataSinkStatusBadge.js";
+import { isNative as a, nativeNotify as o } from "../../utils/nativeBridge.js";
+import ie from "../components/datasink/DataSinkCard.js";
+import ae from "../components/datasink/DataSinkDeleteDialog.js";
+import oe from "../components/datasink/DataSinkRefreshDialog.js";
+import se from "../components/datasink/ImportDataSinkDialog.js";
+import ce from "../components/datasink/SetupStateBadge.js";
+import { memo as s, useCallback as c, useMemo as l, useState as u } from "react";
+import { AccessDenied as le, PermissionButton as ue } from "@burdenoff/fe-libs/shared/components";
+import { usePermissions as de } from "@burdenoff/fe-libs/shared/providers/shell";
+import { AlertCircle as fe, Container as pe, Download as me, Eye as he, LayoutGrid as ge, Pencil as _e, Plus as d, RefreshCw as ve, Search as ye, Table2 as be, Trash2 as xe, Upload as Se, X as Ce } from "lucide-react";
+import { useI18n as we } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AuroraBackground as Te, Badge as Ee, Button as f, CTAOverflowMenu as De, GradientText as Oe, IllustratedEmptyState as ke, Input as Ae, PagePurpose as je, Select as p, SelectContent as m, SelectItem as h, SelectTrigger as g, SelectValue as _, Spinner as Me } from "@burdenoff/fe-libs/ui";
+import { getProfileScopedKey as v } from "@burdenoff/fe-libs/shared/utils";
+import { Fragment as y, jsx as b, jsxs as x } from "react/jsx-runtime";
 //#region src/bigconsole/pages/DataSinksPage.tsx
-var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "completed" || e.ttl !== null && e.ttl !== void 0 && e.ttl > 0 || e.fluidGridsWorkflowId && e.data && Object.keys(e.data).length > 0 ? "completed" : e.fluidGridsWorkflowId ? "workflow_running" : "workflow_pending", C = o(function() {
-	let o = t(), { t: C } = Se(), w = s((e, t) => {
-		let n = C(e);
+var S = "bigconsole-datasinks-view-mode", C = `inline-flex h-control-md w-[var(--size-controlHeight-md)] items-center justify-center rounded-button border-0 bg-transparent text-text-muted hover:bg-bg-surface hover:text-text-primary motion-safe:transition-colors ${n}`, w = "focus-visible:ring-inset focus-visible:ring-offset-0", Ne = (e) => e.setupState === "completed" || e.ttl !== null && e.ttl !== void 0 && e.ttl > 0 || e.fluidGridsWorkflowId && e.data && Object.keys(e.data).length > 0 ? "completed" : e.fluidGridsWorkflowId ? "workflow_running" : "workflow_pending", T = s(function() {
+	let s = t(), { t: T } = we(), E = c((e, t) => {
+		let n = T(e);
 		return n === e ? t : n;
-	}, [C]), { hasPermission: T, isLoading: Pe } = le(), Fe = T(r.DATASINK_READ), E = T(r.DATASINK_CREATE), D = T(r.DATASINK_UPDATE), O = T(r.DATASINK_DELETE), k = T(r.DATASINK_EXECUTE), [A, j] = l("all"), [Ie, M] = l(!1), [N, Le] = l(() => localStorage.getItem(y(S)) || "grid"), P = s((e) => {
-		Le(e), localStorage.setItem(y(S), e);
-	}, []), F = e((e) => e.statusFilter), I = e((e) => e.activeFilter), L = e((e) => e.searchQuery), R = e((e) => e.setStatusFilter), z = e((e) => e.setActiveFilter), B = e((e) => e.setSearchQuery), Re = e((e) => e.deleteDialogOpen), ze = e((e) => e.refreshDialogOpen), V = e((e) => e.currentDataSink), H = e((e) => e.openDeleteDialog), U = e((e) => e.closeDeleteDialog), W = e((e) => e.openRefreshDialog), G = e((e) => e.closeRefreshDialog), { loading: K, error: q, dataSinks: J, deleteDataSink: Be, refreshDataSink: Ve, refetch: Y } = n(), { downloadDataSink: He } = ee(), Ue = c(() => J.map((e) => ({
+	}, [T]), { hasPermission: D, isLoading: Pe } = de(), Fe = D(i.DATASINK_READ), O = D(i.DATASINK_CREATE), k = D(i.DATASINK_UPDATE), A = D(i.DATASINK_DELETE), j = D(i.DATASINK_EXECUTE), [M, N] = u("all"), [Ie, P] = u(!1), [F, Le] = u(() => localStorage.getItem(v(S)) || "grid"), I = c((e) => {
+		Le(e), localStorage.setItem(v(S), e);
+	}, []), L = e((e) => e.statusFilter), R = e((e) => e.activeFilter), z = e((e) => e.searchQuery), B = e((e) => e.setStatusFilter), V = e((e) => e.setActiveFilter), H = e((e) => e.setSearchQuery), Re = e((e) => e.deleteDialogOpen), ze = e((e) => e.refreshDialogOpen), U = e((e) => e.currentDataSink), W = e((e) => e.openDeleteDialog), G = e((e) => e.closeDeleteDialog), K = e((e) => e.openRefreshDialog), q = e((e) => e.closeRefreshDialog), { loading: J, error: Be, dataSinks: Y, deleteDataSink: Ve, refreshDataSink: He, refetch: X } = te(), { downloadDataSink: Ue } = ne(), We = l(() => Y.map((e) => ({
 		dataSink: e,
 		setupState: Ne(e)
-	})), [J]), X = c(() => {
-		let e = [...Ue];
-		if (A === "in_progress" ? e = e.filter((e) => e.setupState !== "completed") : A === "completed" && (e = e.filter((e) => e.setupState === "completed")), F !== null && (e = e.filter((e) => e.dataSink.status === F)), I !== null && (e = e.filter((e) => e.dataSink.isActive === I)), L.trim()) {
-			let t = L.toLowerCase();
+	})), [Y]), Z = l(() => {
+		let e = [...We];
+		if (M === "in_progress" ? e = e.filter((e) => e.setupState !== "completed") : M === "completed" && (e = e.filter((e) => e.setupState === "completed")), L !== null && (e = e.filter((e) => e.dataSink.status === L)), R !== null && (e = e.filter((e) => e.dataSink.isActive === R)), z.trim()) {
+			let t = z.toLowerCase();
 			e = e.filter((e) => e.dataSink.name?.toLowerCase().includes(t) || e.dataSink.key.toLowerCase().includes(t) || e.dataSink.description?.toLowerCase().includes(t));
 		}
 		return e.sort((e, t) => new Date(t.dataSink.updatedAt).getTime() - new Date(e.dataSink.updatedAt).getTime());
 	}, [
-		Ue,
-		A,
-		F,
-		I,
-		L
-	]), We = s(() => {
-		o("/datasinks/new");
-	}, [o]), Z = s((e) => {
-		o(`/datasinks/${e}`);
-	}, [o]), Ge = s((e) => {
-		o(`/datasinks/${e}/edit`);
-	}, [o]), Q = s((e) => {
-		let t = J.find((t) => t.id === e);
-		t && W(t);
-	}, [J, W]), Ke = s(async (e) => {
-		V && (await Ve({
-			id: V.id,
+		We,
+		M,
+		L,
+		R,
+		z
+	]), Ge = c(() => {
+		s("/datasinks/new");
+	}, [s]), Q = c((e) => {
+		s(`/datasinks/${e}`);
+	}, [s]), Ke = c((e) => {
+		s(`/datasinks/${e}/edit`);
+	}, [s]), qe = c((e) => {
+		let t = Y.find((t) => t.id === e);
+		t && K(t);
+	}, [Y, K]), Je = c(async (e) => {
+		U && (await He({
+			id: U.id,
 			forceRefresh: e
-		}), G());
+		}), q());
 	}, [
-		V,
-		Ve,
-		G
-	]), qe = s((e) => {
-		let t = J.find((t) => t.id === e);
-		t && H(t);
-	}, [J, H]), Je = s(async () => {
-		if (V) {
+		U,
+		He,
+		q
+	]), Ye = c((e) => {
+		let t = Y.find((t) => t.id === e);
+		t && W(t);
+	}, [Y, W]), Xe = c(async () => {
+		if (U) {
 			try {
-				await Be(V.id), i() && a("success");
+				await Ve(U.id), a() && o("success");
 			} catch (e) {
-				throw i() && a("error"), e;
+				throw a() && o("error"), e;
 			}
-			U();
+			G();
 		}
 	}, [
-		V,
-		Be,
-		U
-	]), Ye = s(async (e) => {
-		let t = J.find((t) => t.id === e);
-		t && await He(e, t.name || t.key);
-	}, [J, He]), Xe = s(() => {
-		M(!0);
-	}, []), Ze = s((e, t, n) => {
-		Y();
-	}, [Y]), Qe = c(() => A !== "all" || F !== null || I !== null || L.trim() !== "", [
-		A,
-		F,
-		I,
-		L
-	]), $ = s(() => {
-		j("all"), R(null), z(null), B("");
-	}, [
+		U,
+		Ve,
+		G
+	]), Ze = c(async (e) => {
+		let t = Y.find((t) => t.id === e);
+		t && await Ue(e, t.name || t.key);
+	}, [Y, Ue]), Qe = c(() => {
+		P(!0);
+	}, []), $e = c((e, t, n) => {
+		X();
+	}, [X]), et = l(() => M !== "all" || L !== null || R !== null || z.trim() !== "", [
+		M,
+		L,
 		R,
-		z,
-		B
-	]), $e = [
+		z
+	]), $ = c(() => {
+		N("all"), B(null), V(null), H("");
+	}, [
+		B,
+		V,
+		H
+	]), tt = [
 		{
 			value: "all",
-			label: w("bigconsole.dataSinks.filters.setupState.all", "All")
+			label: E("bigconsole.dataSinks.filters.setupState.all", "All")
 		},
 		{
 			value: "in_progress",
-			label: w("bigconsole.dataSinks.filters.setupState.inProgress", "In Progress")
+			label: E("bigconsole.dataSinks.filters.setupState.inProgress", "In Progress")
 		},
 		{
 			value: "completed",
-			label: w("bigconsole.dataSinks.filters.setupState.completed", "Completed")
+			label: E("bigconsole.dataSinks.filters.setupState.completed", "Completed")
 		}
 	];
-	return !Pe && !Fe ? /* @__PURE__ */ b(se, {
-		title: w("bigconsole.dataSinks.accessDenied.title", "Access Denied"),
-		description: w("bigconsole.dataSinks.accessDenied.description", "You don't have permission to view data sinks.")
-	}) : q ? /* @__PURE__ */ b("div", {
-		style: { padding: "var(--space-pagePadding)" },
-		children: /* @__PURE__ */ b(Ee, {
-			style: {
-				borderColor: "var(--color-status-error-border)",
-				backgroundColor: "var(--color-status-error-bgSubtle)"
-			},
-			children: /* @__PURE__ */ b(De, {
-				style: { padding: "var(--space-pagePadding)" },
-				children: /* @__PURE__ */ x("div", {
-					style: {
-						display: "flex",
-						flexDirection: "column",
-						alignItems: "center",
-						textAlign: "center"
-					},
-					children: [
-						/* @__PURE__ */ b("div", {
-							style: {
-								padding: "var(--space-controlGap)",
-								borderRadius: "50%",
-								backgroundColor: "var(--color-status-error-bgSubtle)",
-								marginBottom: "var(--space-formGap)"
-							},
-							children: /* @__PURE__ */ b(ue, { style: {
-								height: "var(--size-icon-xl)",
-								width: "var(--size-icon-xl)",
-								color: "var(--color-status-error-text)"
-							} })
-						}),
-						/* @__PURE__ */ b("h3", {
-							style: {
-								fontSize: "var(--font-size-body-lg)",
-								fontWeight: "var(--font-weight-medium)",
-								color: "var(--color-status-error-text)",
-								marginBottom: "var(--space-controlGap)"
-							},
-							children: w("bigconsole.dataSinks.error.title", "Failed to load Data Sinks")
-						}),
-						/* @__PURE__ */ b("p", {
-							style: {
-								fontSize: "var(--font-size-body-sm)",
-								color: "var(--color-text-secondary)",
-								marginBottom: "var(--space-formGap)"
-							},
-							children: q.message
-						}),
-						/* @__PURE__ */ b(d, {
-							size: "sm",
-							onClick: () => Y(),
-							children: w("bigconsole.dataSinks.error.retry", "Try Again")
-						})
-					]
-				})
-			})
-		})
+	return !Pe && !Fe ? /* @__PURE__ */ b(le, {
+		title: E("bigconsole.dataSinks.accessDenied.title", "Access Denied"),
+		description: E("bigconsole.dataSinks.accessDenied.description", "You don't have permission to view data sinks.")
 	}) : /* @__PURE__ */ x("div", {
-		style: {
-			minHeight: "100vh",
-			backgroundColor: "var(--color-bg-canvas)"
-		},
+		className: "min-w-0",
+		style: { backgroundColor: "var(--color-bg-canvas)" },
 		children: [
-			/* @__PURE__ */ x("div", {
-				className: "relative overflow-hidden border-b border-border-seam bg-gloss-card",
-				children: [/* @__PURE__ */ b(Ce, { intensity: "subtle" }), /* @__PURE__ */ b("div", {
+			/* @__PURE__ */ x("header", {
+				className: "relative overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]",
+				children: [/* @__PURE__ */ b(Te, { intensity: "subtle" }), /* @__PURE__ */ b("div", {
 					style: { padding: "var(--space-pagePadding)" },
 					children: /* @__PURE__ */ x("div", {
 						style: {
@@ -203,7 +148,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 									borderRadius: "var(--radius-card)",
 									backgroundColor: "var(--color-action-primary-bg)"
 								},
-								children: /* @__PURE__ */ b(de, { style: {
+								children: /* @__PURE__ */ b(pe, { style: {
 									height: "var(--size-icon-lg)",
 									width: "var(--size-icon-lg)",
 									color: "var(--color-action-primary-text)"
@@ -211,36 +156,27 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 							}), /* @__PURE__ */ x("div", {
 								style: { minWidth: 0 },
 								children: [/* @__PURE__ */ b("h1", {
-									style: {
-										fontSize: "var(--font-size-heading-h4)",
-										fontWeight: "var(--font-weight-bold)",
-										margin: 0,
-										color: "var(--color-text-primary)"
-									},
-									children: /* @__PURE__ */ b(Oe, { children: w("bigconsole.dataSinks.title", "Data Sinks") })
+									className: "m-0 text-2xl font-bold text-text-primary",
+									children: /* @__PURE__ */ b(Oe, { children: E("bigconsole.dataSinks.title", "Data Sinks") })
 								}), /* @__PURE__ */ b("p", {
-									style: {
-										fontSize: "var(--font-size-body-sm)",
-										color: "var(--color-text-secondary)",
-										margin: 0
-									},
-									children: w("bigconsole.dataSinks.subtitle", "Manage pre-processed data from FluidGrids workflows")
+									className: "m-0 text-sm text-text-secondary",
+									children: E("bigconsole.dataSinks.subtitle", "Manage pre-processed data from FluidGrids workflows")
 								})]
 							})]
-						}), /* @__PURE__ */ b(Te, {
-							primary: E ? {
-								label: w("bigconsole.dataSinks.actions.create", "Create Data Sink"),
-								onSelect: We,
-								icon: /* @__PURE__ */ b(u, { style: {
+						}), /* @__PURE__ */ b(De, {
+							primary: O ? {
+								label: E("bigconsole.dataSinks.actions.create", "Create Data Sink"),
+								onSelect: Ge,
+								icon: /* @__PURE__ */ b(d, { style: {
 									marginRight: "var(--space-iconGap)",
 									height: "var(--size-icon-sm)",
 									width: "var(--size-icon-sm)"
 								} })
 							} : void 0,
-							actions: E ? [{
-								label: w("bigconsole.dataSinks.actions.import", "Import"),
-								onSelect: Xe,
-								icon: /* @__PURE__ */ b(be, { style: {
+							actions: O ? [{
+								label: E("bigconsole.dataSinks.actions.import", "Import"),
+								onSelect: Qe,
+								icon: /* @__PURE__ */ b(Se, { style: {
 									height: "var(--size-icon-sm)",
 									width: "var(--size-icon-sm)"
 								} })
@@ -251,48 +187,64 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 			}),
 			/* @__PURE__ */ x("div", {
 				style: { padding: "var(--space-pagePadding)" },
-				children: [
-					/* @__PURE__ */ b(Ae, {
-						className: "mb-[var(--space-sectionGap)]",
-						children: "Data sinks are the structured destinations that hold your processed data — define a schema once and every pipeline, parser, and workflow can write into it. Dashboards then query sinks directly, so a sink is where your data lives and where your charts read from."
-					}),
-					/* @__PURE__ */ b("div", {
-						style: { marginBottom: "var(--space-formGap)" },
-						children: /* @__PURE__ */ b("div", {
+				children: [/* @__PURE__ */ b(je, {
+					className: "mb-[var(--space-sectionGap)]",
+					children: "Data sinks are the structured destinations that hold your processed data — define a schema once and every pipeline, parser, and workflow can write into it. Dashboards then query sinks directly, so a sink is where your data lives and where your charts read from."
+				}), /* @__PURE__ */ b(ee, { children: Be ? /* @__PURE__ */ b(r, {
+					tone: "danger",
+					headingLevel: 2,
+					title: E("bigconsole.dataSinks.error.title", "Failed to load Data Sinks"),
+					description: Be.message,
+					icon: /* @__PURE__ */ b(fe, { className: "h-icon-sm w-icon-sm" }),
+					actions: /* @__PURE__ */ b(f, {
+						size: "sm",
+						onClick: () => X(),
+						children: E("bigconsole.dataSinks.error.retry", "Try Again")
+					})
+				}) : /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(r, {
+					headingLevel: 2,
+					padding: "compact",
+					title: E("bigconsole.dataSinks.filters.heading", "Filters"),
+					description: E("bigconsole.dataSinks.filters.description", "Narrow the list by setup progress, status, or name."),
+					bodyClassName: "space-y-form-gap",
+					children: /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b("div", {
+						role: "group",
+						"aria-label": E("bigconsole.dataSinks.filters.setupState.label", "Setup state"),
+						style: {
+							display: "flex",
+							alignItems: "center",
+							flexWrap: "wrap",
+							gap: "2px",
+							padding: "4px",
+							backgroundColor: "var(--color-bg-sunken)",
+							borderRadius: "var(--radius-card)",
+							maxWidth: "100%",
+							width: "fit-content"
+						},
+						children: tt.map((e) => /* @__PURE__ */ b("button", {
+							type: "button",
+							"aria-pressed": M === e.value,
+							onClick: () => N(e.value),
+							className: n,
 							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "2px",
-								padding: "4px",
-								backgroundColor: "var(--color-bg-sunken)",
-								borderRadius: "var(--radius-card)",
-								width: "fit-content"
+								minHeight: "var(--size-controlHeight-md)",
+								padding: "var(--space-controlGap) var(--space-formGap)",
+								fontSize: "var(--font-size-body-sm)",
+								fontWeight: "var(--font-weight-medium)",
+								borderRadius: "var(--radius-button)",
+								border: "none",
+								cursor: "pointer",
+								backgroundColor: M === e.value ? "var(--color-bg-surface)" : "transparent",
+								color: M === e.value ? "var(--color-text-primary)" : "var(--color-text-secondary)",
+								boxShadow: M === e.value ? "var(--shadow-elevation-1)" : "none"
 							},
-							children: $e.map((e) => /* @__PURE__ */ b("button", {
-								type: "button",
-								onClick: () => j(e.value),
-								style: {
-									padding: "var(--space-controlGap) var(--space-formGap)",
-									fontSize: "var(--font-size-body-sm)",
-									fontWeight: "var(--font-weight-medium)",
-									borderRadius: "var(--radius-button)",
-									border: "none",
-									cursor: "pointer",
-									transition: "all 0.2s ease",
-									backgroundColor: A === e.value ? "var(--color-bg-surface)" : "transparent",
-									color: A === e.value ? "var(--color-text-primary)" : "var(--color-text-secondary)",
-									boxShadow: A === e.value ? "0 1px 2px rgba(0,0,0,0.05)" : "none"
-								},
-								children: e.label
-							}, e.value))
-						})
-					}),
-					/* @__PURE__ */ x("div", {
+							children: e.label
+						}, e.value))
+					}), /* @__PURE__ */ x("div", {
 						style: {
 							display: "flex",
 							alignItems: "center",
 							gap: "var(--space-controlGap)",
-							marginBottom: "var(--space-sectionGap)",
 							flexWrap: "wrap"
 						},
 						children: [
@@ -303,7 +255,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 									minWidth: "min(100%, 240px)",
 									flex: "1 1 240px"
 								},
-								children: [/* @__PURE__ */ b(_e, { style: {
+								children: [/* @__PURE__ */ b(ye, { style: {
 									position: "absolute",
 									left: "var(--space-controlGap)",
 									top: "50%",
@@ -311,212 +263,197 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 									height: "var(--size-icon-sm)",
 									width: "var(--size-icon-sm)",
 									color: "var(--color-text-muted)"
-								} }), /* @__PURE__ */ b(ke, {
+								} }), /* @__PURE__ */ b(Ae, {
 									type: "text",
-									placeholder: w("bigconsole.dataSinks.search.placeholder", "Search data sinks..."),
-									value: L,
-									onChange: (e) => B(e.target.value),
+									placeholder: E("bigconsole.dataSinks.search.placeholder", "Search data sinks..."),
+									value: z,
+									onChange: (e) => H(e.target.value),
 									style: {
 										paddingLeft: "var(--size-controlHeight-md)",
 										height: "var(--size-controlHeight-md)"
 									}
 								})]
 							}),
-							/* @__PURE__ */ x(m, {
-								value: F || "all",
-								onValueChange: (e) => R(e === "all" ? null : e),
-								children: [/* @__PURE__ */ b(_, {
+							/* @__PURE__ */ x(p, {
+								value: L || "all",
+								onValueChange: (e) => B(e === "all" ? null : e),
+								children: [/* @__PURE__ */ b(g, {
 									style: { width: "min(100%, 150px)" },
-									children: /* @__PURE__ */ b(v, { placeholder: w("bigconsole.dataSinks.filters.status.placeholder", "All Statuses") })
-								}), /* @__PURE__ */ x(h, { children: [
-									/* @__PURE__ */ b(g, {
+									children: /* @__PURE__ */ b(_, { placeholder: E("bigconsole.dataSinks.filters.status.placeholder", "All Statuses") })
+								}), /* @__PURE__ */ x(m, { children: [
+									/* @__PURE__ */ b(h, {
 										value: "all",
-										children: w("bigconsole.dataSinks.filters.status.all", "All Statuses")
+										children: E("bigconsole.dataSinks.filters.status.all", "All Statuses")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "ready",
-										children: w("bigconsole.dataSinks.filters.status.ready", "Ready")
+										children: E("bigconsole.dataSinks.filters.status.ready", "Ready")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "error",
-										children: w("bigconsole.dataSinks.filters.status.error", "Error")
+										children: E("bigconsole.dataSinks.filters.status.error", "Error")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "stale",
-										children: w("bigconsole.dataSinks.filters.status.stale", "Stale")
+										children: E("bigconsole.dataSinks.filters.status.stale", "Stale")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "refreshing",
-										children: w("bigconsole.dataSinks.filters.status.refreshing", "Refreshing")
+										children: E("bigconsole.dataSinks.filters.status.refreshing", "Refreshing")
 									})
 								] })]
 							}),
-							/* @__PURE__ */ x(m, {
-								value: I === null ? "all" : I ? "true" : "false",
-								onValueChange: (e) => z(e === "all" ? null : e === "true"),
-								children: [/* @__PURE__ */ b(_, {
+							/* @__PURE__ */ x(p, {
+								value: R === null ? "all" : R ? "true" : "false",
+								onValueChange: (e) => V(e === "all" ? null : e === "true"),
+								children: [/* @__PURE__ */ b(g, {
 									style: { width: "min(100%, 130px)" },
-									children: /* @__PURE__ */ b(v, { placeholder: w("bigconsole.dataSinks.filters.active.placeholder", "All") })
-								}), /* @__PURE__ */ x(h, { children: [
-									/* @__PURE__ */ b(g, {
+									children: /* @__PURE__ */ b(_, { placeholder: E("bigconsole.dataSinks.filters.active.placeholder", "All") })
+								}), /* @__PURE__ */ x(m, { children: [
+									/* @__PURE__ */ b(h, {
 										value: "all",
-										children: w("bigconsole.dataSinks.filters.active.all", "All")
+										children: E("bigconsole.dataSinks.filters.active.all", "All")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "true",
-										children: w("bigconsole.dataSinks.filters.active.active", "Active")
+										children: E("bigconsole.dataSinks.filters.active.active", "Active")
 									}),
-									/* @__PURE__ */ b(g, {
+									/* @__PURE__ */ b(h, {
 										value: "false",
-										children: w("bigconsole.dataSinks.filters.active.inactive", "Inactive")
+										children: E("bigconsole.dataSinks.filters.active.inactive", "Inactive")
 									})
 								] })]
 							}),
-							Qe && /* @__PURE__ */ x(d, {
+							et && /* @__PURE__ */ x(f, {
 								variant: "ghost",
 								size: "sm",
 								onClick: $,
-								children: [/* @__PURE__ */ b(xe, { style: {
+								children: [/* @__PURE__ */ b(Ce, { style: {
 									marginRight: "var(--space-iconGap)",
 									height: "var(--size-icon-sm)",
 									width: "var(--size-icon-sm)"
-								} }), w("bigconsole.dataSinks.filters.clear", "Clear Filters")]
-							}),
-							/* @__PURE__ */ x("div", {
-								style: {
-									marginLeft: "auto",
-									display: "flex",
-									alignItems: "center",
-									gap: "var(--space-controlGap)"
-								},
-								children: [/* @__PURE__ */ x(we, {
-									variant: "secondary",
-									children: [
-										X.length,
-										" ",
-										X.length === 1 ? w("bigconsole.dataSinks.count.single", "Data Sink") : w("bigconsole.dataSinks.count.plural", "Data Sinks")
-									]
-								}), /* @__PURE__ */ x("div", {
-									style: {
-										display: "flex",
-										borderRadius: "var(--radius-button)",
-										border: "1px solid var(--color-border)",
-										overflow: "hidden"
-									},
-									children: [/* @__PURE__ */ b("button", {
-										type: "button",
-										onClick: () => P("grid"),
-										title: w("bigconsole.dataSinks.view.grid", "Grid view"),
-										style: {
-											padding: "6px 8px",
-											border: "none",
-											cursor: "pointer",
-											backgroundColor: N === "grid" ? "var(--color-bg-sunken)" : "transparent",
-											color: N === "grid" ? "var(--color-text-primary)" : "var(--color-text-muted)"
-										},
-										children: /* @__PURE__ */ b(me, { size: 16 })
-									}), /* @__PURE__ */ b("button", {
-										type: "button",
-										onClick: () => P("table"),
-										title: w("bigconsole.dataSinks.view.table", "Table view"),
-										style: {
-											padding: "6px 8px",
-											border: "none",
-											borderLeft: "1px solid var(--color-border)",
-											cursor: "pointer",
-											backgroundColor: N === "table" ? "var(--color-bg-sunken)" : "transparent",
-											color: N === "table" ? "var(--color-text-primary)" : "var(--color-text-muted)"
-										},
-										children: /* @__PURE__ */ b(ve, { size: 16 })
-									})]
-								})]
+								} }), E("bigconsole.dataSinks.filters.clear", "Clear Filters")]
 							})
 						]
+					})] })
+				}), /* @__PURE__ */ b(r, {
+					emphasis: "primary",
+					headingLevel: 2,
+					title: E("bigconsole.dataSinks.list.heading", "Data sinks"),
+					description: E("bigconsole.dataSinks.list.description", "Every sink in this workspace, most recently updated first."),
+					meta: /* @__PURE__ */ x(Ee, {
+						variant: "secondary",
+						children: [
+							Z.length,
+							" ",
+							Z.length === 1 ? E("bigconsole.dataSinks.count.single", "Data Sink") : E("bigconsole.dataSinks.count.plural", "Data Sinks")
+						]
 					}),
-					K && J.length === 0 && /* @__PURE__ */ b("div", {
+					actions: /* @__PURE__ */ x("div", {
+						role: "group",
+						"aria-label": E("bigconsole.dataSinks.view.label", "List layout"),
 						style: {
 							display: "flex",
-							alignItems: "center",
-							justifyContent: "center",
-							padding: "80px 0"
+							borderRadius: "var(--radius-button)",
+							border: "1px solid var(--color-border)",
+							overflow: "hidden"
 						},
-						children: /* @__PURE__ */ x("div", {
-							style: { textAlign: "center" },
-							children: [/* @__PURE__ */ b(je, { style: {
-								height: "var(--size-icon-xl)",
-								width: "var(--size-icon-xl)",
-								margin: "0 auto var(--space-formGap)"
-							} }), /* @__PURE__ */ b("p", {
-								style: {
-									fontSize: "var(--font-size-body-sm)",
-									color: "var(--color-text-muted)"
-								},
-								children: w("bigconsole.dataSinks.loading", "Loading data sinks...")
-							})]
-						})
+						children: [/* @__PURE__ */ b("button", {
+							type: "button",
+							onClick: () => I("grid"),
+							"aria-pressed": F === "grid",
+							title: E("bigconsole.dataSinks.view.grid", "Grid view"),
+							className: `flex h-control-md w-[var(--size-controlHeight-md)] items-center justify-center ${n} ${w}`,
+							style: {
+								border: "none",
+								cursor: "pointer",
+								backgroundColor: F === "grid" ? "var(--color-bg-sunken)" : "transparent",
+								color: F === "grid" ? "var(--color-text-primary)" : "var(--color-text-muted)"
+							},
+							children: /* @__PURE__ */ b(ge, { size: 16 })
+						}), /* @__PURE__ */ b("button", {
+							type: "button",
+							onClick: () => I("table"),
+							"aria-pressed": F === "table",
+							title: E("bigconsole.dataSinks.view.table", "Table view"),
+							className: `flex h-control-md w-[var(--size-controlHeight-md)] items-center justify-center ${n} ${w}`,
+							style: {
+								border: "none",
+								borderLeft: "1px solid var(--color-border)",
+								cursor: "pointer",
+								backgroundColor: F === "table" ? "var(--color-bg-sunken)" : "transparent",
+								color: F === "table" ? "var(--color-text-primary)" : "var(--color-text-muted)"
+							},
+							children: /* @__PURE__ */ b(be, { size: 16 })
+						})]
 					}),
-					!K && J.length === 0 && /* @__PURE__ */ b(f, {
-						treatment: "insight",
-						className: "border-border-seam",
-						children: /* @__PURE__ */ b(p, {
+					children: /* @__PURE__ */ x(y, { children: [
+						J && Y.length === 0 && /* @__PURE__ */ b("div", {
+							className: "flex items-center justify-center py-12",
+							children: /* @__PURE__ */ x("div", {
+								style: { textAlign: "center" },
+								children: [/* @__PURE__ */ b(Me, { style: {
+									height: "var(--size-icon-xl)",
+									width: "var(--size-icon-xl)",
+									margin: "0 auto var(--space-formGap)"
+								} }), /* @__PURE__ */ b("p", {
+									className: "text-sm text-text-muted",
+									children: E("bigconsole.dataSinks.loading", "Loading data sinks...")
+								})]
+							})
+						}),
+						!J && Y.length === 0 && /* @__PURE__ */ b(ke, {
 							illustration: "empty-data",
-							title: w("bigconsole.dataSinks.empty.title", "No Data Sinks yet"),
-							description: w("bigconsole.dataSinks.empty.description", "Data Sinks store pre-processed data from FluidGrids workflows for fast access in widgets."),
-							action: /* @__PURE__ */ b(ce, {
-								permission: r.DATASINK_CREATE,
+							title: E("bigconsole.dataSinks.empty.title", "No Data Sinks yet"),
+							description: E("bigconsole.dataSinks.empty.description", "Data Sinks store pre-processed data from FluidGrids workflows for fast access in widgets."),
+							action: /* @__PURE__ */ b(ue, {
+								permission: i.DATASINK_CREATE,
 								deniedBehavior: "disable",
-								children: /* @__PURE__ */ x(d, {
-									onClick: We,
-									children: [/* @__PURE__ */ b(u, { style: {
+								children: /* @__PURE__ */ x(f, {
+									onClick: Ge,
+									children: [/* @__PURE__ */ b(d, { style: {
 										marginRight: "var(--space-iconGap)",
 										height: "var(--size-icon-sm)",
 										width: "var(--size-icon-sm)"
-									} }), w("bigconsole.dataSinks.actions.create", "Create Data Sink")]
+									} }), E("bigconsole.dataSinks.actions.create", "Create Data Sink")]
 								})
 							})
-						})
-					}),
-					!K && X.length === 0 && J.length > 0 && /* @__PURE__ */ b(f, {
-						treatment: "insight",
-						className: "border-border-seam",
-						children: /* @__PURE__ */ b(p, {
-							illustration: "empty-search",
-							title: w("bigconsole.dataSinks.empty.filteredTitle", "No matching data sinks"),
-							description: w("bigconsole.dataSinks.empty.filtered", "No data sinks match your filters"),
-							action: /* @__PURE__ */ b(d, {
-								variant: "ghost",
+						}),
+						!J && Z.length === 0 && Y.length > 0 && /* @__PURE__ */ b(r, {
+							tone: "info",
+							emphasis: "muted",
+							padding: "compact",
+							headingLevel: 3,
+							title: E("bigconsole.dataSinks.empty.filteredTitle", "No matching data sinks"),
+							description: E("bigconsole.dataSinks.empty.filtered", "No data sinks match your filters"),
+							actions: /* @__PURE__ */ b(f, {
+								variant: "secondary",
 								size: "sm",
 								onClick: $,
-								children: w("bigconsole.dataSinks.filters.clear", "Clear Filters")
+								children: E("bigconsole.dataSinks.filters.clear", "Clear Filters")
 							})
-						})
-					}),
-					X.length > 0 && N === "grid" && /* @__PURE__ */ b("div", {
-						style: {
-							display: "grid",
-							gridTemplateColumns: "repeat(auto-fill, minmax(min(100%, 320px), 1fr))",
-							gap: "var(--space-formGap)"
-						},
-						children: X.map((e) => /* @__PURE__ */ b(ne, {
-							dataSink: e.dataSink,
-							setupState: e.setupState,
-							onView: Z,
-							onEdit: Ge,
-							onRefresh: Q,
-							onExport: Ye,
-							onDelete: qe,
-							canEdit: D,
-							canRefresh: k,
-							canDelete: O
-						}, e.dataSink.id))
-					}),
-					X.length > 0 && N === "table" && /* @__PURE__ */ b("div", {
-						style: {
-							border: "1px solid var(--color-border)",
-							borderRadius: "var(--radius-card)",
-							overflow: "hidden"
-						},
-						children: /* @__PURE__ */ b("div", {
+						}),
+						Z.length > 0 && F === "grid" && /* @__PURE__ */ b("div", {
+							style: {
+								display: "grid",
+								gridTemplateColumns: "repeat(auto-fill, minmax(min(100%, 320px), 1fr))",
+								gap: "var(--space-formGap)"
+							},
+							children: Z.map((e) => /* @__PURE__ */ b(ie, {
+								dataSink: e.dataSink,
+								setupState: e.setupState,
+								onView: Q,
+								onEdit: Ke,
+								onRefresh: qe,
+								onExport: Ze,
+								onDelete: Ye,
+								canEdit: k,
+								canRefresh: j,
+								canDelete: A
+							}, e.dataSink.id))
+						}),
+						Z.length > 0 && F === "table" && /* @__PURE__ */ b("div", {
+							className: "min-w-0",
 							style: { overflowX: "auto" },
 							children: /* @__PURE__ */ x("table", {
 								style: {
@@ -538,7 +475,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.name", "Name")
+											children: E("bigconsole.dataSinks.table.name", "Name")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -548,7 +485,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.key", "Key")
+											children: E("bigconsole.dataSinks.table.key", "Key")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -558,7 +495,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.status", "Status")
+											children: E("bigconsole.dataSinks.table.status", "Status")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -568,7 +505,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.setup", "Setup")
+											children: E("bigconsole.dataSinks.table.setup", "Setup")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -578,7 +515,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.active", "Active")
+											children: E("bigconsole.dataSinks.table.active", "Active")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -588,7 +525,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.version", "Version")
+											children: E("bigconsole.dataSinks.table.version", "Version")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -598,7 +535,7 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.updated", "Updated")
+											children: E("bigconsole.dataSinks.table.updated", "Updated")
 										}),
 										/* @__PURE__ */ b("th", {
 											style: {
@@ -608,24 +545,15 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 												color: "var(--color-text-secondary)",
 												whiteSpace: "nowrap"
 											},
-											children: w("bigconsole.dataSinks.table.actions", "Actions")
+											children: E("bigconsole.dataSinks.table.actions", "Actions")
 										})
 									]
-								}) }), /* @__PURE__ */ b("tbody", { children: X.map((e) => {
+								}) }), /* @__PURE__ */ b("tbody", { children: Z.map((e) => {
 									let t = e.dataSink;
 									return /* @__PURE__ */ x("tr", {
-										onClick: () => Z(t.id),
-										style: {
-											borderBottom: "1px solid var(--color-border)",
-											cursor: "pointer",
-											transition: "background-color 0.15s"
-										},
-										onMouseEnter: (e) => {
-											e.currentTarget.style.backgroundColor = "var(--color-bg-sunken)";
-										},
-										onMouseLeave: (e) => {
-											e.currentTarget.style.backgroundColor = "transparent";
-										},
+										onClick: () => Q(t.id),
+										className: "cursor-pointer hover:bg-bg-sunken motion-safe:transition-colors",
+										style: { borderBottom: "1px solid var(--color-border)" },
 										children: [
 											/* @__PURE__ */ b("td", {
 												style: {
@@ -654,11 +582,11 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 											}),
 											/* @__PURE__ */ b("td", {
 												style: { padding: "10px 12px" },
-												children: /* @__PURE__ */ b(te, { status: t.status })
+												children: /* @__PURE__ */ b(re, { status: t.status })
 											}),
 											/* @__PURE__ */ b("td", {
 												style: { padding: "10px 12px" },
-												children: /* @__PURE__ */ b(oe, { state: e.setupState })
+												children: /* @__PURE__ */ b(ce, { state: e.setupState })
 											}),
 											/* @__PURE__ */ b("td", {
 												style: {
@@ -671,9 +599,9 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 														width: 8,
 														height: 8,
 														borderRadius: "50%",
-														backgroundColor: t.isActive ? "#22c55e" : "var(--color-text-muted)"
+														backgroundColor: t.isActive ? "var(--color-status-success-bg)" : "var(--color-text-muted)"
 													},
-													title: t.isActive ? w("bigconsole.dataSinks.badges.active", "Active") : w("bigconsole.dataSinks.badges.inactive", "Inactive")
+													title: t.isActive ? E("bigconsole.dataSinks.badges.active", "Active") : E("bigconsole.dataSinks.badges.inactive", "Inactive")
 												})
 											}),
 											/* @__PURE__ */ x("td", {
@@ -706,73 +634,43 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 													children: [
 														/* @__PURE__ */ b("button", {
 															type: "button",
-															title: w("bigconsole.dataSinks.actions.view", "View"),
-															onClick: () => Z(t.id),
-															style: {
-																padding: 4,
-																border: "none",
-																background: "none",
-																cursor: "pointer",
-																color: "var(--color-text-muted)",
-																borderRadius: 4
-															},
-															children: /* @__PURE__ */ b(pe, { size: 14 })
-														}),
-														D && /* @__PURE__ */ b("button", {
-															type: "button",
-															title: w("bigconsole.dataSinks.actions.edit", "Edit"),
-															onClick: () => Ge(t.id),
-															style: {
-																padding: 4,
-																border: "none",
-																background: "none",
-																cursor: "pointer",
-																color: "var(--color-text-muted)",
-																borderRadius: 4
-															},
+															title: E("bigconsole.dataSinks.actions.view", "View"),
+															"aria-label": E("bigconsole.dataSinks.actions.view", "View"),
+															onClick: () => Q(t.id),
+															className: C,
 															children: /* @__PURE__ */ b(he, { size: 14 })
 														}),
 														k && /* @__PURE__ */ b("button", {
 															type: "button",
-															title: w("bigconsole.dataSinks.actions.refresh", "Refresh"),
-															onClick: () => Q(t.id),
-															style: {
-																padding: 4,
-																border: "none",
-																background: "none",
-																cursor: "pointer",
-																color: "var(--color-text-muted)",
-																borderRadius: 4
-															},
-															children: /* @__PURE__ */ b(ge, { size: 14 })
+															title: E("bigconsole.dataSinks.actions.edit", "Edit"),
+															"aria-label": E("bigconsole.dataSinks.actions.edit", "Edit"),
+															onClick: () => Ke(t.id),
+															className: C,
+															children: /* @__PURE__ */ b(_e, { size: 14 })
+														}),
+														j && /* @__PURE__ */ b("button", {
+															type: "button",
+															title: E("bigconsole.dataSinks.actions.refresh", "Refresh"),
+															"aria-label": E("bigconsole.dataSinks.actions.refresh", "Refresh"),
+															onClick: () => qe(t.id),
+															className: C,
+															children: /* @__PURE__ */ b(ve, { size: 14 })
 														}),
 														/* @__PURE__ */ b("button", {
 															type: "button",
-															title: w("bigconsole.dataSinks.actions.export", "Export"),
-															onClick: () => Ye(t.id),
-															style: {
-																padding: 4,
-																border: "none",
-																background: "none",
-																cursor: "pointer",
-																color: "var(--color-text-muted)",
-																borderRadius: 4
-															},
-															children: /* @__PURE__ */ b(fe, { size: 14 })
+															title: E("bigconsole.dataSinks.actions.export", "Export"),
+															"aria-label": E("bigconsole.dataSinks.actions.export", "Export"),
+															onClick: () => Ze(t.id),
+															className: C,
+															children: /* @__PURE__ */ b(me, { size: 14 })
 														}),
-														O && /* @__PURE__ */ b("button", {
+														A && /* @__PURE__ */ b("button", {
 															type: "button",
-															title: w("bigconsole.dataSinks.actions.delete", "Delete"),
-															onClick: () => qe(t.id),
-															style: {
-																padding: 4,
-																border: "none",
-																background: "none",
-																cursor: "pointer",
-																color: "var(--color-text-muted)",
-																borderRadius: 4
-															},
-															children: /* @__PURE__ */ b(ye, { size: 14 })
+															title: E("bigconsole.dataSinks.actions.delete", "Delete"),
+															"aria-label": E("bigconsole.dataSinks.actions.delete", "Delete"),
+															onClick: () => Ye(t.id),
+															className: C,
+															children: /* @__PURE__ */ b(xe, { size: 14 })
 														})
 													]
 												})
@@ -782,29 +680,29 @@ var S = "bigconsole-datasinks-view-mode", Ne = (e) => e.setupState === "complete
 								}) })]
 							})
 						})
-					})
-				]
+					] })
+				})] }) })]
 			}),
-			V && /* @__PURE__ */ x(Me, { children: [/* @__PURE__ */ b(re, {
-				dataSink: V,
+			U && /* @__PURE__ */ x(y, { children: [/* @__PURE__ */ b(ae, {
+				dataSink: U,
 				isOpen: Re,
-				onClose: U,
-				onConfirm: Je
-			}), /* @__PURE__ */ b(ie, {
-				dataSink: V,
-				isOpen: ze,
 				onClose: G,
-				onConfirm: Ke
+				onConfirm: Xe
+			}), /* @__PURE__ */ b(oe, {
+				dataSink: U,
+				isOpen: ze,
+				onClose: q,
+				onConfirm: Je
 			})] }),
-			/* @__PURE__ */ b(ae, {
+			/* @__PURE__ */ b(se, {
 				isOpen: Ie,
-				onClose: () => M(!1),
-				onSuccess: Ze
+				onClose: () => P(!1),
+				onSuccess: $e
 			})
 		]
 	});
 });
 //#endregion
-export { C as DataSinksPage, C as default };
+export { T as DataSinksPage, T as default };
 
 //# sourceMappingURL=DataSinksPage.js.map