@loopstack/loopstack-studio 0.25.1 → 0.26.0

package/dist/features/file-explorer/components/FileTree.js

@@ -0,0 +1,90 @@
+import { Button } from "../../../components/ui/button.js";
+import { ScrollArea } from "../../../components/ui/scroll-area.js";
+import { CodeExplorerTreeNode } from "../../code-explorer/components/CodeExplorerTreeNode.js";
+import { useFileExplorer } from "../providers/FileExplorerProvider.js";
+import { c } from "react/compiler-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { AlertCircle, Loader2, RefreshCw } from "lucide-react";
+function FileTree() {
+	let d = c(35), { nodes: f, isTreeLoading: p, treeError: m, isFetchingTree: h, expandedFolders: g, toggleFolder: _, selectFile: v, closeFile: y, selectedFile: b, refreshTree: x } = useFileExplorer();
+	if (p) {
+		let e;
+		return d[0] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-center gap-2 p-3 text-sm text-muted-foreground",
+			children: [/* @__PURE__ */ jsx(Loader2, { className: "h-4 w-4 animate-spin" }), "Loading file tree…"]
+		}), d[0] = e) : e = d[0], e;
+	}
+	if (m) {
+		let a;
+		d[1] === Symbol.for("react.memo_cache_sentinel") ? (a = /* @__PURE__ */ jsx(AlertCircle, { className: "mt-0.5 h-4 w-4 shrink-0" }), d[1] = a) : a = d[1];
+		let o = m instanceof Error ? m.message : String(m), s;
+		d[2] === o ? s = d[3] : (s = /* @__PURE__ */ jsxs("div", {
+			className: "flex items-start gap-2 text-sm text-destructive",
+			children: [a, /* @__PURE__ */ jsx("span", { children: o })]
+		}), d[2] = o, d[3] = s);
+		let l;
+		d[4] === Symbol.for("react.memo_cache_sentinel") ? (l = /* @__PURE__ */ jsx(RefreshCw, { className: "mr-1.5 h-3.5 w-3.5" }), d[4] = l) : l = d[4];
+		let u;
+		d[5] === x ? u = d[6] : (u = /* @__PURE__ */ jsxs(Button, {
+			variant: "outline",
+			size: "sm",
+			onClick: x,
+			children: [l, "Retry"]
+		}), d[5] = x, d[6] = u);
+		let f;
+		return d[7] !== s || d[8] !== u ? (f = /* @__PURE__ */ jsxs("div", {
+			className: "space-y-2 p-3",
+			children: [s, u]
+		}), d[7] = s, d[8] = u, d[9] = f) : f = d[9], f;
+	}
+	if (f.length === 0) {
+		let e;
+		return d[10] === Symbol.for("react.memo_cache_sentinel") ? (e = /* @__PURE__ */ jsx("p", {
+			className: "px-2 py-4 text-sm text-muted-foreground",
+			children: "No files found"
+		}), d[10] = e) : e = d[10], e;
+	}
+	let S = `h-3 w-3 ${h ? "animate-spin" : ""}`, C;
+	d[11] === S ? C = d[12] : (C = /* @__PURE__ */ jsx(RefreshCw, { className: S }), d[11] = S, d[12] = C);
+	let w;
+	d[13] !== h || d[14] !== x || d[15] !== C ? (w = /* @__PURE__ */ jsx("div", {
+		className: "flex items-center justify-end px-1",
+		children: /* @__PURE__ */ jsx(Button, {
+			variant: "ghost",
+			size: "icon",
+			className: "h-6 w-6",
+			onClick: x,
+			disabled: h,
+			children: C
+		})
+	}), d[13] = h, d[14] = x, d[15] = C, d[16] = w) : w = d[16];
+	let T;
+	if (d[17] !== y || d[18] !== g || d[19] !== f || d[20] !== v || d[21] !== b?.id || d[22] !== _) {
+		let e;
+		d[24] !== y || d[25] !== g || d[26] !== v || d[27] !== b?.id || d[28] !== _ ? (e = (e) => /* @__PURE__ */ jsx(CodeExplorerTreeNode, {
+			node: e,
+			depth: 0,
+			expandedFolders: g,
+			toggleFolder: _,
+			onSelectFile: v,
+			onCloseFile: y,
+			selectedFileId: b?.id
+		}, e.id), d[24] = y, d[25] = g, d[26] = v, d[27] = b?.id, d[28] = _, d[29] = e) : e = d[29], T = f.map(e), d[17] = y, d[18] = g, d[19] = f, d[20] = v, d[21] = b?.id, d[22] = _, d[23] = T;
+	} else T = d[23];
+	let E;
+	d[30] === T ? E = d[31] : (E = /* @__PURE__ */ jsx(ScrollArea, {
+		className: "h-full w-full",
+		children: /* @__PURE__ */ jsx("div", {
+			className: "w-full py-1",
+			role: "tree",
+			"aria-label": "File tree",
+			children: T
+		})
+	}), d[30] = T, d[31] = E);
+	let D;
+	return d[32] !== w || d[33] !== E ? (D = /* @__PURE__ */ jsxs("div", {
+		className: "flex h-full flex-col gap-1.5",
+		children: [w, E]
+	}), d[32] = w, d[33] = E, d[34] = D) : D = d[34], D;
+}
+export { FileTree };

package/dist/features/file-explorer/file-explorer-feature.js

@@ -0,0 +1,12 @@
+import { FileExplorerPanel } from "./components/FileExplorerPanel.js";
+import { Files } from "lucide-react";
+const fileExplorerFeature = {
+	id: "file-explorer",
+	sidebarPanel: {
+		id: "files",
+		label: "Files",
+		icon: Files,
+		component: FileExplorerPanel
+	}
+};
+export { fileExplorerFeature };

package/dist/features/file-explorer/hooks/useFileExplorer.js

@@ -0,0 +1,44 @@
+import { useApiClient } from "../../../hooks/useApi.js";
+import { c } from "react/compiler-runtime";
+import { useQuery } from "@tanstack/react-query";
+function useFileTree(r, i) {
+	let a = c(10), o = i === void 0 ? !0 : i, { envKey: s, api: l } = useApiClient(), u;
+	a[0] !== s || a[1] !== r ? (u = [
+		"file-explorer-tree",
+		s,
+		r
+	], a[0] = s, a[1] = r, a[2] = u) : u = a[2];
+	let d;
+	a[3] !== l || a[4] !== r ? (d = () => l.files.getTree({ workspaceId: r }), a[3] = l, a[4] = r, a[5] = d) : d = a[5];
+	let f = !!r && o, p;
+	return a[6] !== u || a[7] !== d || a[8] !== f ? (p = {
+		queryKey: u,
+		queryFn: d,
+		enabled: f,
+		staleTime: 3e4,
+		retry: !1
+	}, a[6] = u, a[7] = d, a[8] = f, a[9] = p) : p = a[9], useQuery(p);
+}
+function useFileContent(r, i, a) {
+	let o = c(12), s = a === void 0 ? !0 : a, { envKey: l, api: u } = useApiClient(), d;
+	o[0] !== l || o[1] !== i || o[2] !== r ? (d = [
+		"file-explorer-content",
+		l,
+		r,
+		i
+	], o[0] = l, o[1] = i, o[2] = r, o[3] = d) : d = o[3];
+	let f;
+	o[4] !== u || o[5] !== i || o[6] !== r ? (f = () => u.files.readFile({
+		workspaceId: r,
+		path: i
+	}), o[4] = u, o[5] = i, o[6] = r, o[7] = f) : f = o[7];
+	let p = !!r && !!i && s, m;
+	return o[8] !== d || o[9] !== f || o[10] !== p ? (m = {
+		queryKey: d,
+		queryFn: f,
+		enabled: p,
+		staleTime: 15e3,
+		retry: !1
+	}, o[8] = d, o[9] = f, o[10] = p, o[11] = m) : m = o[11], useQuery(m);
+}
+export { useFileContent, useFileTree };

package/dist/features/file-explorer/index.js

@@ -0,0 +1,2 @@
+import { FileExplorerProvider, useFileExplorer, useOptionalFileExplorer } from "./providers/FileExplorerProvider.js";
+import { fileExplorerFeature } from "./file-explorer-feature.js";

package/dist/features/file-explorer/providers/FileExplorerProvider.js

@@ -0,0 +1,112 @@
+import { useFileContent, useFileTree } from "../hooks/useFileExplorer.js";
+import { c } from "react/compiler-runtime";
+import { createContext, useCallback, useContext, useMemo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { useQueryClient } from "@tanstack/react-query";
+var FileExplorerContext = createContext(null);
+function FileExplorerProvider(s) {
+	let l = c(36), { workspaceId: u, enabled: d, children: f } = s, p = d === void 0 ? !0 : d, m = useQueryClient(), h;
+	l[0] === Symbol.for("react.memo_cache_sentinel") ? (h = /* @__PURE__ */ new Set(), l[0] = h) : h = l[0];
+	let [g, _] = useState(h), v;
+	l[1] === Symbol.for("react.memo_cache_sentinel") ? (v = [], l[1] = v) : v = l[1];
+	let [y, b] = useState(v), [x, S] = useState(null), C = useFileTree(u, p), w = useFileContent(u, x?.type === "file" ? x.path : void 0, p), T;
+	l[2] === Symbol.for("react.memo_cache_sentinel") ? (T = (e) => {
+		_((a) => {
+			let o = new Set(a);
+			return o.has(e) ? o.delete(e) : o.add(e), o;
+		});
+	}, l[2] = T) : T = l[2];
+	let E = T, D;
+	l[3] === Symbol.for("react.memo_cache_sentinel") ? (D = (e) => {
+		e.type === "file" && (S(e), b((a) => a.some((a) => a.path === e.path) ? a : [...a, e]));
+	}, l[3] = D) : D = l[3];
+	let O = D, k;
+	l[4] === x?.path ? k = l[5] : (k = (e) => {
+		b((a) => {
+			let o = a.filter((a) => a.path !== e.path);
+			if (x?.path === e.path) if (o.length > 0) {
+				let s = a.findIndex((a) => a.path === e.path);
+				S(o[Math.max(0, s - 1)]);
+			} else S(null);
+			return o;
+		});
+	}, l[4] = x?.path, l[5] = k);
+	let A = k, j;
+	l[6] === x ? j = l[7] : (j = () => {
+		x && b((e) => {
+			let a = e.filter((e) => e.path !== x.path);
+			if (a.length > 0) {
+				let o = e.findIndex((e) => e.path === x.path);
+				S(a[Math.max(0, o - 1)]);
+			} else S(null);
+			return a;
+		});
+	}, l[6] = x, l[7] = j);
+	let M = j, N;
+	l[8] === Symbol.for("react.memo_cache_sentinel") ? (N = () => {
+		b([]), S(null);
+	}, l[8] = N) : N = l[8];
+	let P = N, F;
+	l[9] === Symbol.for("react.memo_cache_sentinel") ? (F = (e) => {
+		b([e]), S(e);
+	}, l[9] = F) : F = l[9];
+	let I = F, L;
+	l[10] === x ? L = l[11] : (L = (e) => {
+		b((a) => {
+			let o = a.findIndex((a) => a.path === e.path);
+			if (o <= 0) return a;
+			let s = a.slice(o);
+			return x && a.findIndex((e) => e.path === x.path) < o && S(e), s;
+		});
+	}, l[10] = x, l[11] = L);
+	let R = L, z;
+	l[12] === x ? z = l[13] : (z = (e) => {
+		b((a) => {
+			let o = a.findIndex((a) => a.path === e.path);
+			if (o < 0 || o >= a.length - 1) return a;
+			let s = a.slice(0, o + 1);
+			return x && a.findIndex((e) => e.path === x.path) > o && S(e), s;
+		});
+	}, l[12] = x, l[13] = z);
+	let B = z, V;
+	l[14] === m ? V = l[15] : (V = () => {
+		m.invalidateQueries({ queryKey: ["file-explorer-tree"] });
+	}, l[14] = m, l[15] = V);
+	let H = V, U;
+	l[16] === C.data ? U = l[17] : (U = C.data ?? [], l[16] = C.data, l[17] = U);
+	let W = C.isLoading && !C.data, G = w.data?.content ?? null, K = w.isLoading && !!x, q;
+	l[18] !== M || l[19] !== A || l[20] !== R || l[21] !== B || l[22] !== g || l[23] !== y || l[24] !== H || l[25] !== x || l[26] !== U || l[27] !== W || l[28] !== G || l[29] !== K || l[30] !== C.error || l[31] !== C.isFetching ? (q = {
+		nodes: U,
+		isTreeLoading: W,
+		treeError: C.error,
+		isFetchingTree: C.isFetching,
+		openFiles: y,
+		selectedFile: x,
+		fileContent: G,
+		isContentLoading: K,
+		expandedFolders: g,
+		toggleFolder: E,
+		selectFile: O,
+		closeFile: A,
+		closeAll: P,
+		closeOthers: I,
+		closeToLeft: R,
+		closeToRight: B,
+		clearSelection: M,
+		refreshTree: H
+	}, l[18] = M, l[19] = A, l[20] = R, l[21] = B, l[22] = g, l[23] = y, l[24] = H, l[25] = x, l[26] = U, l[27] = W, l[28] = G, l[29] = K, l[30] = C.error, l[31] = C.isFetching, l[32] = q) : q = l[32];
+	let J = q, Y;
+	return l[33] !== f || l[34] !== J ? (Y = /* @__PURE__ */ jsx(FileExplorerContext.Provider, {
+		value: J,
+		children: f
+	}), l[33] = f, l[34] = J, l[35] = Y) : Y = l[35], Y;
+}
+function useFileExplorer() {
+	let e = useContext(FileExplorerContext);
+	if (!e) throw Error("useFileExplorer must be used within FileExplorerProvider");
+	return e;
+}
+function useOptionalFileExplorer() {
+	return useContext(FileExplorerContext);
+}
+export { FileExplorerProvider, useFileExplorer, useOptionalFileExplorer };

package/dist/features/health/LocalHealthCheck.js

@@ -1,86 +1,86 @@
-import { ApiClientEvents as e } from "../../events/api-client-events.js";
-import { eventBus as t } from "../../services/eventEmitter.js";
+import { ApiClientEvents } from "../../events/api-client-events.js";
+import { eventBus } from "../../services/eventEmitter.js";
 import "../../services/index.js";
-import { useStudio as n } from "../../providers/StudioProvider.js";
-import { useGetHealthInfo as r, useWorkerAuth as i, useWorkerAuthTokenRefresh as a } from "../../hooks/useAuth.js";
-import { useCallback as o, useEffect as s, useRef as c, useState as l } from "react";
-import { jsx as u, jsxs as d } from "react/jsx-runtime";
-import { useQueryClient as f } from "@tanstack/react-query";
-import { RefreshCw as p, X as m } from "lucide-react";
-//#region src/features/health/LocalHealthCheck.tsx
-var h = {
+import { useStudio } from "../../providers/StudioProvider.js";
+import { useGetHealthInfo, useWorkerAuth, useWorkerAuthTokenRefresh } from "../../hooks/useAuth.js";
+import { useCallback, useEffect, useRef, useState } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useQueryClient } from "@tanstack/react-query";
+import { RefreshCw, X } from "lucide-react";
+const Escalation = {
 	None: 0,
 	Refresh: 1,
 	Login: 2,
 	Debug: 3,
 	Connection: 4
-}, g = () => {
-	let { environment: g } = n(), [_, v] = l(h.None), y = i(), b = a(), x = r(!1), S = f(), C = c(b);
+};
+var LocalHealthCheck_default = () => {
+	let { environment: g } = useStudio(), [_, v] = useState(Escalation.None), y = useWorkerAuth(), b = useWorkerAuthTokenRefresh(), x = useGetHealthInfo(!1), S = useQueryClient(), C = useRef(b);
 	C.current = b;
-	let w = c(y);
+	let w = useRef(y);
 	w.current = y;
-	let T = c(x);
+	let T = useRef(x);
 	T.current = x;
-	let E = o(() => {
+	let E = useCallback(() => {
 		T.current.refetch();
-	}, []), D = o(() => {
+	}, []), D = useCallback(() => {
 		C.current.mutate();
-	}, []), O = o(async () => {
+	}, []), O = useCallback(async () => {
 		try {
 			let e = "local";
 			g.getIdToken && (e = await g.getIdToken()), w.current.mutate({ hubLoginRequestDto: { idToken: e } });
 		} catch {
-			v(h.Debug);
+			v(Escalation.Debug);
 		}
 	}, [g]);
-	s(() => {
-		if (_ !== h.Connection) return;
+	useEffect(() => {
+		if (_ !== Escalation.Connection) return;
 		let e = setInterval(E, 5e3);
 		return () => clearInterval(e);
-	}, [_, E]), s(() => {
-		x.data && (v(h.None), S.invalidateQueries());
-	}, [x.data, S]), s(() => {
-		b.error && v(h.Login);
-	}, [b.error]), s(() => {
-		b.data?.status === 200 && v(h.None);
-	}, [b.data]), s(() => {
-		y.error && v(h.Debug);
-	}, [y.error]), s(() => {
-		y.data?.status === 200 && v(h.None);
-	}, [y.data]), s(() => {
-		_ === h.Refresh ? D() : _ === h.Login && O();
+	}, [_, E]), useEffect(() => {
+		x.data && (v(Escalation.None), S.invalidateQueries());
+	}, [x.data, S]), useEffect(() => {
+		b.error && v(Escalation.Login);
+	}, [b.error]), useEffect(() => {
+		b.data?.status === 200 && v(Escalation.None);
+	}, [b.data]), useEffect(() => {
+		y.error && v(Escalation.Debug);
+	}, [y.error]), useEffect(() => {
+		y.data?.status === 200 && v(Escalation.None);
+	}, [y.data]), useEffect(() => {
+		_ === Escalation.Refresh ? D() : _ === Escalation.Login && O();
 	}, [
 		_,
 		D,
 		O
-	]), s(() => {
-		let n = t.on(e.UNAUTHORIZED, () => {
-			v(h.Refresh);
-		}), r = t.on(e.ERR_NETWORK, () => {
-			v(h.Connection);
+	]), useEffect(() => {
+		let m = eventBus.on(ApiClientEvents.UNAUTHORIZED, () => {
+			v(Escalation.Refresh);
+		}), h = eventBus.on(ApiClientEvents.ERR_NETWORK, () => {
+			v(Escalation.Connection);
 		});
 		return () => {
-			n(), r();
+			m(), h();
 		};
 	}, []);
-	let [k, A] = l(!1), j = _ >= h.Debug && !k;
-	return s(() => {
-		_ < h.Debug && A(!1);
-	}, [_]), j ? /* @__PURE__ */ u("div", {
+	let [k, A] = useState(!1), j = _ >= Escalation.Debug && !k;
+	return useEffect(() => {
+		_ < Escalation.Debug && A(!1);
+	}, [_]), j ? /* @__PURE__ */ jsx("div", {
 		className: "bg-destructive/10 border-destructive/30 fixed inset-x-0 bottom-0 z-50 border-t px-4 py-3",
-		children: /* @__PURE__ */ d("div", {
+		children: /* @__PURE__ */ jsxs("div", {
 			className: "flex items-center justify-between",
-			children: [/* @__PURE__ */ d("div", {
+			children: [/* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-3",
-				children: [/* @__PURE__ */ u("div", { className: "bg-destructive h-2 w-2 rounded-full" }), /* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("p", {
+				children: [/* @__PURE__ */ jsx("div", { className: "bg-destructive h-2 w-2 rounded-full" }), /* @__PURE__ */ jsxs("div", { children: [/* @__PURE__ */ jsx("p", {
 					className: "text-foreground text-sm font-semibold",
 					children: "Connection issues detected"
-				}), /* @__PURE__ */ d("p", {
+				}), /* @__PURE__ */ jsxs("p", {
 					className: "text-muted-foreground text-xs",
 					children: [
 						"Please make sure the environment",
 						" ",
-						/* @__PURE__ */ d("strong", { children: [
+						/* @__PURE__ */ jsxs("strong", { children: [
 							g.name,
 							" (",
 							g.id,
@@ -90,20 +90,19 @@ var h = {
 						"is properly configured and running."
 					]
 				})] })]
-			}), /* @__PURE__ */ d("div", {
+			}), /* @__PURE__ */ jsxs("div", {
 				className: "flex items-center gap-2",
-				children: [_ === h.Connection && /* @__PURE__ */ d("button", {
+				children: [_ === Escalation.Connection && /* @__PURE__ */ jsxs("button", {
 					onClick: E,
 					className: "bg-primary flex items-center gap-2 rounded-md px-3 py-1.5 text-sm text-white transition-colors disabled:cursor-not-allowed disabled:opacity-50",
-					children: [/* @__PURE__ */ u(p, { className: `h-3 w-3 ${x.isLoading ? "animate-spin" : ""}` }), "Retry"]
-				}), /* @__PURE__ */ u("button", {
+					children: [/* @__PURE__ */ jsx(RefreshCw, { className: `h-3 w-3 ${x.isLoading ? "animate-spin" : ""}` }), "Retry"]
+				}), /* @__PURE__ */ jsx("button", {
 					onClick: () => A(!0),
 					className: "text-muted-foreground hover:text-foreground rounded-xs p-1 transition-colors",
-					children: /* @__PURE__ */ u(m, { className: "h-4 w-4" })
+					children: /* @__PURE__ */ jsx(X, { className: "h-4 w-4" })
 				})]
 			})]
 		})
 	}) : null;
 };
-//#endregion
-export { g as default };
+export { LocalHealthCheck_default as default };

package/dist/features/health/index.js

@@ -1 +1 @@
-import "./LocalHealthCheck.js";
+import LocalHealthCheck_default from "./LocalHealthCheck.js";

package/dist/features/oauth/OAuthCallbackPage.js

@@ -1,2 +1,2 @@
-import "react";
-import "react/jsx-runtime";
+import React, { useEffect, useState } from "react";
+import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";