@burdenoff/microfe-bigconsole 2026.1101.1 → 2026.1102.1

package/dist/bigconsole/components/pipeline/PipelineRunHistory.d.ts

@@ -0,0 +1,15 @@
+import { PipelineExecution, PipelineStage } from '../../types';
+export interface PipelineRunHistoryListProps {
+    /** Runs of this pipeline, newest first. */
+    executions: readonly PipelineExecution[];
+    selectedId: string | null;
+    onSelect: (execution: PipelineExecution) => void;
+    currentActorId: string | null | undefined;
+}
+export declare const PipelineRunHistoryList: import('react').NamedExoticComponent<PipelineRunHistoryListProps>;
+export interface PipelineStageTimelineProps {
+    execution: PipelineExecution;
+    stages: readonly PipelineStage[] | null | undefined;
+    currentActorId: string | null | undefined;
+}
+export declare const PipelineStageTimeline: import('react').NamedExoticComponent<PipelineStageTimelineProps>;

package/dist/bigconsole/components/pipeline/PipelineRunHistory.js

@@ -0,0 +1,270 @@
+import { SECTION_FOCUS_RING as e } from "../common/sectionStyles.js";
+import { Section as t } from "../common/Section.js";
+import "../common/index.js";
+import { buildStageTimeline as n, formatDurationMs as r, runDurationMs as i, runStatusTone as a, triggeredByLabel as o } from "../../utils/pipelineExecutionTimeline.js";
+import { memo as s, useMemo as c } from "react";
+import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell/I18nProvider";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/bigconsole/components/pipeline/PipelineRunHistory.tsx
+var f = {
+	success: "bg-[var(--color-status-success-bgSubtle)] text-[var(--color-status-success-text)] border-[var(--color-status-success-border)]",
+	danger: "bg-[var(--color-status-error-bgSubtle)] text-[var(--color-status-error-text)] border-[var(--color-status-error-border)]",
+	warning: "bg-[var(--color-status-warning-bgSubtle)] text-[var(--color-status-warning-text)] border-[var(--color-status-warning-border)]",
+	info: "bg-[var(--color-status-info-bgSubtle)] text-[var(--color-status-info-text)] border-[var(--color-status-info-border)]",
+	neutral: "bg-bg-surface text-text-secondary border-[var(--color-border-subtle)]"
+}, p = {
+	success: "bg-[var(--color-status-success-text)]",
+	danger: "bg-[var(--color-status-error-text)]",
+	warning: "bg-[var(--color-status-warning-text)]",
+	info: "bg-[var(--color-status-info-text)]",
+	neutral: "bg-[var(--color-border-strong)]"
+}, m = "rounded-button bg-bg-surface px-1.5 py-0.5 font-mono break-all text-text-primary";
+function h({ tone: e, label: t }) {
+	return /* @__PURE__ */ u("span", {
+		className: `inline-flex items-center whitespace-nowrap rounded-pill border px-2 py-0.5 text-xs font-medium ${f[e]}`,
+		children: t
+	});
+}
+function g() {
+	let { t: e } = l();
+	return (t) => {
+		switch (t) {
+			case "completed": return e("bigconsole.pipelines.execution.status.completed", "Completed");
+			case "failed": return e("bigconsole.pipelines.execution.status.failed", "Failed");
+			case "running": return e("bigconsole.pipelines.execution.status.running", "Running");
+			case "pending": return e("bigconsole.pipelines.execution.status.pending", "Pending");
+			case "success": return e("bigconsole.pipelines.execution.status.success", "Success");
+			case "skipped": return e("bigconsole.pipelines.execution.status.skipped", "Skipped");
+			default: return t;
+		}
+	};
+}
+function _(e) {
+	if (!e) return "—";
+	let t = new Date(e);
+	return Number.isNaN(t.getTime()) ? "—" : t.toLocaleString();
+}
+var v = s(function({ executions: n, selectedId: s, onSelect: c, currentActorId: f }) {
+	let { t: p } = l(), m = g();
+	return /* @__PURE__ */ u(t, {
+		headingLevel: 2,
+		title: p("bigconsole.pipelines.execution.historyHeading", "Previous runs"),
+		meta: n.length > 0 ? /* @__PURE__ */ u("span", {
+			className: "rounded-pill bg-bg-sunken px-2 py-0.5 text-xs font-medium text-text-secondary",
+			children: n.length
+		}) : null,
+		"data-testid": "pipeline-execution-history",
+		children: n.length === 0 ? /* @__PURE__ */ u("p", {
+			className: "text-sm text-text-secondary",
+			children: p("bigconsole.pipelines.execution.noHistory", "No execution history yet. Test this pipeline with sample input to inspect its stages.")
+		}) : /* @__PURE__ */ u("ol", {
+			className: "flex flex-col gap-control-gap",
+			"aria-label": p("bigconsole.pipelines.execution.runList", "Runs"),
+			children: n.map((t) => {
+				let n = t.id === s, l = o(t.executedBy, f);
+				return /* @__PURE__ */ u("li", { children: /* @__PURE__ */ d("button", {
+					type: "button",
+					"aria-pressed": n,
+					onClick: () => c(t),
+					"data-testid": "pipeline-execution-run",
+					"data-status": t.status,
+					className: `flex w-full min-w-0 flex-col gap-1 rounded-button border p-3 text-left ${e} ${n ? "border-[var(--color-border-strong)] bg-bg-sunken" : "border-[var(--color-border-subtle)] bg-bg-surface"}`,
+					children: [
+						/* @__PURE__ */ d("span", {
+							className: "flex flex-wrap items-center justify-between gap-2 text-sm font-medium text-text-primary",
+							children: [/* @__PURE__ */ u(h, {
+								tone: a(t.status),
+								label: m(t.status)
+							}), /* @__PURE__ */ u("span", { children: r(i(t)) })]
+						}),
+						/* @__PURE__ */ u("span", {
+							className: "break-words text-xs text-text-secondary",
+							children: _(t.startedAt ?? t.createdAt)
+						}),
+						/* @__PURE__ */ d("span", {
+							className: "flex flex-wrap justify-between gap-2 text-xs text-text-muted",
+							children: [/* @__PURE__ */ d("span", { children: [
+								p("bigconsole.pipelines.execution.triggeredBy", "By"),
+								" ",
+								/* @__PURE__ */ u("span", {
+									className: "font-mono",
+									title: t.executedBy,
+									children: l ?? p("bigconsole.pipelines.execution.triggeredByYou", "you")
+								})
+							] }), /* @__PURE__ */ u("span", { children: p("bigconsole.pipelines.execution.versionShort", "v{{version}}", { version: t.pipelineVersion }) })]
+						})
+					]
+				}) }, t.id);
+			})
+		})
+	});
+}), y = s(function({ execution: e, stages: s, currentActorId: f }) {
+	let { t: v } = l(), y = g(), b = c(() => n(e, s), [e, s]), x = o(e.executedBy, f);
+	return /* @__PURE__ */ u(t, {
+		emphasis: "primary",
+		headingLevel: 2,
+		title: v("bigconsole.pipelines.execution.timelineHeading", "Stage timeline"),
+		meta: /* @__PURE__ */ u(h, {
+			tone: a(e.status),
+			label: y(e.status)
+		}),
+		"data-testid": "pipeline-stage-timeline",
+		children: /* @__PURE__ */ d("div", {
+			className: "flex flex-col gap-form-gap",
+			children: [
+				/* @__PURE__ */ d("dl", {
+					className: "grid grid-cols-2 gap-form-gap sm:grid-cols-4",
+					children: [
+						/* @__PURE__ */ d("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ u("dt", {
+								className: "text-xs text-text-muted",
+								children: v("bigconsole.pipelines.execution.totalDuration", "Total duration")
+							}), /* @__PURE__ */ u("dd", {
+								className: "text-text-primary",
+								"data-testid": "pipeline-run-duration",
+								children: r(i(e))
+							})]
+						}),
+						/* @__PURE__ */ d("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ u("dt", {
+								className: "text-xs text-text-muted",
+								children: v("bigconsole.pipelines.execution.started", "Started")
+							}), /* @__PURE__ */ u("dd", {
+								className: "break-words text-text-primary",
+								children: _(e.startedAt)
+							})]
+						}),
+						/* @__PURE__ */ d("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ u("dt", {
+								className: "text-xs text-text-muted",
+								children: v("bigconsole.pipelines.execution.finished", "Finished")
+							}), /* @__PURE__ */ u("dd", {
+								className: "break-words text-text-primary",
+								children: _(e.completedAt)
+							})]
+						}),
+						/* @__PURE__ */ d("div", {
+							className: "min-w-0",
+							children: [/* @__PURE__ */ u("dt", {
+								className: "text-xs text-text-muted",
+								children: v("bigconsole.pipelines.execution.triggeredByHeading", "Triggered by")
+							}), /* @__PURE__ */ u("dd", {
+								className: "break-all font-mono text-text-primary",
+								title: e.executedBy,
+								children: x ?? v("bigconsole.pipelines.execution.triggeredByYou", "you")
+							})]
+						})
+					]
+				}),
+				/* @__PURE__ */ u("p", {
+					className: "text-xs text-text-secondary",
+					"data-testid": "pipeline-stage-counts",
+					children: v("bigconsole.pipelines.execution.stageCounts", "{{success}} succeeded · {{skipped}} skipped · {{failed}} failed", b.counts)
+				}),
+				b.rows.length === 0 ? /* @__PURE__ */ u("p", {
+					className: "text-sm text-text-secondary",
+					children: v("bigconsole.pipelines.execution.noStageResults", "This run recorded no stage results.")
+				}) : /* @__PURE__ */ u("ol", {
+					className: "flex flex-col gap-control-gap",
+					children: b.rows.map((e) => /* @__PURE__ */ d("li", {
+						"data-testid": "pipeline-timeline-stage",
+						"data-status": e.status,
+						className: "min-w-0 rounded-card border border-[var(--color-border-subtle)] bg-bg-sunken p-3",
+						children: [
+							/* @__PURE__ */ d("div", {
+								className: "flex flex-wrap items-center justify-between gap-control-gap",
+								children: [/* @__PURE__ */ d("h3", {
+									className: "min-w-0 break-words text-sm font-medium text-text-primary",
+									children: [
+										e.step,
+										". ",
+										e.name
+									]
+								}), /* @__PURE__ */ d("span", {
+									className: "flex items-center gap-2 text-sm text-text-secondary",
+									children: [/* @__PURE__ */ u(h, {
+										tone: e.tone,
+										label: y(e.status)
+									}), /* @__PURE__ */ u("span", { children: r(e.durationMs) })]
+								})]
+							}),
+							/* @__PURE__ */ u("div", {
+								className: "relative mt-2 h-2 w-full overflow-hidden rounded-pill bg-bg-surface",
+								role: "img",
+								"aria-label": v("bigconsole.pipelines.execution.barLabel", "{{name}}: {{duration}}, {{share}}% of stage time", {
+									name: e.name,
+									duration: r(e.durationMs),
+									share: Math.round(e.widthPercent)
+								}),
+								children: /* @__PURE__ */ u("span", {
+									className: `absolute inset-y-0 rounded-pill ${p[e.tone]}`,
+									style: {
+										left: `${e.offsetPercent}%`,
+										width: `${e.widthPercent}%`
+									}
+								})
+							}),
+							(e.inputKey || e.outputKey) && /* @__PURE__ */ d("div", {
+								className: "mt-2 flex flex-wrap items-center gap-x-2 gap-y-1 text-xs text-text-secondary",
+								children: [
+									/* @__PURE__ */ u("span", {
+										className: "text-text-muted",
+										children: v("bigconsole.pipelines.execution.reads", "Reads")
+									}),
+									/* @__PURE__ */ u("code", {
+										className: m,
+										children: e.inputKey ?? "—"
+									}),
+									/* @__PURE__ */ u("span", {
+										"aria-hidden": "true",
+										children: "→"
+									}),
+									/* @__PURE__ */ u("span", {
+										className: "text-text-muted",
+										children: v("bigconsole.pipelines.execution.writes", "writes")
+									}),
+									/* @__PURE__ */ u("code", {
+										className: m,
+										children: e.outputKey ?? "—"
+									})
+								]
+							}),
+							e.error && /* @__PURE__ */ u("p", {
+								className: "mt-2 break-words text-sm text-status-error-text",
+								"data-testid": "pipeline-timeline-error",
+								children: e.error
+							}),
+							e.hasOutput && /* @__PURE__ */ d("details", {
+								className: "mt-2",
+								children: [/* @__PURE__ */ u("summary", {
+									className: "cursor-pointer rounded-button text-sm text-text-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+									children: v("bigconsole.pipelines.execution.stageOutput", "Stage output")
+								}), /* @__PURE__ */ u("pre", {
+									className: "mt-2 max-h-48 overflow-auto rounded-input bg-bg-canvas p-3 text-xs text-text-primary",
+									children: JSON.stringify(e.output, null, 2)
+								})]
+							})
+						]
+					}, e.id))
+				}),
+				e.error && /* @__PURE__ */ u("p", {
+					role: "alert",
+					className: "break-words text-sm text-status-error-text",
+					children: e.error
+				}),
+				e.outputData !== null && e.outputData !== void 0 && /* @__PURE__ */ d("details", { children: [/* @__PURE__ */ u("summary", {
+					className: "cursor-pointer rounded-button text-sm text-text-secondary focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-bg-surface",
+					children: v("bigconsole.pipelines.execution.runOutput", "Run output")
+				}), /* @__PURE__ */ u("pre", {
+					className: "mt-2 max-h-64 overflow-auto rounded-input bg-bg-canvas p-3 text-xs text-text-primary",
+					children: JSON.stringify(e.outputData, null, 2)
+				})] })
+			]
+		})
+	});
+});
+//#endregion
+export { v as PipelineRunHistoryList, y as PipelineStageTimeline };

package/dist/bigconsole/hooks/usePipelineOperations.d.ts

@@ -18,7 +18,8 @@ interface UpdatePipelineInput {
     name?: string;
     description?: string;
     status?: PipelineStatus;
-    metadata?: Record<string, unknown>;
+    /** Full replacement of the stage list, in order (the service replaces stages wholesale). */
+    stages?: UpdatePipelineStageInput[];
 }
 interface CreatePipelineStageInput {
     parserId: string;