0.6.6
This commit is contained in:
237
kb_app/frontend/ts/demo_ws_manager.ts
Normal file
237
kb_app/frontend/ts/demo_ws_manager.ts
Normal file
@@ -0,0 +1,237 @@
|
||||
// file: kb_app/frontend/ts/demo_ws_manager.ts
|
||||
|
||||
import * as bootstrap from "bootstrap";
|
||||
import "simplebar";
|
||||
import ResizeObserver from "resize-observer-polyfill";
|
||||
import { invoke } from "@tauri-apps/api/core";
|
||||
import { listen } from "@tauri-apps/api/event";
|
||||
import { debug, takeoverConsole } from "@fltsci/tauri-plugin-tracing";
|
||||
|
||||
(window as Window & typeof globalThis & { bootstrap?: typeof bootstrap }).bootstrap = bootstrap;
|
||||
(window as Window & typeof globalThis & { ResizeObserver?: typeof ResizeObserver }).ResizeObserver = ResizeObserver;
|
||||
|
||||
type DemoWsManagerEndpointSummary = {
|
||||
name: string;
|
||||
resolvedUrl: string;
|
||||
provider: string;
|
||||
roles: string[];
|
||||
connectionState: string;
|
||||
activeSubscriptionCount: number;
|
||||
};
|
||||
|
||||
type DemoWsManagerSnapshotPayload = {
|
||||
endpointCount: number;
|
||||
startedCount: number;
|
||||
endpoints: DemoWsManagerEndpointSummary[];
|
||||
};
|
||||
|
||||
const endpointCountText = document.querySelector<HTMLSpanElement>("#demoWsManagerEndpointCountText");
|
||||
const startedCountText = document.querySelector<HTMLSpanElement>("#demoWsManagerStartedCountText");
|
||||
const roleSelect = document.querySelector<HTMLSelectElement>("#demoWsManagerRoleSelect");
|
||||
const tableBody = document.querySelector<HTMLTableSectionElement>("#demoWsManagerTableBody");
|
||||
const logTextarea = document.querySelector<HTMLTextAreaElement>("#demoWsManagerLogTextarea");
|
||||
const startAllButton = document.querySelector<HTMLButtonElement>("#demoWsManagerStartAllButton");
|
||||
const stopAllButton = document.querySelector<HTMLButtonElement>("#demoWsManagerStopAllButton");
|
||||
const refreshButton = document.querySelector<HTMLButtonElement>("#demoWsManagerRefreshButton");
|
||||
const startRoleButton = document.querySelector<HTMLButtonElement>("#demoWsManagerStartRoleButton");
|
||||
const stopRoleButton = document.querySelector<HTMLButtonElement>("#demoWsManagerStopRoleButton");
|
||||
const clearLogButton = document.querySelector<HTMLButtonElement>("#demoWsManagerClearLogButton");
|
||||
|
||||
function appendLogLine(line: string): void {
|
||||
if (!logTextarea) {
|
||||
return;
|
||||
}
|
||||
const prefix = logTextarea.value.length > 0 ? "\n" : "";
|
||||
logTextarea.value += `${prefix}${line}`;
|
||||
logTextarea.scrollTop = logTextarea.scrollHeight;
|
||||
}
|
||||
|
||||
function renderSnapshot(snapshot: DemoWsManagerSnapshotPayload): void {
|
||||
if (endpointCountText) {
|
||||
endpointCountText.textContent = String(snapshot.endpointCount);
|
||||
}
|
||||
if (startedCountText) {
|
||||
startedCountText.textContent = String(snapshot.startedCount);
|
||||
}
|
||||
if (!tableBody) {
|
||||
return;
|
||||
}
|
||||
|
||||
tableBody.innerHTML = "";
|
||||
|
||||
for (const endpoint of snapshot.endpoints) {
|
||||
const row = document.createElement("tr");
|
||||
row.innerHTML = `
|
||||
<td>
|
||||
<div class="fw-semibold">${endpoint.name}</div>
|
||||
<div class="small text-body-secondary">${endpoint.resolvedUrl}</div>
|
||||
</td>
|
||||
<td>${endpoint.provider}</td>
|
||||
<td>${endpoint.roles.join(", ")}</td>
|
||||
<td>${endpoint.connectionState}</td>
|
||||
<td>${endpoint.activeSubscriptionCount}</td>
|
||||
`;
|
||||
tableBody.appendChild(row);
|
||||
}
|
||||
}
|
||||
|
||||
async function refreshSnapshot(): Promise<void> {
|
||||
try {
|
||||
const snapshot = await invoke<DemoWsManagerSnapshotPayload>("demo_ws_manager_get_snapshot");
|
||||
renderSnapshot(snapshot);
|
||||
appendLogLine("[ui] refreshed manager snapshot");
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] snapshot error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
async function loadRoles(): Promise<void> {
|
||||
if (!roleSelect) {
|
||||
return;
|
||||
}
|
||||
|
||||
roleSelect.innerHTML = "";
|
||||
|
||||
try {
|
||||
const roles = await invoke<string[]>("demo_ws_manager_list_roles");
|
||||
for (const role of roles) {
|
||||
const option = document.createElement("option");
|
||||
option.value = role;
|
||||
option.textContent = role;
|
||||
roleSelect.appendChild(option);
|
||||
}
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] list roles error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
async function startAll(): Promise<void> {
|
||||
try {
|
||||
const snapshot = await invoke<DemoWsManagerSnapshotPayload>("demo_ws_manager_start_all");
|
||||
renderSnapshot(snapshot);
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] start all error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
async function stopAll(): Promise<void> {
|
||||
try {
|
||||
const snapshot = await invoke<DemoWsManagerSnapshotPayload>("demo_ws_manager_stop_all");
|
||||
renderSnapshot(snapshot);
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] stop all error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
async function startRole(): Promise<void> {
|
||||
if (!roleSelect || roleSelect.value.trim().length === 0) {
|
||||
appendLogLine("[ui] no role selected");
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const snapshot = await invoke<DemoWsManagerSnapshotPayload>("demo_ws_manager_start_role", {
|
||||
role: roleSelect.value,
|
||||
});
|
||||
renderSnapshot(snapshot);
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] start role error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
async function stopRole(): Promise<void> {
|
||||
if (!roleSelect || roleSelect.value.trim().length === 0) {
|
||||
appendLogLine("[ui] no role selected");
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
const snapshot = await invoke<DemoWsManagerSnapshotPayload>("demo_ws_manager_stop_role", {
|
||||
role: roleSelect.value,
|
||||
});
|
||||
renderSnapshot(snapshot);
|
||||
} catch (error) {
|
||||
appendLogLine(`[ui] stop role error: ${String(error)}`);
|
||||
}
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", async () => {
|
||||
void takeoverConsole();
|
||||
debug("demo_ws_manager window loaded");
|
||||
|
||||
const sidebarToggle = document.querySelector<HTMLButtonElement>('#sidebarToggle');
|
||||
if (sidebarToggle) {
|
||||
// restaurer l’état depuis localStorage
|
||||
if (localStorage.getItem('sidebar-toggle') === 'true') {
|
||||
document.body.classList.add('sidenav-toggled');
|
||||
}
|
||||
|
||||
sidebarToggle.addEventListener('click', (event) => {
|
||||
event.preventDefault();
|
||||
document.body.classList.toggle('sidenav-toggled');
|
||||
localStorage.setItem('sidebar-toggle', document.body.classList.contains('sidenav-toggled') ? 'true' : 'false');
|
||||
});
|
||||
}
|
||||
|
||||
const tooltipTriggerList = document.querySelectorAll('[data-bs-toggle="tooltip"]');
|
||||
Array.from(tooltipTriggerList).map(tooltipTriggerEl => new bootstrap.Tooltip(tooltipTriggerEl));
|
||||
const toastElList = document.querySelectorAll('.toast');
|
||||
Array.from(toastElList).map(toastEl => new bootstrap.Toast(toastEl));
|
||||
const popoverTriggerList = document.querySelectorAll('[data-bs-toggle="popover"]');
|
||||
Array.from(popoverTriggerList).map(popoverTriggerEl => new bootstrap.Popover(popoverTriggerEl));
|
||||
|
||||
const gobackto = location.pathname + location.search;
|
||||
|
||||
document.querySelectorAll<HTMLAnchorElement>('a[data-setlang]').forEach((a) => {
|
||||
const href = a.getAttribute("href");
|
||||
if (!href) return; // pas de href => on ignore
|
||||
|
||||
const url = new URL(href, location.origin);
|
||||
url.searchParams.set("gobackto", gobackto);
|
||||
|
||||
// conserve une URL relative (path + query)
|
||||
a.setAttribute("href", url.pathname + "?" + url.searchParams.toString());
|
||||
});
|
||||
|
||||
if (startAllButton) {
|
||||
startAllButton.addEventListener("click", () => {
|
||||
void startAll();
|
||||
});
|
||||
}
|
||||
if (stopAllButton) {
|
||||
stopAllButton.addEventListener("click", () => {
|
||||
void stopAll();
|
||||
});
|
||||
}
|
||||
if (refreshButton) {
|
||||
refreshButton.addEventListener("click", () => {
|
||||
void refreshSnapshot();
|
||||
});
|
||||
}
|
||||
if (startRoleButton) {
|
||||
startRoleButton.addEventListener("click", () => {
|
||||
void startRole();
|
||||
});
|
||||
}
|
||||
if (stopRoleButton) {
|
||||
stopRoleButton.addEventListener("click", () => {
|
||||
void stopRole();
|
||||
});
|
||||
}
|
||||
if (clearLogButton && logTextarea) {
|
||||
clearLogButton.addEventListener("click", () => {
|
||||
logTextarea.value = "";
|
||||
});
|
||||
}
|
||||
|
||||
await listen<string>("kb-demo-ws-manager-log", (event) => {
|
||||
appendLogLine(event.payload);
|
||||
});
|
||||
|
||||
await listen<DemoWsManagerSnapshotPayload>("kb-demo-ws-manager-snapshot", (event) => {
|
||||
renderSnapshot(event.payload);
|
||||
});
|
||||
|
||||
await loadRoles();
|
||||
await refreshSnapshot();
|
||||
});
|
||||
Reference in New Issue
Block a user