generated from coulomb/repo-seed
T4: workstreams.md and dependencies.md now call /state/deps instead of the
full /state/summary — removes 2 heavy 10-table queries per 60 s cycle.
T5: index.md's 4 independent polling loops (summaryState, sbomSnapState,
regsState, wsChartState) consolidated into a single pageState generator
with one Promise.all batch and a shared backoff counter.
T6: config.js gains waitForVisible(ms) — pauses polling entirely while the
tab is hidden and fires immediately on visibilitychange. pollDelay()
simplified (hidden-tab POLL_HIDDEN logic removed). All 16 polling pages
migrated from await sleep(pollDelay(...)) to await waitForVisible(pollDelay(...)).
CUST-WP-0039 complete — all 6 tasks done.
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
7.8 KiB
7.8 KiB
title
| title |
|---|
| Domains |
import {API, POLL_HEAVY, apiFetch, pollDelay, waitForVisible} from "./components/config.js";
const domainsState = (async function*() {
let failures = 0;
while (true) {
let domains = [], repos = [], ok = false;
try {
const [rd, rr] = await Promise.all([
apiFetch("/domains/?status=all"),
apiFetch("/repos/"),
]);
ok = rd.ok && rr.ok;
if (ok) {
[domains, repos] = await Promise.all([rd.json(), rr.json()]);
}
} catch {}
failures = ok ? 0 : failures + 1;
yield {domains, repos, ok, ts: new Date()};
await waitForVisible(pollDelay({ok, base: POLL_HEAVY, failures}));
}
})();
const domains = domainsState.domains ?? [];
const repos = domainsState.repos ?? [];
const _ok = domainsState.ok ?? false;
const _ts = domainsState.ts;
Domains
import {injectTocTop} from "./components/toc-sidebar.js";
import {withDocHelp} from "./components/doc-overlay.js";
import {openEntityModal} from "./components/entity-modal.js";
// ── 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("live-indicator", _liveEl);
const _h1 = document.querySelector("#observablehq-main h1");
if (_h1) { _h1.style.position = "relative"; withDocHelp(_h1, "/docs/domains"); }
// ── KPI row ────────────────────────────────────────────────────────────────────
const activeDomains = domains.filter(d => d.status === "active");
const archivedDomains = domains.filter(d => d.status === "archived");
const newestDomain = [...domains].sort((a, b) => b.created_at?.localeCompare(a.created_at ?? "") ?? 0)[0];
display(html`<div class="kpi-row-top">
<div class="kpi-card">
<div class="kpi-card-value">${domains.length}</div>
<div class="kpi-card-label">total domains</div>
</div>
<div class="kpi-card">
<div class="kpi-card-value">${activeDomains.length}</div>
<div class="kpi-card-label">active</div>
</div>
<div class="kpi-card">
<div class="kpi-card-value">${repos.length}</div>
<div class="kpi-card-label">total repos</div>
</div>
<div class="kpi-card">
<div class="kpi-card-value">${newestDomain?.name ?? "—"}</div>
<div class="kpi-card-label">newest domain</div>
</div>
</div>`);
Domain Cards
// Build repo index by domain_id
const reposByDomain = {};
for (const repo of repos) {
if (!reposByDomain[repo.domain_id]) reposByDomain[repo.domain_id] = [];
reposByDomain[repo.domain_id].push(repo);
}
if (domains.length === 0) {
display(html`<p class="dim">No domains found. API may be offline.</p>`);
} else {
display(html`<div class="domain-grid">${domains.map(d => {
const domainRepos = reposByDomain[d.id] ?? [];
return html`<div class="domain-card domain-status-${d.status} entity-row"
title="Click to view details">
<div class="domain-card-header">
<span class="domain-slug">${d.slug}</span>
<span class="domain-status-badge domain-status-badge-${d.status}">${d.status}</span>
</div>
<div class="domain-name">${d.name}</div>
${d.description ? html`<div class="domain-desc">${d.description.slice(0, 160)}${d.description.length > 160 ? " …" : ""}</div>` : ""}
<div class="domain-repos">
${domainRepos.length === 0
? html`<span class="no-repos">no repos registered</span>`
: domainRepos.map(r => html`<div class="repo-row">
<span class="repo-name">${r.name}</span>
${r.local_path ? html`<code class="repo-path">${r.local_path}</code>` : ""}
${r.remote_url ? html`<a class="repo-url" href=${r.remote_url} target="_blank">${r.remote_url.replace(/^https?:\/\//, "")}</a>` : ""}
</div>`)
}
</div>
</div>`;
})}</div>`);
}