// app.js — Polling-basierter Dashboard-Reducer (Forge v2.1, Files-First Layout). // Polling-Strategie: // /api/current-run alle 2s — Hero-Section (Files + Plan + Status) // /api/status alle 2s — Now + Timeline (collapsible) // /api/reports alle 10s — Reports-Liste // /api/health alle 5s — mint dev pill const POLL_FAST_MS = 2000; const POLL_REPORTS_MS = 10000; const HEALTH_MS = 5000; const EVENT_LABEL = { start: { marker: "▶", label: "START" }, progress: { marker: "…", label: "PROGRESS" }, complete: { marker: "✓", label: "DONE" }, error: { marker: "✗", label: "ERROR" }, veto: { marker: "⛔", label: "VETO" }, warning: { marker: "⚠", label: "WARN" }, tool_complete: { marker: "·", label: "TOOL" }, tool_error: { marker: "·", label: "TOOL!" }, "drift-detected": { marker: "!", label: "DRIFT" }, "curator-decision": { marker: "✎", label: "CURATOR" }, "report-ready": { marker: "📄", label: "REPORT" }, "changelog-parsed": { marker: "📜", label: "CHGLOG" }, }; const STEP_GLYPH = { active: "▸", done: "✓", error: "✗", blocked: "⛔", skipped: "⏭", pending: "◯", }; // ────────────────── State ────────────────── const state = { events: [], // letzte 200 Events aus /api/status activeAgents: new Map(), cachedPages: [], currentRun: null, // Forge v2.3 diffsByPath: new Map(), // path -> { stat, hunks, full } | null (loading) commentsByPath: new Map(), // path -> string (current input) commentsLoadedFor: null, // trace_id für das comments aktuell geladen sind commentSaveTimers: new Map(), // path -> setTimeout-id commentSaveStatus: new Map(), // path -> "saving" | "saved" | "error" inputFolders: null, pendingReviews: null, // Forge v2.8 audit-fix F11 loopBusy: false, // Forge v2.5 relatedByPath: new Map(), // path -> { available, results: [{path,title,score}] } | null (loading) reviewedPaths: new Set(), // pro-File "angeschaut, OK"-Marker (per Trace lokal) pathSearch: "", // Substring-Filter aus dem Path-Search-Feld // Forge v2.6 pageReviewByPath: new Map(), // path -> { verdict, summary, watch_for, frontmatter, available } | null (loading) // Forge v2.8 planFile: null, // { available, filename, mtime, content, truncated } | null }; // ────────────────── Utils ────────────────── function escapeHtml(s) { return String(s ?? "") .replace(/&/g, "&") .replace(//g, ">") .replace(/"/g, """) .replace(/'/g, "'"); } function fmtTime(iso) { if (!iso) return "—"; return iso.slice(11, 19); } function setStatusPill(id, state, label) { const el = document.getElementById(id); if (!el) return; el.dataset.state = state; if (id === "status-poll") { const lbl = document.getElementById("status-poll-label"); if (lbl) lbl.textContent = label; } } // ────────────────── Status-JSONL Reducer (Live-Stream) ────────────────── function applyEvent(ev) { state.events.push(ev); if (state.events.length > 200) state.events.shift(); const trace = ev.trace_id || "no-trace"; const agent = ev.agent_id || "unknown"; const key = `${trace}::${agent}`; const evType = ev.event_type; if (evType === "start" || evType === "progress") { const a = state.activeAgents.get(key) || {}; state.activeAgents.set(key, { agent, trace, startTs: a.startTs || ev.ts, lastTs: ev.ts, lastEvent: evType, lastMessage: ev.message || a.lastMessage || "", phase: ev.phase || a.phase || "", }); } else if (["complete", "error", "veto"].includes(evType)) { state.activeAgents.delete(key); } } function fmtElapsed(startIso) { if (!startIso) return ""; try { const sec = Math.max(0, (Date.now() - new Date(startIso).getTime()) / 1000); if (sec < 60) return `${sec.toFixed(0)}s`; if (sec < 3600) return `${(sec / 60).toFixed(1)}min`; return `${(sec / 3600).toFixed(1)}h`; } catch (_) { return ""; } } function renderNow() { const el = document.getElementById("now-list"); if (!el) return; const active = Array.from(state.activeAgents.values()) .sort((a, b) => (a.lastTs > b.lastTs ? -1 : 1)); if (active.length === 0) { el.innerHTML = `

Keine aktiven Agents.

`; return; } el.innerHTML = active.map((a) => { const lbl = EVENT_LABEL[a.lastEvent] || { marker: "·" }; return `

${lbl.marker} ${escapeHtml(a.agent)} ${escapeHtml(a.phase)} · ${fmtElapsed(a.startTs)} ${a.lastMessage ? `${escapeHtml(a.lastMessage)}` : ""}

`; }).join(""); } function renderTimeline() { const el = document.getElementById("timeline-list"); if (!el) return; if (state.events.length === 0) { el.innerHTML = `

Noch keine Events.

`; return; } const last = state.events.slice(-50).reverse(); el.innerHTML = last.map((ev) => { const lbl = EVENT_LABEL[ev.event_type] || { marker: "·" }; return `

${fmtTime(ev.ts)} ${lbl.marker} ${escapeHtml(ev.agent_id)} · ${escapeHtml((ev.message || "").slice(0, 100))}

`; }).join(""); } // ────────────────── HERO: Current Run ────────────────── let filesFilter = "all"; function renderHero() { const run = state.currentRun; const slugEl = document.getElementById("hero-slug"); const statusEl = document.getElementById("hero-status"); const metaEl = document.getElementById("hero-meta"); const filesCountEl = document.getElementById("files-count"); const filesEl = document.getElementById("files-list"); if (!run) { slugEl.textContent = "Lade…"; return; } // Header if (run.slug) { slugEl.textContent = run.slug; } else { slugEl.textContent = "Idle · kein laufender Run"; } statusEl.textContent = run.status; statusEl.dataset.status = run.status; const traceShort = run.trace_id ? run.trace_id.slice(0, 8) : "—"; const metaParts = []; metaParts.push(`${escapeHtml(traceShort)}`); if (run.events_count) metaParts.push(`${run.events_count} events`); if (run.new_count) metaParts.push(`${run.new_count} NEW`); if (run.edit_count) metaParts.push(`${run.edit_count} EDIT`); if (run.delete_count) metaParts.push(`${run.delete_count} DEL`); // Forge v2.5 (Track E #4): Comment-Counter im Header spiegeln const commentCount = getNonEmptyCommentsCount(); const reviewedCount = state.reviewedPaths.size; const filesTotal = run.files_total || 0; if (filesTotal > 0) { const cntCls = commentCount > 0 ? "meta-pill meta-pill-comments" : "meta-pill meta-pill-comments-zero"; metaParts.push(`💬 ${commentCount} / ${filesTotal}`); if (reviewedCount > 0) { metaParts.push(`✓ ${reviewedCount} reviewed`); } } metaEl.innerHTML = metaParts.join(" · "); // Forge v2.5 (Track E #12): Sub-Title-Zeile mit Run-Stats const substatsEl = document.getElementById("hero-substats"); if (substatsEl) { const stats = []; if (run.trace_id) stats.push(`Trace ${escapeHtml(run.trace_id)}`); if (run.events_count) stats.push(`${run.events_count} events`); if (filesTotal) { const breakdown = [ run.new_count ? `${run.new_count} NEW` : null, run.edit_count ? `${run.edit_count} EDIT` : null, run.delete_count ? `${run.delete_count} DEL` : null, ].filter(Boolean).join(", "); stats.push(`${filesTotal} files${breakdown ? ` (${breakdown})` : ""}`); } if (run.duration_human) stats.push(`Dauer ${escapeHtml(run.duration_human)}`); if (run.status) stats.push(`Status ${escapeHtml(run.status)}`); substatsEl.innerHTML = stats.length ? stats.join(" · ") : ""; } // Files-Count filesCountEl.textContent = run.files_total; // Files-List if (!run.files || run.files.length === 0) { filesEl.innerHTML = `

Keine uncommitted Änderungen — git diff --name-status HEAD ist leer.

`; return; } const search = (state.pathSearch || "").trim().toLowerCase(); const visible = run.files.filter((f) => { if (filesFilter === "mintlify" && !f.is_mintlify) return false; if (filesFilter === "new" && f.change_kind !== "new") return false; if (filesFilter === "edit" && f.change_kind !== "edit") return false; if (filesFilter === "api" && !f.is_api) return false; if (filesFilter === "open") { // "offen" = weder reviewed noch kommentiert const hasComment = (state.commentsByPath.get(f.path) || "").trim().length > 0; const isReviewed = state.reviewedPaths.has(f.path); if (hasComment || isReviewed) return false; } if (search && !f.path.toLowerCase().includes(search)) return false; return true; }); const counterEl = document.getElementById("files-counter"); if (counterEl) { if (search || filesFilter !== "all") { counterEl.textContent = `${visible.length} / ${run.files.length} sichtbar`; } else { counterEl.textContent = ""; } } if (visible.length === 0) { filesEl.innerHTML = `

Keine Files mit aktuellem Filter.

`; return; } filesEl.innerHTML = visible.map((f) => { const tags = [ `${escapeHtml(f.change_kind.toUpperCase())}`, ]; if (f.is_mintlify) tags.push(`MDX`); if (f.is_api) tags.push(`API`); const actions = []; if (f.mint_url) { actions.push(`▶ mint dev`); } actions.push(``); const why = f.why ? `

${escapeHtml(f.why)}

` : ""; const agentLine = (f.agent && f.agent !== "unknown") ? `Agent ${escapeHtml(f.agent)}` : ""; // Forge v2.3: Diff + Comment slots (lazily populated) const pathAttr = escapeHtml(f.path); const cachedDiff = state.diffsByPath.get(f.path); const diffMarkup = renderDiffBlock(cachedDiff); const cachedComment = state.commentsByPath.get(f.path) || ""; // Forge v2.5 (Track E #8): Reviewed-Toggle const isReviewed = state.reviewedPaths.has(f.path); const reviewedAttr = isReviewed ? ' data-reviewed="true"' : ""; // Forge v2.6: Page-Review (LLM-Prosa) als Haupt-Section, Diff in Collapse const cachedReview = state.pageReviewByPath.get(f.path); const pageReviewMarkup = renderPageReviewBlock(cachedReview); return `

${tags.join("")}

`${pathAttr}`

${agentLine ? `

${agentLine}

` : ""} ${why}

${pageReviewMarkup}

▸ Roh-Diff zeigen

${diffMarkup}

Kommentar

${actions.join("")}

`; }).join(""); // Copy-Button-Handler filesEl.querySelectorAll(".btn-copy").forEach((btn) => { btn.addEventListener("click", () => { const path = btn.dataset.path; navigator.clipboard?.writeText(path).then(() => { const orig = btn.textContent; btn.textContent = "✓"; setTimeout(() => { btn.textContent = orig; }, 1200); }); }); }); // Forge v2.5 (Track E #8): Reviewed-Toggle-Handler filesEl.querySelectorAll(".btn-reviewed").forEach((btn) => { btn.addEventListener("click", () => { const path = btn.dataset.path; if (state.reviewedPaths.has(path)) { state.reviewedPaths.delete(path); } else { state.reviewedPaths.add(path); } // Re-render hero (für Header-Counter + reviewed-Style) renderHero(); }); }); // Forge v2.3: Lazy-Diff-Loader für jede File-Card visible.forEach((f) => { if (!state.diffsByPath.has(f.path)) { loadFileDiff(f.path); } }); // Forge v2.5: Lazy-Related-Loader (nur für .mdx-Files, embeddings-only) visible.forEach((f) => { if (!f.is_mintlify) return; if (!state.relatedByPath.has(f.path)) { loadRelatedPages(f.path); } }); // Forge v2.6 + v2.8: Lazy-PageReview-Loader (max 6 in-flight, da Cache-Hits günstig sind) const PAGE_REVIEW_INITIAL_PARALLEL = 6; const reviewQueue = visible.filter(f => f.is_mintlify && !state.pageReviewByPath.has(f.path)); reviewQueue.slice(0, PAGE_REVIEW_INITIAL_PARALLEL).forEach(f => loadPageReview(f.path)); // Rest: triggern wenn die ersten fertig sind (in loadPageReview) state._pageReviewQueue = reviewQueue.slice(PAGE_REVIEW_INITIAL_PARALLEL).map(f => f.path); // Forge v2.3: Comment-Input-Handler (autosave debounce) filesEl.querySelectorAll(".comment-input").forEach((ta) => { ta.addEventListener("input", () => onCommentInput(ta)); ta.addEventListener("blur", () => flushCommentSave(ta.dataset.path)); }); // Forge v2.8 audit-fix F13: Per-File-Verdict-Buttons filesEl.querySelectorAll(".verdict-btn").forEach((btn) => { btn.addEventListener("click", (ev) => { ev.stopPropagation(); onVerdictClick(btn); }); }); // Forge v2.3: Diff-Expand-Handler filesEl.querySelectorAll(".diff-expand-btn").forEach((btn) => { btn.addEventListener("click", (ev) => { ev.stopPropagation(); const slot = btn.closest(".file-diff-slot"); slot?.classList.toggle("expanded"); btn.textContent = slot?.classList.contains("expanded") ? "▴ Diff zuklappen" : "▾ Vollständigen Diff zeigen"; }); }); // Forge v2.3: Footer-Button updaten updateFooterButton(); } function renderPlan() { const el = document.getElementById("plan-view"); const cntEl = document.getElementById("plan-count"); const plan = state.currentRun?.plan; if (!plan) { // Forge v2.8 Fallback: zeige das neueste Claude-Code-Plan-File aus ~/.claude/plans/ return renderPlanFileFallback(el, cntEl); } const total = plan.total_steps || plan.steps.length; const done = plan.done_count; const pct = total > 0 ? Math.round((done / total) * 100) : 0; cntEl.textContent = `${done}/${total} · ${pct}%`; const stepsHtml = plan.steps.map((s) => { const glyph = STEP_GLYPH[s.status] || "◯"; const meta = s._placeholder ? '(noch nicht emittiert)' : (s.event_count ? `${s.event_count} events` : ''); return `

${glyph}

${s.step_order || "?"}. ${escapeHtml(s.step_name)}

${meta}

`; }).join(""); el.innerHTML = `

${escapeHtml(plan.plan_title)}

${stepsHtml || `

Keine Steps emittiert.

`; } // Forge v2.8: Plan-File-Fallback — rendert den Inhalt des jüngsten // Claude-Code-Plan-Files aus ~/.claude/plans/ als rohes Markdown. function renderPlanFileFallback(el, cntEl) { const pf = state.planFile; if (!pf || !pf.available) { cntEl.textContent = ""; el.innerHTML = `

Kein aktiver Plan.
(${pf?.error ? escapeHtml(pf.error) : "Plan-Files liegen in ~/.claude/plans/"})

`; return; } const mtimeShort = (pf.mtime || "").replace("T", " ").replace(/\.\d+/, "").slice(0, 19); cntEl.textContent = `${pf.filename || ""} · ${mtimeShort}`; // Markdown-Renderung: simple Heuristik (Headings + Bullet-Lines). Keine externe Library. const lines = (pf.content || "").split("\n"); const out = []; let inList = false; let inCode = false; for (const raw of lines) { if (raw.startsWith("```")) { if (inCode) { out.push(""); inCode = false; } else { out.push("

"); inCode = true; }
      continue;
    }
    if (inCode) { out.push(escapeHtml(raw)); continue; }
    const line = raw;
    const h = line.match(/^(#{1,6})\s+(.+)$/);
    if (h) {
      if (inList) { out.push(""); inList = false; }
      const lvl = Math.min(h[1].length + 2, 6);
      out.push(`${escapeHtml(h[2])}`);
      continue;
    }
    const b = line.match(/^[\s]*[-*]\s+(.+)$/);
    if (b) {
      if (!inList) { out.push(""); inList = true; }
      out.push(`${escapeHtml(b[1])}`);
      continue;
    }
    if (line.trim() === "") {
      if (inList) { out.push(""); inList = false; }
      out.push("");
      continue;
    }
    out.push(`${escapeHtml(line)}`);
  }
  if (inList) out.push("");
  if (inCode) out.push("

"); const truncatedHint = pf.truncated ? `

(gekürzt auf 200 KB)

` : ""; el.innerHTML = `

📄 ~/.claude/plans/${escapeHtml(pf.filename)} · ${pf.total_files} Plan-Files gesamt

${out.join("\n")}

${truncatedHint}

`; } // ────────────────── Reports-Index ────────────────── let reportsCache = []; let reportsFilter = "all"; function renderReports() { const el = document.getElementById("reports-list"); const visible = reportsCache.filter((r) => reportsFilter === "all" ? true : r.status === reportsFilter ); if (visible.length === 0) { el.innerHTML = `

Keine Reports.

`; return; } el.innerHTML = visible.map((r) => { const date = (r.start_ts || "").slice(0, 10); return `

${escapeHtml(r.slug)}

${escapeHtml(r.status)}

${escapeHtml(date)} · ${escapeHtml(r.duration_min)}min

${escapeHtml(r.folder)}

${r.files_total} files ${r.new_files ? `${r.new_files} new` : ""} ${r.edit_files ? `${r.edit_files} edit` : ""} ${r.drifts ? `${r.drifts} drifts` : ""} ${r.kb_updates ? `${r.kb_updates} KB` : ""}

`; }).join(""); } // ────────────────── Polling ────────────────── async function pollCurrentRun() { try { const resp = await fetch("/api/current-run", { cache: "no-store" }); if (!resp.ok) throw new Error(`current-run ${resp.status}`); const newRun = await resp.json(); const traceChanged = state.currentRun?.trace_id !== newRun.trace_id; state.currentRun = newRun; if (traceChanged) { // Forge v2.3: Bei Trace-Wechsel comments + diffs neu laden state.commentsLoadedFor = null; state.diffsByPath.clear(); state.commentsByPath.clear(); state.relatedByPath.clear(); state.reviewedPaths.clear(); state.pageReviewByPath.clear(); state._pageReviewQueue = []; loadCommentsForCurrentRun(); } renderHero(); renderPlan(); setStatusPill("status-poll", "ok", "live"); } catch (err) { setStatusPill("status-poll", "off", "offline"); } } async function pollStatus() { try { const resp = await fetch("/api/status", { cache: "no-store" }); if (!resp.ok) return; const text = await resp.text(); state.events = []; state.activeAgents.clear(); for (const line of text.split("\n")) { const t = line.trim(); if (!t) continue; try { applyEvent(JSON.parse(t)); } catch (_) {} } renderNow(); renderTimeline(); } catch (_) {} } async function pollReports() { try { const resp = await fetch("/api/reports", { cache: "no-store" }); if (!resp.ok) return; reportsCache = await resp.json(); renderReports(); } catch (_) {} } async function pollHealth() { try { const resp = await fetch("/api/health", { cache: "no-store" }); if (!resp.ok) return; const data = await resp.json(); setStatusPill("status-mint", data.mint_dev_running ? "ok" : "off", "mint dev"); } catch (_) { setStatusPill("status-mint", "off", "mint dev"); } } async function pollInputFolders() { try { const resp = await fetch("/api/input-folders", { cache: "no-store" }); if (!resp.ok) return; state.inputFolders = await resp.json(); renderInputFolders(); } catch (_) {} } // Forge v2.8 audit-fix F11: Pending-Reviews-Hub async function pollPendingReviews() { try { const resp = await fetch("/api/pending-reviews", { cache: "no-store" }); if (!resp.ok) return; state.pendingReviews = await resp.json(); renderPendingReviews(); } catch (_) {} } // Forge v2.8: Plan-File-Loader (liest ~/.claude/plans/*.md neuestes) async function pollPlanFile() { try { const resp = await fetch("/api/plan-file", { cache: "no-store" }); if (!resp.ok) return; const data = await resp.json(); const prevMtime = state.planFile?.mtime || ""; state.planFile = data; // Re-render Plan-Pane wenn sich was geändert hat (mtime oder availability) if (data.mtime !== prevMtime || data.available !== (state.planFile && state.planFile.available)) { renderPlan(); } } catch (_) {} } // ────────────────── Forge v2.3: Diff-Loader ────────────────── async function loadFileDiff(path) { state.diffsByPath.set(path, null); // loading-Marker try { const encoded = encodeURIComponent(path); const resp = await fetch(`/api/file-diff/${encoded}`, { cache: "no-store" }); if (!resp.ok) { state.diffsByPath.delete(path); return; } const data = await resp.json(); state.diffsByPath.set(path, data); // Re-render nur den entsprechenden Slot const slot = document.querySelector(`.file-diff-slot[data-path="${cssQuoteAttr(path)}"]`); if (slot) { slot.innerHTML = renderDiffBlock(data); // Re-bind expand-button für diesen Slot const btn = slot.querySelector(".diff-expand-btn"); if (btn) { btn.addEventListener("click", (ev) => { ev.stopPropagation(); slot.classList.toggle("expanded"); btn.textContent = slot.classList.contains("expanded") ? "▴ Diff zuklappen" : "▾ Vollständigen Diff zeigen"; }); } } } catch (_) { state.diffsByPath.delete(path); } } function renderDiffBlock(diff) { if (diff === null || diff === undefined) { return `

lade Diff…

`; } if (!diff.hunks || diff.hunks.length === 0) { return `

kein Diff verfügbar (NEW-File ohne Vorgänger oder bereits gestaged)

`; } const stat = `+${diff.stat.added} / −${diff.stat.removed}`; // Forge v2.3.1 + v2.4: Semantik-Bullets prominent + LLM-Source-Tag const summary = Array.isArray(diff.summary) ? diff.summary : []; const sourceTag = diff.summary_source === "llm" ? `🧠 LLM` : `⚙ heuristik`; const summaryHtml = summary.length > 0 ? `

${escapeHtml(b)}
${sourceTag}

` : `

Keine semantische Klassifikation — schau im Diff nach. ${sourceTag}

`; // Full diff (für expand) const fullEscaped = escapeHtml(diff.full || "").split("\n").map((line) => { const cls = line.startsWith("+") && !line.startsWith("+++") ? "diff-line-add" : line.startsWith("-") && !line.startsWith("---") ? "diff-line-del" : line.startsWith("@@") ? "diff-line-hunk" : "diff-line-ctx"; return `${line}`; }).join("\n"); return `

${stat}· ${diff.hunks.length} Hunk(s)

${summaryHtml}

${fullEscaped}

`; } // ────────────────── Forge v2.5: Related-Pages Loader ────────────────── async function loadRelatedPages(path) { state.relatedByPath.set(path, null); // loading-Marker // embeddings-Index nutzt docs.json-Pfad-Form (ohne .mdx-Suffix) const queryKey = path.endsWith(".mdx") ? path.slice(0, -4) : path; try { const encoded = encodeURIComponent(queryKey); const resp = await fetch(`/api/related/${encoded}?k=3`, { cache: "no-store" }); if (!resp.ok) { state.relatedByPath.set(path, { available: false, results: [] }); return; } const data = await resp.json(); state.relatedByPath.set(path, data); const slot = document.querySelector(`.file-related-slot[data-path="${cssQuoteAttr(path)}"]`); if (slot) { slot.innerHTML = renderRelatedBlock(data); } } catch (_) { state.relatedByPath.set(path, { available: false, results: [] }); } } function renderRelatedBlock(data) { if (data === null || data === undefined) { return ``; } if (!data.available) { return ``; // graceful skip wenn embeddings-Layer nicht aktiv } const results = Array.isArray(data.results) ? data.results : []; if (results.length === 0) { return ``; } const items = results.map((r) => { const score = (typeof r.score === "number") ? r.score.toFixed(2) : "?"; const title = r.title || r.path; return `

`; }).join(""); return ` `; } // ────────────────── Forge v2.6 + v2.8: Page-Review-Loader ────────────────── // v2.8: 8s-Client-Timeout, Polling bei 202-Response, persistenter Loading-State. const PAGE_REVIEW_FETCH_TIMEOUT_MS = 8000; const PAGE_REVIEW_POLL_INTERVAL_MS = 5000; const PAGE_REVIEW_POLL_MAX_ATTEMPTS = 12; // → ~60s Gesamt-Polling-Zeitraum function _setLoadingPlaceholder(path, message) { // Setzt nicht den Map-Slot (sonst würde Re-Trigger blockieren), // sondern rendert nur den Slot mit Custom-Loading-Message. const slot = document.querySelector(`.file-page-review-slot[data-path="${cssQuoteAttr(path)}"]`); if (slot) { slot.innerHTML = `

${escapeHtml(message)}

`; } } function _drainPageReviewQueue() { const queue = state._pageReviewQueue || []; if (queue.length > 0) { const nextPath = queue.shift(); state._pageReviewQueue = queue; if (!state.pageReviewByPath.has(nextPath)) { loadPageReview(nextPath); } } } async function _fetchPageReviewOnce(path, signal) { const encoded = encodeURIComponent(path); const resp = await fetch(`/api/page-review/${encoded}`, { cache: "no-store", signal }); if (!resp.ok && resp.status !== 202) { throw new Error(`HTTP ${resp.status}`); } const data = await resp.json(); return { status: resp.status, data }; } async function _pollPageReview(path, attemptsLeft) { if (attemptsLeft <= 0) { // Polling-Limit erreicht → Fallback ohne Map-Eintrag, damit nächstes Render re-triggert _setLoadingPlaceholder(path, "⚠ Page-Review-Generierung läuft länger als erwartet — beim nächsten Refresh ist sie vermutlich fertig."); _drainPageReviewQueue(); return; } const ctrl = new AbortController(); const timer = setTimeout(() => ctrl.abort(), PAGE_REVIEW_FETCH_TIMEOUT_MS); try { const { status, data } = await _fetchPageReviewOnce(path, ctrl.signal); clearTimeout(timer); if (status === 202) { _setLoadingPlaceholder(path, "⟳ Page-Review wird im Hintergrund erstellt…"); setTimeout(() => _pollPageReview(path, attemptsLeft - 1), PAGE_REVIEW_POLL_INTERVAL_MS); return; } // 200 + Daten state.pageReviewByPath.set(path, data); const slot = document.querySelector(`.file-page-review-slot[data-path="${cssQuoteAttr(path)}"]`); if (slot) { slot.innerHTML = renderPageReviewBlock(data); } updateVerdictCounters(); _drainPageReviewQueue(); } catch (err) { clearTimeout(timer); const isTimeout = err && err.name === "AbortError"; _setLoadingPlaceholder(path, isTimeout ? "⏱ Anfrage dauerte zu lange — Generierung läuft im Hintergrund weiter." : "⚠ Netzwerk-Fehler — wird automatisch erneut versucht.", ); setTimeout(() => _pollPageReview(path, attemptsLeft - 1), PAGE_REVIEW_POLL_INTERVAL_MS); } } async function loadPageReview(path) { // Persistenter Loading-Marker damit Re-Render nicht doppelt fetched state.pageReviewByPath.set(path, null); _setLoadingPlaceholder(path, "⟳ Page-Review wird geladen…"); await _pollPageReview(path, PAGE_REVIEW_POLL_MAX_ATTEMPTS); } function renderPageReviewBlock(data) { if (data === null || data === undefined) { return `

⟳ Page-Review wird geladen…

`; } const verdict = data.verdict || "needs-review"; const verdictMeta = { "looks-good": { icon: "✓", label: "Looks good" }, "needs-review": { icon: "⚠", label: "Needs review" }, "flag-blocker": { icon: "⛔", label: "Blocker" }, }[verdict] || { icon: "?", label: verdict }; const cachedTag = data.cached ? `⚡ cached` : ""; const availableWarn = data.available === false ? `⚙ heuristik` : `🧠 LLM`; const watchFor = Array.isArray(data.watch_for) ? data.watch_for : []; const watchHtml = watchFor.length > 0 ? `

Worauf achten:

${escapeHtml(w)}

` : ""; const summary = data.summary ? escapeHtml(data.summary) : "(keine Zusammenfassung)"; return `

${escapeHtml(verdictMeta.icon)} ${escapeHtml(verdictMeta.label)} ${availableWarn}${cachedTag}

${summary}

${watchHtml}

`; } function updateVerdictCounters() { // optional Hook for hero-header counts; aktuell no-op (Future-Proofing) } // ────────────────── Forge v2.3: Comments Sync ────────────────── async function loadCommentsForCurrentRun() { const trace = state.currentRun?.trace_id; if (!trace || state.commentsLoadedFor === trace) return; try { const resp = await fetch(`/api/comments/${encodeURIComponent(trace)}`, { cache: "no-store" }); if (!resp.ok) return; const data = await resp.json(); state.commentsByPath.clear(); for (const [k, v] of Object.entries(data)) { if (typeof v === "string") state.commentsByPath.set(k, v); } state.commentsLoadedFor = trace; // Re-render Hero damit existing Comments sichtbar sind renderHero(); } catch (_) {} } // Forge v2.8 audit-fix F13: Verdict-Praefix-Konstanten // build_review_prompt im server.py erkennt diese Marker und gruppiert in der // notes.md "## Approved", "## Rejected", "## Comments" — Claude sieht klare // Approve/Reject-Trennung statt nur Freiform-Prosa. const VERDICT_APPROVED_PREFIX = "approved: "; const VERDICT_REJECTED_PREFIX = "rejected: "; function stripVerdictPrefix(value) { if (!value) return { prefix: null, body: "" }; if (value.startsWith(VERDICT_APPROVED_PREFIX)) { return { prefix: "approved", body: value.slice(VERDICT_APPROVED_PREFIX.length) }; } if (value.startsWith(VERDICT_REJECTED_PREFIX)) { return { prefix: "rejected", body: value.slice(VERDICT_REJECTED_PREFIX.length) }; } return { prefix: null, body: value }; } function onVerdictClick(btn) { const path = btn.dataset.path; const action = btn.dataset.action; if (!path) return; const textarea = document.getElementById(`comment-${cssEscape(path)}`); if (!textarea) return; const current = state.commentsByPath.get(path) || ""; const { body } = stripVerdictPrefix(current); let newValue; if (action === "verdict-approve") { newValue = VERDICT_APPROVED_PREFIX + (body || "page is good as-is"); } else if (action === "verdict-reject") { newValue = VERDICT_REJECTED_PREFIX + (body || ""); // Bei reject: Focus auf Textarea, damit User Begruendung ergaenzen kann setTimeout(() => { textarea.focus(); const pos = newValue.length; try { textarea.setSelectionRange(pos, pos); } catch (_) {} }, 0); } else if (action === "verdict-comment") { newValue = body; } else { return; } textarea.value = newValue; state.commentsByPath.set(path, newValue); setCommentStatus(path, "saving"); // Sofort flushen, damit Backend Marker mitbekommt flushCommentSave(path); updateFooterButton(); // Visuelles Feedback auf der Card const card = btn.closest(".file-row"); if (card) { card.dataset.verdict = action.replace("verdict-", ""); } } function onCommentInput(textarea) { const path = textarea.dataset.path; state.commentsByPath.set(path, textarea.value); setCommentStatus(path, "saving"); if (state.commentSaveTimers.has(path)) { clearTimeout(state.commentSaveTimers.get(path)); } const timer = setTimeout(() => flushCommentSave(path), 1500); state.commentSaveTimers.set(path, timer); updateFooterButton(); } async function flushCommentSave(path) { if (state.commentSaveTimers.has(path)) { clearTimeout(state.commentSaveTimers.get(path)); state.commentSaveTimers.delete(path); } const trace = state.currentRun?.trace_id; if (!trace) return; const value = state.commentsByPath.get(path) || ""; try { const resp = await fetch(`/api/comments/${encodeURIComponent(trace)}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ [path]: value }), }); setCommentStatus(path, resp.ok ? "saved" : "error"); } catch (_) { setCommentStatus(path, "error"); } } function setCommentStatus(path, status) { state.commentSaveStatus.set(path, status); const el = document.querySelector(`[data-status-for="${cssQuoteAttr(path)}"]`); if (!el) return; if (status === "saving") el.textContent = "speichert…"; else if (status === "saved") el.textContent = "✓ saved"; else if (status === "error") el.textContent = "× failed"; el.dataset.state = status; if (status === "saved") { setTimeout(() => { if (state.commentSaveStatus.get(path) === "saved") { const el2 = document.querySelector(`[data-status-for="${cssQuoteAttr(path)}"]`); if (el2) el2.textContent = ""; } }, 2500); } } // ────────────────── Forge v2.3: Footer-Button (Closed-Loop) ────────────────── function getNonEmptyCommentsCount() { let count = 0; for (const v of state.commentsByPath.values()) { if (v && v.trim()) count++; } return count; } function updateFooterButton() { const wrapper = document.getElementById("loop-footer"); if (!wrapper) return; const trace = state.currentRun?.trace_id; const filesTotal = state.currentRun?.files_total || 0; if (!trace || filesTotal === 0) { wrapper.innerHTML = ""; return; } const cnt = getNonEmptyCommentsCount(); const isReview = cnt > 0; const label = isReview ? "Änderungen als Prompt formulieren" : "Review abschließen → Agent benachrichtigen"; const subtext = isReview ? `${cnt} von ${filesTotal} Files kommentiert` : `0 von ${filesTotal} Files kommentiert — Doku ist gut`; const variant = isReview ? "review" : "clean"; wrapper.innerHTML = ` `; const btn = wrapper.querySelector(".loop-submit"); if (btn) btn.addEventListener("click", submitClosedLoop); } async function submitClosedLoop() { if (state.loopBusy) return; const trace = state.currentRun?.trace_id; if (!trace) return; state.loopBusy = true; const btn = document.querySelector(".loop-submit"); if (btn) { btn.disabled = true; btn.textContent = "wird verarbeitet…"; } // Erst alle pendenden Saves flushen for (const path of Array.from(state.commentSaveTimers.keys())) { await flushCommentSave(path); } try { const resp = await fetch(`/api/build-prompt/${encodeURIComponent(trace)}`, { method: "POST", headers: { "Content-Type": "application/json" }, body: "{}", }); if (!resp.ok) throw new Error(`status ${resp.status}`); const result = await resp.json(); showLoopModal(result); } catch (err) { showLoopModal({ mode: "error", error: String(err) }); } finally { state.loopBusy = false; updateFooterButton(); } } function showLoopModal(result) { let modal = document.getElementById("loop-modal"); if (!modal) { modal = document.createElement("div"); modal.id = "loop-modal"; modal.className = "loop-modal"; document.body.appendChild(modal); } let body = ""; if (result.mode === "review") { const trigger = result.trigger_hint || ""; // F16 (v2.8): inbox_file ist null in review-mode — mutual exclusive mit docs-input const inboxRow = result.inbox_file ? `

Inbox-File: ${escapeHtml(result.inbox_file)}

` : ""; body = `

✓ Review-Feedback bereit

${result.comment_count} Kommentare gespeichert.

Drop-Folder: ${escapeHtml(result.docs_input_folder)}

`; } else if (result.mode === "clean") { const trigger = result.trigger_hint || ""; body = `

✓ Review als clean signalisiert

Alle Pages bewertest du als gut — keine Änderungswünsche.

Inbox-File: ${escapeHtml(result.inbox_file)}

`; } else { body = `

× Fehler

${escapeHtml(result.error || "unknown")}

`; } modal.innerHTML = ` `; modal.querySelector(".loop-modal-close").addEventListener("click", () => modal.remove()); modal.querySelector(".loop-modal-backdrop").addEventListener("click", () => modal.remove()); modal.querySelectorAll('[data-action="copy-trigger"]').forEach((btn) => { btn.addEventListener("click", () => copyTriggerHint(btn)); }); } async function copyTriggerHint(btn) { const text = btn?.dataset?.copy || ""; if (!text) return; const originalLabel = btn.textContent; try { await navigator.clipboard.writeText(text); btn.textContent = "✓ kopiert"; btn.classList.add("is-copied"); } catch (_) { btn.textContent = "× failed"; btn.classList.add("is-error"); } setTimeout(() => { btn.textContent = originalLabel; btn.classList.remove("is-copied", "is-error"); }, 1800); } // ────────────────── Forge v2.3: Input-Folders Section ────────────────── function renderInputFolders() { const el = document.getElementById("input-folders-list"); if (!el) return; const data = state.inputFolders; if (!data) { el.innerHTML = `

Lade Input-Folders…

`; return; } if (data.is_empty) { el.innerHTML = `

📁 docs-input/ ist leer — bereit für einen neuen Job. Drop einen Folder rein oder gib /docs <Freitext> ein.

`; return; } const cards = []; for (const j of data.jobs || []) { cards.push(folderCard(j, false)); } for (const c of data.changelog || []) { cards.push(folderCard(c, true)); } el.innerHTML = `

${cards.join("")}

`; } // Forge v2.8 audit-fix F11: Pending-Reviews rendering function renderPendingReviews() { const el = document.getElementById("pending-reviews-list"); if (!el) return; const data = state.pendingReviews; if (!data) { el.innerHTML = `

Lade offene Reviews…

`; return; } if (!data.reviews || data.reviews.length === 0) { el.innerHTML = `

✓ keine offenen Reviews der letzten 30 Tage

`; return; } const cards = data.reviews.map((r) => pendingReviewCard(r)); const totalNote = data.total > data.reviews.length ? `

${data.reviews.length} von ${data.total} Reviews angezeigt

` : ""; el.innerHTML = `

${cards.join("")}

${totalNote}`; } function pendingReviewCard(r) { const updated = (r.updated || "").slice(0, 10); const filesPreview = (r.files || []).slice(0, 3) .map((f) => `${escapeHtml(f)}`).join(" "); const moreFiles = (r.files || []).length > 3 ? ` +${r.files.length - 3} mehr` : ""; const trigger = `/docs _review-feedback-${r.trace_short}`; return `

${escapeHtml(r.trace_short)} ${r.comment_count} comment${r.comment_count !== 1 ? "s" : ""} ${escapeHtml(updated)}

${filesPreview}${moreFiles}

Resume: ${escapeHtml(trigger)}

`; } function folderCard(folder, isChangelog) { const tags = []; if (folder.has_notes) tags.push("notes"); if (folder.has_changelog) tags.push("changelog.md"); if (folder.has_images) tags.push("images"); const tagsHtml = tags.map((t) => `${escapeHtml(t)}`).join(""); const trigger = isChangelog ? `/docs ${folder.name}` : `/docs ${folder.name}`; return `

${escapeHtml(folder.name)} ${isChangelog ? 'CHANGELOG' : ""}

${tagsHtml}${folder.file_count} Files

Trigger: ${escapeHtml(trigger)}

`; } // ────────────────── Helpers ────────────────── function cssEscape(s) { // Sanitize für DOM-IDs: nur a-z0-9- return String(s || "").replace(/[^a-zA-Z0-9_-]/g, "_"); } function cssQuoteAttr(s) { // Escape für CSS-Attribute-Selector return String(s || "").replace(/"/g, '\\"'); } // ────────────────── Init + Polling-Lifecycle ────────────────── function bindFilterBar(barId, callback) { const buttons = document.querySelectorAll(`#${barId} .filter-btn`); buttons.forEach((btn) => { btn.addEventListener("click", () => { buttons.forEach((b) => b.classList.remove("active")); btn.classList.add("active"); callback(btn.dataset.filter); }); }); } // Forge v2.2: Polling-Lifecycle mit visibilitychange-Pause const pollers = []; function startPolling() { if (pollers.length > 0) return; // schon läuft // Sofort einmal pollen damit beim Tab-Wiederkehr keine 2s-Lücke pollCurrentRun(); pollStatus(); pollReports(); pollHealth(); pollInputFolders(); pollPlanFile(); pollPendingReviews(); pollers.push(setInterval(pollCurrentRun, POLL_FAST_MS)); pollers.push(setInterval(pollStatus, POLL_FAST_MS)); pollers.push(setInterval(pollReports, POLL_REPORTS_MS)); pollers.push(setInterval(pollHealth, HEALTH_MS)); pollers.push(setInterval(pollInputFolders, 5000)); pollers.push(setInterval(pollPlanFile, 8000)); pollers.push(setInterval(pollPendingReviews, 10000)); } function stopPolling() { while (pollers.length > 0) { clearInterval(pollers.pop()); } setStatusPill("status-poll", "unknown", "paused (tab hidden)"); } function onVisibilityChange() { if (document.hidden) { stopPolling(); } else { startPolling(); } } async function init() { bindFilterBar("files-filter", (filter) => { filesFilter = filter; renderHero(); }); bindFilterBar("reports-filter", (filter) => { reportsFilter = filter; renderReports(); }); // Forge v2.5 (Track E #5): Path-Search-Input const searchEl = document.getElementById("files-search"); if (searchEl) { let searchTimer = null; searchEl.addEventListener("input", () => { clearTimeout(searchTimer); searchTimer = setTimeout(() => { state.pathSearch = searchEl.value; renderHero(); }, 120); }); searchEl.addEventListener("keydown", (ev) => { if (ev.key === "Escape") { searchEl.value = ""; state.pathSearch = ""; renderHero(); } }); } // Live-Section Toggle const toggle = document.getElementById("live-toggle"); const section = document.getElementById("live-section"); if (toggle && section) { toggle.addEventListener("click", () => { const collapsed = section.dataset.collapsed === "true"; section.dataset.collapsed = collapsed ? "false" : "true"; }); } try { state.cachedPages = await window.MintUrl.loadDocsPages(); } catch (_) {} // Forge v2.2: visibilitychange-Hook spart CPU wenn Tab im Hintergrund document.addEventListener("visibilitychange", onVisibilityChange); if (!document.hidden) { startPolling(); } else { setStatusPill("status-poll", "unknown", "paused (tab hidden)"); } } if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", init); } else { init(); }