state-hub/dashboard/src/todo.md

title
Todo

const API  = "http://127.0.0.1:8000";
const POLL = 15_000;
const THIS_REPO = "the-custodian";

// Live poll: tasks + workstreams + topics + contributions
const todoState = (async function*() {
  while (true) {
    let tasks = [], contribs = [], wsMap = {}, ok = false;
    try {
      const [rt, rw, rto, rc] = await Promise.all([
        fetch(`${API}/tasks/?limit=500`),
        fetch(`${API}/workstreams/`),
        fetch(`${API}/topics/`),
        fetch(`${API}/contributions/`),
      ]);
      ok = rt.ok && rw.ok && rto.ok && rc.ok;
      if (ok) {
        const [taskList, wsList, topicList, contribList] = await Promise.all([
          rt.json(), rw.json(), rto.json(), rc.json(),
        ]);
        const topicMap = Object.fromEntries(topicList.map(t => [t.id, t]));
        wsMap = Object.fromEntries(wsList.map(w => [w.id, {
          ...w,
          domain: topicMap[w.topic_id]?.domain_slug ?? "unknown",
        }]));
        tasks   = taskList.map(t => ({
          ...t,
          workstream_title: wsMap[t.workstream_id]?.title ?? "—",
          domain:           wsMap[t.workstream_id]?.domain ?? "unknown",
        }));
        contribs = contribList;
      }
    } catch {}
    yield {tasks, contribs, ok, ts: new Date()};
    await new Promise(res => setTimeout(res, POLL));
  }
})();

const tasks   = todoState.tasks   ?? [];
const contribs = todoState.contribs ?? [];
const _ok      = todoState.ok      ?? false;
const _ts      = todoState.ts;

// ── Classify tasks ────────────────────────────────────────────────────────────
const OPEN_STATUSES = new Set(["todo", "in_progress", "blocked"]);

// Internal: custodian domain, open, no [repo:] routing prefix
const internal = tasks.filter(t =>
  OPEN_STATUSES.has(t.status) &&
  t.domain === "custodian" &&
  !t.title.includes("[repo:")
);

// Ecosystem inbound: tasks routed to this repo from any domain
const ecosystem = tasks.filter(t =>
  OPEN_STATUSES.has(t.status) &&
  t.title.toLowerCase().includes(`[repo:${THIS_REPO}]`)
);

// Third-party: open contributions (outbound work for upstream repos)
const thirdParty = contribs.filter(c =>
  ["draft", "submitted", "acknowledged"].includes(c.status)
);

Todo

import {injectTocTop} from "./components/toc-sidebar.js";
import {withDocHelp}  from "./components/doc-overlay.js";

// ── KPI sidebar card ──────────────────────────────────────────────────────────
const _kpiBox = html`<div class="kpi-infobox">
  <div class="kpi-infobox-title">Todo Summary</div>
  <div class="kpi-row">
    <span class="kpi-row-label">internal</span>
    <div class="kpi-row-right">
      <div class="kpi-row-value">${internal.length}</div>
    </div>
  </div>
  <div class="kpi-row">
    <span class="kpi-row-label">ecosystem (inbound)</span>
    <div class="kpi-row-right">
      <div class="kpi-row-value">${ecosystem.length}</div>
    </div>
  </div>
  <div class="kpi-row">
    <span class="kpi-row-label">third-party (outbound)</span>
    <div class="kpi-row-right">
      <div class="kpi-row-value">${thirdParty.length}</div>
    </div>
  </div>
</div>`;

// ── Live indicator ────────────────────────────────────────────────────────────
const _liveEl = html`<div class="live-indicator">
  <span style="color:${_ok ? 'var(--theme-foreground-focus)' : 'red'}">●</span>
  ${_ok
    ? `Live · updated ${_ts?.toLocaleTimeString()}`
    : html`<span style="color:red">Offline — run: <code>make api</code></span>`}
</div>`;
withDocHelp(_liveEl, "/docs/live-data");

injectTocTop("todo-kpi-box", _kpiBox);
injectTocTop("live-indicator", _liveEl);

const _h1 = document.querySelector("#observablehq-main h1");
if (_h1) { _h1.style.position = "relative"; withDocHelp(_h1, "/docs/todo"); }

---

Internal

Work fully addressable within this repo. Open tasks in custodian workstreams without a cross-repo routing prefix.

const PRIORITY_ORDER = {critical: 0, high: 1, medium: 2, low: 3};
const STATUS_ORDER   = {blocked: 0, in_progress: 1, todo: 2};

function sortTasks(arr) {
  return [...arr].sort((a, b) => {
    const sd = (STATUS_ORDER[a.status] ?? 9) - (STATUS_ORDER[b.status] ?? 9);
    if (sd !== 0) return sd;
    return (PRIORITY_ORDER[a.priority] ?? 9) - (PRIORITY_ORDER[b.priority] ?? 9);
  });
}

function renderTaskList(arr) {
  if (arr.length === 0) return html`<p class="dim">No open todos in this category. ✓</p>`;
  return html`<div class="task-list">${sortTasks(arr).map(t => html`
    <div class="task-item status-${t.status}">
      <div class="task-item-header">
        <span class="task-badge task-priority-${t.priority}">${t.priority}</span>
        <span class="task-status-chip status-chip-${t.status}">${t.status.replace("_", " ")}</span>
        <span class="task-context task-ws-name">${t.workstream_title}</span>
        ${t.assignee ? html`<span class="task-assignee">@${t.assignee}</span>` : ""}
      </div>
      <div class="task-title">${t.title}</div>
      ${t.blocking_reason ? html`<div class="task-blocking-reason">⊘ ${t.blocking_reason}</div>` : ""}
    </div>
  `)}</div>`;
}

display(renderTaskList(internal));

---

Ecosystem

Inbound tasks routed to this repo by other agents via the [repo:${THIS_REPO}] prefix convention.

display(renderTaskList(ecosystem));

---

Third-Party

Outbound work for upstream repos — open contribution artifacts (bug reports, feature requests, extension points, upstream PRs).

const TYPE_LABEL = {br: "Bug Report", fr: "Feature Request", ep: "Extension Point", upr: "Upstream PR"};
const STATUS_COLOR_C = {draft: "#94a3b8", submitted: "#3b82f6", acknowledged: "#f59e0b"};

if (thirdParty.length === 0) {
  display(html`<p class="dim">No open outbound contributions. ✓</p>`);
} else {
  display(html`<div class="task-list">${thirdParty.map(c => html`
    <div class="task-item">
      <div class="task-item-header">
        <span class="task-badge" style="background:#f1f5f9;color:#475569">${TYPE_LABEL[c.type] ?? c.type}</span>
        <span class="task-status-chip" style="background:${STATUS_COLOR_C[c.status] ?? '#ccc'}20;color:${STATUS_COLOR_C[c.status] ?? '#666'}">${c.status}</span>
        ${c.target_org  ? html`<span class="task-context">${c.target_org}</span>` : ""}
        ${c.target_repo ? html`<span class="task-context task-ws-name">${c.target_repo}</span>` : ""}
      </div>
      <div class="task-title">${c.title}</div>
      ${c.body_path ? html`<div class="task-blocking-reason" style="background:#f0fdf4;color:#166534">↗ ${c.body_path}</div>` : ""}
    </div>
  `)}</div>`);
}