aimeat 1.24.0 → 1.24.1

package/dist/locales/en.json

@@ -45,6 +45,8 @@
   "profile.workflows.form.cancel": "Cancel",
   "profile.workflows.form.save": "Save",
   "profile.workflows.form.saved": "Workflow saved",
+  "profile.workflows.cancelRun": "Cancel run",
+  "profile.workflows.cancelled": "Run cancelled",
   "profile.tabs.scheduler": "Scheduler",
   "profile.agents.detail.tabs.schedules": "Schedules",
   "profile.scheduler.title": "Scheduler",
@@ -5897,6 +5899,9 @@
     "moreActions": "More actions",
     "policyLabel": "Join policy",
     "tabWorkspaces": "Workspaces",
+    "structureOverviewOrg": "Organism structure overview",
+    "structureOverviewWs": "Workspace structure overview",
+    "structEmpty": "No structure to show yet.",
     "tabMembers": "Members",
     "tabAgents": "Agents",
     "tabBoard": "Board",
@@ -6402,7 +6407,10 @@
       "complete_test_task": "Agent executes and completes the test task",
       "publish_commands": "agents.{name}.commands memory has a non-empty array of { name, description, category }",
       "publish_config": "At least one agents.config.{name}.* memory entry exists describing this runtime",
-      "declare_services": "Agent declares offered services (optional)"
+      "declare_services": "Agent declares offered services (optional)",
+      "declare_offerings": "Agent publishes at least one offer (id + title + ask) to agents.{name}.offers so the owner can find what it does (optional)",
+      "make_workflow_compatible": "At least one offer declares success_signal + required_to_function + deliverable.location, so it can be a step in an Agent Workflow (optional)",
+      "price_offer": "At least one offer is sellable cross-owner: price + visibility public + a callable binding (optional)"
     },
     "errors": {
       "accessDenied": "Access denied",

package/dist/locales/fi.json

@@ -45,6 +45,8 @@
   "profile.workflows.form.cancel": "Peruuta",
   "profile.workflows.form.save": "Tallenna",
   "profile.workflows.form.saved": "Työnkulku tallennettu",
+  "profile.workflows.cancelRun": "Keskeytä ajo",
+  "profile.workflows.cancelled": "Ajo keskeytetty",
   "profile.tabs.scheduler": "Ajastin",
   "profile.agents.detail.tabs.schedules": "Ajastukset",
   "profile.scheduler.title": "Ajastin",
@@ -5897,6 +5899,9 @@
     "moreActions": "Lisätoiminnot",
     "policyLabel": "Liittymiskäytäntö",
     "tabWorkspaces": "Työtilat",
+    "structureOverviewOrg": "Organismin rakenteen yleiskuva",
+    "structureOverviewWs": "Työtilan rakenteen yleiskuva",
+    "structEmpty": "Ei vielä rakennetta näytettäväksi.",
     "tabMembers": "Jäsenet",
     "tabAgents": "Agentit",
     "tabBoard": "Taulu",
@@ -6402,7 +6407,10 @@
       "complete_test_task": "Agentti suorittaa ja viimeistelee testitehtävän",
       "publish_commands": "agents.{name}.commands -muistissa on epätyhjä { name, description, category } -taulu",
       "publish_config": "Vähintään yksi agents.config.{name}.* -muistitietue kuvaa tätä runtimea",
-      "declare_services": "Agentti ilmoittaa tarjoamansa palvelut (valinnainen)"
+      "declare_services": "Agentti ilmoittaa tarjoamansa palvelut (valinnainen)",
+      "declare_offerings": "Agentti julkaisee vähintään yhden tarjouksen (id + title + ask) avaimeen agents.{name}.offers, jotta omistaja löytää mitä se tekee (valinnainen)",
+      "make_workflow_compatible": "Vähintään yksi tarjous määrittää success_signal + required_to_function + deliverable.location, jolloin se voi olla työnkulun vaihe (valinnainen)",
+      "price_offer": "Vähintään yksi tarjous on myytävissä omistajien välillä: price + visibility public + kutsuttava sidonta (valinnainen)"
     },
     "errors": {
       "accessDenied": "Pääsy estetty",

package/dist/public/css/views/profile.css

@@ -2492,6 +2492,27 @@
 .pj-org-tab-count { color: var(--muted); font-size: 0.75rem; margin-left: 0.3rem; }
 .pj-org-boardrow { display: flex; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
 
+/* ── OKF-style structure overview (collapsible Markdown map of an organism / workspace) ── */
+.pj-struct-overview { margin: 0.4rem 0 0.8rem; }
+.pj-struct-toggle { display: inline-flex; align-items: center; gap: 0.4rem; background: none; border: none; padding: 0.3rem 0; font-size: 0.85rem; color: var(--text-dim); cursor: pointer; }
+.pj-struct-toggle:hover { color: var(--text); }
+.pj-struct-caret { color: var(--muted); font-size: 0.8rem; width: 0.8rem; }
+.pj-struct-body { margin-top: 0.4rem; max-height: 32rem; overflow: auto; padding: 0.75rem 0.9rem; }
+/* Compact, on-theme typography so the rendered map reads as part of the dashboard, not a raw doc. */
+.pj-struct-body .md-body { font-size: 0.85rem; color: var(--text); line-height: 1.5; }
+.pj-struct-body .md-body > :first-child { margin-top: 0; }
+.pj-struct-body .md-body h1 { font-size: 1rem; font-weight: 700; margin: 0 0 0.3rem; color: var(--text); }
+.pj-struct-body .md-body h2 { font-size: 0.92rem; font-weight: 700; margin: 0.95rem 0 0.35rem; padding-top: 0.55rem; border-top: 1px solid var(--border); color: var(--text); }
+.pj-struct-body .md-body h3 { font-size: 0.83rem; font-weight: 600; margin: 0.55rem 0 0.2rem; color: var(--text-dim); text-transform: none; }
+.pj-struct-body .md-body p { margin: 0.2rem 0; }
+.pj-struct-body .md-body blockquote { margin: 0.2rem 0; padding: 0 0 0 0.6rem; border-left: 2px solid var(--border); color: var(--muted); font-size: 0.8rem; }
+.pj-struct-body .md-body blockquote p { margin: 0.1rem 0; }
+.pj-struct-body .md-body ul { margin: 0.2rem 0 0.4rem; padding-left: 1.15rem; }
+.pj-struct-body .md-body li { margin: 0.12rem 0; }
+.pj-struct-body .md-body code { background: var(--bg-dim); border: 1px solid var(--border); border-radius: 4px; padding: 0.02rem 0.32rem; font-size: 0.78rem; }
+.pj-struct-body .md-body strong { font-weight: 600; }
+.pj-struct-body .md-body em { color: var(--muted); font-style: normal; }
+
 /* ── Workspace renew (phase 2): header actions, review banner, add-space tab ── */
 .pj-ws-head-actions { margin-left: auto; display: flex; gap: 0.4rem; align-items: center; }
 .pj-ws-banner { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; border: 1px solid var(--border); border-left: 3px solid var(--warn, var(--accent)); border-radius: 10px; background: var(--card); padding: 0.55rem 0.75rem; margin: 0.6rem 0 0.2rem; }

package/dist/public/css/views/workflows.css

@@ -47,8 +47,13 @@
 
 /* ── detail ── */
 .wf-detail-head { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; }
-.wf-detail-title { font-size: 1.1rem; font-weight: 700; color: var(--text); flex: 1; }
+.wf-detail-titlebox { flex: 1; display: flex; flex-direction: column; gap: 0.1rem; min-width: 0; }
+.wf-detail-title { font-size: 1.1rem; font-weight: 700; color: var(--text); }
+.wf-detail-sub { font-size: 0.8rem; color: var(--text-dim); }
+.wf-detail-sub code { font-family: var(--font-mono, monospace); }
+.wf-detail-desc { color: var(--text-dim); font-size: 0.9rem; margin: -0.3rem 0 0.3rem; }
 .wf-detail-actions { display: flex; gap: 0.4rem; }
+.wf-node-desc { font-weight: 400; color: var(--text-dim); font-size: 0.85rem; }
 
 .wf-graph { display: flex; flex-direction: column; gap: 0.5rem; }
 .wf-node {

package/dist/public/js/services/organisms.js

@@ -491,6 +491,24 @@ export async function getWorkspace(orgId, wsId) {
   return resp?.data || null;
 }
 
+/** OKF-style STRUCTURE OVERVIEW (Markdown) of the whole organism — every workspace's space
+ *  breakdown + totals, deterministic, size-bounded. Returns '' on failure (caller shows a notice). */
+export async function getOrganismOverview(orgId) {
+  try {
+    const r = await apiGet(`/v1/organisms/${encodeURIComponent(orgId)}/overview`);
+    return r?.data?.markdown || '';
+  } catch { return ''; }
+}
+
+/** OKF-style STRUCTURE OVERVIEW (Markdown) of ONE workspace — per space the most-recent entries
+ *  (ids + titles) and totals. Returns '' on failure. */
+export async function getWorkspaceOverview(orgId, wsId) {
+  try {
+    const r = await apiGet(`/v1/organisms/${encodeURIComponent(orgId)}/workspace/overview?ws=${encodeURIComponent(wsId)}`);
+    return r?.data?.markdown || '';
+  } catch { return ''; }
+}
+
 /** Overwrite a workspace's manifest (e.g. edited name/summary/policy from Settings). */
 export async function saveManifest(orgId, wsId, manifest) {
   return apiPost('/v1/memory', { key: `${wsRoot(orgId, wsId)}.meta.manifest`, value: manifest, visibility: 'private' });

package/dist/public/js/services/workflows.js

@@ -55,3 +55,8 @@ export async function getRun(id, runId) {
 export async function runWorkflow(id, mode, vars) {
   return apiPost(`/v1/workflows/${encodeURIComponent(id)}/run`, { mode, ...(vars ? { vars } : {}) });
 }
+
+/** Cancel an in-flight run (stuck / gone wrong). */
+export async function cancelRun(id, runId) {
+  return apiPost(`/v1/workflows/${encodeURIComponent(id)}/runs/${encodeURIComponent(runId)}/cancel`, {});
+}

package/dist/public/views/profile/organisms-tab.js

@@ -148,6 +148,11 @@
  *     auto-activates; §7c) — the agent joins/provisions its own spaces and the task completion is
  *     the ack. An agent already working in THIS workspace (per the participants data) shows a
  *     "✓ active here" badge instead of Adopt. Convention agreed with the crewaimeat side 2026-06-10.
+ *   v1.29.0 — 2026-06-13 — OKF-style structure overview: a collapsible <${'StructureOverview'}> panel in
+ *     OrganismHome (📐 Organism structure overview — every workspace's space breakdown + totals) and in
+ *     Workspace (📐 Workspace structure overview — per-space recent ids + titles). Lazy-loads a
+ *     deterministic Markdown map from the server (orgService.getOrganismOverview / getWorkspaceOverview)
+ *     and renders it via the safe Markdown component. Collapsed by default (no cost until opened).
  *   v1.28.0 — 2026-06-12 — Overview landing tab: the whole workspace on one vertical scroll — a
  *     "what happened here" strip (last 8 activity events, humanized + clickable) above every
  *     manifest space stacked in order (records: compact rows max 5 + "Show all N →"; documents:
@@ -237,6 +242,46 @@ function KebabMenu({ items, label, trigger, btnClass }) {
 
 /** Tag chips + inline input — Enter/comma adds, × or Backspace-on-empty removes, blur commits.
  *  Shows immediately how the value parses (vs. a raw "comma separated" text field). */
+/** Collapsible OKF-style structure-overview panel. A button that, on first expand, lazy-loads a
+ *  deterministic Markdown structure map (server projection — never persisted) and renders it via the
+ *  safe Markdown component. Used at organism level (every workspace's space breakdown) and workspace
+ *  level (per-space recent ids + titles). Collapsed by default so it costs nothing until asked for. */
+function StructureOverview({ load, label }) {
+  const [open, setOpen] = useState(false);
+  const [md, setMd] = useState(null);   // null = not loaded yet; '' = loaded but empty/failed
+  const [busy, setBusy] = useState(false);
+  const toggle = async () => {
+    const next = !open;
+    setOpen(next);
+    if (next && md === null && !busy) {
+      setBusy(true);
+      // For the human view, strip the OKF YAML frontmatter (machine metadata — kept in the raw
+      // server/MCP output) AND the leading "# … — structure overview" H1 (the panel toggle already
+      // names it; the page header already shows the org/workspace name). The body starts at the
+      // description / totals line.
+      try {
+        const raw = (await load()) || '';
+        setMd(raw.replace(/^---\n[\s\S]*?\n---\n+/, '').replace(/^#\s+.*\n+/, ''));
+      } finally { setBusy(false); }
+    }
+  };
+  return html`
+    <div class="pj-struct-overview">
+      <button class="pj-struct-toggle" aria-expanded=${open} onClick=${toggle}>
+        <span class="pj-struct-caret">${open ? '▾' : '▸'}</span>
+        <span>${'📐 '}${label}</span>
+      </button>
+      ${open ? html`
+        <div class="pj-struct-body card-detail">
+          ${busy
+            ? html`<${Spinner} text=${t('organisms.loading') || 'Loading...'} />`
+            : (md
+              ? html`<${Markdown} text=${md} />`
+              : html`<div class="section-desc">${t('organisms.structEmpty') || 'No structure to show yet.'}</div>`)}
+        </div>` : null}
+    </div>`;
+}
+
 function TagInput({ tags, onChange, placeholder }) {
   const [val, setVal] = useState('');
   const add = () => { const v = val.trim().replace(/,+$/, ''); if (v && !tags.includes(v)) onChange([...tags, v]); setVal(''); };
@@ -1413,6 +1458,9 @@ function OrganismHome({ org, ghii, showToast, initialSettings, onOpenWs, onBack,
         </div>
       </div>
 
+      <${StructureOverview} label=${t('organisms.structureOverviewOrg') || 'Organism structure overview'}
+        load=${() => orgService.getOrganismOverview(org.id)} />
+
       <div class="pj-org-tabs" role="tablist">
         ${tabs.map(tb => html`
           <button class="pj-org-tab ${activeHomeTab === tb.id ? 'active' : ''}" role="tab" aria-selected=${activeHomeTab === tb.id} key=${tb.id}
@@ -2951,6 +2999,9 @@ function Workspace({ org, wsId, showToast, onBack, onBackToList }) {
       </div>
       ${ws.manifest?.summary ? html`<div class="section-desc">${(ws.manifest.summary)}</div>` : null}
 
+      <${StructureOverview} label=${t('organisms.structureOverviewWs') || 'Workspace structure overview'}
+        load=${() => orgService.getWorkspaceOverview(orgId, wsId)} />
+
       ${approvals.length > 0 && activeTab !== 'review' ? html`
         <div class="pj-ws-banner" role="status">
           <span class="pj-ws-banner-text">

package/dist/public/views/profile/workflows-tab.js

@@ -16,7 +16,7 @@ import { useState, useEffect, useRef, useCallback } from 'preact/hooks';
 import htm from 'htm';
 import { t } from '/js/i18n.js';
 import { timeAgo } from '/js/utils.js';
-import { listWorkflows, getWorkflow, getBlueprint, getHealth, listRuns, getRun, runWorkflow } from '/js/services/workflows.js';
+import { listWorkflows, getWorkflow, getBlueprint, getHealth, listRuns, getRun, runWorkflow, cancelRun } from '/js/services/workflows.js';
 import WorkflowForm from './workflows-form.js';
 
 const html = htm.bind(h);
@@ -39,7 +39,7 @@ function triggerSummary(trigger) {
 function statusClass(status) {
   if (status === 'done' || status === 'green') return 'wf-badge--ok';
   if (status === 'partial' || status === 'red' || (typeof status === 'string' && status.endsWith('-red')) || status === 'timed-out') return 'wf-badge--err';
-  if (status === 'skipped') return 'wf-badge--muted';
+  if (status === 'skipped' || status === 'cancelled') return 'wf-badge--muted';
   return 'wf-badge--run';
 }
 
@@ -111,7 +111,7 @@ export default function WorkflowsTab({ showToast }) {
   if (view.name === 'edit') return html`<${EditFormView} id=${view.id} showToast=${showToast}
     onCancel=${() => setView({ name: 'detail', id: view.id })} onSaved=${(id) => setView({ name: 'detail', id })} />`;
   if (view.name === 'detail') return html`<${DetailView} id=${view.id} onBack=${() => { setView({ name: 'list' }); loadList(); }} onOpenRun=${(runId) => setView({ name: 'run', id: view.id, runId })} onRun=${doRun} onEdit=${() => setView({ name: 'edit', id: view.id })} />`;
-  if (view.name === 'run') return html`<${RunView} id=${view.id} runId=${view.runId} onBack=${() => setView({ name: 'detail', id: view.id })} />`;
+  if (view.name === 'run') return html`<${RunView} id=${view.id} runId=${view.runId} showToast=${showToast} onBack=${() => setView({ name: 'detail', id: view.id })} />`;
 
   // ── list ──
   return html`
@@ -161,35 +161,55 @@ function EditFormView({ id, onCancel, onSaved, showToast }) {
 }
 
 function DetailView({ id, onBack, onOpenRun, onRun, onEdit }) {
+  const [def, setDef] = useState(null);
   const [blueprint, setBlueprint] = useState(null);
   const [runs, setRuns] = useState([]);
   const [err, setErr] = useState(null);
 
   const load = useCallback(async () => {
-    const [bp, rr] = await Promise.all([getBlueprint(id).catch(e => ({ _err: e.message })), listRuns(id).catch(() => null)]);
+    const [d, bp, rr] = await Promise.all([
+      getWorkflow(id).catch(() => null),
+      getBlueprint(id).catch(e => ({ _err: e.message })),
+      listRuns(id).catch(() => null),
+    ]);
+    setDef(d?.data || null);
     if (bp?._err) setErr(bp._err); else setBlueprint(bp?.data || null);
     setRuns(rr?.data?.runs || []);
   }, [id]);
   useEffect(() => { load(); }, [load]);
+  // Live updates: re-fetch the blueprint + recent runs as runs advance (engine emitChange → SSE).
+  const liveRef = useRef(load); liveRef.current = load;
+  useEffect(() => {
+    const h = () => liveRef.current();
+    window.addEventListener('aimeat-live-update', h);
+    return () => window.removeEventListener('aimeat-live-update', h);
+  }, []);
+
+  const stepDesc = (stepId) => loc((def?.steps || []).find(s => s.id === stepId)?.description);
+  const triggerLine = def ? triggerSummary(def.trigger) : '';
 
   return html`
     <div class="wf-tab">
       <div class="wf-detail-head">
         <button class="btn-ghost" onClick=${onBack}>← ${t('profile.workflows.back')}</button>
-        <div class="wf-detail-title">${id}</div>
+        <div class="wf-detail-titlebox">
+          <div class="wf-detail-title">${def ? loc(def.title) || id : id}</div>
+          <div class="wf-detail-sub"><code>${id}</code>${triggerLine ? html` · ${triggerLine}` : ''}</div>
+        </div>
         <div class="wf-detail-actions">
           <button class="btn-ghost" onClick=${onEdit}>${t('profile.workflows.edit')}</button>
           <button class="btn-outline" onClick=${() => onRun(id, 'signals-only')}>${t('profile.workflows.check')}</button>
           <button class="btn-primary" onClick=${() => onRun(id, 'full')}>${t('profile.workflows.run')}</button>
         </div>
       </div>
+      ${def && loc(def.description) && html`<div class="wf-detail-desc">${loc(def.description)}</div>`}
 
       ${err && html`<div class="wf-error">${err}</div>`}
 
       <div class="wf-section-title">${t('profile.workflows.blueprint')}</div>
       ${blueprint && html`<div class="wf-graph">
         ${blueprint.nodes.map(n => html`<div class="wf-node" key=${n.stepId}>
-          <div class="wf-node-id">${n.stepId}</div>
+          <div class="wf-node-id">${n.stepId}${stepDesc(n.stepId) ? html` <span class="wf-node-desc">— ${stepDesc(n.stepId)}</span>` : ''}</div>
           <div class="wf-node-agent">${(n.agents || []).join(', ')} · ${n.offerId}</div>
           ${n.reads.length > 0 && html`<div class="wf-node-io">↘ ${n.reads.join(', ')}</div>`}
           ${n.writes.length > 0 && html`<div class="wf-node-io">↗ ${n.writes.join(', ')}</div>`}
@@ -214,30 +234,66 @@ function DetailView({ id, onBack, onOpenRun, onRun, onEdit }) {
 }
 
 // ── Run: per-step timeline ──────────────────────────────────────────────────────
-function RunView({ id, runId, onBack }) {
+function RunView({ id, runId, onBack, showToast }) {
   const [run, setRun] = useState(null);
   const [err, setErr] = useState(null);
-  useEffect(() => { getRun(id, runId).then(r => setRun(r?.data || null)).catch(e => setErr(e.message)); }, [id, runId]);
+  const [cancelling, setCancelling] = useState(false);
+  const loadRun = useCallback(() => getRun(id, runId).then(r => setRun(r?.data || null)).catch(e => setErr(e.message)), [id, runId]);
+  useEffect(() => { loadRun(); }, [loadRun]);
+  // Live updates: the engine emits emitChange('workflows') as the run advances (dispatch → green →
+  // next step → done) → SSE → aimeat-live-update. Re-fetch so the timeline updates without a manual reload.
+  const liveRef = useRef(loadRun); liveRef.current = loadRun;
+  useEffect(() => {
+    const h = () => liveRef.current();
+    window.addEventListener('aimeat-live-update', h);
+    return () => window.removeEventListener('aimeat-live-update', h);
+  }, []);
+
+  const inFlight = run && (run.status === 'running' || run.status === 'waiting-step');
+  const doCancel = async () => {
+    setCancelling(true);
+    try { await cancelRun(id, runId); showToast?.(t('profile.workflows.cancelled'), false); await loadRun(); }
+    catch (e) { showToast?.(e?.message || 'Cancel failed', true); }
+    finally { setCancelling(false); }
+  };
+
+  // The run pins the full definition (defSnapshot), so we can name the workflow + each step
+  // without any extra fetch — and show exactly the def THIS run executed (even if it changed since).
+  const def = run?.defSnapshot;
+  const stepDef = (stepId) => (def?.steps || []).find(s => s.id === stepId);
 
   return html`
     <div class="wf-tab">
       <div class="wf-detail-head">
         <button class="btn-ghost" onClick=${onBack}>← ${t('profile.workflows.back')}</button>
-        <div class="wf-detail-title">${t('profile.workflows.run')} · ${run ? timeAgo(run.startedAt) : runId.slice(0, 8)}</div>
+        <div class="wf-detail-titlebox">
+          <div class="wf-detail-title">${def ? loc(def.title) || run.workflowId : t('profile.workflows.run')}</div>
+          <div class="wf-detail-sub">
+            ${run ? html`<code>${run.workflowId}</code> · ${t('profile.workflows.run')} ${timeAgo(run.startedAt)} · ${run.mode}` : runId.slice(0, 8)}
+          </div>
+        </div>
+        ${inFlight && html`<button class="btn-danger-solid" disabled=${cancelling} onClick=${doCancel}>${cancelling ? '…' : t('profile.workflows.cancelRun')}</button>`}
         ${run && html`<${StatusBadge} status=${run.status} />`}
       </div>
+      ${run && def && loc(def.description) && html`<div class="wf-detail-desc">${loc(def.description)}</div>`}
       ${err && html`<div class="wf-error">${err}</div>`}
       ${run && html`<div class="wf-steps">
-        ${Object.entries(run.steps).map(([stepId, s]) => html`<div class="wf-step" key=${stepId}>
+        ${Object.entries(run.steps).map(([stepId, s]) => {
+          const sd = stepDef(stepId);
+          const agents = sd ? (Array.isArray(sd.agent) ? sd.agent.join(', ') : sd.agent) : null;
+          return html`<div class="wf-step" key=${stepId}>
           <div class="wf-step-row">
             <${StatusBadge} status=${s.state} />
             <span class="wf-step-id">${stepId}</span>
+            ${sd && loc(sd.description) && html`<span class="wf-node-desc">— ${loc(sd.description)}</span>`}
             ${s.reads?.length > 0 && html`<span class="wf-muted">↘ ${s.reads.length}</span>`}
             ${s.writes?.length > 0 && html`<span class="wf-muted">↗ ${s.writes.length}</span>`}
             ${s.attempt > 0 && html`<span class="wf-muted">${t('profile.workflows.attempt')} ${s.attempt + 1}</span>`}
           </div>
+          ${agents && html`<div class="wf-node-agent">${agents} · ${sd.offer}</div>`}
           ${(s.outputObserved || s.inputObserved) && html`<pre class="wf-observed">${JSON.stringify(s.outputObserved || s.inputObserved, null, 2)}</pre>`}
-        </div>`)}
+        </div>`;
+        })}
         ${(run.inspections || []).length > 0 && html`<div class="wf-inspections">${t('profile.workflows.inspectorDispatched', { count: run.inspections.length })}</div>`}
       </div>`}
     </div>`;