@jterrats/open-orchestra 0.1.0 → 0.2.1

package/dist/assets/web-console.js

@@ -0,0 +1,743 @@
+// src/web-chart-contracts.ts
+var GRAPH_STATE_LABELS = ["ready", "blocked", "locked", "complete"];
+function buildDashboardChartData(input) {
+  return {
+    taskStatus: Object.entries(input.status.tasks.byStatus).map(([label, value]) => ({ label, value })).filter((slice) => slice.value > 0),
+    graphState: GRAPH_STATE_LABELS.map((label) => ({
+      label,
+      value: input.graph[label].length
+    })).filter((slice) => slice.value > 0)
+  };
+}
+
+// src/web-console-client.js
+var endpoints = [
+  ["status", "/api/status"],
+  ["validation", "/api/validate"],
+  ["graph", "/api/graph/plan"],
+  ["roles", "/api/roles"],
+  ["evidence", "/api/evidence"],
+  ["approvals", "/api/approvals"],
+  ["tasks", "/api/tasks"],
+  ["evidenceView", "/api/evidence/view"],
+  ["roleActivation", "/api/roles/activation"],
+  ["skills", "/api/skills"],
+  ["sources", "/api/sources"],
+  ["lessons", "/api/lessons"],
+  ["workspaceClassification", "/api/workspace/classification"],
+  ["runtimeAdapters", "/api/runtime/adapters"]
+];
+var statePill = document.querySelector("#load-state");
+var lastUpdated = document.querySelector("#last-updated");
+var metrics = document.querySelector("#metrics");
+var validation = document.querySelector("#validation");
+var workspaceView = document.querySelector("#workspace-view");
+var graph = document.querySelector("#graph");
+var actions = document.querySelector("#actions");
+var charts = document.querySelector("#charts");
+var evidenceTask = document.querySelector("#evidence-task");
+var evidenceType = document.querySelector("#evidence-type");
+var evidenceList = document.querySelector("#evidence-list");
+var rolesView = document.querySelector("#roles-view");
+var planningView = document.querySelector("#planning-view");
+var playwrightTask = document.querySelector("#playwright-task");
+var playwrightPlan = document.querySelector("#playwright-plan");
+var skillsTask = document.querySelector("#skills-task");
+var skillsTarget = document.querySelector("#skills-target");
+var skillsPlanList = document.querySelector("#skills-plan-list");
+var skillsList = document.querySelector("#skills-list");
+var skillsPreview = document.querySelector("#skills-preview");
+var sourcesList = document.querySelector("#sources-list");
+var lessonsList = document.querySelector("#lessons-list");
+var lessonTask = document.querySelector("#lesson-task");
+var lessonPromoteFilter = document.querySelector("#lesson-promote-filter");
+var lessonPromotionResult = document.querySelector(
+  "#lesson-promotion-result"
+);
+var taskStatusChart;
+var graphStateChart;
+var themeToggle = document.querySelector("#theme-toggle");
+applyStoredTheme();
+themeToggle.addEventListener("click", toggleTheme);
+document.querySelector("#refresh").addEventListener("click", loadDashboard);
+document.querySelector("#evidence-filter").addEventListener("click", loadEvidence);
+document.querySelector("#playwright-task").addEventListener("change", loadPlaywrightPlan);
+document.querySelector("#playwright-attach").addEventListener("click", attachPlaywrightEvidence);
+document.querySelector("#skills-task").addEventListener("change", loadSkillPlan);
+document.querySelector("#skills-target").addEventListener("change", loadSkillRender);
+document.querySelector("#skills-plan").addEventListener("click", loadSkillPlan);
+document.querySelector("#skills-render").addEventListener("click", loadSkillRender);
+document.querySelector("#lesson-add").addEventListener("click", addLesson);
+document.querySelector("#lesson-promote").addEventListener("click", promoteLessons);
+loadDashboard();
+function applyStoredTheme() {
+  const stored = localStorage.getItem("open-orchestra-theme");
+  if (stored === "dark" || stored === "light") {
+    document.documentElement.dataset.theme = stored;
+  }
+}
+function toggleTheme() {
+  const current = document.documentElement.dataset.theme || (window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light");
+  const next = current === "dark" ? "light" : "dark";
+  document.documentElement.dataset.theme = next;
+  localStorage.setItem("open-orchestra-theme", next);
+  loadDashboard();
+}
+async function loadDashboard() {
+  setLoading("Loading workflow", "");
+  try {
+    const entries = await Promise.all(
+      endpoints.map(async function(entry) {
+        const response = await fetch(entry[1]);
+        if (!response.ok) {
+          throw new Error(entry[1] + " returned " + response.status);
+        }
+        return [entry[0], await response.json()];
+      })
+    );
+    render(Object.fromEntries(entries));
+    setLoading("Workflow loaded", "ok");
+    lastUpdated.textContent = "Updated " + (/* @__PURE__ */ new Date()).toLocaleTimeString();
+  } catch (error) {
+    setLoading("Console unavailable", "warn");
+    renderEmpty(
+      "The local API is not ready yet.",
+      String(error.message || error)
+    );
+  }
+}
+function render(data) {
+  replace(metrics, [
+    metric(String(data.status.tasks.total), "Tasks"),
+    metric(String(data.graph.ready.length), "Ready"),
+    metric(String(data.graph.blocked.length), "Blocked"),
+    metric(String(data.graph.locked.length), "Locked"),
+    metric(String(data.roles.length), "Roles"),
+    metric(String(data.evidence.length), "Evidence"),
+    metric(String(data.approvals.length), "Approvals"),
+    metric(data.validation.valid ? "Valid" : "Needs work", "Workspace")
+  ]);
+  renderValidation(data.validation);
+  renderWorkspace(data.workspaceClassification, data.runtimeAdapters);
+  renderGraph(data.graph);
+  renderActions(data);
+  renderCharts(data);
+  renderEvidenceControls(data);
+  renderEvidence(data.evidenceView);
+  renderRoles(data.roleActivation);
+  renderPlanning(data.roleActivation);
+  renderPlaywrightTasks(data.tasks);
+  renderSkillControls(data);
+  renderSkillCatalog(data.skills, data.sources);
+  renderSourceCatalog(data.sources);
+  renderLessons(data.lessons);
+  loadPlaywrightPlan();
+  loadSkillPlan();
+}
+function renderWorkspace(classification, adapters) {
+  const adapterNames = adapters.map(function(adapter) {
+    return adapter.label;
+  });
+  replace(workspaceView, [
+    listItem(
+      classification.kind + " workspace",
+      classification.recommendedAction
+    ),
+    listItem("Write policy", classification.writePolicy),
+    listItem("Runtime targets", adapterNames.join(", "))
+  ]);
+}
+function renderCharts(data) {
+  const chartData = buildDashboardChartData(data);
+  const hasChartData = chartData.taskStatus.length > 0 || chartData.graphState.length > 0;
+  charts.hidden = !hasChartData;
+  if (!hasChartData || !globalThis.Chart) {
+    return;
+  }
+  taskStatusChart = renderChart(
+    taskStatusChart,
+    "task-status-chart",
+    "doughnut",
+    chartData.taskStatus
+  );
+  graphStateChart = renderChart(
+    graphStateChart,
+    "graph-state-chart",
+    "bar",
+    chartData.graphState
+  );
+}
+function renderChart(current, canvasId, type, slices) {
+  const style = getComputedStyle(document.documentElement);
+  const colors = [
+    style.getPropertyValue("--accent").trim(),
+    style.getPropertyValue("--ok").trim(),
+    style.getPropertyValue("--warn").trim(),
+    "#8a6fdf",
+    "#d36d8c",
+    "#5f9ea0"
+  ];
+  const textColor = style.getPropertyValue("--ink").trim();
+  const lineColor = style.getPropertyValue("--line").trim();
+  if (current) {
+    current.destroy();
+  }
+  return new globalThis.Chart(document.getElementById(canvasId), {
+    type,
+    data: {
+      labels: slices.map(function(slice) {
+        return slice.label;
+      }),
+      datasets: [
+        {
+          data: slices.map(function(slice) {
+            return slice.value;
+          }),
+          backgroundColor: colors,
+          borderColor: lineColor,
+          borderWidth: 1
+        }
+      ]
+    },
+    options: {
+      responsive: true,
+      maintainAspectRatio: false,
+      plugins: { legend: { position: "bottom", labels: { color: textColor } } },
+      scales: type === "bar" ? {
+        x: { ticks: { color: textColor }, grid: { color: lineColor } },
+        y: {
+          beginAtZero: true,
+          ticks: { color: textColor, precision: 0 },
+          grid: { color: lineColor }
+        }
+      } : {}
+    }
+  });
+}
+async function loadEvidence() {
+  const query = new URLSearchParams();
+  if (evidenceTask.value) {
+    query.set("task", evidenceTask.value);
+  }
+  if (evidenceType.value) {
+    query.set("type", evidenceType.value);
+  }
+  const response = await fetch("/api/evidence/view?" + query.toString());
+  renderEvidence(await response.json());
+}
+function renderEvidenceControls(data) {
+  replace(
+    evidenceTask,
+    [option("", "All tasks")].concat(
+      data.tasks.map(function(task) {
+        return option(task.id, task.id);
+      })
+    )
+  );
+  replace(
+    evidenceType,
+    [option("", "All types")].concat(
+      ["command", "file", "screenshot", "trace", "video", "log", "report"].map(
+        function(type) {
+          return option(type, type);
+        }
+      )
+    )
+  );
+  replace(
+    playwrightTask,
+    data.tasks.map(function(task) {
+      return option(task.id, task.id);
+    })
+  );
+}
+function renderEvidence(items) {
+  replace(
+    evidenceList,
+    items.length > 0 ? items.map(evidenceItem) : [
+      empty(
+        "No evidence yet",
+        "Attach command, report, screenshot, trace, video, or log evidence."
+      )
+    ]
+  );
+}
+function evidenceItem(item) {
+  const node = listItem(
+    item.summary,
+    (item.taskId || "no-task") + " - " + item.type + " - " + item.actor
+  );
+  const row = document.createElement("div");
+  row.className = "tag-row";
+  item.artifacts.forEach(function(artifact) {
+    if (artifact.exists) {
+      const link = document.createElement("a");
+      link.className = "artifact-link";
+      link.href = artifact.url;
+      link.target = "_blank";
+      link.rel = "noreferrer";
+      link.textContent = artifact.path;
+      row.append(link);
+    } else {
+      const miss = document.createElement("span");
+      miss.className = "missing";
+      miss.textContent = "Missing: " + artifact.path;
+      row.append(miss);
+    }
+  });
+  node.append(row);
+  return node;
+}
+function renderRoles(report) {
+  replace(
+    rolesView,
+    report.roles.slice(0, 12).map(function(entry) {
+      const node = listItem(
+        entry.role.name,
+        entry.state + " - " + entry.role.description
+      );
+      const tags = document.createElement("div");
+      tags.className = "tag-row";
+      ["activationCriteria", "expectedEvidence", "gateParticipation"].forEach(
+        function(field) {
+          (entry.role[field] || []).slice(0, 3).forEach(function(value) {
+            const tag = document.createElement("span");
+            tag.className = "tag";
+            tag.textContent = value;
+            tags.append(tag);
+          });
+        }
+      );
+      node.append(tags);
+      return node;
+    })
+  );
+}
+function renderPlanning(report) {
+  const totals = report.planning.totals;
+  const rows = [
+    listItem(
+      "Graph totals",
+      "ready " + totals.ready + " - blocked " + totals.blocked + " - locked " + totals.locked + " - complete " + totals.complete
+    )
+  ].concat(
+    report.planning.byRole.map(function(role) {
+      return listItem(
+        role.roleId,
+        "ready " + role.ready + " - blocked " + role.blocked + " - locked " + role.locked + " - complete " + role.complete
+      );
+    })
+  );
+  replace(planningView, rows);
+}
+function renderSkillControls(data) {
+  const optionsForTasks = function() {
+    return data.tasks.length > 0 ? data.tasks.map(function(task) {
+      return option(task.id, task.id);
+    }) : [option("", "No tasks")];
+  };
+  replace(skillsTask, optionsForTasks());
+  replace(lessonTask, [option("", "No task")].concat(optionsForTasks()));
+}
+function renderSkillCatalog(skills, sources) {
+  const sourceMap = new Map(
+    sources.map(function(source) {
+      return [source.id, source.name];
+    })
+  );
+  replace(
+    skillsList,
+    skills.slice(0, 10).map(function(skill) {
+      const node = listItem(skill.name, skill.summary);
+      const tags = document.createElement("div");
+      tags.className = "tag-row";
+      skill.sourceGroups.slice(0, 4).forEach(function(group) {
+        const tag = document.createElement("span");
+        tag.className = "tag";
+        tag.textContent = sourceMap.get(group) || group;
+        tags.append(tag);
+      });
+      node.append(tags);
+      return node;
+    })
+  );
+}
+async function loadSkillPlan() {
+  if (!skillsTask.value) {
+    replace(skillsPlanList, [
+      empty("No task selected", "Create a task to plan task-scoped skills.")
+    ]);
+    skillsPreview.textContent = "No skill render yet.";
+    return;
+  }
+  const response = await fetch(
+    "/api/skills/plan?task=" + encodeURIComponent(skillsTask.value)
+  );
+  if (!response.ok) {
+    replace(skillsPlanList, [
+      empty(
+        "Skill plan unavailable",
+        "The local API could not plan skills for this task."
+      )
+    ]);
+    return;
+  }
+  const plan = await response.json();
+  replace(
+    skillsPlanList,
+    plan.selected.length > 0 ? plan.selected.map(function(item) {
+      const node = listItem(
+        item.skill.name,
+        item.rationale.join("; ") || "selected"
+      );
+      const tags = document.createElement("div");
+      tags.className = "tag-row";
+      item.skill.sourceGroups.slice(0, 4).forEach(function(group) {
+        const tag = document.createElement("span");
+        tag.className = "tag";
+        tag.textContent = group;
+        tags.append(tag);
+      });
+      node.append(tags);
+      return node;
+    }) : [
+      empty(
+        "No skills selected",
+        "No task signal matched the skill catalog."
+      )
+    ]
+  );
+  await loadSkillRender();
+}
+async function loadSkillRender() {
+  if (!skillsTask.value) {
+    skillsPreview.textContent = "No skill render yet.";
+    return;
+  }
+  const query = new URLSearchParams({
+    task: skillsTask.value,
+    target: skillsTarget.value
+  });
+  const response = await fetch("/api/skills/render?" + query.toString());
+  if (!response.ok) {
+    skillsPreview.textContent = "Skill render unavailable.";
+    return;
+  }
+  const rendered = await response.json();
+  skillsPreview.textContent = rendered.content;
+}
+function renderSourceCatalog(sources) {
+  replace(
+    sourcesList,
+    sources.length > 0 ? sources.map(function(source) {
+      const node = listItem(
+        source.name,
+        "priority " + source.priority + " - " + source.description
+      );
+      const tags = document.createElement("div");
+      tags.className = "tag-row";
+      source.locations.forEach(function(location) {
+        const tag = document.createElement("span");
+        tag.className = "tag";
+        tag.textContent = location;
+        tags.append(tag);
+      });
+      node.append(tags);
+      return node;
+    }) : [
+      empty(
+        "No source catalog",
+        "Run orchestra init to scaffold source-of-truth metadata."
+      )
+    ]
+  );
+}
+function renderLessons(lessons) {
+  replace(
+    lessonsList,
+    lessons.length > 0 ? lessons.slice(0, 12).map(function(lesson) {
+      const node = listItem(
+        lesson.operation,
+        lesson.errorSignature + " - " + lesson.rootCause
+      );
+      const tags = document.createElement("div");
+      tags.className = "tag-row";
+      const appliesTo = Array.isArray(lesson.appliesTo) ? lesson.appliesTo : [];
+      appliesTo.slice(0, 4).forEach(function(tool) {
+        const tag = document.createElement("span");
+        tag.className = "tag";
+        tag.textContent = tool;
+        tags.append(tag);
+      });
+      node.append(tags);
+      return node;
+    }) : [
+      empty(
+        "No lessons yet",
+        "Record reusable tool, syntax, workflow, or permission failures."
+      )
+    ]
+  );
+}
+async function addLesson() {
+  const missingRequiredInput = lessonRequiredInputs().find(function(input) {
+    return !input.value.trim();
+  });
+  if (missingRequiredInput) {
+    setLoading("Complete required lesson fields", "warn");
+    missingRequiredInput.focus();
+    return;
+  }
+  const body = {
+    taskId: lessonTask.value || void 0,
+    actor: document.querySelector("#lesson-actor").value,
+    operation: document.querySelector("#lesson-operation").value,
+    failedAction: document.querySelector("#lesson-failed-action").value,
+    errorSignature: document.querySelector("#lesson-error-signature").value,
+    rootCause: document.querySelector("#lesson-root-cause").value,
+    fix: document.querySelector("#lesson-fix").value,
+    prevention: document.querySelector("#lesson-prevention").value,
+    appliesTo: csvValues(document.querySelector("#lesson-applies-to").value),
+    verifiedBy: csvValues(document.querySelector("#lesson-verified-by").value)
+  };
+  const response = await fetch("/api/lessons/add", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!response.ok) {
+    setLoading("Lesson add failed", "warn");
+    return;
+  }
+  clearLessonForm();
+  await loadDashboard();
+}
+async function promoteLessons() {
+  const response = await fetch("/api/lessons/promote", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify({
+      to: document.querySelector("#lesson-promote-target").value,
+      filter: lessonPromoteFilter.value || void 0
+    })
+  });
+  if (!response.ok) {
+    setLoading("Lesson promotion failed", "warn");
+    return;
+  }
+  const promotion = await response.json();
+  renderLessonPromotion(promotion);
+  setLoading("Promoted " + promotion.lessons.length + " lessons", "ok");
+  lessonPromoteFilter.value = "";
+  await loadDashboard();
+}
+function renderLessonPromotion(promotion) {
+  if (!lessonPromotionResult) {
+    return;
+  }
+  const rows = [];
+  if (promotion.artifact) {
+    rows.push(listItem("Review artifact", promotion.artifact));
+  }
+  rows.push(listItem("Promoted lessons", String(promotion.lessons.length)));
+  replace(lessonPromotionResult, rows);
+}
+function lessonRequiredInputs() {
+  return Array.from(document.querySelectorAll("[data-lesson-required]"));
+}
+function clearLessonForm() {
+  [
+    "#lesson-operation",
+    "#lesson-failed-action",
+    "#lesson-error-signature",
+    "#lesson-root-cause",
+    "#lesson-fix",
+    "#lesson-prevention",
+    "#lesson-applies-to",
+    "#lesson-verified-by"
+  ].forEach(function(selector) {
+    document.querySelector(selector).value = "";
+  });
+}
+function csvValues(value) {
+  return value.split(",").map(function(item) {
+    return item.trim();
+  }).filter(Boolean);
+}
+function renderPlaywrightTasks(tasks) {
+  if (tasks.length === 0) {
+    replace(playwrightTask, [option("", "No tasks")]);
+  }
+}
+async function loadPlaywrightPlan() {
+  if (!playwrightTask.value) {
+    replace(playwrightPlan, [
+      empty("No task selected", "Create a task to generate a Playwright plan.")
+    ]);
+    return;
+  }
+  const response = await fetch(
+    "/api/playwright/plan?task=" + encodeURIComponent(playwrightTask.value)
+  );
+  const plan = await response.json();
+  replace(
+    playwrightPlan,
+    plan.scenarios.map(function(scenario) {
+      return listItem(scenario.name, scenario.assertions.join(" | "));
+    })
+  );
+}
+async function attachPlaywrightEvidence() {
+  const body = {
+    task: playwrightTask.value,
+    kind: document.querySelector("#playwright-kind").value,
+    path: document.querySelector("#playwright-path").value,
+    summary: document.querySelector("#playwright-summary").value
+  };
+  const response = await fetch("/api/playwright/evidence", {
+    method: "POST",
+    headers: { "content-type": "application/json" },
+    body: JSON.stringify(body)
+  });
+  if (!response.ok) {
+    setLoading("Evidence attach failed", "warn");
+    return;
+  }
+  await loadDashboard();
+}
+function option(value, label) {
+  const node = document.createElement("option");
+  node.value = value;
+  node.textContent = label;
+  return node;
+}
+function renderValidation(report) {
+  if (report.valid && report.warnings.length === 0) {
+    replace(validation, [
+      empty("Workspace is valid", "No validation issues were reported.")
+    ]);
+    return;
+  }
+  replace(
+    validation,
+    report.errors.concat(report.warnings).map(function(message) {
+      return listItem(
+        message,
+        report.errors.includes(message) ? "Error" : "Warning"
+      );
+    })
+  );
+}
+function renderGraph(plan) {
+  const rows = [
+    ["Ready", plan.ready],
+    ["Blocked", plan.blocked],
+    ["Locked", plan.locked],
+    ["Complete", plan.complete]
+  ].flatMap(function(group) {
+    return group[1].slice(0, 4).map(function(item) {
+      return listItem(
+        item.title,
+        group[0] + " - " + item.id + " - " + item.ownerRole
+      );
+    });
+  });
+  replace(
+    graph,
+    rows.length > 0 ? rows : [
+      empty(
+        "No tasks yet",
+        "Add tasks with orchestra task add to start planning."
+      )
+    ]
+  );
+}
+function renderActions(data) {
+  const next = [];
+  if (!data.validation.valid) {
+    next.push(
+      listItem(
+        "Fix workspace validation",
+        "Run orchestra validate for full details."
+      )
+    );
+  }
+  if (data.graph.ready.length > 0) {
+    next.push(
+      listItem(
+        "Start ready work",
+        data.graph.ready.length + " task(s) can run now."
+      )
+    );
+  }
+  if (data.approvals.length > 0) {
+    next.push(
+      listItem(
+        "Review pending approvals",
+        data.approvals.length + " approval artifact(s) found."
+      )
+    );
+  }
+  if (data.status.tasks.total === 0) {
+    next.push(
+      listItem(
+        "Create the first task",
+        "Use a backlog item, owner role, scope, and acceptance criteria."
+      )
+    );
+  }
+  replace(
+    actions,
+    next.length > 0 ? next : [
+      empty(
+        "No immediate action",
+        "The workflow has no blocking console actions."
+      )
+    ]
+  );
+}
+function metric(value, label) {
+  const node = document.createElement("div");
+  node.className = "metric";
+  const strong = document.createElement("strong");
+  strong.textContent = value;
+  const span = document.createElement("span");
+  span.textContent = label;
+  node.append(strong, span);
+  return node;
+}
+function listItem(title, detail) {
+  const node = document.createElement("li");
+  node.className = "list-item";
+  const strong = document.createElement("strong");
+  strong.textContent = title;
+  const span = document.createElement("span");
+  span.textContent = detail;
+  node.append(strong, span);
+  return node;
+}
+function empty(title, detail) {
+  const node = document.createElement("div");
+  node.className = "empty-state";
+  const strong = document.createElement("strong");
+  strong.textContent = title;
+  const p = document.createElement("p");
+  p.textContent = detail;
+  node.append(strong, p);
+  return node;
+}
+function replace(parent, nodes) {
+  parent.replaceChildren(...nodes);
+}
+function renderEmpty(title, detail) {
+  replace(metrics, [empty(title, detail)]);
+  charts.hidden = true;
+  replace(validation, []);
+  replace(workspaceView, []);
+  replace(graph, []);
+  replace(actions, []);
+}
+function setLoading(label, tone) {
+  statePill.textContent = label;
+  statePill.className = ("pill " + tone).trim();
+}