dsh-comfyui 0.5.1 → 0.5.2

package/client/client.js

@@ -45,6 +45,8 @@ window.__ModuleLoader__.load({
 			cardFailed: "执行失败",
 			cardInterrupted: "已中断",
 			cardCollect: "使用 job_output 收集后台任务结果",
+			cardRecovered: "已从资产索引恢复（ComfyUI 历史已失效）",
+			cardPollStalled: "后台任务状态收集失败（已重试 {n} 次）：{message}",
 			cardLoadFailed: "加载失败，点下方下载",
 			cardDownload: "下载",
 			cardWorkflow: "工作流",
@@ -308,6 +310,8 @@ window.__ModuleLoader__.load({
 			cardFailed: "Execution failed",
 			cardInterrupted: "Interrupted",
 			cardCollect: "Collect the background job result with job_output",
+			cardRecovered: "Recovered from the asset index (ComfyUI history was evicted)",
+			cardPollStalled: "Failed to collect the background job status after {n} retries: {message}",
 			cardLoadFailed: "failed to load, use the download link below",
 			cardDownload: "Download",
 			cardWorkflow: "Workflow",
@@ -733,17 +737,39 @@ window.__ModuleLoader__.load({
 				onIndex: setLightbox
 			}) : null);
 		}
+		/** Transient-failure retry budget for the jobs/media poll (backoff steps). */
+		const POLL_MAX_FAILURES = 20;
+		/** 'unknown' grace polls (~5 min at 3 s) before treating history as evicted.
+		* The route answers 'queued' while ComfyUI still holds the prompt, so this
+		* only counts polls where the job is in neither history nor the queue. */
+		const POLL_UNKNOWN_GRACE = 100;
 		function BackgroundCard({ label, promptId, t }) {
 			const [result, setResult] = (0, react.useState)(null);
 			const [lightbox, setLightbox] = (0, react.useState)(null);
 			(0, react.useEffect)(() => {
 				let stopped = false;
 				let timer;
+				let failures = 0;
+				let unknowns = 0;
+				const schedule = (delay, fn) => {
+					timer = window.setTimeout(fn, delay);
+				};
+				const recoverFromAssets = async () => {
+					try {
+						const data = await (await fetch("/comfyui/assets", { headers: { accept: "application/json" } })).json();
+						if (stopped || data.ok !== true || !Array.isArray(data.assets)) return null;
+						const media = data.assets.find((entry) => entry.promptId === promptId)?.media ?? [];
+						return media.length > 0 ? media : null;
+					} catch {
+						return null;
+					}
+				};
 				const poll = async () => {
 					try {
 						const data = await (await fetch(`/comfyui/jobs/media?promptId=${encodeURIComponent(promptId)}`, { headers: { accept: "application/json" } })).json();
 						if (stopped) return;
-						if (data.ok !== true || data.status === void 0) return;
+						if (data.ok !== true || data.status === void 0) throw new Error(data.error ?? "invalid jobs/media response");
+						failures = 0;
 						if (data.status === "completed" || data.status === "failed") {
 							setResult({
 								status: data.status,
@@ -752,13 +778,51 @@ window.__ModuleLoader__.load({
 							});
 							return;
 						}
-						timer = window.setTimeout(() => {
+						if (data.status === "unknown") {
+							unknowns += 1;
+							const recovered = await recoverFromAssets();
+							if (stopped) return;
+							if (recovered !== null) {
+								setResult({
+									status: "completed",
+									media: recovered,
+									recovered: true
+								});
+								return;
+							}
+							if (unknowns > POLL_UNKNOWN_GRACE) {
+								setResult({
+									status: "completed",
+									media: []
+								});
+								return;
+							}
+							schedule(3e3, () => {
+								poll();
+							});
+							return;
+						}
+						unknowns = 0;
+						schedule(3e3, () => {
 							poll();
-						}, 3e3);
-					} catch {
-						timer = window.setTimeout(() => {
+						});
+					} catch (error) {
+						if (stopped) return;
+						failures += 1;
+						if (failures > POLL_MAX_FAILURES) {
+							const message = error instanceof Error ? error.message : String(error);
+							setResult({
+								status: "failed",
+								error: t("cardPollStalled", {
+									n: POLL_MAX_FAILURES,
+									message
+								})
+							});
+							return;
+						}
+						schedule(Math.min(3e3 * failures, 3e4), () => {
 							poll();
-						}, 5e3);
+						});
 					}
 				};
 				poll();
@@ -766,12 +830,12 @@ window.__ModuleLoader__.load({
 					stopped = true;
 					if (timer !== void 0) window.clearTimeout(timer);
 				};
-			}, [promptId]);
+			}, [promptId, t]);
 			if (result !== null && (result.status === "completed" || result.status === "failed")) {
 				const media = result.media ?? [];
 				const urls = media.map((item) => item.url);
 				const kinds = media.map((item) => item.kind);
-				return (0, react.createElement)("div", { className: "dsc-card" }, (0, react.createElement)("div", { className: "dsc-card-head" }, (0, react.createElement)("span", { className: result.status === "failed" ? "dsc-badge dsc-badge--err" : "dsc-badge dsc-badge--ok" }, result.status === "failed" ? t("cardFailed") : t("cardBackgroundDone")), (0, react.createElement)("span", { className: "dsc-meta" }, `${label} · ${promptId}`)), result.status === "failed" ? (0, react.createElement)("div", { className: "dsc-meta dsc-job-error" }, result.error ?? t("cardFailed")) : media.length > 0 ? (0, react.createElement)("div", { className: "dsc-grid" }, media.map((item, index) => (0, react.createElement)(MediaItem, {
+				return (0, react.createElement)("div", { className: "dsc-card" }, (0, react.createElement)("div", { className: "dsc-card-head" }, (0, react.createElement)("span", { className: result.status === "failed" ? "dsc-badge dsc-badge--err" : "dsc-badge dsc-badge--ok" }, result.status === "failed" ? t("cardFailed") : t("cardBackgroundDone")), (0, react.createElement)("span", { className: "dsc-meta" }, `${label} · ${promptId}`)), result.status !== "failed" && result.recovered === true ? (0, react.createElement)("div", { className: "dsc-meta" }, t("cardRecovered")) : null, result.status === "failed" ? (0, react.createElement)("div", { className: "dsc-meta dsc-job-error" }, result.error ?? t("cardFailed")) : media.length > 0 ? (0, react.createElement)("div", { className: "dsc-grid" }, media.map((item, index) => (0, react.createElement)(MediaItem, {
 					key: `${item.node}-${item.index}`,
 					item,
 					t,
@@ -843,6 +907,19 @@ window.__ModuleLoader__.load({
 			if (!response.ok) throw new Error(`HTTP ${response.status}`);
 			return await response.json();
 		}
+		/**
+		* GET a list endpoint and return the array under `key`. Routes report failure
+		* as HTTP 200 `{ ok: false, error }`, so a plain getJson hands the caller
+		* `undefined` for the list — which crashed the whole panel on `.length` inside
+		* the slot error boundary, i.e. "click does nothing" (Issue #5). Throwing the
+		* route's error instead lets the caller show it next to the section.
+		*/
+		async function getList(url, key) {
+			const data = await getJson(url);
+			const list = data[key];
+			if (Array.isArray(list)) return list;
+			throw new Error(typeof data.error === "string" ? data.error : `unexpected response from ${url}`);
+		}
 		async function postJson(url, body) {
 			const response = await fetch(url, {
 				method: "POST",
@@ -2250,13 +2327,16 @@ window.__ModuleLoader__.load({
 				active: tab === "queue",
 				label: t("tabQueue"),
 				onClick: () => panelStore.setTab("queue")
-			})), (0, react.createElement)("div", { className: "dsc-panel-body" }, tab === "workflows" ? (0, react.createElement)(WorkflowsTab, { t }) : tab === "assets" ? (0, react.createElement)(AssetsTab, {
+			})), (0, react.createElement)("div", { className: "dsc-panel-body" }, (0, react.createElement)(TabBoundary, {
+				key: tab,
+				t
+			}, tab === "workflows" ? (0, react.createElement)(WorkflowsTab, { t }) : tab === "assets" ? (0, react.createElement)(AssetsTab, {
 				t,
 				onPreview: openPreview
 			}) : (0, react.createElement)(QueueTab, {
 				t,
 				onPreview: openPreview
-			})), lightbox !== null ? (0, react.createElement)(Lightbox, {
+			}))), lightbox !== null ? (0, react.createElement)(Lightbox, {
 				t,
 				images: lightbox.images,
 				kinds: lightbox.kinds,
@@ -2284,6 +2364,27 @@ window.__ModuleLoader__.load({
 		function ErrorNote({ t, message }) {
 			return (0, react.createElement)("div", { className: "dsc-err" }, `${t("error")}: ${message}`);
 		}
+		/**
+		* Catches a tab's render error and shows it in place. Without this the host's
+		* slot error boundary swallows the whole overlay silently, so a tab crash
+		* reads as "clicking the button does nothing" with a clean console (Issue #5).
+		*/
+		var TabBoundary = class extends react.Component {
+			state = { error: null };
+			static getDerivedStateFromError(error) {
+				return { error: error instanceof Error ? error : new Error(String(error)) };
+			}
+			componentDidCatch(error) {
+				console.error("[dsh-comfyui] panel tab render error", error);
+			}
+			render() {
+				if (this.state.error !== null) return (0, react.createElement)(ErrorNote, {
+					t: this.props.t,
+					message: this.state.error.message
+				});
+				return this.props.children;
+			}
+		};
 		/** Load area at the bottom of the workflow library, modeled on the ComfyUI
 		* LoadImage node — a list of **slots** rather than a single image.
 		*
@@ -3169,15 +3270,13 @@ window.__ModuleLoader__.load({
 			const [deleting, setDeleting] = (0, react.useState)(null);
 			const load = async () => {
 				try {
-					const data = await getJson("/comfyui/workflows");
-					setList(data.workflows);
+					setList(await getList("/comfyui/workflows", "workflows"));
 					setError(null);
 				} catch (cause) {
 					setError(cause instanceof Error ? cause.message : String(cause));
 				}
 				try {
-					const data = await getJson("/comfyui/comfy-workflows");
-					setComfyui(data.workflows);
+					setComfyui(await getList("/comfyui/comfy-workflows", "workflows"));
 					setComfyuiError(null);
 				} catch (cause) {
 					setComfyuiError(cause instanceof Error ? cause.message : String(cause));
@@ -3185,13 +3284,13 @@ window.__ModuleLoader__.load({
 			};
 			(0, react.useEffect)(() => {
 				let cancelled = false;
-				getJson("/comfyui/workflows").then((data) => {
-					if (!cancelled) setList(data.workflows);
+				getList("/comfyui/workflows", "workflows").then((workflows) => {
+					if (!cancelled) setList(workflows);
 				}).catch((cause) => {
 					if (!cancelled) setError(cause instanceof Error ? cause.message : String(cause));
 				});
-				getJson("/comfyui/comfy-workflows").then((data) => {
-					if (!cancelled) setComfyui(data.workflows);
+				getList("/comfyui/comfy-workflows", "workflows").then((workflows) => {
+					if (!cancelled) setComfyui(workflows);
 				}).catch((cause) => {
 					if (!cancelled) setComfyuiError(cause instanceof Error ? cause.message : String(cause));
 				});
@@ -4059,8 +4158,7 @@ window.__ModuleLoader__.load({
 			const [notice, setNotice] = (0, react.useState)(null);
 			const load = async () => {
 				try {
-					const data = await getJson("/comfyui/assets");
-					setAssets(data.assets);
+					setAssets(await getList("/comfyui/assets", "assets"));
 					setError(null);
 				} catch (cause) {
 					setError(cause instanceof Error ? cause.message : String(cause));
@@ -4068,8 +4166,8 @@ window.__ModuleLoader__.load({
 			};
 			(0, react.useEffect)(() => {
 				let cancelled = false;
-				getJson("/comfyui/assets").then((data) => {
-					if (!cancelled) setAssets(data.assets);
+				getList("/comfyui/assets", "assets").then((items) => {
+					if (!cancelled) setAssets(items);
 				}).catch((cause) => {
 					if (!cancelled) setError(cause instanceof Error ? cause.message : String(cause));
 				});