feat(admin): apix-admin UI at admin.api-index.org

Internal maintainer dashboard: global stats, sandbox list with tier-filter and pagination, sandbox drill-down with D3 world map, tier-promotion form. API-key auth via HttpOnly cookie. Port 8084, rolling a/b deploy alongside the existing service pairs. - apix-common: AdminSandboxSummary, AdminSandboxListResponse, AdminStatsResponse DTOs - apix-registry: AdminResource (4 endpoints), SandboxService.listAllSandboxes + getGlobalStats - apix-registry: SandboxResource GET /{uuid}/dashboard endpoint (was missing — fixes portal 500) - apix-portal: RegistryClient path corrected to /dashboard - apix-admin: new Quarkus module — auth filter, registry REST client, 3 resources, 6 Qute templates, admin.js - infra: Dockerfile.admin, docker-compose admin-a/b services, Caddyfile admin.api-index.org block - scripts: deploy-bluegreen.sh extended for admin-a/b Co-Authored-By: Mira Rehfeld <noreply@anthropic.com>
2026-05-16 21:18:48 +02:00
parent e385d05ce1
commit 82a379e536
32 changed files with 1300 additions and 32 deletions
@@ -0,0 +1,136 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="UTF-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<title>{dashboard.name} · APIX Admin</title>
+<style>
+* { box-sizing: border-box; margin: 0; padding: 0; }
+body { background: #0d1117; color: #c9d1d9; font-family: 'SF Mono','Consolas','Fira Code',monospace; font-size: 14px; }
+a { color: #58a6ff; text-decoration: none; }
+a:hover { text-decoration: underline; }
+nav {
+  display: flex; align-items: center; gap: 1.5rem;
+  padding: 0.75rem 1.5rem; border-bottom: 1px solid #21262d; background: #161b22;
+}
+.nav-logo { color: #8b949e; font-size: 0.75rem; }
+.nav-logo span { color: #e6edf3; font-weight: 600; font-size: 0.9rem; }
+.nav-link { font-size: 0.8rem; color: #8b949e; }
+.nav-link:hover { color: #e6edf3; }
+.nav-right { margin-left: auto; }
+
+.header { padding: 1rem 1.5rem; border-bottom: 1px solid #21262d; display: flex; align-items: center; gap: 1rem; }
+.sb-name { font-size: 1rem; color: #e6edf3; font-weight: 600; }
+.tier-badge {
+  background: #161b22; border: 1px solid #30363d;
+  color: #8b949e; padding: 0.1rem 0.5rem; border-radius: 12px;
+  font-size: 0.7rem; letter-spacing: 0.05em;
+}
+.sb-id { font-size: 0.75rem; color: #484f58; }
+
+.stats-grid {
+  display: grid; grid-template-columns: repeat(auto-fit, minmax(200px,1fr));
+  gap: 1px; background: #21262d; border-bottom: 1px solid #21262d;
+}
+.stat { background: #0d1117; padding: 1rem 1.5rem; }
+.stat-label { font-size: 0.65rem; color: #484f58; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.3rem; }
+.stat-value { font-size: 1.4rem; color: #e6edf3; font-weight: 600; }
+.stat-sub { font-size: 0.7rem; color: #484f58; margin-top: 0.2rem; }
+
+#map-wrap { background: #060d18; }
+#world-map { display: block; width: 100%; }
+
+.actions { padding: 1.5rem; border-top: 1px solid #21262d; display: flex; gap: 1rem; flex-wrap: wrap; }
+.actions-title { width: 100%; font-size: 0.7rem; color: #484f58; text-transform: uppercase; letter-spacing: 0.06em; margin-bottom: 0.5rem; }
+form { display: flex; gap: 0.5rem; align-items: center; }
+select, button {
+  background: #161b22; border: 1px solid #30363d; color: #c9d1d9;
+  font-family: inherit; font-size: 0.8rem;
+  border-radius: 4px; padding: 0.4rem 0.7rem; cursor: pointer;
+}
+select:focus, button:focus { outline: none; border-color: #58a6ff; }
+button.promote { background: #238636; border-color: #238636; color: #fff; font-weight: 600; }
+button.promote:hover { background: #2ea043; }
+
+.footer { padding: 0.75rem 1.5rem; border-top: 1px solid #21262d; font-size: 0.7rem; color: #484f58; }
+
+@keyframes star-glow {
+  0%,100% { filter: drop-shadow(0 0 3px #ffd700) drop-shadow(0 0 6px #ffd70066); }
+  50% { filter: drop-shadow(0 0 8px #ffd700) drop-shadow(0 0 18px #ffd700aa); }
+}
+.registrar-star { font-size: 14px; fill: #ffd700; dominant-baseline: central; text-anchor: middle; animation: star-glow 2.4s ease-in-out infinite; }
+@keyframes blink-pulse {
+  0% { opacity:0; r:2; } 25% { opacity:0.9; r:5; } 65% { opacity:0.4; r:4; } 100% { opacity:0; r:2; }
+}
+.agent-blink { fill: #3d8bfd; opacity:0; animation: blink-pulse 2.8s ease-in-out infinite; }
+</style>
+</head>
+<body>
+<nav>
+  <div class="nav-logo">APIX · <span>Admin</span></div>
+  <a class="nav-link" href="/">Dashboard</a>
+  <a class="nav-link" href="/sandboxes">Sandboxes</a>
+  <div class="nav-right"><a class="nav-link" href="/login/logout">Sign out</a></div>
+</nav>
+
+<div class="header">
+  <span class="sb-name">{dashboard.name}</span>
+  <span class="tier-badge">{dashboard.tier}</span>
+  <span class="sb-id">{dashboard.sandboxId}</span>
+</div>
+
+<div class="stats-grid">
+  <div class="stat">
+    <div class="stat-label">Services</div>
+    <div class="stat-value">{#if dashboard.usage.get('SERVICE_REGISTERED') != null}{dashboard.usage.get('SERVICE_REGISTERED')}{#else}0{/if}</div>
+    <div class="stat-sub">of {#if dashboard.maxServices != null}{dashboard.maxServices}{#else}∞{/if} allowed</div>
+  </div>
+  <div class="stat">
+    <div class="stat-label">Searches</div>
+    <div class="stat-value">{#if dashboard.usage.get('SERVICE_SEARCHED') != null}{dashboard.usage.get('SERVICE_SEARCHED')}{#else}0{/if}</div>
+    <div class="stat-sub">capability discovery calls</div>
+  </div>
+  <div class="stat">
+    <div class="stat-label">Rate limit</div>
+    <div class="stat-value">{dashboard.ratePerMinute}</div>
+    <div class="stat-sub">req / min</div>
+  </div>
+  <div class="stat">
+    <div class="stat-label">Expires</div>
+    <div class="stat-value" id="expires-val">—</div>
+    <div class="stat-sub" id="expires-raw">{dashboard.expiresAt}</div>
+  </div>
+  {#if dashboard.registrarLocation != null}
+  <div class="stat">
+    <div class="stat-label">Location</div>
+    <div class="stat-value" style="font-size:1rem">{dashboard.registrarLocation}</div>
+    <div class="stat-sub">owner-declared</div>
+  </div>
+  {/if}
+</div>
+
+<div id="map-wrap"><svg id="world-map"></svg></div>
+
+<div class="actions">
+  <div class="actions-title">Admin actions</div>
+  <form method="POST" action="/sandboxes/{dashboard.sandboxId}/promote">
+    <select name="tier">
+      <option value="FREE">FREE</option>
+      <option value="STANDARD">STANDARD</option>
+      <option value="PROFESSIONAL">PROFESSIONAL</option>
+      <option value="COMMUNITY">COMMUNITY</option>
+      <option value="FOUNDER">FOUNDER</option>
+      <option value="DEMO">DEMO</option>
+    </select>
+    <button type="submit" class="promote">Promote tier</button>
+  </form>
+</div>
+
+<div class="footer">sandbox id: {dashboard.sandboxId} · created {dashboard.createdAt}</div>
+
+<script>var __D = {dataJson.raw};</script>
+<script src="https://cdn.jsdelivr.net/npm/d3@7/dist/d3.min.js"></script>
+<script src="https://cdn.jsdelivr.net/npm/topojson-client@3/dist/topojson-client.min.js"></script>
+<script src="/admin.js"></script>
+</body>
+</html>