const $ = (id) => document.getElementById(id);
const send = (msg) => chrome.runtime.sendMessage(msg);

async function render() {
  const s = await send({ type: "popup-state" });
  $("locked").classList.toggle("hidden", !!s.npub);
  $("unlocked").classList.toggle("hidden", !s.npub);
  if (!s.npub) return;
  $("name").textContent = s.profile?.name || "Your nostr identity";
  $("npub").textContent = s.npub;
  const sites = Object.keys(s.perms);
  $("no-sites").classList.toggle("hidden", sites.length > 0);
  $("sites").replaceChildren(...sites.map((origin) => {
    const li = document.createElement("li");
    const span = document.createElement("span");
    span.className = "mono";
    span.textContent = origin;
    const btn = document.createElement("button");
    btn.className = "small";
    btn.textContent = "Revoke";
    btn.onclick = async () => { await send({ type: "revoke", origin }); render(); };
    li.append(span, btn);
    return li;
  }));
}

$("unlock").onclick = async () => { await send({ type: "open-goostr" }); window.close(); };
$("lock").onclick = async () => { await send({ type: "lock" }); render(); };
chrome.storage.session.onChanged.addListener(render);
render();