diff --git a/webui/viewer.html b/webui/viewer.html index c69d597..96eae71 100644 --- a/webui/viewer.html +++ b/webui/viewer.html @@ -13,7 +13,7 @@
Export Viewer

Messages

-

Account: Loading...

+

Account:

Dashboard diff --git a/webui/viewer.js b/webui/viewer.js index fe62648..ae20025 100644 --- a/webui/viewer.js +++ b/webui/viewer.js @@ -130,6 +130,58 @@ function channelsEndpoint() { return "/api/channels"; } +function renderAccountSelector() { + const sel = document.getElementById("viewer-account-select"); + if (!sel) return; + sel.innerHTML = ""; + const legacy = viewerState.accounts.length === 0; + if (legacy) { + const opt = document.createElement("option"); + opt.value = ""; + opt.textContent = "Legacy"; + sel.appendChild(opt); + } else { + viewerState.accounts.forEach((acc) => { + const opt = document.createElement("option"); + opt.value = acc.id; + opt.textContent = acc.label || acc.id; + if (acc.id === viewerState.accountId) opt.selected = true; + sel.appendChild(opt); + }); + } +} + +async function switchViewerAccount(accountId) { + viewerState.accountId = accountId || null; + viewerState.accounts.forEach((acc) => { + if (acc.id === accountId) { + const opts = document.getElementById("viewer-account-select")?.options; + if (opts) { + for (let i = 0; i < opts.length; i++) { + opts[i].selected = opts[i].value === accountId; + } + } + } + }); + try { + const authData = viewerState.accountId + ? await api(`/api/accounts/${encodeURIComponent(viewerState.accountId)}/auth`) + : await api("/api/auth"); + viewerState.userId = authData.user_id || null; + } catch (e) { + console.warn("Could not fetch user ID:", e); + } + const channels = await api(channelsEndpoint()); + viewerState.channels = channels; + viewerState.channelId = channels[0]?.channel_id || null; + viewerState.oldestMessageId = null; + viewerState.newestMessageId = null; + renderChannelList(); + if (viewerState.channelId) { + await loadChannel(viewerState.channelId); + } +} + async function loadViewerAccount(params) { const requested = params.get("account"); try { @@ -143,12 +195,12 @@ async function loadViewerAccount(params) { viewerState.accounts[0]?.id || null; - const accountName = - viewerState.accounts.find((item) => item.id === viewerState.accountId)?.label || - viewerState.accountId || - "Legacy"; - const accountEl = document.getElementById("viewer-account-name"); - if (accountEl) accountEl.textContent = accountName; + renderAccountSelector(); + + const sel = document.getElementById("viewer-account-select"); + if (sel) { + sel.addEventListener("change", () => switchViewerAccount(sel.value)); + } try { const authData = viewerState.accountId