@tenonhq/dovetail-dashboard 0.0.13 → 0.0.14

package/public/claude-plans.js

@@ -0,0 +1,354 @@
+/* /claude-plans page logic.
+ * - Fetches initial state from REST.
+ * - Subscribes to /api/claude-plans/stream (SSE) for live updates.
+ * - Renders markdown via marked + DOMPurify, Mermaid via mermaid.run().
+ */
+
+(function () {
+  "use strict";
+
+  if (window.mermaid && typeof window.mermaid.initialize === "function") {
+    window.mermaid.initialize({ startOnLoad: false, theme: "default", securityLevel: "strict" });
+  }
+  if (window.marked && typeof window.marked.setOptions === "function") {
+    window.marked.setOptions({ breaks: true, gfm: true });
+  }
+
+  var state = {
+    plans: new Map(),       // slug -> plan
+    artifacts: new Map(),   // slug -> Map<artifactSlug, artifact>
+    selectedSlug: null,
+    activeTab: "plan"
+  };
+
+  var els = {
+    storage: document.getElementById("cp-storage"),
+    list: document.getElementById("cp-list"),
+    count: document.getElementById("cp-count"),
+    railEmpty: document.getElementById("cp-rail-empty"),
+    detailEmpty: document.getElementById("cp-detail-empty"),
+    detailBody: document.getElementById("cp-detail-body"),
+    detailTitle: document.getElementById("cp-detail-title"),
+    detailStatus: document.getElementById("cp-detail-status"),
+    detailStamp: document.getElementById("cp-detail-stamp"),
+    artifactCount: document.getElementById("cp-artifact-count"),
+    planPanel: document.getElementById("cp-tab-plan"),
+    artifactsPanel: document.getElementById("cp-tab-artifacts"),
+    tabs: document.querySelectorAll(".cp-tab")
+  };
+
+  function sortedPlans() {
+    return Array.from(state.plans.values()).sort(function (a, b) {
+      return (b.updated_at || "").localeCompare(a.updated_at || "");
+    });
+  }
+
+  function sortedArtifacts(slug) {
+    var map = state.artifacts.get(slug);
+    if (!map) return [];
+    return Array.from(map.values()).sort(function (a, b) {
+      return (a.created_at || "").localeCompare(b.created_at || "");
+    });
+  }
+
+  function fmtTime(iso) {
+    if (!iso) return "";
+    var d = new Date(iso);
+    if (isNaN(d.getTime())) return iso;
+    return d.toLocaleString();
+  }
+
+  function showError(msg) {
+    var el = document.createElement("div");
+    el.style.cssText = "position:fixed;bottom:16px;right:16px;background:var(--danger);color:#fff;padding:8px 14px;border-radius:4px;font-size:13px;z-index:9999";
+    el.textContent = msg;
+    document.body.appendChild(el);
+    setTimeout(function () { el.remove(); }, 4000);
+  }
+
+  function renderMarkdown(md, target) {
+    if (!window.marked || !window.DOMPurify) {
+      target.textContent = md;
+      return;
+    }
+    var html = window.marked.parse(md || "");
+    target.innerHTML = window.DOMPurify.sanitize(html);
+  }
+
+  function renderMermaid(source, target) {
+    target.classList.add("cp-mermaid");
+    target.textContent = "";
+    if (!window.mermaid || typeof window.mermaid.render !== "function") {
+      target.textContent = source;
+      return;
+    }
+    var id = "mmd-" + Math.random().toString(36).slice(2, 10);
+    try {
+      window.mermaid.render(id, source).then(
+        function (out) { target.innerHTML = out.svg; },
+        function (err) {
+          target.classList.remove("cp-mermaid");
+          target.classList.add("cp-mermaid-error");
+          target.textContent = "mermaid error: " + (err && err.message ? err.message : String(err));
+        }
+      );
+    } catch (err) {
+      target.classList.remove("cp-mermaid");
+      target.classList.add("cp-mermaid-error");
+      target.textContent = "mermaid error: " + err.message;
+    }
+  }
+
+  function renderRail() {
+    var plans = sortedPlans();
+    els.count.textContent = String(plans.length);
+    if (plans.length === 0) {
+      els.railEmpty.style.display = "block";
+      els.list.innerHTML = "";
+      return;
+    }
+    els.railEmpty.style.display = "none";
+    els.list.innerHTML = "";
+    plans.forEach(function (plan) {
+      var artifactCount = (state.artifacts.get(plan.slug) || new Map()).size;
+      var li = document.createElement("li");
+      li.className = "cp-list-item" + (plan.slug === state.selectedSlug ? " active" : "");
+      li.tabIndex = 0;
+      li.dataset.slug = plan.slug;
+      li.innerHTML =
+        '<div class="cp-list-row">' +
+        '  <span class="cp-list-title"></span>' +
+        '  <span class="cp-status-pill cp-status-' + plan.status + '">' + plan.status + '</span>' +
+        '</div>' +
+        '<div class="cp-list-meta">' +
+        '  <span class="cp-list-meta-slug"></span>' +
+        '  <span class="cp-artifact-badge">' + artifactCount + ' artifact' + (artifactCount === 1 ? '' : 's') + '</span>' +
+        '</div>';
+      li.querySelector(".cp-list-title").textContent = plan.title;
+      li.querySelector(".cp-list-meta-slug").textContent = plan.slug;
+      li.addEventListener("click", function () { selectPlan(plan.slug); });
+      li.addEventListener("keydown", function (e) {
+        if (e.key === "Enter" || e.key === " ") { e.preventDefault(); selectPlan(plan.slug); }
+      });
+      var delBtn = document.createElement("button");
+      delBtn.className = "cp-list-delete";
+      delBtn.title = "Delete plan";
+      delBtn.textContent = "×";
+      delBtn.addEventListener("click", function (e) {
+        e.stopPropagation();
+        if (!delBtn.dataset.confirm) {
+          delBtn.dataset.confirm = "1";
+          delBtn.textContent = "?";
+          setTimeout(function () {
+            delBtn.textContent = "×";
+            delete delBtn.dataset.confirm;
+          }, 2000);
+          return;
+        }
+        fetch("/api/claude-plans/" + encodeURIComponent(plan.slug), { method: "DELETE" })
+          .then(function (r) {
+            if (!r.ok) throw new Error("HTTP " + r.status);
+            removePlan(plan.slug);
+          })
+          .catch(function () {
+            delBtn.textContent = "×";
+            delete delBtn.dataset.confirm;
+            showError("Failed to delete plan. Try again.");
+          });
+      });
+      li.querySelector(".cp-list-row").appendChild(delBtn);
+      els.list.appendChild(li);
+    });
+  }
+
+  function renderDetail() {
+    if (!state.selectedSlug || !state.plans.has(state.selectedSlug)) {
+      els.detailEmpty.style.display = "block";
+      els.detailBody.hidden = true;
+      return;
+    }
+    var plan = state.plans.get(state.selectedSlug);
+    var artifacts = sortedArtifacts(state.selectedSlug);
+
+    els.detailEmpty.style.display = "none";
+    els.detailBody.hidden = false;
+    els.detailTitle.textContent = plan.title;
+    els.detailStatus.textContent = plan.status;
+    els.detailStatus.className = "cp-status-pill cp-status-" + plan.status;
+    els.detailStamp.textContent = "updated " + fmtTime(plan.updated_at);
+    els.artifactCount.textContent = String(artifacts.length);
+
+    var existingPrBadge = document.getElementById("cp-pr-badge");
+    if (existingPrBadge) existingPrBadge.remove();
+    if (plan.pr_url) {
+      var prBadge = document.createElement("a");
+      prBadge.id = "cp-pr-badge";
+      prBadge.className = "cp-pr-badge";
+      prBadge.href = plan.pr_url;
+      prBadge.target = "_blank";
+      prBadge.rel = "noopener noreferrer";
+      prBadge.textContent = plan.pr_title
+        ? "PR #" + plan.pr_number + " — " + plan.pr_title
+        : "PR #" + (plan.pr_number || "");
+      els.detailStamp.insertAdjacentElement("afterend", prBadge);
+    }
+
+    if (plan.content_html) {
+      els.planPanel.innerHTML = window.DOMPurify
+        ? window.DOMPurify.sanitize(plan.content_html)
+        : plan.content_html;
+    } else {
+      renderMarkdown(plan.content_md, els.planPanel);
+    }
+
+    els.artifactsPanel.innerHTML = "";
+    if (artifacts.length === 0) {
+      var empty = document.createElement("div");
+      empty.className = "cp-detail-empty";
+      empty.style.padding = "40px 0";
+      empty.textContent = "No artifacts yet. Call push_artifact or push_diagram from Claude.";
+      els.artifactsPanel.appendChild(empty);
+    } else {
+      artifacts.forEach(function (artifact) {
+        var card = document.createElement("div");
+        card.className = "cp-artifact-card";
+        var head = document.createElement("div");
+        head.className = "cp-artifact-head";
+        var title = document.createElement("span");
+        title.className = "cp-artifact-title";
+        title.textContent = artifact.title;
+        var kind = document.createElement("span");
+        kind.className = "cp-kind-pill";
+        kind.textContent = artifact.kind;
+        head.appendChild(title);
+        head.appendChild(kind);
+        card.appendChild(head);
+
+        var body = document.createElement("div");
+        if (artifact.kind === "mermaid") renderMermaid(artifact.content, body);
+        else renderMarkdown(artifact.content, body);
+        card.appendChild(body);
+        els.artifactsPanel.appendChild(card);
+      });
+    }
+  }
+
+  function setActiveTab(tab) {
+    state.activeTab = tab;
+    els.tabs.forEach(function (btn) {
+      btn.classList.toggle("active", btn.dataset.tab === tab);
+    });
+    els.planPanel.hidden = tab !== "plan";
+    els.artifactsPanel.hidden = tab !== "artifacts";
+  }
+
+  function selectPlan(slug) {
+    state.selectedSlug = slug;
+    renderRail();
+    renderDetail();
+  }
+
+  els.tabs.forEach(function (btn) {
+    btn.addEventListener("click", function () { setActiveTab(btn.dataset.tab); });
+  });
+
+  function upsertPlan(plan) {
+    state.plans.set(plan.slug, plan);
+    renderRail();
+    if (state.selectedSlug === plan.slug) renderDetail();
+  }
+
+  function removePlan(slug) {
+    state.plans.delete(slug);
+    state.artifacts.delete(slug);
+    if (state.selectedSlug === slug) state.selectedSlug = null;
+    renderRail();
+    renderDetail();
+  }
+
+  function upsertArtifact(artifact) {
+    var bucket = state.artifacts.get(artifact.plan_slug);
+    if (!bucket) {
+      bucket = new Map();
+      state.artifacts.set(artifact.plan_slug, bucket);
+    }
+    bucket.set(artifact.slug, artifact);
+    renderRail();
+    if (state.selectedSlug === artifact.plan_slug) renderDetail();
+  }
+
+  function removeArtifact(planSlug, slug) {
+    var bucket = state.artifacts.get(planSlug);
+    if (!bucket) return;
+    bucket.delete(slug);
+    renderRail();
+    if (state.selectedSlug === planSlug) renderDetail();
+  }
+
+  async function loadInitial() {
+    try {
+      var res = await fetch("/api/claude-plans");
+      var data = await res.json();
+      if (data && Array.isArray(data.plans)) {
+        data.plans.forEach(function (p) { state.plans.set(p.slug, p); });
+      }
+      if (data && data.storage) els.storage.textContent = data.storage;
+    } catch (err) {
+      console.warn("[claude-plans] failed to load initial state:", err);
+    }
+    // Preload artifacts for visible plans
+    var slugs = Array.from(state.plans.keys());
+    await Promise.all(slugs.map(function (slug) {
+      return fetch("/api/claude-plans/" + encodeURIComponent(slug))
+        .then(function (r) { return r.json(); })
+        .then(function (data) {
+          if (data && Array.isArray(data.artifacts)) {
+            var bucket = new Map();
+            data.artifacts.forEach(function (a) { bucket.set(a.slug, a); });
+            state.artifacts.set(slug, bucket);
+          }
+        })
+        .catch(function () { /* ignore */ });
+    }));
+    renderRail();
+    if (!state.selectedSlug) {
+      var sorted = sortedPlans();
+      if (sorted.length > 0) selectPlan(sorted[0].slug);
+    }
+  }
+
+  function startStream() {
+    var es = new EventSource("/api/claude-plans/stream");
+    es.addEventListener("plan:upsert", function (e) {
+      try { upsertPlan(JSON.parse(e.data).plan); } catch (_) {}
+    });
+    es.addEventListener("plan:delete", function (e) {
+      try { removePlan(JSON.parse(e.data).slug); } catch (_) {}
+    });
+    es.addEventListener("artifact:upsert", function (e) {
+      try { upsertArtifact(JSON.parse(e.data).artifact); } catch (_) {}
+    });
+    es.addEventListener("artifact:delete", function (e) {
+      try {
+        var payload = JSON.parse(e.data);
+        removeArtifact(payload.plan_slug, payload.slug);
+      } catch (_) {}
+    });
+    es.addEventListener("plan:focus", function (e) {
+      try {
+        var data = JSON.parse(e.data);
+        if (data.slug) {
+          selectPlan(data.slug);
+          var item = els.list.querySelector("[data-slug=\"" + data.slug + "\"]");
+          if (item) item.scrollIntoView({ behavior: "smooth", block: "nearest" });
+        }
+      } catch (_) {}
+    });
+    es.onerror = function () { /* EventSource auto-reconnects */ };
+  }
+
+  document.addEventListener("DOMContentLoaded", function () {
+    setActiveTab("plan");
+    loadInitial().then(startStream);
+  });
+})();

package/public/index.html

@@ -14,6 +14,7 @@
     </div>
     <div class="header-right">
       <button class="btn-refresh" id="refresh-btn" title="Refresh scopes and update sets">Refresh</button>
+      <a class="btn-refresh" href="/claude-plans" title="Claude plans and diagrams pushed via MCP">Claude</a>
       <div class="active-task-chip" id="active-task-chip" style="display:none;"></div>
       <div class="instance-badge" id="instance-badge">Loading...</div>
     </div>

package/public/styles.css

@@ -717,6 +717,11 @@ header h1 span {
   border-color: var(--danger);
 }
 
+.toast.warn {
+  border-color: #c88c2a;
+  color: #e8b86d;
+}
+
 @keyframes slideIn {
   from {
     opacity: 0;
@@ -817,3 +822,24 @@ header h1 span {
   color: var(--text-muted);
   white-space: nowrap;
 }
+
+.recent-edit-dismiss {
+  background: none;
+  border: none;
+  color: var(--text-muted);
+  font-size: 16px;
+  line-height: 1;
+  padding: 0 2px;
+  cursor: pointer;
+  opacity: 0;
+  transition: opacity 0.15s, color 0.15s;
+  flex-shrink: 0;
+}
+
+.recent-edit-row:hover .recent-edit-dismiss {
+  opacity: 1;
+}
+
+.recent-edit-dismiss:hover {
+  color: var(--danger);
+}

package/server.js

@@ -23,6 +23,11 @@ const recentEditsLimiter = RateLimit({
   windowMs: 15 * 60 * 1000,
   max: 100,
 });
+// Rate limiter for claude-plans destructive operations
+const claudePlansLimiter = RateLimit({
+  windowMs: 15 * 60 * 1000,
+  max: 60,
+});
 const SN_PASSWORD = process.env.SN_PASSWORD || "";
 const BASE_URL = `https://${SN_INSTANCE}`;
 
@@ -279,6 +284,7 @@ app.get("/api/recent-edits", recentEditsLimiter, async function (req, res) {
       }
 
       enriched.push({
+        sys_id: edit.sys_id,
         tableName: edit.tableName,
         name: edit.name,
         scope: edit.scope,
@@ -293,6 +299,28 @@ app.get("/api/recent-edits", recentEditsLimiter, async function (req, res) {
   }
 });
 
+// POST /api/recent-edits/dismiss — remove one entry from the local recent edits file
+app.post("/api/recent-edits/dismiss", function (req, res) {
+  try {
+    var sys_id = req.body.sys_id;
+    var tableName = req.body.tableName;
+    if (!sys_id || !tableName) {
+      return res.status(400).json({ error: "sys_id and tableName required" });
+    }
+    var edits = [];
+    if (fs.existsSync(RECENT_EDITS_FILE)) {
+      edits = JSON.parse(fs.readFileSync(RECENT_EDITS_FILE, "utf8"));
+    }
+    var filtered = edits.filter(function (e) {
+      return !(e.sys_id === sys_id && e.tableName === tableName);
+    });
+    fs.writeFileSync(RECENT_EDITS_FILE, JSON.stringify(filtered, null, 2));
+    res.json({ ok: true });
+  } catch (e) {
+    res.status(500).json({ error: e.message });
+  }
+});
+
 // GET /api/update-sets/:scope — list in-progress update sets for a scope
 app.get("/api/update-sets/:scope", async (req, res) => {
   try {
@@ -772,14 +800,244 @@ app.post("/api/clickup/deselect-task", function (req, res) {
   }
 });
 
+// --- Claude Plans Panel ---
+// Reads JSON records written by @tenonhq/dovetail-claude-plans into
+// ~/.dovetail/claude-plans/ and streams updates to the /claude-plans page.
+// Storage layout:
+//   <root>/<plan-slug>.json
+//   <root>/<plan-slug>/artifacts/<artifact-slug>.json
+const os = require("os");
+const chokidar = require("chokidar");
+
+const CLAUDE_PLANS_DIR =
+  process.env.DOVE_CLAUDE_PLANS_DIR ||
+  path.join(os.homedir(), ".dovetail", "claude-plans");
+
+// Slugs are written by @tenonhq/dovetail-claude-plans' slugify() — kebab-case,
+// max 64 chars. We re-validate on the read side so a request like `..%2Ffoo`
+// cannot escape CLAUDE_PLANS_DIR via path.join.
+const CLAUDE_PLAN_SLUG = /^[a-z0-9][a-z0-9-]{0,63}$/;
+
+function isValidSlug(slug) {
+  return typeof slug === "string" && CLAUDE_PLAN_SLUG.test(slug);
+}
+
+function planFilePath(slug) {
+  return path.join(CLAUDE_PLANS_DIR, slug + ".json");
+}
+
+function artifactsDirFor(slug) {
+  return path.join(CLAUDE_PLANS_DIR, slug, "artifacts");
+}
+
+function safeReadJson(filePath) {
+  try {
+    if (!fs.existsSync(filePath)) return null;
+    return JSON.parse(fs.readFileSync(filePath, "utf8"));
+  } catch (e) {
+    return null;
+  }
+}
+
+function listClaudePlans() {
+  if (!fs.existsSync(CLAUDE_PLANS_DIR)) return [];
+  const entries = fs.readdirSync(CLAUDE_PLANS_DIR);
+  const plans = [];
+  for (let i = 0; i < entries.length; i++) {
+    const name = entries[i];
+    if (!name.endsWith(".json")) continue;
+    const plan = safeReadJson(path.join(CLAUDE_PLANS_DIR, name));
+    if (plan) plans.push(plan);
+  }
+  plans.sort(function (a, b) {
+    return (b.updated_at || "").localeCompare(a.updated_at || "");
+  });
+  return plans;
+}
+
+function listClaudeArtifacts(slug) {
+  if (!isValidSlug(slug)) return [];
+  const dir = artifactsDirFor(slug);
+  if (!fs.existsSync(dir)) return [];
+  const entries = fs.readdirSync(dir);
+  const artifacts = [];
+  for (let i = 0; i < entries.length; i++) {
+    if (!entries[i].endsWith(".json")) continue;
+    const a = safeReadJson(path.join(dir, entries[i]));
+    if (a) artifacts.push(a);
+  }
+  artifacts.sort(function (a, b) {
+    return (a.created_at || "").localeCompare(b.created_at || "");
+  });
+  return artifacts;
+}
+
+// Parse a watcher path like "<root>/<slug>.json" or
+// "<root>/<slug>/artifacts/<artifact-slug>.json" into { kind, slug, artifactSlug }.
+function classifyPath(filePath) {
+  const rel = path.relative(CLAUDE_PLANS_DIR, filePath);
+  if (!rel || rel.startsWith("..")) return null;
+  const parts = rel.split(path.sep);
+  if (parts.length === 1 && parts[0] === ".focus") {
+    return { kind: "focus" };
+  }
+  if (parts.length === 1 && parts[0].endsWith(".json")) {
+    return { kind: "plan", slug: parts[0].slice(0, -5) };
+  }
+  if (parts.length === 3 && parts[1] === "artifacts" && parts[2].endsWith(".json")) {
+    return { kind: "artifact", slug: parts[0], artifactSlug: parts[2].slice(0, -5) };
+  }
+  return null;
+}
+
+// SSE fan-out. Each connected client is a response object held open until the
+// client disconnects; broadcastClaudePlanEvent writes a single SSE frame to all.
+const claudePlanSseClients = new Set();
+
+function broadcastClaudePlanEvent(event, data) {
+  const frame = "event: " + event + "\ndata: " + JSON.stringify(data) + "\n\n";
+  for (const res of claudePlanSseClients) {
+    try {
+      res.write(frame);
+    } catch (err) {
+      claudePlanSseClients.delete(res);
+    }
+  }
+}
+
+function handleWatcherChange(event, filePath) {
+  const info = classifyPath(filePath);
+  if (!info) return;
+  if (info.kind === "focus") {
+    const focus = safeReadJson(filePath);
+    if (focus && isValidSlug(focus.slug)) {
+      broadcastClaudePlanEvent("plan:focus", { slug: focus.slug });
+    }
+    return;
+  }
+  if (info.kind === "plan") {
+    if (event === "unlink") {
+      broadcastClaudePlanEvent("plan:delete", { slug: info.slug });
+      return;
+    }
+    const plan = safeReadJson(filePath);
+    if (plan) broadcastClaudePlanEvent("plan:upsert", { plan: plan });
+    return;
+  }
+  if (info.kind === "artifact") {
+    if (event === "unlink") {
+      broadcastClaudePlanEvent("artifact:delete", {
+        plan_slug: info.slug,
+        slug: info.artifactSlug
+      });
+      return;
+    }
+    const artifact = safeReadJson(filePath);
+    if (artifact) broadcastClaudePlanEvent("artifact:upsert", { artifact: artifact });
+  }
+}
+
+// Start the watcher lazily — create the storage dir if missing so chokidar has
+// something to watch. ignoreInitial avoids replaying every file on boot
+// (clients fetch initial state via GET /api/claude-plans).
+let claudePlanWatcher = null;
+function startClaudePlanWatcher() {
+  if (claudePlanWatcher) return;
+  try {
+    fs.mkdirSync(CLAUDE_PLANS_DIR, { recursive: true });
+  } catch (err) {
+    console.warn("[claude-plans] could not create storage dir:", err.message);
+  }
+  claudePlanWatcher = chokidar.watch(CLAUDE_PLANS_DIR, {
+    ignoreInitial: true,
+    awaitWriteFinish: { stabilityThreshold: 50, pollInterval: 25 },
+    depth: 3
+  });
+  claudePlanWatcher.on("add", function (p) { handleWatcherChange("add", p); });
+  claudePlanWatcher.on("change", function (p) { handleWatcherChange("change", p); });
+  claudePlanWatcher.on("unlink", function (p) { handleWatcherChange("unlink", p); });
+}
+
+app.get("/claude-plans", function (req, res) {
+  res.sendFile(path.join(__dirname, "public", "claude-plans.html"));
+});
+
+app.get("/api/claude-plans", function (req, res) {
+  try {
+    res.json({ plans: listClaudePlans(), storage: CLAUDE_PLANS_DIR });
+  } catch (e) {
+    res.status(500).json({ error: e.message });
+  }
+});
+
+app.get("/api/claude-plans/stream", function (req, res) {
+  res.set({
+    "Content-Type": "text/event-stream",
+    "Cache-Control": "no-cache",
+    Connection: "keep-alive",
+    "X-Accel-Buffering": "no"
+  });
+  res.flushHeaders();
+  res.write("event: hello\ndata: {}\n\n");
+  claudePlanSseClients.add(res);
+
+  const heartbeat = setInterval(function () {
+    try {
+      res.write(": heartbeat\n\n");
+    } catch (err) {
+      clearInterval(heartbeat);
+      claudePlanSseClients.delete(res);
+    }
+  }, 25000);
+
+  req.on("close", function () {
+    clearInterval(heartbeat);
+    claudePlanSseClients.delete(res);
+  });
+});
+
+// :slug must avoid the static "stream" route above; Express matches in order.
+app.get("/api/claude-plans/:slug", function (req, res) {
+  try {
+    const slug = req.params.slug;
+    if (!isValidSlug(slug)) return res.status(400).json({ error: "invalid slug" });
+    const plan = safeReadJson(planFilePath(slug));
+    if (!plan) return res.status(404).json({ error: "plan not found" });
+    res.json({ plan: plan, artifacts: listClaudeArtifacts(slug) });
+  } catch (e) {
+    res.status(500).json({ error: e.message });
+  }
+});
+
+app.delete("/api/claude-plans/:slug", claudePlansLimiter, function (req, res) {
+  try {
+    var slug = req.params.slug;
+    if (!isValidSlug(slug)) return res.status(400).json({ error: "invalid slug" });
+    var baseDir = path.resolve(CLAUDE_PLANS_DIR);
+    var planFile = path.resolve(baseDir, slug + ".json");
+    if (!planFile.startsWith(baseDir + path.sep)) return res.status(400).json({ error: "invalid slug" });
+    if (!fs.existsSync(planFile)) return res.status(404).json({ error: "plan not found" });
+    fs.unlinkSync(planFile);
+    var artifactsDir = path.resolve(baseDir, slug);
+    if (artifactsDir.startsWith(baseDir + path.sep) && fs.existsSync(artifactsDir)) {
+      fs.rmSync(artifactsDir, { recursive: true, force: true });
+    }
+    res.json({ deleted: true });
+  } catch (e) {
+    res.status(500).json({ error: e.message });
+  }
+});
+
 // Only start the server when run directly (not when require()-d).
 // Callers like dashboardCommand.ts and allScopesCommands.ts use
 // spawn("node", [serverPath]) which sets require.main === module.
 if (require.main === module) {
+  startClaudePlanWatcher();
   app.listen(PORT, "127.0.0.1", function () {
     console.log("\n  Dovetail Update Set Dashboard");
     console.log("  Instance:  " + SN_INSTANCE);
     console.log("  Project:   " + PROJECT_ROOT);
-    console.log("  Dashboard: http://localhost:" + PORT + "\n");
+    console.log("  Dashboard: http://localhost:" + PORT);
+    console.log("  Claude:    http://localhost:" + PORT + "/claude-plans\n");
   });
 }