co-maintainer 0.4.0-beta.1

package/dist/src/server/pages/analytics.js

@@ -0,0 +1,193 @@
+import { bars, count, delta, duration, empty, html, layout, money, text, } from "./layout.js";
+import { listJobs } from "../../store/jobs.js";
+export function renderAnalytics(username, range, data) {
+    const failed = listJobs({ status: "failed" }).slice(0, 5);
+    const totalFindings = data.bySeverity.reduce((sum, row) => sum + row.findings, 0);
+    const byRepo = data.byRepo.length === 0
+        ? empty("No usage yet", "Cost and findings show up after reviews run.")
+        : `<table>
+        <thead><tr><th>Repository</th><th class="num">Pull requests</th><th class="num">Findings</th>
+          <th class="num">Per pull request</th><th class="num">Tokens</th>
+          <th class="num">Average review</th><th class="num">Cost</th></tr></thead>
+        <tbody>
+          ${data.byRepo
+            .map((row) => `<tr><td><a href="/repos/${text(row.repo)}">${text(row.repo)}</a></td>
+            <td class="num">${row.pullRequests}</td>
+            <td class="num">${row.findings}</td>
+            <td class="num">${row.pullRequests
+            ? (row.findings / row.pullRequests).toFixed(1)
+            : "0"}</td>
+            <td class="num">${count(row.tokensIn + row.tokensOut)}</td>
+            <td class="num">${duration(row.avgDurationMs)}</td>
+            <td class="num">${money(row.cost)}</td></tr>`)
+            .join("")}
+        </tbody>
+      </table>`;
+    const byModel = data.byModel.length === 0
+        ? empty("No models yet", "Each review records the model that wrote it.")
+        : `<table>
+        <thead><tr><th>Model</th><th class="num">Reviews</th><th class="num">Tokens in</th>
+          <th class="num">Tokens out</th><th class="num">Average review</th>
+          <th class="num">Per review</th><th class="num">Cost</th></tr></thead>
+        <tbody>
+          ${data.byModel
+            .map((row) => `<tr><td>${text(row.model)}</td>
+            <td class="num">${row.reviews}</td>
+            <td class="num">${count(row.tokensIn)}</td>
+            <td class="num">${count(row.tokensOut)}</td>
+            <td class="num">${duration(row.avgDurationMs)}</td>
+            <td class="num">${money(row.reviews ? row.cost / row.reviews : 0)}</td>
+            <td class="num">${money(row.cost)}</td></tr>`)
+            .join("")}
+        </tbody>
+      </table>`;
+    const byRemoteToken = (data.byRemoteToken ?? []).length === 0
+        ? empty("No remote reviews yet", "Usage from CLI tokens appears here.")
+        : `<table>
+        <thead><tr><th>Token</th><th class="num">Reviews</th><th class="num">Findings</th>
+          <th class="num">Cost</th></tr></thead>
+        <tbody>
+          ${(data.byRemoteToken ?? [])
+            .map((row) => `<tr><td>${text(row.tokenName)}</td>
+            <td class="num">${row.reviews}</td>
+            <td class="num">${row.findings}</td>
+            <td class="num">${money(row.cost)}</td></tr>`)
+            .join("")}
+        </tbody>
+      </table>`;
+    const bySeverity = data.bySeverity.length === 0
+        ? empty("No findings yet", "Severity shows how much of the noise matters.")
+        : `<table>
+        <thead><tr><th>Severity</th><th class="num">Findings</th><th class="num">Share</th>
+          <th class="num">Posted</th><th class="num">Raised again</th></tr></thead>
+        <tbody>
+          ${data.bySeverity
+            .map((row) => `<tr><td>${text(row.severity)}</td>
+            <td class="num">${row.findings}</td>
+            <td class="num">${totalFindings
+            ? Math.round((row.findings / totalFindings) * 100)
+            : 0}%</td>
+            <td class="num">${row.posted}</td>
+            <td class="num">${row.repeats}</td></tr>`)
+            .join("")}
+        </tbody>
+      </table>`;
+    const busiest = data.byDay.reduce((best, row) => (row.cost > best.cost ? row : best), {
+        day: "",
+        cost: 0,
+        reviews: 0,
+        findings: 0,
+    });
+    const looks = failed.length === 0
+        ? empty("Nothing stands out", "Failed jobs will be listed here.")
+        : failed
+            .map((job) => `<div class="notice bad worth-item" data-worth-id="${text(job.id)}" style="margin-bottom:12px">
+        <div class="txt"><b>${text(job.repo)}</b>. ${text(job.type)} failed${job.error ? `. ${text(job.error)}` : ""}.</div>
+        <a class="btn" href="/activity">See why</a>
+        <button class="dismiss-worth" type="button" data-dismiss-worth="${text(job.id)}" aria-label="Dismiss">×</button>
+      </div>`)
+            .join("");
+    return html(layout({
+        title: "Usage · co-maintainer",
+        username,
+        active: "analytics",
+        body: `<div class="wrap">
+  <div class="pagehead">
+    <div><h1>Usage</h1>
+      <p class="lead">Last ${data.days} days</p></div>
+    <div class="actions">
+      <select id="range" style="width:150px">
+        <option value="7d"${range === "7d" ? " selected" : ""}>Last 7 days</option>
+        <option value="30d"${range === "30d" ? " selected" : ""}>Last 30 days</option>
+        <option value="90d"${range === "90d" ? " selected" : ""}>Last 90 days</option>
+      </select>
+    </div>
+  </div>
+  <div class="card"><div class="bd">
+    <div class="kfig wrap4">
+      <div><div class="k">Pull requests reviewed</div><div class="big">${data.totals.pullRequests}</div>${delta(data.change.pullRequests, data.days)}</div>
+      <div><div class="k">Findings</div><div class="big">${data.totals.findings}</div>${delta(data.change.findings, data.days)}</div>
+      <div><div class="k">Cost</div><div class="big">${money(data.totals.cost)}</div>${delta(data.change.cost, data.days, true)}</div>
+      <div><div class="k">Tokens</div><div class="big">${count(data.totals.tokensIn + data.totals.tokensOut)}</div><div class="trend">${count(data.totals.tokensIn)} in and ${count(data.totals.tokensOut)} out</div></div>
+      <div><div class="k">Average review</div><div class="big">${duration(data.totals.avgDurationMs)}</div></div>
+      <div><div class="k">Rounds per pull request</div><div class="big">${data.totals.pullRequests
+            ? (data.totals.reviews / data.totals.pullRequests).toFixed(1)
+            : "0"}</div>${data.totals.failed
+            ? `<div class="trend down">${data.totals.failed} failed</div>`
+            : ""}</div>
+    </div>
+  </div></div>
+  <div class="card">
+    <div class="hd"><h2>Cost per day</h2></div>
+    <div class="bd">
+      ${bars(data.byDay.map((row) => ({
+            label: `${row.day} ${money(row.cost)} over ${row.reviews} reviews`,
+            value: row.cost,
+        })))}
+      <p class="muted" style="margin:10px 0 0">${busiest.cost
+            ? `Busiest day was ${text(busiest.day)} at ${money(busiest.cost)}`
+            : "No spend in this range"}</p>
+    </div>
+  </div>
+  <div class="card">
+    <div class="hd"><h2>By repository</h2></div>
+    <div class="bd flush">${byRepo}</div>
+  </div>
+  <div class="card">
+    <div class="hd"><h2>By model</h2></div>
+    <div class="bd flush">${byModel}</div>
+  </div>
+  <div class="card">
+    <div class="hd"><h2>By remote token</h2></div>
+    <div class="bd flush">${byRemoteToken}</div>
+  </div>
+  <div class="card">
+    <div class="hd"><h2>Findings by severity</h2></div>
+    <div class="bd flush">${bySeverity}</div>
+  </div>
+  <div class="card" id="worth-a-look">
+    <div class="hd"><h2>Worth a look</h2></div>
+    <div class="bd">${looks}</div>
+  </div>
+</div>
+<script>
+document.getElementById("range").addEventListener("change", function() {
+  location.href = "/analytics?range=" + this.value;
+});
+(function() {
+  var key = "co-maintainer:dismissed-worth";
+  var read = function() {
+    try {
+      var value = JSON.parse(localStorage.getItem(key) || "[]");
+      return Array.isArray(value) ? value : [];
+    } catch (_) {
+      return [];
+    }
+  };
+  var dismissed = read();
+  document.querySelectorAll("[data-worth-id]").forEach(function(item) {
+    if (dismissed.indexOf(item.getAttribute("data-worth-id")) !== -1) {
+      item.remove();
+    }
+  });
+  document.addEventListener("click", function(event) {
+    var button = event.target.closest("[data-dismiss-worth]");
+    if (!button) return;
+    var id = button.getAttribute("data-dismiss-worth");
+    if (!id) return;
+    var next = read();
+    if (next.indexOf(id) === -1) next.push(id);
+    try {
+      localStorage.setItem(key, JSON.stringify(next));
+    } catch (_) {}
+    var item = button.closest("[data-worth-id]");
+    if (item) item.remove();
+    if (!document.querySelector("[data-worth-id]")) {
+      document.querySelector("#worth-a-look .bd").textContent =
+        "Nothing stands out.";
+    }
+  });
+})();
+</script>`,
+    }));
+}

package/dist/src/server/pages/client.d.ts

@@ -0,0 +1,2 @@
+/** Generated from src/server/pages/client.js by scripts/embed_assets.mjs — do not edit. */
+export declare const client = "function toast(message) {\n  const host = document.getElementById(\"toasts\");\n  if (!host) return;\n  const el = document.createElement(\"div\");\n  el.className = \"toast\";\n  el.setAttribute(\"role\", \"status\");\n  el.textContent = message;\n  host.appendChild(el);\n  setTimeout(function () {\n    el.remove();\n  }, 5000);\n}\n\nfunction fail(card, message, retry) {\n  toast(message);\n  if (!card) return;\n  let box = card.querySelector(\"[data-fail]\");\n  if (!box) {\n    box = document.createElement(\"div\");\n    box.setAttribute(\"data-fail\", \"1\");\n    box.className = \"fail\";\n    card.appendChild(box);\n  }\n  box.replaceChildren();\n  const p = document.createElement(\"p\");\n  p.textContent = message;\n  const btn = document.createElement(\"button\");\n  btn.className = \"btn sm\";\n  btn.type = \"button\";\n  btn.textContent = \"Retry\";\n  btn.addEventListener(\"click\", retry);\n  box.appendChild(p);\n  box.appendChild(btn);\n}\n\nfunction clearFail(card) {\n  const box = card && card.querySelector(\"[data-fail]\");\n  if (box) box.remove();\n}\n\nfunction skeleton(card, on) {\n  if (!card) return;\n  card.classList.toggle(\"busy\", on);\n}\n\nasync function api(method, url, body) {\n  const res = await fetch(url, {\n    method: method,\n    headers: {\n      \"content-type\": \"application/json\",\n      \"x-requested-with\": \"co-maintainer\",\n    },\n    body: body === undefined ? undefined : JSON.stringify(body),\n  });\n  if (!res.ok) {\n    let message = \"Request failed\";\n    try {\n      const data = await res.json();\n      if (data.error && data.error.message) message = data.error.message;\n    } catch {\n      // body was not JSON; keep the generic message\n    }\n    throw new Error(message);\n  }\n  if (res.status === 204) return null;\n  return await res.json();\n}\n\nasync function run(btn, card, fn) {\n  if (btn) btn.disabled = true;\n  skeleton(card, true);\n  clearFail(card);\n  try {\n    await fn();\n  } catch (err) {\n    fail(card, err.message, function () {\n      run(btn, card, fn);\n    });\n  } finally {\n    if (btn) btn.disabled = false;\n    skeleton(card, false);\n  }\n}\n\nasync function postAndGo(url, body, next, btn) {\n  const card = btn && btn.closest(\"[data-async]\");\n  await run(btn, card, async function () {\n    await api(\"POST\", url, body);\n    location.href = next;\n  });\n}\n\n// Called from the inline scripts on the repo list and repo pages, which deno lint\n// cannot see, so it looks unused from inside this file.\n// deno-lint-ignore no-unused-vars\nfunction bindToggle(btn, url, field) {\n  btn.addEventListener(\"click\", async function () {\n    if (btn.disabled) return;\n    const on = !btn.classList.contains(\"on\");\n    btn.classList.toggle(\"on\", on);\n    btn.setAttribute(\"data-on\", on ? \"1\" : \"0\");\n    btn.disabled = true;\n    const card = btn.closest(\"[data-async]\");\n    try {\n      const payload = {};\n      payload[field] = on;\n      await api(\"PATCH\", url, payload);\n    } catch (err) {\n      btn.classList.toggle(\"on\", !on);\n      btn.setAttribute(\"data-on\", on ? \"0\" : \"1\");\n      fail(card, err.message, function () {\n        btn.click();\n      });\n    } finally {\n      btn.disabled = false;\n    }\n  });\n}\n\naddEventListener(\"error\", function (ev) {\n  toast((ev.error && ev.error.message) || \"Something broke\");\n});\naddEventListener(\"unhandledrejection\", function (ev) {\n  toast((ev.reason && ev.reason.message) || \"Something broke\");\n});\n\ndocument.addEventListener(\"click\", function (ev) {\n  const btn =\n    ev.target && ev.target.closest\n      ? ev.target.closest(\"[data-cancel], [data-post]\")\n      : null;\n  if (!btn) return;\n  ev.preventDefault();\n  if (btn.hasAttribute(\"data-cancel\")) {\n    postAndGo(\n      \"/api/jobs/\" + btn.getAttribute(\"data-cancel\") + \"/cancel\",\n      {},\n      \"/activity\",\n      btn,\n    );\n    return;\n  }\n  const body = btn.getAttribute(\"data-body\");\n  postAndGo(\n    btn.getAttribute(\"data-post\"),\n    body ? JSON.parse(body) : {},\n    \"/activity\",\n    btn,\n  );\n});\n\n(function pollActivity() {\n  if (!document.getElementById(\"activity-root\")) return;\n  setInterval(async function () {\n    if (document.hidden) return;\n    if (document.querySelector(\"[data-async].busy\")) return;\n    const root = document.getElementById(\"activity-root\");\n    if (!root) return;\n    try {\n      const res = await fetch(location.pathname + location.search, {\n        headers: { accept: \"text/html\" },\n      });\n      if (!res.ok) return;\n      const doc = new DOMParser().parseFromString(\n        await res.text(),\n        \"text/html\",\n      );\n      const next = doc.getElementById(\"activity-root\");\n      if (!next || next.innerHTML === root.innerHTML) return;\n      root.replaceWith(next);\n    } catch {\n      // a failed poll just waits for the next tick\n    }\n  }, 5000);\n})();\n";

package/dist/src/server/pages/client.js

@@ -0,0 +1,2 @@
+/** Generated from src/server/pages/client.js by scripts/embed_assets.mjs — do not edit. */
+export const client = "function toast(message) {\n  const host = document.getElementById(\"toasts\");\n  if (!host) return;\n  const el = document.createElement(\"div\");\n  el.className = \"toast\";\n  el.setAttribute(\"role\", \"status\");\n  el.textContent = message;\n  host.appendChild(el);\n  setTimeout(function () {\n    el.remove();\n  }, 5000);\n}\n\nfunction fail(card, message, retry) {\n  toast(message);\n  if (!card) return;\n  let box = card.querySelector(\"[data-fail]\");\n  if (!box) {\n    box = document.createElement(\"div\");\n    box.setAttribute(\"data-fail\", \"1\");\n    box.className = \"fail\";\n    card.appendChild(box);\n  }\n  box.replaceChildren();\n  const p = document.createElement(\"p\");\n  p.textContent = message;\n  const btn = document.createElement(\"button\");\n  btn.className = \"btn sm\";\n  btn.type = \"button\";\n  btn.textContent = \"Retry\";\n  btn.addEventListener(\"click\", retry);\n  box.appendChild(p);\n  box.appendChild(btn);\n}\n\nfunction clearFail(card) {\n  const box = card && card.querySelector(\"[data-fail]\");\n  if (box) box.remove();\n}\n\nfunction skeleton(card, on) {\n  if (!card) return;\n  card.classList.toggle(\"busy\", on);\n}\n\nasync function api(method, url, body) {\n  const res = await fetch(url, {\n    method: method,\n    headers: {\n      \"content-type\": \"application/json\",\n      \"x-requested-with\": \"co-maintainer\",\n    },\n    body: body === undefined ? undefined : JSON.stringify(body),\n  });\n  if (!res.ok) {\n    let message = \"Request failed\";\n    try {\n      const data = await res.json();\n      if (data.error && data.error.message) message = data.error.message;\n    } catch {\n      // body was not JSON; keep the generic message\n    }\n    throw new Error(message);\n  }\n  if (res.status === 204) return null;\n  return await res.json();\n}\n\nasync function run(btn, card, fn) {\n  if (btn) btn.disabled = true;\n  skeleton(card, true);\n  clearFail(card);\n  try {\n    await fn();\n  } catch (err) {\n    fail(card, err.message, function () {\n      run(btn, card, fn);\n    });\n  } finally {\n    if (btn) btn.disabled = false;\n    skeleton(card, false);\n  }\n}\n\nasync function postAndGo(url, body, next, btn) {\n  const card = btn && btn.closest(\"[data-async]\");\n  await run(btn, card, async function () {\n    await api(\"POST\", url, body);\n    location.href = next;\n  });\n}\n\n// Called from the inline scripts on the repo list and repo pages, which deno lint\n// cannot see, so it looks unused from inside this file.\n// deno-lint-ignore no-unused-vars\nfunction bindToggle(btn, url, field) {\n  btn.addEventListener(\"click\", async function () {\n    if (btn.disabled) return;\n    const on = !btn.classList.contains(\"on\");\n    btn.classList.toggle(\"on\", on);\n    btn.setAttribute(\"data-on\", on ? \"1\" : \"0\");\n    btn.disabled = true;\n    const card = btn.closest(\"[data-async]\");\n    try {\n      const payload = {};\n      payload[field] = on;\n      await api(\"PATCH\", url, payload);\n    } catch (err) {\n      btn.classList.toggle(\"on\", !on);\n      btn.setAttribute(\"data-on\", on ? \"0\" : \"1\");\n      fail(card, err.message, function () {\n        btn.click();\n      });\n    } finally {\n      btn.disabled = false;\n    }\n  });\n}\n\naddEventListener(\"error\", function (ev) {\n  toast((ev.error && ev.error.message) || \"Something broke\");\n});\naddEventListener(\"unhandledrejection\", function (ev) {\n  toast((ev.reason && ev.reason.message) || \"Something broke\");\n});\n\ndocument.addEventListener(\"click\", function (ev) {\n  const btn =\n    ev.target && ev.target.closest\n      ? ev.target.closest(\"[data-cancel], [data-post]\")\n      : null;\n  if (!btn) return;\n  ev.preventDefault();\n  if (btn.hasAttribute(\"data-cancel\")) {\n    postAndGo(\n      \"/api/jobs/\" + btn.getAttribute(\"data-cancel\") + \"/cancel\",\n      {},\n      \"/activity\",\n      btn,\n    );\n    return;\n  }\n  const body = btn.getAttribute(\"data-body\");\n  postAndGo(\n    btn.getAttribute(\"data-post\"),\n    body ? JSON.parse(body) : {},\n    \"/activity\",\n    btn,\n  );\n});\n\n(function pollActivity() {\n  if (!document.getElementById(\"activity-root\")) return;\n  setInterval(async function () {\n    if (document.hidden) return;\n    if (document.querySelector(\"[data-async].busy\")) return;\n    const root = document.getElementById(\"activity-root\");\n    if (!root) return;\n    try {\n      const res = await fetch(location.pathname + location.search, {\n        headers: { accept: \"text/html\" },\n      });\n      if (!res.ok) return;\n      const doc = new DOMParser().parseFromString(\n        await res.text(),\n        \"text/html\",\n      );\n      const next = doc.getElementById(\"activity-root\");\n      if (!next || next.innerHTML === root.innerHTML) return;\n      root.replaceWith(next);\n    } catch {\n      // a failed poll just waits for the next tick\n    }\n  }, 5000);\n})();\n";

package/dist/src/server/pages/home.d.ts

@@ -0,0 +1,16 @@
+export declare function renderLogin(opts: {
+    next: string;
+    error?: string;
+    showPassword: boolean;
+    showGithub: boolean;
+}): Response;
+export declare function renderHome(username: string, rows: {
+    fullName: string;
+    statusKind: "ok" | "warn" | "err" | "run";
+    status: string;
+    knowledge: string;
+    knowledgeAt?: string;
+    autoOn: boolean;
+    reviews: string;
+    cost: string;
+}[]): Response;

package/dist/src/server/pages/home.js

@@ -0,0 +1,87 @@
+import { empty, html, layout, skSlot, text, when } from "./layout.js";
+export function renderLogin(opts) {
+    const err = opts.error
+        ? `<p class="notice bad"><span class="txt">${text(opts.error)}</span></p>`
+        : "";
+    const passwordForm = opts.showPassword
+        ? `<form method="post" action="/login">
+      <input type="hidden" name="next" value="${text(opts.next)}">
+      <div class="field wide"><label>Password</label>
+        <input type="password" name="password" autofocus required></div>
+      <button class="primary" type="submit">Sign in</button>
+    </form>`
+        : "";
+    const githubButton = opts.showGithub
+        ? `<a class="btn primary" style="display:block;text-align:center" href="/auth/github?next=${encodeURIComponent(opts.next)}">Continue with GitHub</a>`
+        : "";
+    const divider = opts.showPassword && opts.showGithub
+        ? `<p class="muted" style="text-align:center;margin:16px 0">or</p>`
+        : "";
+    const lead = opts.showPassword
+        ? "Use the dashboard password printed when serve started."
+        : "Sign in with your GitHub account.";
+    return html(layout({
+        title: "Sign in · co-maintainer",
+        body: `<div class="wrap" style="max-width:420px">
+  <img class="brand" src="/logo.png" alt="co-maintainer">
+  <div class="pagehead"><div><h1>Sign in</h1>
+    <p class="lead">${text(lead)}</p></div></div>
+  ${err}
+  <div class="card"><div class="bd">
+    ${passwordForm}${divider}${githubButton}
+  </div></div>
+</div>`,
+    }));
+}
+export function renderHome(username, rows) {
+    const autoCount = rows.filter((row) => row.autoOn).length;
+    const lead = rows.length === 0
+        ? "No repositories yet. Add one to start."
+        : `${rows.length} repositories · ${autoCount} reviewing pull requests automatically`;
+    const body = rows.length === 0
+        ? empty("No repositories", "Add a repository to generate knowledge and review pull requests.")
+        : `<div class="card" data-async>
+    ${skSlot("table")}
+    <div class="bd flush">
+      <table>
+        <thead><tr>
+          <th>Repository</th><th>Status</th><th>Knowledge</th><th>Auto review</th>
+          <th class="num">Reviews</th><th class="num">Cost (30d)</th>
+        </tr></thead>
+        <tbody>
+          ${rows
+            .map((row) => `<tr>
+            <td><a href="/repos/${text(row.fullName)}">${text(row.fullName)}</a></td>
+            <td><span class="st ${row.statusKind}">${text(row.status)}</span></td>
+            <td>${text(row.knowledge)}${row.knowledgeAt
+            ? `<div class="dim" style="font-size:13px">${when(row.knowledgeAt)}</div>`
+            : ""}</td>
+            <td>${row.autoOn
+            ? `<button class="tg on" data-repo="${text(row.fullName)}" data-on="1"></button>`
+            : `<button class="tg" data-repo="${text(row.fullName)}" data-on="0"></button>`}</td>
+            <td class="num">${text(row.reviews)}</td>
+            <td class="num">${text(row.cost)}</td>
+          </tr>`)
+            .join("")}
+        </tbody>
+      </table>
+    </div>
+    <div class="ft"><span>Showing ${rows.length} repositories</span></div>
+  </div>`;
+    return html(layout({
+        title: "Repositories · co-maintainer",
+        username,
+        body: `<div class="wrap">
+  <div class="pagehead">
+    <div><h1>Repositories</h1><p class="lead">${text(lead)}</p></div>
+    <div class="actions">${rows.length === 0 ? `<a class="btn" href="/setup">Get started</a>` : ""}<a class="btn primary" href="/repos/new">Add repository</a></div>
+  </div>
+  ${body}
+</div>
+<script>
+document.querySelectorAll(".tg[data-repo]").forEach(function(btn) {
+  bindToggle(btn, "/api/repos/" + btn.getAttribute("data-repo"), "autoReview");
+});
+</script>`,
+    }));
+}

package/dist/src/server/pages/knowledge.d.ts

@@ -0,0 +1,2 @@
+import type { repoKnowledge } from "../../services/dashboard.ts";
+export declare function renderKnowledge(username: string, data: Awaited<ReturnType<typeof repoKnowledge>>, viewId?: string): Response;

package/dist/src/server/pages/knowledge.js

@@ -0,0 +1,64 @@
+import { capped, empty, html, layout, repoNav, skSlot, text, when, } from "./layout.js";
+import { COMPARE_FILE_CAP, MAX_COMMITS_COUNTED } from "../../services/drift.js";
+function sizeLabel(bytes) {
+    if (bytes < 1024)
+        return `${bytes} B`;
+    return `${(bytes / 1024).toFixed(1)} KB`;
+}
+export function renderKnowledge(username, data, viewId) {
+    const name = data.repo.full_name;
+    const viewing = data.docs.find((doc) => doc.id === viewId);
+    const drift = data.drift;
+    const notice = data.repo.knowledge_built_at
+        ? `<div class="notice"><div class="txt">Built ${when(data.repo.knowledge_built_at)}.${drift
+            ? ` Since then: <b>${drift.prs_since} new pull requests</b>, <b>${drift.prs_updated} changed pull requests</b>, <b>${capped(drift.commits_since, MAX_COMMITS_COUNTED)} new commits</b> and <b>${capped(drift.files_changed, COMPARE_FILE_CAP)} changed files</b>. <span class="muted">Checked ${when(drift.as_of)}.</span>`
+            : ""}</div></div>`
+        : `<div class="notice info"><div class="txt">Knowledge has not been built yet. Run init from the repository list.</div></div>`;
+    const viewer = viewing
+        ? `<div class="card"><div class="hd"><h2>${text(viewing.title)}</h2>
+        <a class="btn sm" style="margin-left:auto" href="/repos/${text(name)}/knowledge">Close</a></div>
+      <div class="bd"><pre class="log" style="max-height:none">${text(viewing.text)}</pre></div></div>`
+        : "";
+    const table = data.docs.length === 0
+        ? empty("No documents", "Init this repository to generate the review guide.")
+        : `<table>
+          <thead><tr><th>Document</th><th>What it covers</th><th class="num">Size</th><th></th></tr></thead>
+          <tbody>
+            ${data.docs
+            .map((doc) => `<tr><td><b>${text(doc.title)}</b></td>
+              <td class="muted">${text(doc.covers)}</td>
+              <td class="num">${text(sizeLabel(doc.bytes))}</td>
+              <td style="width:1%"><a class="btn sm" href="?view=${text(doc.id)}">View</a></td></tr>`)
+            .join("")}
+          </tbody>
+        </table>`;
+    return html(layout({
+        title: `Knowledge · ${name}`,
+        username,
+        body: `<div class="wrap side">
+  ${repoNav(name, "knowledge")}
+  <div data-async>
+    ${skSlot()}
+    <div class="crumbs"><a href="/">Repositories</a> /
+      <a href="/repos/${text(name)}">${text(name)}</a> / Knowledge</div>
+    <div class="pagehead">
+      <div><h1>Knowledge</h1>
+        <p class="lead">What co-maintainer learned about this repository, and checks every pull request against.</p></div>
+      <div class="actions"><button class="primary" id="update">Update</button></div>
+    </div>
+    ${notice}
+    <div class="card"><div class="bd flush">${table}</div></div>
+    ${viewer}
+    <div class="card">
+      <div class="hd"><h2>History</h2></div>
+      <div class="bd">${empty("Only the current knowledge is kept", "Older versions are not stored yet.")}</div>
+    </div>
+  </div>
+</div>
+<script>
+document.getElementById("update").addEventListener("click", function() {
+  postAndGo("/api/repos/" + ${JSON.stringify(name)} + "/remake", {}, "/activity", this);
+});
+</script>`,
+    }));
+}

package/dist/src/server/pages/layout.d.ts

@@ -0,0 +1,32 @@
+export declare function escapeHtml(value: unknown): string;
+export declare function text(value: unknown): string;
+export declare function markdown(value: unknown): string;
+export declare function money(value: number): string;
+export declare function count(value: number): string;
+export declare function duration(ms: number | null | undefined): string;
+/** Rendered only when the earlier window had something to compare against,
+ * so an empty first month stays quiet rather than claiming a jump. */
+export declare function delta(change: number | undefined, days: number, lowerIsBetter?: boolean): string;
+/** A flex row of divs beats pulling in a chart library for one series, and
+ * it stays readable when a range has a single day in it. Each column is full
+ * height with the bar painted as a gradient stop, because a bar sized by its
+ * own height leaves nothing to hover over on a quiet day. */
+export declare function bars(items: {
+    label: string;
+    value: number;
+}[]): string;
+/** GitHub truncates long responses, so a count that reached its ceiling is
+ * a floor rather than a total and has to read as one. */
+export declare function capped(value: number, cap: number): string;
+export declare function when(iso: string | null | undefined): string;
+export declare function skSlot(kind?: "table" | "block"): string;
+export declare function layout(opts: {
+    title: string;
+    username?: string;
+    active?: "activity" | "analytics" | "settings";
+    body: string;
+}): string;
+export declare function html(body: string, status?: number): Response;
+export declare function repoNav(fullName: string, on: string): string;
+export declare function empty(title: string, lead: string): string;
+export declare function statusClass(kind: "ok" | "warn" | "err" | "run", label: string): string;