@burdenoff/microfe-bigconsole 2026.805.3 → 2026.812.2

package/dist/bigconsole/pages/WorkflowsPage.js

@@ -1,47 +1,50 @@
 import { useWorkflowStore as e } from "../store/workflowStore.js";
 import { useAppNavigate as t } from "../contexts/NavigationContext.js";
 import "../contexts/index.js";
-import n from "../hooks/useWorkflowOperations.js";
-import { newWorkflowPath as r } from "../BigConsoleRoutes.js";
-import { BIGCONSOLE_PERMISSIONS as i } from "../../constants/permissions.js";
-import { isNative as a, nativeNotify as o } from "../../utils/nativeBridge.js";
-import s from "../components/workflow/WorkflowDeleteDialog.js";
-import c from "../components/workflow/WorkflowCard.js";
-import { memo as l, useCallback as u, useMemo as d, useState as f } from "react";
-import { AccessDenied as p, PermissionButton as m } from "@burdenoff/fe-libs/shared/components";
-import { usePermissions as h } from "@burdenoff/fe-libs/shared/providers/shell";
-import { AlertCircle as g, Plus as _, Search as v, Workflow as y } from "lucide-react";
-import { useI18n as b } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
-import { AuroraBackground as x, Button as S, Card as C, CardContent as w, GlassCard as T, GradientText as E, IllustratedEmptyState as D, Input as O, PagePurpose as k, Spinner as A } from "@burdenoff/fe-libs/ui";
-import { jsx as j, jsxs as M } from "react/jsx-runtime";
+import { SECTION_FOCUS_RING as n } from "../components/common/sectionStyles.js";
+import { Section as r, SectionStack as i } from "../components/common/Section.js";
+import "../components/common/index.js";
+import a from "../hooks/useWorkflowOperations.js";
+import { newWorkflowPath as o } from "../BigConsoleRoutes.js";
+import { BIGCONSOLE_PERMISSIONS as s } from "../../constants/permissions.js";
+import { isNative as c, nativeNotify as l } from "../../utils/nativeBridge.js";
+import u from "../components/workflow/WorkflowDeleteDialog.js";
+import d from "../components/workflow/WorkflowCard.js";
+import { memo as f, useCallback as p, useMemo as m, useState as h } from "react";
+import { AccessDenied as g, PermissionButton as _ } from "@burdenoff/fe-libs/shared/components";
+import { usePermissions as v } from "@burdenoff/fe-libs/shared/providers/shell";
+import { AlertCircle as y, Plus as b, Search as x, Workflow as S } from "lucide-react";
+import { useI18n as C } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { AuroraBackground as w, Button as T, GradientText as E, IllustratedEmptyState as D, Input as O, PagePurpose as k, Spinner as A } from "@burdenoff/fe-libs/ui";
+import { Fragment as j, jsx as M, jsxs as N } from "react/jsx-runtime";
 //#region src/bigconsole/pages/WorkflowsPage.tsx
-var N = l(function() {
-	let l = t(), { t: N } = b(), { hasPermission: P, isLoading: F } = h(), I = P(i.WORKFLOW_READ), L = P(i.WORKFLOW_UPDATE), R = P(i.WORKFLOW_DELETE), [z, B] = f("all"), V = e((e) => e.searchQuery), H = e((e) => e.setSearchQuery), U = e((e) => e.deleteDialogOpen), W = e((e) => e.currentWorkflow), G = e((e) => e.openDeleteDialog), K = e((e) => e.closeDeleteDialog), { loading: q, error: J, workflows: Y, deleteWorkflow: X, refetch: Z } = n(), Q = d(() => {
+var P = f(function() {
+	let f = t(), { t: P } = C(), { hasPermission: F, isLoading: I } = v(), L = F(s.WORKFLOW_READ), R = F(s.WORKFLOW_UPDATE), z = F(s.WORKFLOW_DELETE), [B, V] = h("all"), H = e((e) => e.searchQuery), U = e((e) => e.setSearchQuery), ee = e((e) => e.deleteDialogOpen), W = e((e) => e.currentWorkflow), G = e((e) => e.openDeleteDialog), K = e((e) => e.closeDeleteDialog), { loading: q, error: J, workflows: Y, deleteWorkflow: X, refetch: Z } = a(), Q = m(() => {
 		let e = [...Y];
-		if (z !== "all" && (e = e.filter((e) => e.status === z)), V.trim()) {
-			let t = V.toLowerCase();
+		if (B !== "all" && (e = e.filter((e) => e.status === B)), H.trim()) {
+			let t = H.toLowerCase();
 			e = e.filter((e) => e.name.toLowerCase().includes(t) || e.key.toLowerCase().includes(t) || e.description?.toLowerCase().includes(t));
 		}
 		return e.sort((e, t) => new Date(t.updatedAt).getTime() - new Date(e.updatedAt).getTime());
 	}, [
 		Y,
-		z,
-		V
-	]), $ = u(() => {
-		l(r());
-	}, [l]), ee = u((e) => {
-		l(`/workflows/${e}`);
-	}, [l]), te = u((e) => {
-		l(`/workflows/${e}/edit`);
-	}, [l]), ne = u((e) => {
+		B,
+		H
+	]), $ = p(() => {
+		f(o());
+	}, [f]), te = p((e) => {
+		f(`/workflows/${e}`);
+	}, [f]), ne = p((e) => {
+		f(`/workflows/${e}/edit`);
+	}, [f]), re = p((e) => {
 		let t = Y.find((t) => t.id === e);
 		t && G(t);
-	}, [Y, G]), re = u(async () => {
+	}, [Y, G]), ie = p(async () => {
 		if (W) {
 			try {
-				await X(W.id), a() && o("success");
+				await X(W.id), c() && l("success");
 			} catch (e) {
-				throw a() && o("error"), e;
+				throw c() && l("error"), e;
 			}
 			K();
 		}
@@ -49,308 +52,190 @@ var N = l(function() {
 		W,
 		X,
 		K
-	]), ie = [
+	]), ae = [
 		{
 			value: "all",
-			label: N("bigconsole.workflows.filters.all", "All")
+			label: P("bigconsole.workflows.filters.all", "All")
 		},
 		{
 			value: "draft",
-			label: N("bigconsole.workflows.status.draft", "Draft")
+			label: P("bigconsole.workflows.status.draft", "Draft")
 		},
 		{
 			value: "active",
-			label: N("bigconsole.workflows.status.active", "Active")
+			label: P("bigconsole.workflows.status.active", "Active")
 		},
 		{
 			value: "paused",
-			label: N("bigconsole.workflows.status.paused", "Paused")
+			label: P("bigconsole.workflows.status.paused", "Paused")
 		},
 		{
 			value: "error",
-			label: N("bigconsole.workflows.status.error", "Error")
+			label: P("bigconsole.workflows.status.error", "Error")
 		},
 		{
 			value: "archived",
-			label: N("bigconsole.workflows.status.archived", "Archived")
+			label: P("bigconsole.workflows.status.archived", "Archived")
 		}
 	];
-	return !F && !I ? /* @__PURE__ */ j(p, {
-		title: N("bigconsole.workflows.errors.accessDeniedTitle", "Access Denied"),
-		description: N("bigconsole.workflows.errors.accessDeniedListDescription", "You don't have permission to view workflows.")
-	}) : J ? /* @__PURE__ */ j("div", {
-		style: { padding: "var(--space-pagePadding)" },
-		children: /* @__PURE__ */ j(C, {
-			style: {
-				borderColor: "var(--color-status-error-border)",
-				backgroundColor: "var(--color-status-error-bgSubtle)"
-			},
-			children: /* @__PURE__ */ j(w, {
-				style: { padding: "var(--space-pagePadding)" },
-				children: /* @__PURE__ */ M("div", {
-					style: {
-						display: "flex",
-						flexDirection: "column",
-						alignItems: "center",
-						textAlign: "center"
-					},
-					children: [
-						/* @__PURE__ */ j("div", {
-							style: {
-								padding: "var(--space-controlGap)",
-								borderRadius: "50%",
-								backgroundColor: "var(--color-status-error-bgSubtle)",
-								marginBottom: "var(--space-formGap)"
-							},
-							children: /* @__PURE__ */ j(g, { style: {
-								height: "var(--size-icon-xl)",
-								width: "var(--size-icon-xl)",
-								color: "var(--color-status-error-text)"
-							} })
-						}),
-						/* @__PURE__ */ j("h3", {
-							style: {
-								fontSize: "var(--font-size-body-lg)",
-								fontWeight: "var(--font-weight-medium)",
-								color: "var(--color-status-error-text)",
-								marginBottom: "var(--space-controlGap)"
-							},
-							children: N("bigconsole.workflows.errors.loadFailedTitle", "Failed to load Workflows")
-						}),
-						/* @__PURE__ */ j("p", {
-							style: {
-								fontSize: "var(--font-size-body-sm)",
-								color: "var(--color-text-secondary)",
-								marginBottom: "var(--space-formGap)"
-							},
-							children: J.message
-						}),
-						/* @__PURE__ */ j(S, {
-							size: "sm",
-							onClick: () => Z(),
-							children: N("bigconsole.workflows.actions.tryAgain", "Try Again")
-						})
-					]
-				})
-			})
-		})
-	}) : /* @__PURE__ */ M("div", {
-		style: {
-			minHeight: "100vh",
-			backgroundColor: "var(--color-bg-canvas)"
-		},
+	if (!I && !L) return /* @__PURE__ */ M(g, {
+		title: P("bigconsole.workflows.errors.accessDeniedTitle", "Access Denied"),
+		description: P("bigconsole.workflows.errors.accessDeniedListDescription", "You don't have permission to view workflows.")
+	});
+	let oe = !q && Y.length === 0, se = !q && Q.length === 0 && Y.length > 0;
+	return /* @__PURE__ */ N("div", {
+		className: "min-h-dvh bg-bg-canvas",
 		children: [
-			/* @__PURE__ */ M("div", {
-				className: "relative overflow-hidden border-b border-border-seam bg-gloss-card",
-				children: [/* @__PURE__ */ j(x, { intensity: "subtle" }), /* @__PURE__ */ j("div", {
-					style: { padding: "var(--space-pagePadding)" },
-					children: /* @__PURE__ */ M("div", {
-						style: {
-							display: "flex",
-							alignItems: "center",
-							justifyContent: "space-between"
-						},
-						children: [/* @__PURE__ */ M("div", {
-							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "var(--space-formGap)"
-							},
-							children: [/* @__PURE__ */ j("div", {
-								style: {
-									display: "flex",
-									height: "var(--size-controlHeight-lg)",
-									width: "var(--size-controlHeight-lg)",
-									alignItems: "center",
-									justifyContent: "center",
-									borderRadius: "var(--radius-card)",
-									backgroundColor: "var(--color-action-primary-bg)"
-								},
-								children: /* @__PURE__ */ j(y, { style: {
-									height: "var(--size-icon-lg)",
-									width: "var(--size-icon-lg)",
-									color: "var(--color-action-primary-text)"
-								} })
-							}), /* @__PURE__ */ M("div", { children: [/* @__PURE__ */ j("h1", {
-								style: {
-									fontSize: "var(--font-size-heading-h4)",
-									fontWeight: "var(--font-weight-bold)",
-									margin: 0,
-									color: "var(--color-text-primary)"
-								},
-								children: /* @__PURE__ */ j(E, { children: N("bigconsole.workflows.list.title", "Workflows") })
-							}), /* @__PURE__ */ j("p", {
-								style: {
-									fontSize: "var(--font-size-body-sm)",
-									color: "var(--color-text-secondary)",
-									margin: 0
-								},
-								children: N("bigconsole.workflows.list.subtitle", "Design ETL workflows with FluidGrids and link them to DataSinks")
-							})] })]
-						}), /* @__PURE__ */ j("div", {
-							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "var(--space-controlGap)"
-							},
-							children: /* @__PURE__ */ j(m, {
-								permission: i.WORKFLOW_CREATE,
-								deniedBehavior: "disable",
-								children: /* @__PURE__ */ M(S, {
-									onClick: $,
-									children: [/* @__PURE__ */ j(_, { style: {
-										marginRight: "var(--space-iconGap)",
-										height: "var(--size-icon-sm)",
-										width: "var(--size-icon-sm)"
-									} }), N("bigconsole.workflows.actions.designWorkflow", "Design Workflow")]
-								})
-							})
+			/* @__PURE__ */ N("header", {
+				"data-section-emphasis": "bare",
+				className: "relative min-w-0 overflow-hidden border-b border-[var(--color-border-seam)] bg-[image:var(--gradient-gloss-card)]",
+				children: [/* @__PURE__ */ M(w, { intensity: "subtle" }), /* @__PURE__ */ N("div", {
+					className: "relative flex flex-col gap-form-gap p-[var(--space-pagePadding)] sm:flex-row sm:items-center sm:justify-between",
+					children: [/* @__PURE__ */ N("div", {
+						className: "flex min-w-0 items-center gap-form-gap",
+						children: [/* @__PURE__ */ M("span", {
+							"aria-hidden": "true",
+							className: "flex h-control-lg w-[var(--size-controlHeight-lg)] shrink-0 items-center justify-center rounded-card bg-action-primary-bg",
+							children: /* @__PURE__ */ M(S, { className: "h-icon-lg w-icon-lg text-action-primary-text" })
+						}), /* @__PURE__ */ N("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ M("h1", {
+								className: "text-2xl font-bold text-text-primary",
+								children: /* @__PURE__ */ M(E, { children: P("bigconsole.workflows.list.title", "Workflows") })
+							}), /* @__PURE__ */ M("p", {
+								className: "text-sm text-text-secondary",
+								children: P("bigconsole.workflows.list.subtitle", "Design ETL workflows with FluidGrids and link them to DataSinks")
+							})]
 						})]
-					})
+					}), /* @__PURE__ */ M("div", {
+						className: "flex flex-wrap items-center gap-control-gap",
+						children: /* @__PURE__ */ M(_, {
+							permission: s.WORKFLOW_CREATE,
+							deniedBehavior: "disable",
+							children: /* @__PURE__ */ N(T, {
+								onClick: $,
+								children: [/* @__PURE__ */ M(b, { className: "h-icon-sm w-icon-sm" }), P("bigconsole.workflows.actions.designWorkflow", "Design Workflow")]
+							})
+						})
+					})]
 				})]
 			}),
 			/* @__PURE__ */ M("div", {
-				style: { padding: "var(--space-pagePadding)" },
-				children: [
-					/* @__PURE__ */ j(k, {
-						className: "mb-[var(--space-sectionGap)]",
-						children: N("bigconsole.workflows.list.purpose", "Workflows are visual ETL jobs built with the FluidGrids builder — they fetch data from external systems, transform it, and load it into your BigConsole DataSinks on a schedule or on demand. Use them to keep dashboards fed with fresh, shaped data without writing glue code.")
+				className: "p-[var(--space-pagePadding)]",
+				children: /* @__PURE__ */ N(i, { children: [/* @__PURE__ */ M(k, { children: P("bigconsole.workflows.list.purpose", "Workflows are visual ETL jobs built with the FluidGrids builder — they fetch data from external systems, transform it, and load it into your BigConsole DataSinks on a schedule or on demand. Use them to keep dashboards fed with fresh, shaped data without writing glue code.") }), J ? /* @__PURE__ */ M(r, {
+					headingLevel: 2,
+					tone: "danger",
+					title: P("bigconsole.workflows.errors.loadFailedTitle", "Failed to load Workflows"),
+					description: "The workflow service did not respond. Nothing has been changed — retry when you are ready.",
+					icon: /* @__PURE__ */ M(y, { className: "h-icon-md w-icon-md" }),
+					actions: /* @__PURE__ */ M(T, {
+						size: "sm",
+						onClick: () => Z(),
+						children: P("bigconsole.workflows.actions.tryAgain", "Try Again")
 					}),
-					/* @__PURE__ */ j("div", {
-						style: { marginBottom: "var(--space-formGap)" },
-						children: /* @__PURE__ */ j("div", {
-							style: {
-								display: "flex",
-								alignItems: "center",
-								gap: "2px",
-								padding: "4px",
-								backgroundColor: "var(--color-bg-sunken)",
-								borderRadius: "var(--radius-card)",
-								width: "fit-content"
-							},
-							children: ie.map((e) => /* @__PURE__ */ j("button", {
+					"data-testid": "workflows-error",
+					children: /* @__PURE__ */ M("p", {
+						className: "break-words text-sm text-[var(--color-status-error-text)]",
+						children: J.message
+					})
+				}) : /* @__PURE__ */ N(j, { children: [/* @__PURE__ */ M(r, {
+					headingLevel: 2,
+					title: "Filters",
+					description: "Narrow the list by status, or search by name, key or description.",
+					padding: "compact",
+					"data-testid": "workflows-filters",
+					children: /* @__PURE__ */ N("div", {
+						className: "flex flex-col gap-form-gap lg:flex-row lg:items-center lg:justify-between",
+						children: [/* @__PURE__ */ M("div", {
+							role: "group",
+							"aria-label": "Filter workflows by status",
+							className: "flex flex-wrap items-center gap-1 rounded-card bg-bg-sunken p-1",
+							children: ae.map((e) => /* @__PURE__ */ M("button", {
 								type: "button",
-								onClick: () => B(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: z === e.value ? "var(--color-bg-surface)" : "transparent",
-									color: z === e.value ? "var(--color-text-primary)" : "var(--color-text-secondary)",
-									boxShadow: z === e.value ? "0 1px 2px rgba(0,0,0,0.05)" : "none"
-								},
+								"aria-pressed": B === e.value,
+								onClick: () => V(e.value),
+								className: `min-h-[var(--size-controlHeight-md)] rounded-button px-3 text-sm font-medium motion-safe:transition-colors ${n} ${B === e.value ? "bg-bg-surface text-text-primary shadow-[var(--shadow-elevation-1)]" : "text-text-secondary hover:text-text-primary"}`,
 								children: e.label
 							}, e.value))
-						})
-					}),
-					/* @__PURE__ */ j("div", {
-						style: { marginBottom: "var(--space-sectionGap)" },
-						children: /* @__PURE__ */ M("div", {
-							style: {
-								position: "relative",
-								maxWidth: "400px"
-							},
-							children: [/* @__PURE__ */ j(v, { style: {
-								position: "absolute",
-								left: "var(--space-controlGap)",
-								top: "50%",
-								transform: "translateY(-50%)",
-								height: "var(--size-icon-sm)",
-								width: "var(--size-icon-sm)",
-								color: "var(--color-text-muted)"
-							} }), /* @__PURE__ */ j(O, {
+						}), /* @__PURE__ */ N("div", {
+							className: "relative w-full lg:max-w-[360px]",
+							children: [/* @__PURE__ */ M(x, {
+								"aria-hidden": "true",
+								className: "pointer-events-none absolute left-3 top-1/2 h-icon-sm w-icon-sm -translate-y-1/2 text-text-muted"
+							}), /* @__PURE__ */ M(O, {
 								type: "text",
-								placeholder: N("bigconsole.workflows.filters.searchPlaceholder", "Search workflows..."),
-								value: V,
-								onChange: (e) => H(e.target.value),
-								style: {
-									paddingLeft: "var(--size-controlHeight-md)",
-									height: "var(--size-controlHeight-md)"
-								}
-							})]
-						})
-					}),
-					q && Y.length === 0 && /* @__PURE__ */ j("div", {
-						style: {
-							display: "flex",
-							alignItems: "center",
-							justifyContent: "center",
-							padding: "80px 0"
-						},
-						children: /* @__PURE__ */ M("div", {
-							style: { textAlign: "center" },
-							children: [/* @__PURE__ */ j(A, { style: {
-								height: "var(--size-icon-xl)",
-								width: "var(--size-icon-xl)",
-								margin: "0 auto var(--space-formGap)"
-							} }), /* @__PURE__ */ j("p", {
-								style: {
-									fontSize: "var(--font-size-body-sm)",
-									color: "var(--color-text-muted)"
-								},
-								children: N("bigconsole.workflows.list.loading", "Loading workflows...")
+								"aria-label": P("bigconsole.workflows.filters.searchPlaceholder", "Search workflows..."),
+								placeholder: P("bigconsole.workflows.filters.searchPlaceholder", "Search workflows..."),
+								value: H,
+								onChange: (e) => U(e.target.value),
+								className: "h-control-md pl-10"
 							})]
-						})
+						})]
+					})
+				}), /* @__PURE__ */ N(r, {
+					headingLevel: 2,
+					emphasis: "primary",
+					title: P("bigconsole.workflows.list.title", "Workflows"),
+					description: "Every workflow in this workspace, most recently updated first.",
+					meta: /* @__PURE__ */ N("span", {
+						className: "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
+						children: [Q.length, Q.length === Y.length ? "" : ` of ${Y.length}`]
 					}),
-					!q && Y.length === 0 && /* @__PURE__ */ j(T, {
-						treatment: "insight",
-						className: "border-border-seam",
-						children: /* @__PURE__ */ j(D, {
+					"data-testid": "workflows-results",
+					children: [
+						q && Y.length === 0 && /* @__PURE__ */ M("div", {
+							className: "flex min-h-[240px] items-center justify-center",
+							children: /* @__PURE__ */ N("div", {
+								className: "text-center",
+								children: [/* @__PURE__ */ M(A, {
+									size: "lg",
+									className: "mb-form-gap"
+								}), /* @__PURE__ */ M("p", {
+									className: "text-sm text-text-muted",
+									children: P("bigconsole.workflows.list.loading", "Loading workflows...")
+								})]
+							})
+						}),
+						oe && /* @__PURE__ */ M(D, {
 							illustration: "empty-data",
-							title: N("bigconsole.workflows.list.emptyTitle", "No Workflows yet"),
-							description: N("bigconsole.workflows.list.emptyDescription", "Design ETL workflows with the FluidGrids visual builder to fetch, transform, and deliver data into BigConsole DataSinks."),
-							action: /* @__PURE__ */ j(m, {
-								permission: i.WORKFLOW_CREATE,
+							title: P("bigconsole.workflows.list.emptyTitle", "No Workflows yet"),
+							description: P("bigconsole.workflows.list.emptyDescription", "Design ETL workflows with the FluidGrids visual builder to fetch, transform, and deliver data into BigConsole DataSinks."),
+							action: /* @__PURE__ */ M(_, {
+								permission: s.WORKFLOW_CREATE,
 								deniedBehavior: "disable",
-								children: /* @__PURE__ */ M(S, {
+								children: /* @__PURE__ */ N(T, {
 									onClick: $,
-									children: [/* @__PURE__ */ j(_, { style: {
-										marginRight: "var(--space-iconGap)",
-										height: "var(--size-icon-sm)",
-										width: "var(--size-icon-sm)"
-									} }), N("bigconsole.workflows.actions.designWorkflow", "Design Workflow")]
+									children: [/* @__PURE__ */ M(b, { className: "h-icon-sm w-icon-sm" }), P("bigconsole.workflows.actions.designWorkflow", "Design Workflow")]
 								})
 							})
-						})
-					}),
-					!q && Q.length === 0 && Y.length > 0 && /* @__PURE__ */ j(T, {
-						treatment: "insight",
-						className: "border-border-seam",
-						children: /* @__PURE__ */ j(D, {
+						}),
+						se && /* @__PURE__ */ M(D, {
 							illustration: "empty-search",
-							title: N("bigconsole.workflows.list.noResultsTitle", "No matching workflows"),
-							description: N("bigconsole.workflows.list.noResultsDescription", "No workflows match your filters")
+							title: P("bigconsole.workflows.list.noResultsTitle", "No matching workflows"),
+							description: P("bigconsole.workflows.list.noResultsDescription", "No workflows match your filters")
+						}),
+						Q.length > 0 && /* @__PURE__ */ M("div", {
+							className: "grid grid-cols-1 gap-form-gap sm:grid-cols-2 xl:grid-cols-3",
+							children: Q.map((e) => /* @__PURE__ */ M(d, {
+								workflow: e,
+								onView: te,
+								onEdit: R ? ne : void 0,
+								onDelete: z ? re : void 0
+							}, e.id))
 						})
-					}),
-					Q.length > 0 && /* @__PURE__ */ j("div", {
-						style: {
-							display: "grid",
-							gridTemplateColumns: "repeat(auto-fill, minmax(320px, 1fr))",
-							gap: "var(--space-formGap)"
-						},
-						children: Q.map((e) => /* @__PURE__ */ j(c, {
-							workflow: e,
-							onView: ee,
-							onEdit: L ? te : void 0,
-							onDelete: R ? ne : void 0
-						}, e.id))
-					})
-				]
+					]
+				})] })] })
 			}),
-			W && /* @__PURE__ */ j(s, {
+			W && /* @__PURE__ */ M(u, {
 				workflow: W,
-				isOpen: U,
+				isOpen: ee,
 				onClose: K,
-				onConfirm: re
+				onConfirm: ie
 			})
 		]
 	});
 });
 //#endregion
-export { N as WorkflowsPage };
+export { P as WorkflowsPage };
 
 //# sourceMappingURL=WorkflowsPage.js.map