Subnets served per interface, pools, reservations, options at three levels, leases in SQLite saved before the ACK, ping and decline conflict checks, validated changes with history and undo, users and tokens, an audit log, a Kea importer, a sandboxed systemd unit and Debian packages. Tested with real udhcpc and dhcpcd clients in Docker (scripts/e2e.sh). Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>
40 lines
2.4 KiB
JavaScript
40 lines
2.4 KiB
JavaScript
// Activity: the latest DHCP messages, refreshed every few seconds.
|
|
import { h, mount, input, select, debounce } from "../ui.js";
|
|
import { get } from "../api.js";
|
|
import { onLeave } from "../app.js";
|
|
|
|
export async function render(el, params, query) {
|
|
const ifaces = await get("/interfaces");
|
|
const mac = input({ placeholder: "MAC address", value: query.get("mac") || "", class: "mono" });
|
|
const iface = select([["", "all interfaces"], ...ifaces.filter((i) => i.subnets.length).map((i) => [i.name, i.name])], query.get("interface") || "");
|
|
const out = h("div");
|
|
let live = true;
|
|
const pause = h("button", { onclick: () => { live = !live; pause.textContent = live ? "Pause" : "Resume"; } }, "Pause");
|
|
const draw = async () => {
|
|
const evs = await get("/events", { mac: mac.value.trim(), interface: iface.value, limit: 300 });
|
|
mount(out, evs.length ? h("div", { class: "table-wrap" }, h("table", { class: "activity" },
|
|
h("thead", null, h("tr", null, ["Time", "Interface", "Message", "Client", "Address", "Host name", ""].map((t) => h("th", null, t)))),
|
|
h("tbody", null, evs.map((e) => {
|
|
const t = e.type.replace(/^DHCP/, "");
|
|
return h("tr", null,
|
|
h("td", { class: "mono small" }, new Date(e.time).toLocaleTimeString(undefined, { hourCycle: "h23" })),
|
|
h("td", { class: "mono" }, e.interface),
|
|
h("td", null, h("strong", { class: "type-" + t.split(" ")[0] }, t)),
|
|
h("td", { class: "mono" }, e.mac ? h("a", { href: "#", onclick: (ev) => { ev.preventDefault(); mac.value = e.mac; draw(); } }, e.mac) : ""),
|
|
h("td", { class: "mono" }, e.ip || ""),
|
|
h("td", null, e.hostname || ""),
|
|
h("td", { class: "detail" }, e.detail || ""));
|
|
})))) : h("div", { class: "empty" }, "No DHCP messages yet" + (mac.value || iface.value ? " that match." : ".")));
|
|
};
|
|
mac.addEventListener("input", debounce(draw, 300));
|
|
iface.addEventListener("change", draw);
|
|
mount(el,
|
|
h("div", { class: "page-head" }, h("div", { class: "grow" }, h("h1", null, "Activity"),
|
|
h("div", { class: "muted" }, "The latest DHCP messages Steward received and sent, newest first. Click a MAC address to follow one client."))),
|
|
h("div", { class: "filter-row" }, mac, iface, pause),
|
|
h("div", { class: "panel" }, out));
|
|
await draw();
|
|
const t = setInterval(() => { if (live) draw().catch(() => {}); }, 3000);
|
|
onLeave(() => clearInterval(t));
|
|
}
|