@tangle-network/sandbox-ui 0.122.0 → 0.122.2

package/dist/pages.js

@@ -3693,6 +3693,8 @@ function StartupScriptsPage({ apiClient, className }) {
 	const [secrets, setSecrets] = React$1.useState([]);
 	const [environments, setEnvironments] = React$1.useState([]);
 	const [loading, setLoading] = React$1.useState(true);
+	const [hasLoaded, setHasLoaded] = React$1.useState(false);
+	const [loadError, setLoadError] = React$1.useState(null);
 	const [error, setError] = React$1.useState(null);
 	const [isDialogOpen, setIsDialogOpen] = React$1.useState(false);
 	const [dialogStep, setDialogStep] = React$1.useState("picker");
@@ -3708,23 +3710,28 @@ function StartupScriptsPage({ apiClient, className }) {
 	const apiRef = React$1.useRef(apiClient);
 	apiRef.current = apiClient;
 	const loadGenRef = React$1.useRef(0);
-	const loadData = React$1.useCallback(async (showSpinner = true) => {
+	const loadData = React$1.useCallback(async () => {
 		const gen = ++loadGenRef.current;
+		setLoading(true);
+		setLoadError(null);
+		setError(null);
 		try {
-			if (showSpinner) setLoading(true);
-			setError(null);
-			const [scriptData, secretData, envData] = await Promise.all([
+			const [scriptResult, secretResult, envResult] = await Promise.allSettled([
 				apiRef.current.listScripts(),
 				apiRef.current.listSecrets?.() ?? Promise.resolve([]),
 				apiRef.current.listEnvironments?.() ?? Promise.resolve([])
 			]);
 			if (gen !== loadGenRef.current) return;
-			setScripts(scriptData);
-			setSecrets(secretData);
-			setEnvironments(envData);
-		} catch (err) {
-			if (gen !== loadGenRef.current) return;
-			setError(err instanceof Error ? err.message : "Failed to load startup scripts");
+			if (scriptResult.status === "fulfilled") {
+				setScripts(scriptResult.value);
+				setHasLoaded(true);
+			}
+			if (secretResult.status === "fulfilled") setSecrets(secretResult.value);
+			if (envResult.status === "fulfilled") setEnvironments(envResult.value);
+			if (scriptResult.status === "rejected") setLoadError("Couldn't load startup scripts.");
+			else if (secretResult.status === "rejected" || envResult.status === "rejected") setLoadError("Some script options couldn't load.");
+		} catch {
+			if (gen === loadGenRef.current) setLoadError("Couldn't load startup scripts.");
 		} finally {
 			if (gen === loadGenRef.current) setLoading(false);
 		}
@@ -3794,7 +3801,7 @@ function StartupScriptsPage({ apiClient, className }) {
 			if (editingScript) await apiRef.current.updateScript(editingScript.id, formData);
 			else await apiRef.current.createScript(formData);
 			setIsDialogOpen(false);
-			await loadData(false);
+			await loadData();
 		} catch (err) {
 			setFormError(err instanceof Error ? err.message : "Failed to save script");
 		} finally {
@@ -3804,7 +3811,7 @@ function StartupScriptsPage({ apiClient, className }) {
 	const handleToggle = async (script) => {
 		try {
 			await apiRef.current.toggleScript(script.id);
-			await loadData(false);
+			await loadData();
 		} catch (err) {
 			setError(err instanceof Error ? err.message : "Failed to toggle script");
 		}
@@ -3815,7 +3822,7 @@ function StartupScriptsPage({ apiClient, className }) {
 		try {
 			await apiRef.current.deleteScript(deleteTarget.id);
 			setDeleteTarget(null);
-			await loadData(false);
+			await loadData();
 		} catch (err) {
 			setError(err instanceof Error ? err.message : "Failed to delete script");
 		} finally {
@@ -3847,12 +3854,23 @@ function StartupScriptsPage({ apiClient, className }) {
 					children: [/* @__PURE__ */ jsx(Plus, { className: "h-4 w-4" }), "New Script"]
 				})
 			}),
-			error && /* @__PURE__ */ jsxs("div", {
-				className: "flex items-center gap-3 rounded-lg border border-destructive/30 bg-destructive/10 p-4",
-				children: [/* @__PURE__ */ jsx(AlertCircle, { className: "h-5 w-5 shrink-0 text-destructive" }), /* @__PURE__ */ jsx("p", {
-					className: "text-sm font-medium text-destructive",
-					children: error
-				})]
+			(loadError || error) && /* @__PURE__ */ jsxs("div", {
+				role: "alert",
+				className: "flex flex-wrap items-center gap-3 rounded-lg border border-destructive/30 bg-destructive/10 p-4",
+				children: [
+					/* @__PURE__ */ jsx(AlertCircle, { className: "h-5 w-5 shrink-0 text-destructive" }),
+					/* @__PURE__ */ jsx("p", {
+						className: "flex-1 text-sm font-medium text-destructive",
+						children: error ?? loadError
+					}),
+					loadError && !error && /* @__PURE__ */ jsx("button", {
+						type: "button",
+						onClick: () => void loadData(),
+						disabled: loading,
+						className: "inline-flex min-h-11 items-center justify-center rounded-lg border border-border bg-surface-container-high px-4 text-sm font-semibold text-foreground shadow-sm hover:bg-surface-container-highest disabled:opacity-50",
+						children: "Retry"
+					})
+				]
 			}),
 			/* @__PURE__ */ jsx(Dialog, {
 				open: isDialogOpen,
@@ -4217,7 +4235,7 @@ function StartupScriptsPage({ apiClient, className }) {
 					})] })]
 				})
 			}),
-			/* @__PURE__ */ jsxs("div", {
+			(loading || hasLoaded) && /* @__PURE__ */ jsxs("div", {
 				className: "overflow-hidden rounded-lg border border-[var(--md3-outline-variant)] bg-surface-container shadow-[var(--shadow-card)]",
 				children: [/* @__PURE__ */ jsxs("div", {
 					className: "border-b border-[var(--md3-outline-variant)] px-6 py-4 flex items-center justify-between",
@@ -4227,7 +4245,7 @@ function StartupScriptsPage({ apiClient, className }) {
 							className: "text-xs font-bold uppercase tracking-widest text-foreground",
 							children: "All Scripts"
 						})
-					}), /* @__PURE__ */ jsxs("span", {
+					}), hasLoaded && /* @__PURE__ */ jsxs("span", {
 						className: "text-xs text-muted-foreground font-mono",
 						children: [
 							scripts.length,
@@ -4235,7 +4253,9 @@ function StartupScriptsPage({ apiClient, className }) {
 							scripts.length !== 1 ? "s" : ""
 						]
 					})]
-				}), loading ? /* @__PURE__ */ jsx("div", {
+				}), loading && !hasLoaded ? /* @__PURE__ */ jsx("div", {
+					role: "status",
+					"aria-label": "Loading startup scripts",
 					className: "flex items-center justify-center py-16",
 					children: /* @__PURE__ */ jsx("div", {
 						className: "h-6 w-6 animate-spin rounded-full border-2 border-primary border-t-transparent",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tangle-network/sandbox-ui",
-  "version": "0.122.0",
+  "version": "0.122.2",
   "description": "Unified UI component library for Tangle Sandbox — primitives, chat, dashboard, terminal, editor, and workspace components",
   "repository": {
     "type": "git",