diff --git a/src/popup/views/home.js b/src/popup/views/home.js index abd052a..76bf225 100644 --- a/src/popup/views/home.js +++ b/src/popup/views/home.js @@ -35,7 +35,7 @@ function render(ctx) { state.wallets.forEach((wallet, wi) => { html += `
`; html += `
`; - html += `${wallet.name}`; + html += `${wallet.name}`; if (wallet.type === "hd") { html += ``; } @@ -112,6 +112,39 @@ function render(ctx) { }); }); + container.querySelectorAll(".wallet-name").forEach((span) => { + span.addEventListener("click", (e) => { + e.stopPropagation(); + const wi = parseInt(span.dataset.wallet, 10); + const wallet = state.wallets[wi]; + const input = document.createElement("input"); + input.type = "text"; + input.value = wallet.name; + input.className = + "font-bold border border-border p-0 bg-bg text-fg"; + input.style.width = span.offsetWidth + 20 + "px"; + const save = async () => { + const val = input.value.trim(); + if (val && val !== wallet.name) { + wallet.name = val; + await saveState(); + } + render(ctx); + }; + input.addEventListener("blur", save); + input.addEventListener("keydown", (ev) => { + if (ev.key === "Enter") input.blur(); + if (ev.key === "Escape") { + input.value = wallet.name; + input.blur(); + } + }); + span.replaceWith(input); + input.focus(); + input.select(); + }); + }); + renderTotalValue(); }