@bobfrankston/rmfmail 1.2.87 → 1.2.96

package/client/components/message-list.ts

@@ -96,6 +96,34 @@ if (typeof document !== "undefined") {
 let currentSort = "date";
 let currentSortDir: "asc" | "desc" = "desc";
 
+// Date basis for the "date" sort + the date column: "sent" (Date: header,
+// default — identical mail clusters, matches other clients) or "received"
+// (per-account arrival time). Persisted so the View-menu toggle survives
+// reloads. Bob 2026-07-01.
+let dateBasis: "sent" | "received" =
+    (localStorage.getItem("mailx-date-basis") as "sent" | "received") || "sent";
+
+/** The epoch-ms to DISPLAY for a row, honoring the current basis. sentDate is
+ *  always populated by the store (backfilled to date), but guard anyway. */
+function effectiveDate(msg: any): number {
+    return dateBasis === "received" ? msg.date : (msg.sentDate ?? msg.date);
+}
+
+/** Current date basis — read by app.ts to check the View-menu radio state. */
+export function getDateBasis(): "sent" | "received" { return dateBasis; }
+
+/** Switch the date basis, persist it, and reload the current view so the new
+ *  sort + column take effect. Called by the View menu. */
+export function setDateBasis(basis: "sent" | "received"): void {
+    if (basis === dateBasis) return;
+    dateBasis = basis;
+    try { localStorage.setItem("mailx-date-basis", basis); } catch { /* private mode */ }
+    // Cached snapshots were ordered by the old basis — clear so the reload
+    // re-sorts from the DB rather than repainting the stale order.
+    listCache.clear();
+    reloadCurrentFolder();
+}
+
 /** Generation counter — incremented on every load* call (loadMessages,
  *  loadUnifiedInbox, loadSearchResults). Each load captures the current
  *  value at the top, then checks before rendering — if the captured gen
@@ -194,6 +222,7 @@ function withScrollAnchor(body: HTMLElement, doRender: () => void): void {
     // must not go off screen"). The old `scrollTop < 4 → no anchor` shortcut
     // was exactly the bug: at the top, new rows shoved the read letter off the
     // bottom.
+    let anchoredOnSelected = false;
     const selected = body.querySelector<HTMLElement>(".ml-row.selected");
     if (selected) {
         const vt = selected.offsetTop - scrollTop;
@@ -201,6 +230,7 @@ function withScrollAnchor(body: HTMLElement, doRender: () => void): void {
         if (vt > -selected.offsetHeight && vt < viewportH) {
             anchorUuid = selected.dataset.uuid || "";
             anchorOffsetWithinViewport = vt;
+            anchoredOnSelected = true;
         }
     }
 
@@ -232,7 +262,14 @@ function withScrollAnchor(body: HTMLElement, doRender: () => void): void {
         // bottom do we fall back to pinning it visible. This satisfies both
         // "show new mail at the top" and the 2026-06-04 rule "a letter in view
         // must stay in view (it may scroll down but must not go off screen)".
-        if (wasAtTop && after.offsetTop < viewportH - after.offsetHeight) {
+        //
+        // EXCEPTION (Bob 2026-06-30: "I was looking at a message and suddenly
+        // my position changed and I was looking at a new message"): when the
+        // anchor IS the open/selected message, the user is actively reading —
+        // never reposition them. Pin the selected row exactly where it sat.
+        // The scroll-to-0 reveal only applies when nothing is open and the user
+        // is merely parked at the top of the list browsing subjects.
+        if (wasAtTop && !anchoredOnSelected && after.offsetTop < viewportH - after.offsetHeight) {
             body.scrollTop = 0;
         } else {
             body.scrollTop = after.offsetTop - anchorOffsetWithinViewport;
@@ -260,8 +297,20 @@ function rememberPosition(): void {
     persistPositions();
 }
 /** Choose the row to focus when re-entering a view with saved position.
- *  Returns the uid to focus, or null to fall back to selectFirst. */
-function pickRestoreUid(items: any[], saved: ViewPosition): string | null {
+ *  Returns the uid to focus, or null to fall back to selectFirst.
+ *
+ *  `allowNeighbor` gates the deleted-message fallback. On a FOREGROUND
+ *  re-entry (user navigating INTO a view) the saved message being absent
+ *  means it was deleted, so we hand focus to the nearest survivor. On a
+ *  BACKGROUND reload (sync/new-mail rebuild of the current view) absent
+ *  does NOT mean deleted — the message the user is READING has merely been
+ *  pushed out of the loaded top-50 page by new arrivals. Switching to a
+ *  neighbor there yanks the viewer onto the new arrival while the list
+ *  stays put (Bob 2026-07-01: "I was looking at a letter and suddenly found
+ *  myself looking at a newly arrived message; the summary did not scroll").
+ *  So background callers pass allowNeighbor=false → return null → keep the
+ *  current viewer untouched. */
+function pickRestoreUid(items: any[], saved: ViewPosition, allowNeighbor = true): string | null {
     if (!items.length) return null;
     // Exact restore by stable uuid — globally unique, so this can never
     // rebind the viewer to a same-uid-number message in another folder
@@ -270,6 +319,7 @@ function pickRestoreUid(items: any[], saved: ViewPosition): string | null {
         const exact = items.find(m => m.uuid && m.uuid === saved.uuid);
         if (exact?.uuid) return exact.uuid;
     }
+    if (!allowNeighbor) return null;
     // Saved message is gone (deleted). Pick the next-older entry by uid —
     // uid is roughly monotonic with arrival on IMAP/Gmail — and return ITS
     // uuid so the restore stays uuid-keyed end to end.
@@ -729,10 +779,30 @@ export function exitMultiSelect(): void {
 }
 
 /** Bulk-actions bar retired 2026-04-24 — trash + spam live on the main
- *  toolbar now and every other bulk op (mark-read, flag, move) is one
- *  right-click away. Kept as a no-op stub so existing call sites
- *  (avatar tap, row click, long-press) don't need to be touched. */
-function updateBulkBar(): void { /* bar removed; nothing to render */ }
+ *  toolbar. This now renders just the selection COUNT (Bob 2026-07-01:
+ *  "multiselect should show the count somewhere") as a floating pill at the
+ *  bottom of the list panel, shown only while a multi-selection of ≥2 is
+ *  active. Every selection-changing site already calls this. */
+function updateBulkBar(): void {
+    const panel = document.getElementById("message-list");
+    if (!panel) return;
+    const body = document.getElementById("ml-body");
+    const count = body?.classList.contains("multi-select-on")
+        ? body.querySelectorAll(".ml-row.selected").length : 0;
+    let pill = document.getElementById("ml-select-count");
+    if (count >= 2) {
+        if (!pill) {
+            pill = document.createElement("div");
+            pill.id = "ml-select-count";
+            pill.className = "ml-select-count";
+            panel.appendChild(pill);
+        }
+        pill.textContent = `${count} selected`;
+        pill.style.display = "";
+    } else if (pill) {
+        pill.style.display = "none";
+    }
+}
 
 /** Select every shown (not filter-hidden) row AND enter multi-select mode.
  *  Shared by the selection menu's "Select all shown" and the Ctrl+A shortcut.
@@ -855,34 +925,7 @@ export function initMessageList(handler: MessageSelectHandler): void {
             }
         }, { passive: true });
 
-        body.addEventListener("scroll", () => {
-            if (loading) return;
-            // Prefetch the next page well BEFORE the bottom (was 200px). The next
-            // 50 rows are a DB query + render; triggering it only 200px out meant
-            // the user scrolled INTO the not-yet-loaded gap and saw a pause (Bob
-            // 2026-06-18 "scroll the summary, there is a delay"). 1000px ≈ a couple
-            // screens of lead time so the page is usually ready by the time it's
-            // scrolled to. `loading` guard still prevents overlapping fetches.
-            const nearBottom = body.scrollHeight - body.scrollTop - body.clientHeight < 1000;
-            if (nearBottom) {
-                if (currentPage * 50 < totalMessages) {
-                    loadMoreMessages();
-                } else {
-                    // Diagnostic: at bottom but not loading more. Log why
-                    // so the user can see whether totalMessages is wrong,
-                    // a filter is on, or we've truly reached the end.
-                    // Only log once per "stuck at bottom" episode.
-                    if (!(body as any)._mlScrollEndLogged) {
-                        (body as any)._mlScrollEndLogged = true;
-                        const rows = body.querySelectorAll(".ml-row").length;
-                        console.log(`  [ml-scroll] reached bottom — currentPage=${currentPage} pageSize=50 loadedRows=${rows} totalMessages=${totalMessages} searchMode=${searchMode} unifiedMode=${unifiedMode} flaggedOnly=${body.classList.contains("flagged-only")}`);
-                    }
-                }
-            } else {
-                // Reset the once-flag so next time we hit bottom we log again.
-                (body as any)._mlScrollEndLogged = false;
-            }
-        });
+        body.addEventListener("scroll", () => { maybeLoadMore(body); });
     }
 
     // Viewer signals "this row is gone server-side" via mailx-remove-stale.
@@ -1117,7 +1160,7 @@ export async function loadUnifiedInbox(autoSelect = true): Promise<void> {
         const renderCached = () => renderMessages(body, "", cached.items, { background: !autoSelect });
         if (!autoSelect) withScrollAnchor(body, renderCached);
         else renderCached();
-        const targetUuid = remembered ? pickRestoreUid(cached.items, remembered) : null;
+        const targetUuid = remembered ? pickRestoreUid(cached.items, remembered, autoSelect) : null;
         if (targetUuid) {
             if (autoSelect) body.scrollTop = savedScroll;
             restoreSelection(body, targetUuid);
@@ -1129,7 +1172,7 @@ export async function loadUnifiedInbox(autoSelect = true): Promise<void> {
     }
 
     try {
-        const result = await apiGetUnifiedInbox(1, 50, flaggedOnly);
+        const result = await apiGetUnifiedInbox(1, 50, flaggedOnly, dateBasis);
         if (myGen !== loadGen) return;       // user moved on; drop stale response
         totalMessages = result.total;
         listCache.set(unifiedCacheKey, { items: result.items, total: result.total, timestamp: Date.now() });
@@ -1154,7 +1197,7 @@ export async function loadUnifiedInbox(autoSelect = true): Promise<void> {
         // appear above as usual.
         withScrollAnchor(body, () => renderMessages(body, "", result.items, { background: !autoSelect }));
 
-        const targetUuid = remembered ? pickRestoreUid(result.items, remembered) : null;
+        const targetUuid = remembered ? pickRestoreUid(result.items, remembered, autoSelect) : null;
         if (targetUuid) {
             // Only restore the saved scrollTop on a first paint (cache miss).
             // After a sync-driven re-render, withScrollAnchor has already
@@ -1225,8 +1268,8 @@ export async function loadSearchResults(query: string, scope = "all", accountId
             try { regex = new RegExp(pattern, "i"); } catch { body.innerHTML = `<div class="ml-empty">Invalid regex</div>`; return; }
 
             const source = scope === "current" && accountId
-                ? await apiGetMessages(accountId, folderId, 1, 10000)
-                : await apiGetUnifiedInbox(1, 10000);
+                ? await apiGetMessages(accountId, folderId, 1, 10000, false, currentSort, currentSortDir, dateBasis)
+                : await apiGetUnifiedInbox(1, 10000, false, dateBasis);
             if (myGen !== loadGen) return;
             const matches = source.items.filter((m: any) =>
                 regex.test(m.subject || "") || regex.test(m.from?.name || "") || regex.test(m.from?.address || "") || regex.test(m.preview || "")
@@ -1335,7 +1378,7 @@ export async function loadMessages(accountId: string, folderId: number, page = 1
         const renderCached = () => renderMessages(body, accountId, cached.items, { background: !autoSelect });
         if (!autoSelect) withScrollAnchor(body, renderCached);
         else renderCached();
-        const targetUuid = remembered ? pickRestoreUid(cached.items, remembered) : null;
+        const targetUuid = remembered ? pickRestoreUid(cached.items, remembered, autoSelect) : null;
         if (focusUid != null) {
             // Search-as-find: jump to the specific message the user selected.
             requestAnimationFrame(() => {
@@ -1356,7 +1399,7 @@ export async function loadMessages(accountId: string, folderId: number, page = 1
     }
 
     try {
-        const result = await apiGetMessages(accountId, folderId, 1, 50, flaggedOnly, currentSort, currentSortDir);
+        const result = await apiGetMessages(accountId, folderId, 1, 50, flaggedOnly, currentSort, currentSortDir, dateBasis);
         // Stale-response guard: a newer load* fired while we were
         // awaiting; the new view already painted. Drop this result
         // silently rather than overwriting.
@@ -1397,7 +1440,7 @@ export async function loadMessages(accountId: string, folderId: number, page = 1
         }
 
         // Prefer saved position; otherwise default by autoSelect.
-        const targetUuid = remembered ? pickRestoreUid(result.items, remembered) : null;
+        const targetUuid = remembered ? pickRestoreUid(result.items, remembered, autoSelect) : null;
         if (focusUid != null) {
             // Search-as-find: select the message the user picked from results.
             requestAnimationFrame(() => {
@@ -1424,6 +1467,43 @@ export async function loadMessages(accountId: string, folderId: number, page = 1
     }
 }
 
+/** Decide whether the next page should load, and load it. Centralized so the
+ *  scroll handler and the post-load re-check share one code path.
+ *
+ *  Why a re-check exists (Bob 2026-06-30: "scroll down near the bottom does
+ *  nothing till an upward scroll then I can scroll down again"): the browser
+ *  fires `scroll` events only while scrollTop actually changes. When the user
+ *  reaches the absolute bottom of the loaded rows, scrollTop is pinned at max,
+ *  so NO further downward scroll events fire. If the event that crossed
+ *  nearBottom arrived while a previous load was still in flight (the old
+ *  `if (loading) return` dropped it), the next page was never requested — the
+ *  list looked frozen until an upward scroll re-armed the handler. Now every
+ *  finished load re-evaluates geometry and chains the next page if the user is
+ *  still sitting near the bottom, so reaching the end is self-driving. */
+function maybeLoadMore(body: HTMLElement): void {
+    if (loading) return;
+    const nearBottom = body.scrollHeight - body.scrollTop - body.clientHeight < 1000;
+    if (!nearBottom) {
+        // Reset the once-flag so next time we hit bottom we log again.
+        (body as any)._mlScrollEndLogged = false;
+        return;
+    }
+    if (currentPage * 50 < totalMessages) {
+        // Prefetch the next page well BEFORE the bottom (1000px lead). The next
+        // 50 rows are a DB query + render; triggering only 200px out meant the
+        // user scrolled INTO the not-yet-loaded gap and saw a pause (Bob
+        // 2026-06-18 "scroll the summary, there is a delay").
+        loadMoreMessages();
+    } else if (!(body as any)._mlScrollEndLogged) {
+        // Diagnostic: at bottom but not loading more. Log why so we can see
+        // whether totalMessages is wrong, a filter is on, or we've truly
+        // reached the end. Once per "stuck at bottom" episode.
+        (body as any)._mlScrollEndLogged = true;
+        const rows = body.querySelectorAll(".ml-row").length;
+        console.log(`  [ml-scroll] reached bottom — currentPage=${currentPage} pageSize=50 loadedRows=${rows} totalMessages=${totalMessages} searchMode=${searchMode} unifiedMode=${unifiedMode} flaggedOnly=${body.classList.contains("flagged-only")}`);
+    }
+}
+
 async function loadMoreMessages(): Promise<void> {
     const body = document.getElementById("ml-body");
     if (!body) return;
@@ -1445,8 +1525,8 @@ async function loadMoreMessages(): Promise<void> {
         const result = searchMode
             ? await searchMessages(currentSearchQuery, currentPage)
             : unifiedMode
-                ? await apiGetUnifiedInbox(currentPage, 50, flaggedOnly)
-                : await apiGetMessages(currentAccountId, currentFolderId, currentPage, 50, flaggedOnly);
+                ? await apiGetUnifiedInbox(currentPage, 50, flaggedOnly, dateBasis)
+                : await apiGetMessages(currentAccountId, currentFolderId, currentPage, 50, flaggedOnly, currentSort, currentSortDir, dateBasis);
         // Append to state
         const current = state.getMessages();
         state.setMessages([...current, ...result.items]);
@@ -1461,6 +1541,13 @@ async function loadMoreMessages(): Promise<void> {
     } finally {
         loading = false;
     }
+    // Re-evaluate: if the user is STILL near the bottom (they kept their finger
+    // pinned at the end, or the page that loaded was shorter than the viewport),
+    // chain the next page. Geometry has settled after the synchronous append
+    // above, so this reads true heights. Terminates when nearBottom goes false
+    // or currentPage*50 >= totalMessages. requestAnimationFrame defers one frame
+    // so layout flushes and we don't recurse on stale heights.
+    requestAnimationFrame(() => maybeLoadMore(body));
 }
 
 /** Replace body contents with rendered rows */
@@ -1487,6 +1574,8 @@ function renderMessages(body: HTMLElement, accountId: string, items: any[], opts
         for (const uuid of preserveSel) {
             body.querySelector(`.ml-row[data-uuid="${CSS.escape(uuid)}"]`)?.classList.add("selected");
         }
+        // Keep the "N selected" pill accurate after a background rebuild.
+        updateBulkBar();
     }
     // A filter (flagged-only / priority-only) that hides EVERY row makes the
     // list look broken — identical to an empty/failed load. Bob 2026-05-27
@@ -1552,10 +1641,16 @@ function restoreSelection(body: HTMLElement, savedUuid: string | null | undefine
     const accountId = row.dataset.accountId;
     const uid = Number(row.dataset.uid);
     if (accountId && Number.isFinite(uid)) {
-        // {scroll:false} — programmatic restore after a sync-driven reload.
-        // The user might be reading rows ABOVE the focused one; do NOT yank
-        // their scroll back to the focused row every time the list rebuilds.
-        focusByIdentity(accountId, uid, { scroll: false });
+        // FATE-SHARING SAFETY NET (Bob 2026-07-01: "even if there is an
+        // inappropriate switch it must automatically make it visible in the
+        // summary"). If this restore re-binds the SAME message already in the
+        // viewer — the normal case after a sync rebuild — keep the user's
+        // scroll exactly where it is; they may be reading rows above/below and
+        // must not be yanked. But if it targets a DIFFERENT message than the
+        // one currently shown, that IS a real viewer switch: scroll the list to
+        // that row so the summary and the viewer can never silently disagree.
+        const switching = focusedRow?.msg?.uuid !== savedUuid;
+        focusByIdentity(accountId, uid, { scroll: switching });
     }
 }
 
@@ -1580,7 +1675,7 @@ export async function showThreadPopup(pillEl: HTMLElement, headMsg: any): Promis
         from.textContent = msg.from?.name || msg.from?.address || "?";
         const date = document.createElement("span");
         date.className = "ml-thread-popup-date";
-        date.textContent = formatDate(msg.date);
+        date.textContent = formatDate(effectiveDate(msg));
         const subject = document.createElement("span");
         subject.className = "ml-thread-popup-subject";
         subject.textContent = msg.subject || "(no subject)";
@@ -1772,7 +1867,8 @@ class MessageRow {
         renderStatusIcons(icons, msg);
         const dateText = document.createElement("span");
         dateText.className = "ml-date-text";
-        dateText.textContent = formatDate(msg.date);
+        dateText.textContent = formatDate(effectiveDate(msg));
+        dateText.title = dateBasis === "received" ? "Received date" : "Sent date";
         date.appendChild(icons);
         date.appendChild(dateText);
 
@@ -2010,6 +2106,18 @@ class MessageRow {
         if (e.ctrlKey || e.metaKey) {
             this.setSelected(!this.isSelected);
             lastClickedRow = this.el;
+            // Ctrl/Cmd-click builds a multi-selection — it MUST set
+            // `multi-select-on`, or a background re-render (new mail arriving)
+            // won't preserve the highlights and restoreSelection collapses the
+            // whole selection down to the single focused row (Bob 2026-07-01:
+            // "suddenly deselect all the messages and leave one"). Same root as
+            // the old Ctrl+A gap. Drop the flag again if the toggle emptied the
+            // selection so a later plain click behaves as single-select.
+            if (body) {
+                const n = body.querySelectorAll(".ml-row.selected").length;
+                if (n >= 1) body.classList.add("multi-select-on");
+                else body.classList.remove("multi-select-on");
+            }
         } else {
             clearSelection();
             focusRow(this);

package/client/components/message-viewer.js

@@ -762,6 +762,13 @@ export async function showMessage(accountId, uid, folderId, specialUse, isRetry
                     if (name) {
                         items.push({ label: `Copy both: ${both}`, action: () => navigator.clipboard.writeText(both) });
                     }
+                    items.push({
+                        label: `Open in contacts: ${addr.address}`,
+                        action: async () => {
+                            const { openAddressBook } = await import("./address-book.js");
+                            await openAddressBook(addr.address);
+                        },
+                    });
                     items.push({
                         label: `Add to contacts: ${addr.address}`,
                         action: async () => {