feat(sources): admin page to add and remove git sources (TODO.md L4)
This commit is contained in:
@@ -0,0 +1,320 @@
|
||||
/* Brain of Reese — Git sources admin page (phase 35, task 04).
|
||||
*
|
||||
* The page module for /git-sources.html: the admin-only manager for the
|
||||
* stored git source list (git-sources table, phase 35 tasks 01/02).
|
||||
* This module is the single owner of the page's behaviour:
|
||||
*
|
||||
* • boot — initSharedHeader() (one cached whoami, shared with the
|
||||
* header toggling): anonymous → the sign-in gate shows and the
|
||||
* manager stays hidden (the exact Sources page gate pattern, and
|
||||
* NO /api/git-sources call is made); admin → gate hidden,
|
||||
* #git-sources-content revealed, loadSources().
|
||||
* • loadSources() — GET /api/git-sources → the table rows
|
||||
* (#git-sources-tbody), the env-fallback note's visibility
|
||||
* (from_env), and the empty state. URLs are ALWAYS rendered with
|
||||
* textContent — never innerHTML (they may embed user:pass@
|
||||
* credentials; phase 32's masking discipline). Non-2xx or a
|
||||
* network failure renders the role="alert" load error with a
|
||||
* retry button — never a stuck page.
|
||||
* • add — #git-source-form submit → POST /api/git-sources {url}.
|
||||
* §7.4 never-stale: the button disables + relabels "Adding…"
|
||||
* while the request is out, re-enables ("Add source") on success
|
||||
* AND failure. 201 clears the input, reloads the list, and
|
||||
* focuses the new row's Remove button (a11y); a failure (409
|
||||
* duplicate, 422 shape) shows the server detail inline under the
|
||||
* form (role="alert", 422 shape-aware like the tuning forms) and
|
||||
* keeps the input — the instruction survives.
|
||||
* • remove — a row's Remove button asks window.confirm first
|
||||
* (removal prunes the documents only on the NEXT sync — the
|
||||
* confirm says so). Cancel → nothing; ok → the row button
|
||||
* disables, DELETE /api/git-sources/{id}, loadSources(). A
|
||||
* failure shows a per-row role="alert" error and re-enables the
|
||||
* button. Env-fallback rows (id null — the list comes from
|
||||
* BOR_GIT_SOURCES, not the table) carry no Remove: nothing is
|
||||
* stored to remove — they show a "from .env" tag instead.
|
||||
* • announce(msg) — #git-sources-announcer (role=status,
|
||||
* aria-live=polite): the screen-reader confirmation for loads,
|
||||
* adds, and removals.
|
||||
*
|
||||
* Scope boundary (phase locked decisions): adding or removing a repo
|
||||
* does NOT clone, import, or prune — the header's Sync sources button
|
||||
* (module-owned in assets/header.js) performs that; the page's hint
|
||||
* box says so.
|
||||
*
|
||||
* The shared header module loads through this script's own relative
|
||||
* import ("./header.js") — a hoisted import evaluated before this body
|
||||
* runs (single-evaluation design: no direct <script> tag; esbuild
|
||||
* inlines it into the page bundle in the image build).
|
||||
*/
|
||||
|
||||
import { initSharedHeader } from "./header.js";
|
||||
|
||||
/* ---------- page elements (git-sources.html, task 04) ---------- */
|
||||
const gateEl = document.querySelector("#git-sources-gate");
|
||||
const contentEl = document.querySelector("#git-sources-content");
|
||||
const formEl = document.querySelector("#git-source-form");
|
||||
const urlInput = document.querySelector("#git-source-url");
|
||||
const addBtn = document.querySelector("#git-source-add");
|
||||
const addError = document.querySelector("#git-source-error");
|
||||
const loadErrorEl = document.querySelector("#git-sources-load-error");
|
||||
const loadErrorText = document.querySelector("#git-sources-load-error-text");
|
||||
const retryBtn = document.querySelector("#git-sources-retry");
|
||||
const tableWrap = document.querySelector("#git-sources-table-wrap");
|
||||
const tbody = document.querySelector("#git-sources-tbody");
|
||||
const emptyEl = document.querySelector("#git-sources-empty");
|
||||
const envNote = document.querySelector("#git-sources-env-note");
|
||||
const announcer = document.querySelector("#git-sources-announcer");
|
||||
|
||||
/* Polite live region: the screen-reader confirmation for loads, adds,
|
||||
and removals (the phase-15 announcer pattern). */
|
||||
function announce(message) {
|
||||
if (announcer) announcer.textContent = message;
|
||||
}
|
||||
|
||||
/* Added date — localized (toLocaleString); env-fallback rows carry
|
||||
added_at null, and a corrupt timestamp must not blank the cell. */
|
||||
function fmtDate(iso) {
|
||||
if (!iso) return "—";
|
||||
try {
|
||||
return new Date(iso).toLocaleString();
|
||||
} catch {
|
||||
return "—";
|
||||
}
|
||||
}
|
||||
|
||||
/* FastAPI error bodies: a string detail or the validation-error array
|
||||
(the first entry's msg is the human line). Same extraction as
|
||||
tuning.js — 422 shape-aware. */
|
||||
async function apiDetail(r, fallback) {
|
||||
try {
|
||||
const data = await r.json();
|
||||
if (Array.isArray(data.detail) && data.detail[0] && data.detail[0].msg) {
|
||||
return String(data.detail[0].msg);
|
||||
}
|
||||
if (typeof data.detail === "string" && data.detail) return data.detail;
|
||||
} catch {
|
||||
/* non-JSON error body */
|
||||
}
|
||||
return fallback;
|
||||
}
|
||||
|
||||
/* ---------- load / render ---------- */
|
||||
|
||||
/* GET /api/git-sources → the table rows + env note + empty state.
|
||||
The load error (role="alert" + retry) is the ONLY terminal state a
|
||||
failed fetch may reach — never a stuck page. */
|
||||
async function loadSources() {
|
||||
let r;
|
||||
try {
|
||||
r = await fetch("/api/git-sources");
|
||||
} catch {
|
||||
showLoadError("Could not reach the server — is the app running?");
|
||||
return;
|
||||
}
|
||||
if (!r.ok) {
|
||||
showLoadError(await apiDetail(r, `The server could not list the git sources (${r.status}).`));
|
||||
return;
|
||||
}
|
||||
let data;
|
||||
try {
|
||||
data = await r.json();
|
||||
} catch {
|
||||
showLoadError("The server sent an unreadable list — try again.");
|
||||
return;
|
||||
}
|
||||
hideLoadError();
|
||||
const sources = Array.isArray(data.sources) ? data.sources : [];
|
||||
renderSources(sources, data.from_env === true);
|
||||
announce(`${sources.length} git source${sources.length === 1 ? "" : "s"} listed.`);
|
||||
}
|
||||
|
||||
function showLoadError(message) {
|
||||
if (loadErrorText) loadErrorText.textContent = message;
|
||||
if (loadErrorEl) loadErrorEl.hidden = false;
|
||||
// The list state is unknown — hide the table AND the empty state so
|
||||
// the error is the only claim about the list's contents.
|
||||
if (tableWrap) tableWrap.hidden = true;
|
||||
if (emptyEl) emptyEl.hidden = true;
|
||||
}
|
||||
|
||||
function hideLoadError() {
|
||||
if (loadErrorEl) loadErrorEl.hidden = true;
|
||||
if (loadErrorText) loadErrorText.textContent = "";
|
||||
}
|
||||
|
||||
function renderSources(sources, fromEnv) {
|
||||
if (envNote) envNote.hidden = !fromEnv;
|
||||
if (tbody) {
|
||||
tbody.replaceChildren();
|
||||
for (const s of sources) tbody.appendChild(makeRow(s));
|
||||
}
|
||||
const hasRows = sources.length > 0;
|
||||
if (tableWrap) tableWrap.hidden = !hasRows;
|
||||
if (emptyEl) emptyEl.hidden = hasRows;
|
||||
}
|
||||
|
||||
/* One row: the URL in a mono <code> (textContent only — URLs may
|
||||
contain credentials), the localized added date ("—" for env
|
||||
fallback rows), and the per-row Remove button — or the "from .env"
|
||||
tag for env-fallback rows (id null: nothing is stored to remove;
|
||||
the env note says where the active list comes from). */
|
||||
const REMOVE_ICON =
|
||||
'<svg aria-hidden="true" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.8" stroke-linecap="round"><path d="M5 7h14M10 7V5h4v2M8.5 7l.7 12h5.6l.7-12"/></svg>';
|
||||
|
||||
function makeRow(s) {
|
||||
const tr = document.createElement("tr");
|
||||
if (s.id) tr.dataset.id = s.id;
|
||||
|
||||
const urlTd = document.createElement("td");
|
||||
urlTd.className = "git-source-url-cell";
|
||||
urlTd.title = s.url; // full URL on hover (long URLs scroll the wrapper)
|
||||
const code = document.createElement("code");
|
||||
code.textContent = s.url; // rendered as text, never as HTML
|
||||
urlTd.appendChild(code);
|
||||
tr.appendChild(urlTd);
|
||||
|
||||
const addedTd = document.createElement("td");
|
||||
addedTd.textContent = fmtDate(s.added_at);
|
||||
tr.appendChild(addedTd);
|
||||
|
||||
const actTd = document.createElement("td");
|
||||
actTd.className = "git-source-actions-cell";
|
||||
if (s.id) {
|
||||
const btn = document.createElement("button");
|
||||
btn.type = "button";
|
||||
btn.className = "git-source-remove";
|
||||
btn.setAttribute("aria-label", `Remove git source: ${s.url}`);
|
||||
btn.innerHTML = REMOVE_ICON + "<span>Remove</span>";
|
||||
const rowError = document.createElement("span");
|
||||
rowError.className = "git-source-row-error";
|
||||
rowError.setAttribute("role", "alert");
|
||||
rowError.hidden = true;
|
||||
btn.addEventListener("click", () => removeSource(s, btn, rowError));
|
||||
actTd.append(btn, rowError);
|
||||
} else {
|
||||
const tag = document.createElement("span");
|
||||
tag.className = "git-source-env-tag";
|
||||
tag.textContent = "from .env";
|
||||
actTd.appendChild(tag);
|
||||
}
|
||||
tr.appendChild(actTd);
|
||||
return tr;
|
||||
}
|
||||
|
||||
/* ---------- remove (DELETE /api/git-sources/{id}) ----------
|
||||
* Removal does not prune anything immediately — the next sync does
|
||||
* (phase scope boundary), so the confirm says exactly that. Cancel →
|
||||
* nothing; a failed delete → per-row role="alert" error + re-enabled
|
||||
* button (never a stuck row); success → the list reloads. */
|
||||
async function removeSource(s, btn, rowError) {
|
||||
const ok = window.confirm(
|
||||
"Remove this git source from the list? Its documents stay indexed until the next sync prunes them.",
|
||||
);
|
||||
if (!ok) return;
|
||||
btn.disabled = true; // one delete per click
|
||||
rowError.hidden = true;
|
||||
try {
|
||||
const r = await fetch(`/api/git-sources/${encodeURIComponent(s.id)}`, { method: "DELETE" });
|
||||
if (!r.ok) {
|
||||
rowError.textContent = await apiDetail(r, "Could not remove the git source — try again.");
|
||||
rowError.hidden = false;
|
||||
btn.disabled = false;
|
||||
return;
|
||||
}
|
||||
announce("Git source removed.");
|
||||
await loadSources(); // 204: the server confirmed — the list re-renders
|
||||
} catch {
|
||||
rowError.textContent = "Could not remove the git source — is the app reachable?";
|
||||
rowError.hidden = false;
|
||||
btn.disabled = false;
|
||||
}
|
||||
}
|
||||
|
||||
/* ---------- add (POST /api/git-sources) ---------- */
|
||||
|
||||
if (formEl && urlInput && addBtn) {
|
||||
formEl.addEventListener("submit", async (e) => {
|
||||
e.preventDefault();
|
||||
// Client-side non-empty check (the input is `required` too — the
|
||||
// browser's native prompt is the first line, this one the second).
|
||||
const url = urlInput.value.trim();
|
||||
if (!url) {
|
||||
if (addError) {
|
||||
addError.textContent = "Enter a git URL to add.";
|
||||
addError.hidden = false;
|
||||
}
|
||||
return;
|
||||
}
|
||||
if (addError) addError.hidden = true; // a new attempt starts clean
|
||||
addBtn.disabled = true; // §7.4: one POST per click
|
||||
addBtn.textContent = "Adding…";
|
||||
try {
|
||||
const r = await fetch("/api/git-sources", {
|
||||
method: "POST",
|
||||
headers: { "Content-Type": "application/json" },
|
||||
body: JSON.stringify({ url }),
|
||||
});
|
||||
if (r.ok) {
|
||||
let createdId = null;
|
||||
try {
|
||||
createdId = (await r.json()).id ?? null;
|
||||
} catch {
|
||||
/* the 201 body is advisory — the reload is the truth */
|
||||
}
|
||||
urlInput.value = ""; // 201: the source is stored
|
||||
announce("Git source added.");
|
||||
await loadSources(); // the new row lands in the table
|
||||
focusNewRow(createdId); // a11y: land the caret on the new row
|
||||
return;
|
||||
}
|
||||
// 409 duplicate / 422 shape / anything else: the server detail
|
||||
// inline (never echoing a URL the server wouldn't), form kept —
|
||||
// the input survives so the fix is one edit, not a re-type.
|
||||
if (addError) {
|
||||
addError.textContent = await apiDetail(r, "Could not add the git source — try again.");
|
||||
addError.hidden = false;
|
||||
}
|
||||
} catch {
|
||||
if (addError) {
|
||||
addError.textContent = "Could not add the git source — is the app reachable?";
|
||||
addError.hidden = false;
|
||||
}
|
||||
} finally {
|
||||
addBtn.disabled = false; // never stale — success OR failure
|
||||
addBtn.textContent = "Add source";
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/* After a successful add, focus the new row's Remove button so the
|
||||
keyboard/screen-reader user lands where the new data is. The 201
|
||||
body carries the row id (tr[data-id]); without one, the first row
|
||||
is the fallback (the list is small and ordered). */
|
||||
function focusNewRow(createdId) {
|
||||
if (!tbody) return;
|
||||
const row = createdId
|
||||
? tbody.querySelector(`tr[data-id="${CSS.escape(createdId)}"]`)
|
||||
: null;
|
||||
const target = (row || tbody.querySelector("tr"))?.querySelector(".git-source-remove");
|
||||
if (target) target.focus();
|
||||
}
|
||||
|
||||
/* ---------- retry + boot ---------- */
|
||||
|
||||
if (retryBtn) retryBtn.addEventListener("click", () => loadSources());
|
||||
|
||||
(async () => {
|
||||
// The shared header FIRST (Sign in/out + the admin-only nav links +
|
||||
// the Sync button — one cached whoami), then the gate: anonymous
|
||||
// visitors get the gate and NO /api/git-sources call (the Sources
|
||||
// page gate pattern); the admin gets the manager.
|
||||
const admin = await initSharedHeader();
|
||||
if (!admin) {
|
||||
if (gateEl) gateEl.hidden = false;
|
||||
if (contentEl) contentEl.hidden = true; // ships hidden — stays hidden
|
||||
return;
|
||||
}
|
||||
if (gateEl) gateEl.hidden = true;
|
||||
if (contentEl) contentEl.hidden = false;
|
||||
await loadSources();
|
||||
})();
|
||||
Reference in New Issue
Block a user