fix: contact rows, narrow sender labels and stale reader pane
This commit is contained in:
parent
9842302c50
commit
f637d5be57
2 changed files with 31 additions and 4 deletions
|
|
@ -115,9 +115,17 @@ for (const button of $("folders").querySelectorAll("button"))
|
|||
folder = button.dataset.folder;
|
||||
for (const b of $("folders").querySelectorAll("button")) b.classList.toggle("active", b === button);
|
||||
selectedId = null;
|
||||
resetView();
|
||||
renderFolder();
|
||||
};
|
||||
|
||||
// The reader empties when a folder changes, so a stale message cannot linger
|
||||
// under a different list.
|
||||
function resetView() {
|
||||
$("view").replaceChildren(Object.assign(document.createElement("p"),
|
||||
{ className: "placeholder", textContent: "select a message" }));
|
||||
}
|
||||
|
||||
async function renderFolder() {
|
||||
const list = $("list");
|
||||
if (folder === "contacts") return renderContacts(list);
|
||||
|
|
@ -132,7 +140,7 @@ async function renderFolder() {
|
|||
item.className = `item${row.id === selectedId ? " selected" : ""}${isUnread ? " unread" : ""}`;
|
||||
const who = document.createElement("div");
|
||||
who.className = "who";
|
||||
who.textContent = folder === "sent" ? row.recipient : (opened.from ?? "?");
|
||||
who.textContent = folder === "sent" ? row.recipient : (opened.fromShort ?? "?");
|
||||
const mid = document.createElement("div");
|
||||
mid.className = "mid";
|
||||
const subject = document.createElement("span");
|
||||
|
|
@ -188,6 +196,8 @@ function describe(row) {
|
|||
subject: fields.Subject || "",
|
||||
snippet: body.replace(/\s+/g, " ").trim().slice(0, 140),
|
||||
from: known ?? `unknown · ${fingerprint(opened.sender)}`,
|
||||
// rows stay narrow: the full fingerprint belongs to the reader
|
||||
fromShort: known ?? `unknown · ${b32encode(opened.sender).slice(0, 4)}`,
|
||||
knownSender: Boolean(known),
|
||||
replyAddress,
|
||||
};
|
||||
|
|
@ -471,13 +481,18 @@ function renderContacts(list) {
|
|||
const contacts = store.allContacts();
|
||||
for (const { address, key, verified } of contacts) {
|
||||
const item = document.createElement("div");
|
||||
item.className = "item";
|
||||
item.className = "item contact";
|
||||
const who = document.createElement("div");
|
||||
who.className = "who";
|
||||
who.textContent = address;
|
||||
const mid = document.createElement("div");
|
||||
mid.className = "mid";
|
||||
mid.textContent = `${fingerprint(b32decode(key))} · ${verified ? "verified key" : "tofu"}`;
|
||||
const fp = document.createElement("div");
|
||||
fp.textContent = fingerprint(b32decode(key));
|
||||
const badge = document.createElement("span");
|
||||
badge.className = verified ? "badge ok" : "badge";
|
||||
badge.textContent = verified ? "verified key" : "tofu";
|
||||
mid.append(fp, badge);
|
||||
const refresh = document.createElement("button");
|
||||
refresh.textContent = "refresh";
|
||||
refresh.onclick = () => refreshContact(address);
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue