${isSigned ? 'Untrusted Plugin' : 'Unsigned Plugin'}
${pluginId}
${statusText}
${fpText}
Type confirm below to load this plugin:
`;
document.body.appendChild(modal);
const input = document.getElementById("plugin-confirm-input");
const loadBtn = document.getElementById("plugin-confirm-load");
const cancelBtn = document.getElementById("plugin-confirm-cancel");
input.addEventListener("input", () => {
const match = input.value.trim().toLowerCase() === "confirm";
loadBtn.disabled = !match;
loadBtn.classList.toggle("opacity-50", !match);
loadBtn.classList.toggle("cursor-not-allowed", !match);
loadBtn.classList.toggle("hover:bg-emerald-800/60", match);
});
cancelBtn.addEventListener("click", () => modal.remove());
modal.addEventListener("click", (e) => { if (e.target === modal) modal.remove(); });
loadBtn.addEventListener("click", async () => {
if (loadBtn.disabled) return;
loadBtn.disabled = true;
loadBtn.textContent = "Loading…";
try {
const res = await fetch(`/api/clients/${clientId}/plugins/${pluginId}/load`, {
method: "POST",
headers: { "Content-Type": "application/json" },
body: JSON.stringify({ confirmed: true }),
});
if (!res.ok) {
const text = await res.text();
alert(`Plugin load failed: ${text}`);
} else {
window.open(`/plugins/${pluginId}?clientId=${clientId}`, "_blank", "noopener");
}
} catch {
alert("Plugin load failed");
}
modal.remove();
});
input.focus();
}
async function loadPluginsForClient(clientId) {
const section = document.getElementById("plugin-section");
const container = document.getElementById("plugin-menu");
if (!section || !container) return;
container.innerHTML = "";
section.classList.add("hidden");
try {
const res = await fetch(`/api/clients/${clientId}/plugins`);
if (!res.ok) return;
const data = await res.json();
const plugins = Array.isArray(data.plugins) ? data.plugins : [];
if (!plugins.length) return;
section.classList.remove("hidden");
for (const plugin of plugins) {
if (plugin.enabled === false) {
continue;
}
const btn = document.createElement("button");
btn.className =
"w-full text-left px-3 py-2 rounded-lg border border-slate-700 bg-slate-800/60 hover:bg-slate-700 text-slate-100 flex items-center gap-2 justify-between";
btn.dataset.plugin = plugin.id;
btn.dataset.loaded = plugin.loaded ? "true" : "false";
if (plugin.lastError) {
btn.title = `Last error: ${plugin.lastError}`;
}
const sig = plugin.signature;
if (sig && sig.signed && !sig.valid) {
btn.disabled = true;
btn.classList.add("opacity-50", "cursor-not-allowed");
btn.title = "Plugin signature is invalid — cannot load";
}
const label = document.createElement("span");
label.className = "flex items-center gap-1";
const labelIcon = document.createElement("i");
labelIcon.className = "fa-solid fa-puzzle-piece";
label.appendChild(labelIcon);
label.append(` ${plugin.name || plugin.id}`);
if (sig) {
const trustIcon = document.createElement("i");
if (sig.signed && !sig.valid) {
trustIcon.className = "fa-solid fa-shield-xmark text-red-400 text-xs ml-1";
trustIcon.title = "Invalid signature";
} else if (sig.signed && sig.valid && sig.trusted) {
trustIcon.className = "fa-solid fa-shield-check text-emerald-400 text-xs ml-1";
trustIcon.title = "Trusted";
} else if (sig.signed && sig.valid && !sig.trusted) {
trustIcon.className = "fa-solid fa-shield text-yellow-400 text-xs ml-1";
trustIcon.title = "Signed but untrusted";
} else {
trustIcon.className = "fa-solid fa-shield-halved text-orange-400 text-xs ml-1";
trustIcon.title = "Unsigned";
}
label.appendChild(trustIcon);
}
const badge = document.createElement("span");
badge.className =
"text-[10px] uppercase tracking-wider px-2 py-0.5 rounded-full border" +
(plugin.loaded
? " border-emerald-600 text-emerald-300 bg-emerald-900/40"
: " border-slate-600 text-slate-300 bg-slate-800/60");
badge.textContent = plugin.loaded ? "loaded" : "available";
btn.appendChild(label);
btn.appendChild(badge);
container.appendChild(btn);
if (plugin.loaded) {
const unloadBtn = document.createElement("button");
unloadBtn.className =
"w-full text-left px-3 py-2 rounded-lg border border-red-800 bg-red-900/30 hover:bg-red-800/60 text-red-100 flex items-center gap-2";
unloadBtn.dataset.pluginUnload = plugin.id;
const unloadIcon = document.createElement("i");
unloadIcon.className = "fa-solid fa-plug-circle-xmark";
const unloadText = document.createElement("span");
unloadText.textContent = `Unload ${plugin.name || plugin.id}`;
unloadBtn.appendChild(unloadIcon);
unloadBtn.appendChild(unloadText);
container.appendChild(unloadBtn);
}
}
} catch {
// ignore
}
}
function initializeRenderer() {
const { renderMerge } = createRenderer({
grid,
totalPill,
pageLabel,
openMenu: (id, x, y) => {
applyMenuSupportRules(id);
openMenu(id, x, y, setContext, { isOnline: isClientOnline(id) });
loadPluginsForClient(id);
},
openModal,
requestPreview,
requestThumbnail,
pingClient: (id) => sendCommand(id, "ping"),
userRole: currentUser?.role,
});
registerRenderer(renderMerge);
refreshGroupFilter();
loadWithOptions();
startAutoRefresh();
if (typeof anime !== "undefined") {
anime
.timeline({ easing: "easeOutQuad" })
.add({
targets: "main > div > div:first-child",
opacity: [0, 1],
translateY: [15, 0],
duration: 500,
})
.add(
{
targets: "main > div > div:nth-child(2)",
opacity: [0, 1],
translateY: [15, 0],
duration: 500,
},
"-=350",
);
}
}
if (logoutBtn && !logoutBtn.dataset.boundLogout) {
logoutBtn.dataset.boundLogout = "true";
logoutBtn.addEventListener("click", async () => {
if (!confirm("Are you sure you want to logout?")) return;
try {
const res = await fetch("/api/logout", {
method: "POST",
headers: { "Content-Type": "application/json" },
});
if (res.ok) {
window.location.href = "/";
} else {
alert("Logout failed. Please try again.");
}
} catch (err) {
console.error("Logout error:", err);
alert("Logout failed. Please try again.");
}
});
}
wireModalClose();
const debouncedSearch = debounce(() => {
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
}, 200);
searchInput?.addEventListener("input", (e) => {
state.searchTerm = e.target.value;
debouncedSearch();
});
sortSelect?.addEventListener("change", (e) => {
state.sort = e.target.value;
localStorage.setItem(PREF_SORT_KEY, state.sort);
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
});
filterStatusSelect?.addEventListener("change", (e) => {
state.filterStatus = e.target.value;
localStorage.setItem(PREF_FILTER_STATUS_KEY, state.filterStatus);
if (state.filterStatus === "online") {
if (showOfflineToggle) showOfflineToggle.checked = false;
} else {
lastNonOnlineStatus = state.filterStatus;
if (showOfflineToggle) showOfflineToggle.checked = true;
}
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
});
filterOsSelect?.addEventListener("change", (e) => {
state.filterOs = e.target.value;
localStorage.setItem(PREF_FILTER_OS_KEY, state.filterOs);
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
});
filterGroupSelect?.addEventListener("change", (e) => {
state.filterGroup = e.target.value;
localStorage.setItem(PREF_FILTER_GROUP_KEY, state.filterGroup);
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
});
initCountryPicker((code) => {
state.filterCountry = code;
localStorage.setItem(PREF_FILTER_COUNTRY_KEY, code);
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
}, localStorage.getItem(PREF_FILTER_COUNTRY_KEY) || "all");
(function restoreFilterStatus() {
const savedStatus = localStorage.getItem(PREF_FILTER_STATUS_KEY);
const validStatuses = ["all", "online", "offline"];
if (savedStatus && validStatuses.includes(savedStatus)) {
state.filterStatus = savedStatus;
if (filterStatusSelect) filterStatusSelect.value = savedStatus;
if (showOfflineToggle) showOfflineToggle.checked = savedStatus !== "online";
if (savedStatus !== "online") lastNonOnlineStatus = savedStatus;
}
const savedSort = localStorage.getItem(PREF_SORT_KEY);
const validSorts = ["stable", "last_seen_desc", "host_asc", "ping_asc", "ping_desc", "country_asc", "country_desc", "group_asc", "group_desc"];
if (savedSort && validSorts.includes(savedSort)) {
state.sort = savedSort;
if (sortSelect) sortSelect.value = savedSort;
}
const savedOs = localStorage.getItem(PREF_FILTER_OS_KEY);
if (savedOs) {
state.filterOs = savedOs;
if (filterOsSelect) filterOsSelect.value = savedOs;
}
const savedCountry = localStorage.getItem(PREF_FILTER_COUNTRY_KEY);
if (savedCountry) {
state.filterCountry = savedCountry;
}
const savedGroup = localStorage.getItem(PREF_FILTER_GROUP_KEY);
if (savedGroup) {
state.filterGroup = savedGroup;
if (filterGroupSelect) filterGroupSelect.value = savedGroup;
}
})();
showOfflineToggle?.addEventListener("change", (e) => {
if (e.target.checked) {
state.filterStatus = lastNonOnlineStatus || "all";
} else {
if (state.filterStatus !== "online") {
lastNonOnlineStatus = state.filterStatus;
}
state.filterStatus = "online";
}
localStorage.setItem(PREF_FILTER_STATUS_KEY, state.filterStatus);
if (filterStatusSelect) {
filterStatusSelect.value = state.filterStatus;
}
state.page = 1;
state.lastDigest = "";
loadWithOptions({ force: true, reorder: true });
});
function updateBulkToolbar() {
selectedCountSpan.textContent = selectedClients.size;
if (selectedClients.size > 0) {
bulkToolbar?.classList.remove("hidden");
} else {
bulkToolbar?.classList.add("hidden");
}
}
function toggleClientSelection(clientId) {
const checkbox = document.querySelector(
`.client-checkbox[data-id="${clientId}"]`,
);
if (!checkbox) return;
if (checkbox.checked) {
selectedClients.add(clientId);
} else {
selectedClients.delete(clientId);
}
updateBulkToolbar();
}
function syncSelectionState() {
document.querySelectorAll(".client-checkbox").forEach((cb) => {
const id = cb.dataset.id;
if (!id) return;
cb.checked = selectedClients.has(id);
});
updateBulkToolbar();
}
bulkClearBtn?.addEventListener("click", () => {
selectedClients.clear();
document
.querySelectorAll(".client-checkbox")
.forEach((cb) => (cb.checked = false));
updateBulkToolbar();
});
clearSelectionBtn?.addEventListener("click", () => {
selectedClients.clear();
document
.querySelectorAll(".client-checkbox")
.forEach((cb) => (cb.checked = false));
updateBulkToolbar();
});
selectAllBtn?.addEventListener("click", () => {
document
.querySelectorAll(".client-checkbox:not(:disabled)")
.forEach((cb) => {
cb.checked = true;
if (cb.dataset.id) {
selectedClients.add(cb.dataset.id);
}
});
updateBulkToolbar();
});
bulkScreenshotBtn?.addEventListener("click", async () => {
if (!confirm(`Take screenshot on ${selectedClients.size} client(s)?`)) return;
let success = 0;
for (const clientId of selectedClients) {
const ok = await sendCommand(clientId, "screenshot");
if (ok) success++;
}
alert(`Screenshots sent to ${success}/${selectedClients.size} clients`);
selectedClients.clear();
document
.querySelectorAll(".client-checkbox")
.forEach((cb) => (cb.checked = false));
updateBulkToolbar();
setTimeout(() => loadWithOptions({ force: true }), 400);
});
bulkDisconnectBtn?.addEventListener("click", async () => {
if (
!confirm(
`Disconnect ${selectedClients.size} client(s)? This will close their connections.`,
)
)
return;
let success = 0;
for (const clientId of selectedClients) {
markManualDisconnect(clientId);
const ok = await sendCommand(clientId, "disconnect");
if (ok) success++;
}
alert(`Disconnected ${success}/${selectedClients.size} clients`);
selectedClients.clear();
document
.querySelectorAll(".client-checkbox")
.forEach((cb) => (cb.checked = false));
updateBulkToolbar();
setTimeout(() => loadWithOptions({ force: true }), 1000);
});
bulkUninstallBtn?.addEventListener("click", async () => {
if (
!confirm(
`Uninstall agent from ${selectedClients.size} client(s)?\n\nThis will remove all persistence mechanisms and terminate the agents. This action cannot be undone.`,
)
)
return;
let success = 0;
for (const clientId of selectedClients) {
const ok = await sendCommand(clientId, "uninstall");
if (ok) success++;
}
alert(`Uninstall sent to ${success}/${selectedClients.size} clients`);
selectedClients.clear();
document
.querySelectorAll(".client-checkbox")
.forEach((cb) => (cb.checked = false));
updateBulkToolbar();
setTimeout(() => loadWithOptions({ force: true }), 1000);
});
bulkGroupBtn?.addEventListener("click", () => {
if (selectedClients.size === 0) return;
openBulkGroupPicker([...selectedClients]);
});
async function openBulkGroupPicker(clientIds) {
const groups = await loadGroups();
const overlay = document.createElement("div");
overlay.className = "fixed inset-0 z-[10000] flex items-center justify-center bg-black/60";
overlay.addEventListener("click", (e) => { if (e.target === overlay) overlay.remove(); });
const modal = document.createElement("div");
modal.className = "bg-slate-900 border border-slate-700 rounded-xl shadow-2xl p-6 w-[400px] max-h-[80vh] flex flex-col gap-4";
modal.innerHTML = `