|
// retoor <retoor@molodetz.nl>
|
|
|
|
import { Http } from "./Http.js";
|
|
import { Poller } from "./Poller.js";
|
|
|
|
export class ContainerList {
|
|
constructor(root) {
|
|
this.root = root;
|
|
this.endpoint = root.dataset.endpoint;
|
|
this.body = document.getElementById("cm-admin-rows");
|
|
this.pollMs = 4000;
|
|
}
|
|
|
|
init() {
|
|
this.poller = new Poller(() => this.refresh(), this.pollMs, { immediate: false });
|
|
}
|
|
|
|
escape(value) {
|
|
const span = document.createElement("span");
|
|
span.textContent = value == null ? "" : String(value);
|
|
return span.innerHTML;
|
|
}
|
|
|
|
async refresh() {
|
|
const instances = (await Http.getJson(this.endpoint)).instances || [];
|
|
if (!this.body) return;
|
|
if (!instances.length) {
|
|
this.body.innerHTML = `<tr><td colspan="6" class="admin-empty">No container instances yet. Open a project's container manager to launch one.</td></tr>`;
|
|
return;
|
|
}
|
|
this.body.innerHTML = instances.map((inst) => this.row(inst)).join("");
|
|
}
|
|
|
|
row(inst) {
|
|
const uid = this.escape(inst.uid);
|
|
const project = inst.project_slug
|
|
? `<a class="cm-row-project" href="/projects/${this.escape(inst.project_slug)}/containers">${this.escape(inst.project_title || inst.project_slug)}</a>`
|
|
: `<span class="cm-muted">-</span>`;
|
|
const ingress = inst.ingress_slug
|
|
? `<a href="/p/${this.escape(inst.ingress_slug)}" target="_blank" rel="noopener">/p/${this.escape(inst.ingress_slug)}</a>`
|
|
: `<span class="cm-muted">-</span>`;
|
|
return `<tr class="cm-row" data-uid="${uid}">
|
|
<td><a class="cm-row-name" href="/admin/containers/${uid}">${this.escape(inst.name)}</a></td>
|
|
<td>${project}</td>
|
|
<td><span class="cm-badge cm-${this.escape(inst.status)}">${this.escape(inst.status)}</span></td>
|
|
<td>${ingress}</td>
|
|
<td>${this.escape(inst.restart_policy || "never")}</td>
|
|
<td><a class="admin-btn admin-btn-sm" href="/admin/containers/${uid}">Manage →</a></td>
|
|
</tr>`;
|
|
}
|
|
}
|