[feat](trx-frontend-http): add Plugins tab showing registered frontends

Add GET /frontends API endpoint returning registered frontend names as
JSON. Add Plugins tab to the web UI that fetches and displays the list.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
Signed-off-by: Stanislaw Grams <stanislawgrams@gmail.com>
This commit is contained in:
2026-02-08 13:59:51 +01:00
parent d7d5674683
commit 7eaa39ea4a
4 changed files with 36 additions and 3 deletions
@@ -615,6 +615,18 @@ document.querySelector(".tab-bar").addEventListener("click", (e) => {
connect();
// --- Plugins tab ---
fetch("/frontends").then(r => r.json()).then(names => {
const list = document.getElementById("plugins-list");
if (!Array.isArray(names) || names.length === 0) {
list.innerHTML = '<div class="plugin-item" style="color:var(--text-muted);">No frontends registered</div>';
return;
}
list.innerHTML = names.map(n => `<div class="plugin-item">${n}</div>`).join("");
}).catch(err => {
console.error("Failed to fetch frontends", err);
});
// --- Signal measurement ---
const sigMeasureBtn = document.getElementById("sig-measure-btn");
const sigClearBtn = document.getElementById("sig-clear-btn");
@@ -19,6 +19,7 @@
</div>
<div class="tab-bar">
<button class="tab active" data-tab="main">Main</button>
<button class="tab" data-tab="plugins">Plugins</button>
<button class="tab" data-tab="about">About</button>
</div>
<div id="tab-main" class="tab-panel">
@@ -116,6 +117,9 @@
</div>
</div>
</div>
<div id="tab-plugins" class="tab-panel" style="display:none;">
<div id="plugins-list"></div>
</div>
<div id="tab-about" class="tab-panel" style="display:none;">
<table class="about-table">
<tr><td>Server</td><td id="about-server-ver">--</td></tr>
@@ -157,6 +157,8 @@ small { color: var(--text-muted); }
.about-table td { padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--border); }
.about-table tr:last-child td { border-bottom: none; }
.about-table td:first-child { color: var(--text-muted); width: 40%; }
.plugin-item { padding: 0.5rem 0.6rem; border-bottom: 1px solid var(--border); color: var(--text); }
.plugin-item:last-child { border-bottom: none; }
.footer { display: flex; justify-content: space-between; align-items: baseline; margin-top: 1.1rem; }
.full-row { grid-column: 1 / -1; }
.copyright { color: var(--text-muted); font-size: 0.75rem; opacity: 0.7; }