@loopstack/loopstack-studio 0.23.1 → 0.25.0

package/dist/pages/DashboardPage.js

@@ -1,58 +1,110 @@
 import { useStudio } from "../providers/StudioProvider.js";
-import { Alert } from "../components/ui/alert.js";
+import { Button } from "../components/ui/button.js";
+import { Alert, AlertDescription, AlertTitle } from "../components/ui/alert.js";
 import MainLayout_default from "../components/layout/MainLayout.js";
 import LoadingCentered_default from "../components/feedback/LoadingCentered.js";
 import Dashboard from "../features/dashboard/Dashboard.js";
 import { useDashboardStats } from "../hooks/useDashboard.js";
 import { c } from "react/compiler-runtime";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { Home } from "lucide-react";
+import { Home, TriangleAlert } from "lucide-react";
 function DashboardPage() {
-	let d = c(17), { environment: f } = useStudio(), { data: p, isLoading: m, error: h } = useDashboardStats();
-	if (m) {
+	let h = c(38), { environment: g } = useStudio(), { data: _, isLoading: v, error: y, refetch: b, isRefetching: x } = useDashboardStats();
+	if (v) {
 		let e;
-		return d[0] === m ? e = d[1] : (e = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: m }), d[0] = m, d[1] = e), e;
+		return h[0] === v ? e = h[1] : (e = /* @__PURE__ */ jsx(LoadingCentered_default, { loading: v }), h[0] = v, h[1] = e), e;
 	}
-	if (h) {
+	if (y) {
 		let e;
-		return d[2] === h.message ? e = d[3] : (e = /* @__PURE__ */ jsxs(Alert, {
-			className: "w-full p-4 text-red-500",
-			children: ["Error loading dashboard: ", h.message]
-		}), d[2] = h.message, d[3] = e), e;
+		h[2] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx(Home, { className: "h-4 w-4" }), h[2] = e) : e = h[2];
+		let d;
+		h[3] === g.name ? d = h[4] : (d = {
+			label: g.name,
+			href: "#",
+			icon: e
+		}, h[3] = g.name, h[4] = d);
+		let f;
+		h[5] === Symbol.for("react.memo_cache_sentinel") ? (f = {
+			label: "Dashboard",
+			current: !0
+		}, h[5] = f) : f = h[5];
+		let p;
+		h[6] === d ? p = h[7] : (p = [d, f], h[6] = d, h[7] = p);
+		let m = p, _;
+		h[8] === Symbol.for("react.memo_cache_sentinel") ? (_ = /* @__PURE__ */ jsx("h1", {
+			className: "mb-4 text-3xl font-bold tracking-tight",
+			children: "Dashboard"
+		}), h[8] = _) : _ = h[8];
+		let v, S;
+		h[9] === Symbol.for("react.memo_cache_sentinel") ? (v = /* @__PURE__ */ jsx(TriangleAlert, {}), S = /* @__PURE__ */ jsx(AlertTitle, { children: "Dashboard konnte nicht geladen werden" }), h[9] = v, h[10] = S) : (v = h[9], S = h[10]);
+		let C;
+		h[11] === y.message ? C = h[12] : (C = /* @__PURE__ */ jsxs("p", {
+			className: "wrap-break-word",
+			children: ["Bitte versuch’s nochmal. ", y.message]
+		}), h[11] = y.message, h[12] = C);
+		let w;
+		h[13] === b ? w = h[14] : (w = () => void b(), h[13] = b, h[14] = w);
+		let T = x ? "Lade neu…" : "Neu versuchen", E;
+		h[15] !== x || h[16] !== w || h[17] !== T ? (E = /* @__PURE__ */ jsx("div", {
+			className: "mt-3 flex flex-wrap gap-2",
+			children: /* @__PURE__ */ jsx(Button, {
+				variant: "destructive",
+				onClick: w,
+				disabled: x,
+				children: T
+			})
+		}), h[15] = x, h[16] = w, h[17] = T, h[18] = E) : E = h[18];
+		let D;
+		h[19] !== E || h[20] !== C ? (D = /* @__PURE__ */ jsx("div", {
+			className: "mx-auto w-full max-w-2xl",
+			children: /* @__PURE__ */ jsxs(Alert, {
+				variant: "destructive",
+				children: [
+					v,
+					S,
+					/* @__PURE__ */ jsxs(AlertDescription, { children: [C, E] })
+				]
+			})
+		}), h[19] = E, h[20] = C, h[21] = D) : D = h[21];
+		let O;
+		return h[22] !== m || h[23] !== D ? (O = /* @__PURE__ */ jsxs(MainLayout_default, {
+			breadcrumbsData: m,
+			children: [_, D]
+		}), h[22] = m, h[23] = D, h[24] = O) : O = h[24], O;
 	}
-	if (!p) {
+	if (!_) {
 		let e;
-		return d[4] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
+		return h[25] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("div", {
 			className: "p-4",
 			children: "No data available"
-		}), d[4] = e) : e = d[4], e;
+		}), h[25] = e) : e = h[25], e;
 	}
-	let g;
-	d[5] === Symbol.for("react.memo_cache_sentinel") ? (g = /* @__PURE__ */ jsx(Home, { className: "h-4 w-4" }), d[5] = g) : g = d[5];
-	let _;
-	d[6] === f.name ? _ = d[7] : (_ = {
-		label: f.name,
+	let S;
+	h[26] === Symbol.for("react.memo_cache_sentinel") ? (S = /* @__PURE__ */ jsx(Home, { className: "h-4 w-4" }), h[26] = S) : S = h[26];
+	let C;
+	h[27] === g.name ? C = h[28] : (C = {
+		label: g.name,
 		href: "#",
-		icon: g
-	}, d[6] = f.name, d[7] = _);
-	let v;
-	d[8] === Symbol.for("react.memo_cache_sentinel") ? (v = {
+		icon: S
+	}, h[27] = g.name, h[28] = C);
+	let w;
+	h[29] === Symbol.for("react.memo_cache_sentinel") ? (w = {
 		label: "Dashboard",
 		current: !0
-	}, d[8] = v) : v = d[8];
-	let y;
-	d[9] === _ ? y = d[10] : (y = [_, v], d[9] = _, d[10] = y);
-	let b = y, x;
-	d[11] === Symbol.for("react.memo_cache_sentinel") ? (x = /* @__PURE__ */ jsx("h1", {
+	}, h[29] = w) : w = h[29];
+	let T;
+	h[30] === C ? T = h[31] : (T = [C, w], h[30] = C, h[31] = T);
+	let E = T, D;
+	h[32] === Symbol.for("react.memo_cache_sentinel") ? (D = /* @__PURE__ */ jsx("h1", {
 		className: "mb-4 text-3xl font-bold tracking-tight",
 		children: "Dashboard"
-	}), d[11] = x) : x = d[11];
-	let S;
-	d[12] === p ? S = d[13] : (S = /* @__PURE__ */ jsx(Dashboard, { dashboardStats: p }), d[12] = p, d[13] = S);
-	let C;
-	return d[14] !== b || d[15] !== S ? (C = /* @__PURE__ */ jsxs(MainLayout_default, {
-		breadcrumbsData: b,
-		children: [x, S]
-	}), d[14] = b, d[15] = S, d[16] = C) : C = d[16], C;
+	}), h[32] = D) : D = h[32];
+	let O;
+	h[33] === _ ? O = h[34] : (O = /* @__PURE__ */ jsx(Dashboard, { dashboardStats: _ }), h[33] = _, h[34] = O);
+	let k;
+	return h[35] !== E || h[36] !== O ? (k = /* @__PURE__ */ jsxs(MainLayout_default, {
+		breadcrumbsData: E,
+		children: [D, O]
+	}), h[35] = E, h[36] = O, h[37] = k) : k = h[37], k;
 }
 export { DashboardPage as default };

package/dist/pages/DebugWorkflowDetailsPage.js

@@ -1,5 +1,5 @@
 import { useStudio } from "../providers/StudioProvider.js";
-import { usePipelineConfigByName, usePipelineSource } from "../hooks/usePipelines.js";
+import { useWorkflowConfigByName, useWorkflowSource } from "../hooks/useWorkflows.js";
 import MainLayout_default from "../components/layout/MainLayout.js";
 import { ReactFlowProvider } from "../node_modules/@xyflow/react/dist/esm/index.js";
 import ConfigFlowViewer_default from "../features/debug/components/ConfigFlowViewer.js";
@@ -28,7 +28,7 @@ function DebugWorkflowDetailsPage() {
 		let m;
 		h[3] === g ? m = h[4] : (m = ["default", g], h[3] = g, h[4] = m), v = m;
 	}
-	let [y, b] = v, { data: x, isLoading: S } = usePipelineConfigByName(y, b), { data: C, isLoading: w } = usePipelineSource(y, b), T = S || w, E;
+	let [y, b] = v, { data: x, isLoading: S } = useWorkflowConfigByName(b), { data: C, isLoading: w } = useWorkflowSource(b), T = S || w, E;
 	h[5] === _ ? E = h[6] : (E = _.getDashboard(), h[5] = _, h[6] = E);
 	let D;
 	h[7] === Symbol.for("react.memo_cache_sentinel") ? (D = /* @__PURE__ */ jsx(Home, { className: "h-4 w-4" }), h[7] = D) : D = h[7];
@@ -45,7 +45,7 @@ function DebugWorkflowDetailsPage() {
 		label: "Debug Workflows",
 		href: k
 	}, h[12] = k, h[13] = A);
-	let j = x?.title || x?.blockName || b || "Workflow Details", M;
+	let j = x?.title || x?.alias || b || "Workflow Details", M;
 	h[14] === j ? M = h[15] : (M = {
 		label: j,
 		current: !0
@@ -57,7 +57,7 @@ function DebugWorkflowDetailsPage() {
 		M
 	], h[16] = O, h[17] = A, h[18] = M, h[19] = N) : N = h[19];
 	let P = N, F;
-	h[20] !== T || h[21] !== b || h[22] !== C || h[23] !== x || h[24] !== y ? (F = T ? /* @__PURE__ */ jsxs("div", {
+	h[20] !== T || h[21] !== C || h[22] !== b || h[23] !== x || h[24] !== y ? (F = T ? /* @__PURE__ */ jsxs("div", {
 		className: "flex items-center space-x-2",
 		children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }), /* @__PURE__ */ jsx("span", { children: "Loading..." })]
 	}) : x ? /* @__PURE__ */ jsxs("div", {
@@ -65,7 +65,7 @@ function DebugWorkflowDetailsPage() {
 		children: [
 			/* @__PURE__ */ jsx("h1", {
 				className: "text-3xl font-bold tracking-tight",
-				children: x.title || x.blockName
+				children: x.title || x.alias
 			}),
 			/* @__PURE__ */ jsx("p", {
 				className: "text-muted-foreground",
@@ -81,7 +81,7 @@ function DebugWorkflowDetailsPage() {
 					}), /* @__PURE__ */ jsx("div", {
 						className: "flex-1 overflow-auto bg-[#1e1e1e]",
 						children: /* @__PURE__ */ jsx(Prism, {
-							language: C?.raw ? "yaml" : "json",
+							language: C?.raw ? "typescript" : "json",
 							style: vscDarkPlus,
 							customStyle: {
 								margin: 0,
@@ -108,10 +108,10 @@ function DebugWorkflowDetailsPage() {
 	}) : /* @__PURE__ */ jsxs("div", { children: [
 		"Workflow Type not found (Workspace: ",
 		y,
-		", Pipeline: ",
+		", Workflow: ",
 		b,
 		")"
-	] }), h[20] = T, h[21] = b, h[22] = C, h[23] = x, h[24] = y, h[25] = F) : F = h[25];
+	] }), h[20] = T, h[21] = C, h[22] = b, h[23] = x, h[24] = y, h[25] = F) : F = h[25];
 	let I;
 	return h[26] !== P || h[27] !== F ? (I = /* @__PURE__ */ jsx(MainLayout_default, {
 		breadcrumbsData: P,

package/dist/pages/DebugWorkflowsPage.js

@@ -11,14 +11,14 @@ import { Home } from "lucide-react";
 function DebugWorkflowsPage() {
 	let { router: f } = useStudio(), { envKey: p, api: m } = useApiClient(), { data: h, isLoading: g } = useWorkspaceConfig(), _ = useQueries({ queries: (h ?? []).map((e) => ({
 		queryKey: [
-			"pipeline-types",
-			e.blockName,
+			"workflowTypes",
+			e.className,
 			p
 		],
 		queryFn: async () => {
-			let c = await m.config.getPipelineTypesByWorkspace({ workspaceBlockName: e.blockName });
+			let c = await m.config.getWorkflowTypesByWorkspace({ workspaceBlockName: e.className });
 			return {
-				workspaceBlockName: e.blockName,
+				workspaceBlockName: e.className,
 				types: c
 			};
 		},
@@ -28,14 +28,14 @@ function DebugWorkflowsPage() {
 		let { workspaceBlockName: c, types: l } = e.data;
 		return (l ?? []).map((e) => ({
 			...e,
-			id: `${c}::${e.blockName}`,
+			id: `${c}::${e.alias}`,
 			workspaceBlockName: c
 		}));
-	}), [_, y]), [x, S] = useState(""), [C, w] = useState("blockName"), [T, E] = useState("ASC"), [D, O] = useState(0), [k, A] = useState(10), j = useMemo(() => {
+	}), [_, y]), [x, S] = useState(""), [C, w] = useState("alias"), [T, E] = useState("ASC"), [D, O] = useState(0), [k, A] = useState(10), j = useMemo(() => {
 		let e = b;
 		if (x) {
 			let c = x.toLowerCase();
-			e = e.filter((e) => e.blockName?.toLowerCase().includes(c) || e.title?.toLowerCase().includes(c) || e.description?.toLowerCase().includes(c) || e.workspaceBlockName.toLowerCase().includes(c));
+			e = e.filter((e) => e.alias?.toLowerCase().includes(c) || e.title?.toLowerCase().includes(c) || e.description?.toLowerCase().includes(c) || e.workspaceBlockName.toLowerCase().includes(c));
 		}
 		return e = [...e].sort((e, c) => {
 			let l = C, u = (e[l] || "").toLowerCase(), d = (c[l] || "").toLowerCase();
@@ -70,8 +70,8 @@ function DebugWorkflowsPage() {
 			data: M,
 			columns: [
 				{
-					id: "blockName",
-					label: "Type ID (Block Name)",
+					id: "alias",
+					label: "Type ID (Alias)",
 					sortable: !0,
 					minWidth: 200,
 					format: (e) => /* @__PURE__ */ jsx("span", {
@@ -83,7 +83,7 @@ function DebugWorkflowsPage() {
 					id: "title",
 					label: "Title",
 					sortable: !0,
-					format: (e, c) => /* @__PURE__ */ jsx("span", { children: String(e || c.blockName || "N/A") })
+					format: (e, c) => /* @__PURE__ */ jsx("span", { children: String(e || c.alias || "N/A") })
 				},
 				{
 					id: "workspaceBlockName",

package/dist/pages/EmbedWorkbenchPage.js

@@ -1,9 +1,9 @@
-import { usePipeline } from "../hooks/usePipelines.js";
+import { useWorkflow } from "../hooks/useWorkflows.js";
 import LoadingCentered_default from "../components/feedback/LoadingCentered.js";
 import ErrorSnackbar_default from "../components/feedback/ErrorSnackbar.js";
 import { require_enums } from "../packages/contracts/dist/enums/index.js";
-import { useFetchWorkflowsByPipeline } from "../hooks/useWorkflows.js";
 import WorkflowItem_default from "../features/workbench/WorkflowItem.js";
+import { WorkbenchLayoutProvider } from "../features/workbench/providers/WorkbenchLayoutProvider.js";
 import "../features/workbench/index.js";
 import { requireParam } from "../lib/requireParam.js";
 import { c } from "react/compiler-runtime";
@@ -12,64 +12,58 @@ import { jsx, jsxs } from "react/jsx-runtime";
 import { useParams } from "react-router-dom";
 var import_enums = require_enums(), EMBED_MESSAGE_TYPE = "loopstack:embed:workflow-completed", EMBED_RESIZE_MESSAGE_TYPE = "loopstack:embed:resize";
 function EmbedWorkbenchPage() {
-	let _ = c(24), v = useParams(), y;
-	_[0] === v ? y = _[1] : (y = requireParam(v, "pipelineId"), _[0] = v, _[1] = y);
-	let b = y, x = useRef(null), S = usePipeline(b), C = useFetchWorkflowsByPipeline(b), w = useRef(!1), T, E;
-	_[2] !== C.data || _[3] !== b ? (T = () => {
-		!C.data || w.current || C.data.length > 0 && C.data.every(_temp) && window.parent !== window && (w.current = !0, window.parent.postMessage({
+	let _ = c(20), v = useParams(), y;
+	_[0] === v ? y = _[1] : (y = requireParam(v, "workflowId"), _[0] = v, _[1] = y);
+	let b = y, x = useRef(null), S = useWorkflow(b), C = useRef(!1), w, T;
+	_[2] !== S.data || _[3] !== b ? (w = () => {
+		!S.data || C.current || S.data.status === import_enums.WorkflowState.Completed && window.parent !== window && (C.current = !0, window.parent.postMessage({
 			type: EMBED_MESSAGE_TYPE,
-			pipelineId: b
+			workflowId: b
 		}, window.location.origin));
-	}, E = [C.data, b], _[2] = C.data, _[3] = b, _[4] = T, _[5] = E) : (T = _[4], E = _[5]), useEffect(T, E);
-	let D, O;
-	_[6] === b ? (D = _[7], O = _[8]) : (D = () => {
+	}, T = [S.data, b], _[2] = S.data, _[3] = b, _[4] = w, _[5] = T) : (w = _[4], T = _[5]), useEffect(w, T);
+	let E, D;
+	_[6] === b ? (E = _[7], D = _[8]) : (E = () => {
 		if (window.parent === window || !x.current) return;
 		let t = new ResizeObserver(() => {
 			if (!x.current) return;
 			let t = Math.max(document.body.scrollHeight, document.body.offsetHeight, document.documentElement.scrollHeight, document.documentElement.offsetHeight);
 			window.parent.postMessage({
 				type: EMBED_RESIZE_MESSAGE_TYPE,
-				pipelineId: b,
+				workflowId: b,
 				height: t
 			}, window.location.origin);
 		});
 		return t.observe(x.current), () => t.disconnect();
-	}, O = [b], _[6] = b, _[7] = D, _[8] = O), useEffect(D, O);
-	let k = _temp2, A;
-	_[9] === Symbol.for("react.memo_cache_sentinel") ? (A = {
+	}, D = [b], _[6] = b, _[7] = E, _[8] = D), useEffect(E, D);
+	let O = _temp, k;
+	_[9] === Symbol.for("react.memo_cache_sentinel") ? (k = {
 		enableDebugMode: !1,
 		showFullMessageHistory: !1
-	}, _[9] = A) : A = _[9];
-	let j = A, M;
-	_[10] === S.error ? M = _[11] : (M = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: S.error }), _[10] = S.error, _[11] = M);
+	}, _[9] = k) : k = _[9];
+	let A = k, j;
+	_[10] === S.error ? j = _[11] : (j = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: S.error }), _[10] = S.error, _[11] = j);
+	let M;
+	_[12] === S.data ? M = _[13] : (M = S.data ? /* @__PURE__ */ jsx(WorkbenchLayoutProvider, {
+		workflow: S.data,
+		children: /* @__PURE__ */ jsx(WorkflowItem_default, {
+			workflow: S.data,
+			workflowId: S.data.id,
+			scrollTo: O,
+			settings: A,
+			embed: !0
+		})
+	}) : null, _[12] = S.data, _[13] = M);
 	let N;
-	_[12] === C.error ? N = _[13] : (N = /* @__PURE__ */ jsx(ErrorSnackbar_default, { error: C.error }), _[12] = C.error, _[13] = N);
-	let P = S.isLoading || C.isLoading, F;
-	_[14] !== S.data || _[15] !== C.data ? (F = S.data && C.data ? C.data.map((t) => /* @__PURE__ */ jsx(WorkflowItem_default, {
-		pipeline: S.data,
-		workflowId: t.id,
-		scrollTo: k,
-		settings: j,
-		embed: !0
-	}, t.id)) : null, _[14] = S.data, _[15] = C.data, _[16] = F) : F = _[16];
-	let I;
-	_[17] !== P || _[18] !== F ? (I = /* @__PURE__ */ jsx(LoadingCentered_default, {
-		loading: P,
-		children: F
-	}), _[17] = P, _[18] = F, _[19] = I) : I = _[19];
-	let L;
-	return _[20] !== I || _[21] !== M || _[22] !== N ? (L = /* @__PURE__ */ jsxs("div", {
+	_[14] !== S.isLoading || _[15] !== M ? (N = /* @__PURE__ */ jsx(LoadingCentered_default, {
+		loading: S.isLoading,
+		children: M
+	}), _[14] = S.isLoading, _[15] = M, _[16] = N) : N = _[16];
+	let P;
+	return _[17] !== j || _[18] !== N ? (P = /* @__PURE__ */ jsxs("div", {
 		ref: x,
-		className: "overflow-hidden px-6 py-4",
-		children: [
-			M,
-			N,
-			I
-		]
-	}), _[20] = I, _[21] = M, _[22] = N, _[23] = L) : L = _[23], L;
-}
-function _temp2() {}
-function _temp(t) {
-	return t.status === import_enums.WorkflowState.Completed;
+		className: "overflow-hidden pl-3 py-4",
+		children: [j, N]
+	}), _[17] = j, _[18] = N, _[19] = P) : P = _[19], P;
 }
+function _temp() {}
 export { EmbedWorkbenchPage as default };