Reservation lease time; reservations by MAC address or client ID

- A reservation can have its own lease time (--lease-time, the
  reservation dialog), over the subnet's. Schema migration 6.
- A reservation with a MAC address and a client ID matches either one
  (a dual-boot machine sends two client IDs from one MAC); before, it
  was found by MAC and then refused. A lease of the reserved address by
  the client's other identity counts as its own.
- The Leases page shows a client's client ID; reserving a lease uses
  both, or one with --by / the dialog's choice.

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

internal/web/static/assets/pages/leases.js

@@ -16,7 +16,8 @@ export function leasesTable(leases, done, opts = {}) {
   const write = can("leases", true), config = can("config", true);
   return table([
     { label: "Address", render: (l) => h("span", { class: "mono" }, l.ip) },
-    { label: "MAC address", render: (l) => h("span", { class: "mono" }, l.mac || "–") },
+    { label: "Client", render: (l) => h("span", { class: "mono" }, l.mac || "–",
+      l.client_id ? h("div", { class: "muted small", title: "Client identifier (option 61)" }, "id " + (l.client_id.length > 20 ? l.client_id.slice(0, 18) + "…" : l.client_id)) : null) },
     { label: "Host name", render: leaseHost },
     { label: "State", render: (l) => [stateBadge(l.state), l.reservation ? [" ", badge("reserved", "accent")] : null] },
     { label: "Ends", render: (l) => time(l.end) },
@@ -24,7 +25,7 @@ export function leasesTable(leases, done, opts = {}) {
     opts.subnet ? null : { label: "Subnet", render: (l) => l.subnet || "–" },
     { label: "Interface", render: (l) => h("span", { class: "mono" }, l.interface) },
     { label: "", tdClass: "actions-cell", render: (l) => [
-      config && !l.reservation && l.mac && l.state !== "declined" ? h("button", { class: "small reveal", title: "Give this client this address from now on", onclick: () => reserve(l, done) }, "Reserve") : null, " ",
+      config && !l.reservation && (l.mac || l.client_id) && l.state !== "declined" ? h("button", { class: "small reveal", title: "Give this client this address from now on", onclick: () => reserve(l, done) }, "Reserve") : null, " ",
       write ? h("button", { class: "small reveal", title: "Forget this lease: the address is free at once", onclick: () => del(l, done) }, "Delete") : null,
     ] },
   ].filter(Boolean), leases, { empty: opts.empty || "No leases." });
@@ -36,14 +37,17 @@ function stateBadge(st) {
 
 async function reserve(l, done) {
   const host = input({ value: l.hostname || "", placeholder: "host name (optional)" });
+  const by = select([["both", "MAC address or client ID (either one)"], ["mac", "MAC address only"], ["client_id", "client ID only"]], "both");
   const err = h("div");
   await modal("Reserve " + l.ip, h("div", null,
-    h("p", null, l.mac + " keeps " + l.ip + " from now on."),
-    h("div", { class: "form-grid" }, h("label", null, "Host name"), host), err), [
+    h("p", null, (l.mac || "The client") + " keeps " + l.ip + " from now on."),
+    h("div", { class: "form-grid" }, h("label", null, "Host name"), host,
+      l.client_id && l.mac ? [h("label", null, "Know it by"), by, h("label"),
+        h("div", { class: "help" }, "It sent the client ID ", h("span", { class: "mono" }, l.client_id), ". With either one, it gets the address whichever system it boots.")] : null), err), [
     { label: "Cancel", value: null },
     { label: "Reserve", kind: "primary", onclick: async () => {
       try {
-        await change("POST", "/leases/" + l.ip + "/reserve", { hostname: host.value.trim() });
+        await change("POST", "/leases/" + l.ip + "/reserve", { hostname: host.value.trim(), by: l.client_id && l.mac ? by.value : undefined });
         done();
         return true;
       } catch (e) {