@rapidmx/web-client 0.3.1 → 0.5.0

package/dist/apps/www/index.js

@@ -4,36 +4,104 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import { useCallback, useEffect, useRef, useState } from "react";
+import { HiOutlineLockClosed } from "react-icons/hi2";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
-import { getMessage, listMessages } from "@rapidmx/react-shared/mail/mailApi.js";
+import { getMessage, getMessageRawContent, listMessages } from "@rapidmx/react-shared/mail/mailApi.js";
 import { listLabels } from "@rapidmx/react-shared/mail/labelsApi.js";
 import { listConversations } from "@rapidmx/react-shared/mail/conversationsApi.js";
 import { search as searchMailbox } from "@rapidmx/react-shared/search/searchApi.js";
 import { parseSearchQuery } from "@rapidmx/react-shared/search/queryGrammar.js";
 import { normalizeServerScores } from "@rapidmx/react-shared/search/searchScoring.js";
 import { searchEncryptedCandidates } from "@rapidmx/react-shared/search/searchTier3.js";
-import { getUnlockedKeys } from "@rapidmx/react-shared/crypto/keySession.js";
+import { searchLocalIndex } from "../shared/search/searchTier2.js";
+import { getUnlockedKeys, subscribeKeySession } from "@rapidmx/react-shared/crypto/keySession.js";
+import { evaluateMessageSecurity } from "@rapidmx/react-shared/crypto/messageSecurity.js";
 import { useMarkMessageRead, useMessageAttachments } from "@rapidmx/react-shared/mail/mailDetailHooks.js";
 import useIsMobile from "@rapidmx/react-shared/util/useIsMobile.js";
-import MailShell, { useMailShell } from "../shared/components/mail/layout/MailShell.js";
+import MailShell, { useMailShell, } from "../shared/components/mail/layout/MailShell.js";
 import MessageDetailPane from "../shared/components/mail/MessageDetailPane.js";
 import ConversationList from "../shared/components/mail/ConversationList.js";
 import ConversationThreadPane from "../shared/components/mail/ConversationThreadPane.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
+import Skeleton from "@rapidmx/react-shared/components/feedback/Skeleton.js";
+import { useUnlockPrompt } from "../shared/components/layout/UnlockPromptProvider.js";
 const MESSAGE_PAGE_SIZE = 50;
 const SEARCH_DEBOUNCE_MS = 300;
-/** Merges Tier 1 (server, possibly `metadataOnly` for an encrypted message) and Tier 3 (decrypted,
- * content-verified) results into one ranked list, per `specs/search.md` §7's "client MUST re-score all
- * results it can see... normalise into the same space rather than interleaving raw scores": both sides
- * are normalized independently via `normalizeServerScores()` before merging, since a Postgres/OpenSearch
- * score and this module's own term-count score occupy unrelated ranges. A uid present in both lists
- * (Tier 1 found it via a `participants` coincidence, Tier 3 then genuinely verified its content) keeps
- * only the Tier 3 entry - real content verification supersedes a metadata guess for the same message.
- * Deliberately not the spec's full skeleton/reordering "Progressive Results" UX (§_Progressive
- * Results_) - that's real, separate UI work; this returns one final merged list once both tiers
- * resolve, same as how the search box already waits on one round-trip today. */
-function mergeSearchResults(tier1, tier3) {
+const LIST_PREVIEW_MAX_LENGTH = 160;
+/** The literal outer-envelope `Subject` every encrypted message carries server-side - RFC 9788's
+ * `hcp_baseline` policy obscures it to this exact string (see `smimeMessage.ts`'s
+ * `applyBaselineOuterHeaders()`), which is also all `Message.subject` ever shows for one of these until
+ * decrypted client-side. Used here to recognize which loaded rows are worth decrypting for display. */
+const ENCRYPTED_SUBJECT_PLACEHOLDER = "[...]";
+/** Strips HTML down to plain text, for a short list-row preview of a decrypted body - mirrors
+ * `searchTier3.ts`'s own private `stripHtml()` (not currently exported from `@rapidmx/react-shared`,
+ * so duplicated here rather than pulled in through a package change just for this one small, pure
+ * helper). Not a security boundary - the output only ever feeds plain text display, truncated below,
+ * never rendered back into any DOM. */
+function stripHtmlToText(html) {
+    return html
+        .replace(/<(script|style)[^>]*>[\s\S]*?<\/\1>/gi, " ")
+        .replace(/<[^>]+>/g, " ")
+        .replace(/&nbsp;/gi, " ")
+        .replace(/&amp;/gi, "&")
+        .replace(/&lt;/gi, "<")
+        .replace(/&gt;/gi, ">")
+        .replace(/&quot;/gi, '"')
+        .replace(/&#0*39;/gi, "'")
+        .replace(/\s+/g, " ")
+        .trim();
+}
+/**
+ * Decrypts the subject/preview of every currently-loaded row whose subject is still the RFC 9788
+ * placeholder (i.e. every encrypted message this device hasn't already resolved), keyed by uid - the
+ * inbox-list counterpart to `MessageDetailPane`'s own single-message decrypt and `searchTier3.ts`'s
+ * per-candidate decrypt. Bounded to `messages` (at most one loaded page, `MESSAGE_PAGE_SIZE`), never the
+ * whole mailbox - matching `searchEncryptedCandidates()`'s own "bounded, not everything" scope. Runs only
+ * once `unlocked` is available (the caller decides when to call this - see `InboxContent`'s own effect
+ * and `handleUnlockList()`), and a single row's fetch/decrypt failure never blocks the rest.
+ */
+async function decryptEncryptedRows(messages, unlocked) {
+    const encrypted = messages.filter((m) => m.subject === ENCRYPTED_SUBJECT_PLACEHOLDER);
+    const entries = await Promise.all(encrypted.map(async (message) => {
+        try {
+            const rawMime = await getMessageRawContent(message.uid);
+            const security = await evaluateMessageSecurity(rawMime, unlocked);
+            if (!security.subject && !security.html) {
+                return null;
+            }
+            const preview = security.html ? stripHtmlToText(security.html).slice(0, LIST_PREVIEW_MAX_LENGTH) : undefined;
+            return [message.uid, { subject: security.subject, preview }];
+        }
+        catch {
+            return null;
+        }
+    }));
+    const result = {};
+    for (const entry of entries) {
+        if (entry) {
+            result[entry[0]] = entry[1];
+        }
+    }
+    return result;
+}
+/** Merges Tier 1 (server, possibly `metadataOnly` for an encrypted message), Tier 2 (local index, fully
+ * decrypted and re-scored), and Tier 3 (server-narrowed candidates, decrypted and re-scored) results into
+ * one ranked list, per `specs/search.md` §7's "client MUST re-score all results it can see... normalise
+ * into the same space rather than interleaving raw scores": each tier is normalized independently via
+ * `normalizeServerScores()` before merging, since a Postgres/OpenSearch score, a local `bm25()` score,
+ * and this module's own Tier 3 term-count score all occupy unrelated ranges. A uid present in more than
+ * one list keeps only the last-inserted entry (Tier 2 wins over Tier 3 wins over Tier 1) - Tier 2 and
+ * Tier 3 both represent genuine, content-verified scores for the same message, so which one "wins" on
+ * overlap doesn't change correctness, only which of two equally-valid scores is shown; either supersedes
+ * Tier 1's metadata-only guess for the same uid.
+ *
+ * Called progressively - once per tier as it resolves, each time with whatever tiers have reported so
+ * far (an empty array for the rest) - by `InboxContent`'s own search orchestration below, per §_Progressive
+ * Results_' "reordering is permitted and preferred over appending." This function itself stays pure and
+ * stateless; it has no notion of "in progress" versus "final." */
+function mergeSearchResults(tier1, tier2, tier3) {
     const normalizedTier1 = normalizeServerScores(tier1);
+    const normalizedTier2 = normalizeServerScores(tier2);
     const normalizedTier3 = normalizeServerScores(tier3);
     const merged = new Map();
     for (const entry of normalizedTier1) {
@@ -42,75 +110,223 @@ function mergeSearchResults(tier1, tier3) {
     for (const entry of normalizedTier3) {
         merged.set(entry.result.entityUid, entry);
     }
+    for (const entry of normalizedTier2) {
+        merged.set(entry.result.entityUid, entry);
+    }
     return Array.from(merged.values())
         .sort((a, b) => b.normalizedScore - a.normalizedScore)
         .map((entry) => entry.result);
 }
-/** Resolves one page of search hits into full `Message` records for display, plus each hit's own
- * `snippet` (keyed by message uid) for rendering in place of the plain `bodyPreview` while searching.
- *
- * `rawQuery` is parsed once, client-side, via `queryGrammar.ts`'s `parseSearchQuery()` — the operator
- * grammar (`from:`/`to:`/`subject:`/`has:attachment`/`before:`/`after:`/`in:`/`is:`/`label:`/`type:`,
- * `specs/search.md` §14) is extracted into structured filters passed to the server, while the
- * remaining free text (quotes, `-` negation, `OR` all preserved) still drives ranking as `q`.
- * `type:` narrows `entityTypes`; when absent this still defaults to `["message"]` — a non-message hit
+/** `type:` narrows `entityTypes`; when absent this still defaults to `["message"]` — a non-message hit
  * (contact/calendarEvent/note/task) has no `Message` to resolve via `getMessage()` below and is simply
  * dropped by the same eventually-consistent-index fallback that already existed, rather than rendered
  * (this inbox list only ever shows message rows; a real multi-entity-type results view is a separate,
- * larger UI project outside this pass).
+ * larger UI project outside this pass). Shared by both the fresh-search orchestration and `loadMore()`
+ * below, which each build this from the same `ParsedSearchQuery` differently only in `cursor`. */
+function tier1SearchParams(parsed, cursor, mailboxUid) {
+    return {
+        // The mailbox actually open - omitted, the server searches the caller's *own* mailbox, which is the
+        // wrong one whenever a shared mailbox's folder is being viewed.
+        mailboxUid,
+        types: parsed.entityTypes ?? ["message"],
+        cursor,
+        limit: MESSAGE_PAGE_SIZE,
+        from: parsed.from,
+        to: parsed.to,
+        cc: parsed.cc,
+        subject: parsed.subject,
+        hasAttachment: parsed.hasAttachment,
+        before: parsed.before,
+        after: parsed.after,
+        folderUid: parsed.folderUid,
+        flags: parsed.flags,
+        labels: parsed.labels,
+    };
+}
+/** How many of Tier 1's own `metadataOnly` hits (§7: "an encrypted entity matched only on server-visible
+ * metadata... MUST be rendered as skeleton entries in place... using the metadata score as a provisional
+ * position") are shown as skeleton rows at once - §_Progressive Results_' "Skeletons MUST be capped, at
+ * approximately one and a half pages." A non-`metadataOnly` Tier 1 hit (a real, already-scored content
+ * match — always the case for unencrypted mail) is never a skeleton and is never subject to this cap.
+ *
+ * A Tier 3 candidate that Tier 1 did *not* already surface has no provisional score/position of its own
+ * under the spec's own wording above, so it is deliberately never pre-rendered as a skeleton here either
+ * - it simply appears, fully resolved, once Tier 3 confirms it (see `InboxContent`'s search
+ * orchestration). */
+const SKELETON_CAP = Math.round(MESSAGE_PAGE_SIZE * 1.5);
+function capSkeletons(tier1Hits) {
+    let skeletonsSeen = 0;
+    return tier1Hits.filter((hit) => {
+        if (!hit.metadataOnly) {
+            return true;
+        }
+        skeletonsSeen += 1;
+        return skeletonsSeen <= SKELETON_CAP;
+    });
+}
+/** How many candidates Tier 3 pulls per distinct search - larger than one page's worth so several
+ * `loadMore()` pages can be sliced from one decrypt pass (see `Tier3Cache` below) instead of a second,
+ * separately expensive server round trip and re-decrypt for the same query. Bounded, not unlimited - per
+ * this module's own `tier1SearchParams()` sibling, Tier 3's own candidate-narrowing is already the
+ * "heaviest single client-side cost" tier (`specs/search.md` §9's identical framing for attachment
+ * extraction); a query whose true candidate set exceeds this simply pages out once this cache is
+ * exhausted; `loadMore()` reflects that honestly via `hasMore`. */
+const TIER3_CANDIDATE_LIMIT = 200;
+/** Keyed by the exact query windows Tier 3 actually ran (`tier3Windows()` - which already reflect the query,
+ * the "Search all mail" toggle, and Tier 2's coverage at the time), not just the query: the same query
+ * narrowed differently (a build finished, new mail moved the coverage end) must not reuse a result that was
+ * computed over a different date range. */
+function tier3CacheKey(mailboxUid, windows, unlocked) {
+    return `${mailboxUid}|${JSON.stringify(windows)}|${String(unlocked)}`;
+}
+/** A search query's cache/cursor identity - stable across re-parsing the identical raw text, and
+ * distinct for anything else (§8's "a query fingerprint, so a cursor cannot be replayed against a
+ * different query"). `JSON.stringify` on `ParsedSearchQuery` is deterministic here because every one of
+ * its own fields is a primitive or a `Date` (which serializes to a fixed ISO string) - no nested object
+ * whose key order could vary between two structurally-identical parses of the same text. */
+function queryFingerprint(parsed) {
+    return JSON.stringify(parsed);
+}
+/** The date windows Tier 3 still has to search: the query's own range minus Tier 2's guaranteed coverage
+ * `[coverage.indexedFrom, coverage.indexedUntil]`, unless the reader explicitly asked to "Search all mail".
+ * Tier 2 already holds fully-decrypted, current content for that range, so re-fetching and re-decrypting it
+ * through Tier 3's slower candidate-narrowing path would be pure waste. Yields up to two windows - older than
+ * the coverage (`before:` tightened to `indexedFrom`) and newer than it (`after:` raised to `indexedUntil`,
+ * since nothing indexes mail that arrived after the build pass started) - never *widening* a bound the query
+ * already specified, and none at all when the query lies entirely inside the coverage.
  *
- * Tier 3 (`searchTier3.ts#searchEncryptedCandidates()`) runs alongside Tier 1 only for the first page
- * (`cursor` absent) - it has no pagination wiring yet (a deliberate scope trim, see that module's own
- * doc comment), so a `loadMore()` continuation stays Tier-1-only. Silently contributes nothing when
- * this mailbox has no unlocked keys this session (`getUnlockedKeys()` returns `undefined`) - nothing
- * for it to decrypt, same as `MessageDetailPane`'s own encrypted-message handling elsewhere. */
-async function searchMessages(mailboxUid, rawQuery, cursor) {
-    const parsed = parseSearchQuery(rawQuery);
-    const [page, tier3Results] = await Promise.all([
-        searchMailbox(parsed.text, {
-            types: parsed.entityTypes ?? ["message"],
-            cursor,
-            limit: MESSAGE_PAGE_SIZE,
-            from: parsed.from,
-            to: parsed.to,
-            cc: parsed.cc,
-            subject: parsed.subject,
-            hasAttachment: parsed.hasAttachment,
-            before: parsed.before,
-            after: parsed.after,
-            folderUid: parsed.folderUid,
-            flags: parsed.flags,
-            labels: parsed.labels,
-        }),
-        cursor ? Promise.resolve([]) : searchEncryptedCandidates(parsed, getUnlockedKeys(mailboxUid)),
-    ]);
-    const mergedResults = mergeSearchResults(page.results, tier3Results);
-    const resolved = await Promise.all(mergedResults.map(async (hit) => {
+ * Only narrows once Tier 2 reports a finished, complete build pass from this session: while it's still
+ * building (or a pass stopped early - a failed folder listing, the byte budget) `indexedFrom` is just the
+ * oldest row that happens to be present, not a guarantee every encrypted message since then is indexed, and
+ * narrowing on it would silently drop encrypted results neither tier returns. */
+function tier3Windows(parsed, coverage, searchAllMail) {
+    if (searchAllMail || !coverage?.indexedFrom || !coverage.indexedUntil || coverage.building || !coverage.complete) {
+        return [parsed];
+    }
+    const coveredFrom = new Date(coverage.indexedFrom);
+    const coveredUntil = new Date(coverage.indexedUntil);
+    const windows = [];
+    if (!parsed.after || parsed.after.getTime() < coveredFrom.getTime()) {
+        windows.push({ ...parsed, before: parsed.before && parsed.before.getTime() < coveredFrom.getTime() ? parsed.before : coveredFrom });
+    }
+    if (!parsed.before || parsed.before.getTime() > coveredUntil.getTime()) {
+        windows.push({ ...parsed, after: parsed.after && parsed.after.getTime() > coveredUntil.getTime() ? parsed.after : coveredUntil });
+    }
+    return windows;
+}
+/** Runs Tier 3 over each window and merges the candidates (a uid can't match in two disjoint windows, but a
+ * message whose date sits exactly on a boundary may come back from both). */
+async function searchTier3Windows(windows, unlocked, mailboxUid) {
+    const pages = await Promise.all(windows.map((window) => searchEncryptedCandidates(window, unlocked, TIER3_CANDIDATE_LIMIT, { mailboxUid })));
+    const merged = new Map();
+    for (const result of pages.flat()) {
+        if (!merged.has(result.entityUid)) {
+            merged.set(result.entityUid, result);
+        }
+    }
+    return [...merged.values()];
+}
+/** `undefined` for a missing, corrupted, or foreign-query cursor - every caller already treats "no
+ * cursor" as "start this tier from the beginning," so there's no separate error path needed here. */
+function decodeCursor(raw, fingerprint) {
+    return raw?.fingerprint === fingerprint ? raw : undefined;
+}
+/** Resolves every hit's `entityUid` to a full `Message` via `getMessage()`, reusing `cache` across
+ * repeated calls within the same search pass - `InboxContent`'s own search orchestration below re-merges
+ * and re-resolves the *entire* current hit set each time a tier resolves, so without this cache every
+ * stage would re-fetch messages an earlier stage already fetched. A hit whose message no longer resolves
+ * (deleted after being indexed, or the fetch itself failed) is cached as `null` and dropped - the same
+ * "a search hit can briefly outlive the message it points to" tolerance this function's inline
+ * predecessor already had. */
+async function resolveHitsToMessages(hits, cache) {
+    const toFetch = hits.filter((hit) => !cache.has(hit.entityUid));
+    await Promise.all(toFetch.map(async (hit) => {
         const message = await getMessage(hit.entityUid).catch(() => null);
-        return message ? { message, snippet: hit.snippet } : null;
+        cache.set(hit.entityUid, message);
     }));
-    // A search hit can briefly outlive the message it points to (index updates are eventually consistent,
-    // and a message can be deleted after being indexed) - drop anything that no longer resolves rather than
-    // rendering a broken entry.
     const messages = [];
     const snippets = {};
-    for (const entry of resolved) {
-        if (!entry) {
+    for (const hit of hits) {
+        const message = cache.get(hit.entityUid);
+        if (!message) {
             continue;
         }
-        messages.push(entry.message);
-        if (entry.snippet) {
-            snippets[entry.message.uid] = entry.snippet;
+        messages.push(message);
+        if (hit.snippet) {
+            snippets[message.uid] = hit.snippet;
         }
     }
-    return { messages, nextCursor: page.nextCursor, snippets };
+    return { messages, snippets };
+}
+/** How far outside the scroll container's visible area the load-more sentinel still counts as "in view". */
+const LOAD_MORE_ROOT_MARGIN_PX = 200;
+/** How many full pages in a row that added no new rows the list keeps loading on its own before it shows a
+ * "Load more" button instead. */
+const MAX_EMPTY_PAGE_CONTINUATIONS = 3;
+/** `true` when `more` has at least one uid `shown` doesn't - i.e. appending it actually adds rows. */
+function hasUnseenMessages(shown, more) {
+    const seen = new Set(shown.map((m) => m.uid));
+    return more.some((m) => !seen.has(m.uid));
+}
+/** The load-more sentinel's actual current geometry against its scroll container, with the same margin the
+ * IntersectionObserver uses. */
+function isWithinLoadMoreRange(sentinel, root) {
+    const rect = sentinel.getBoundingClientRect();
+    const rootRect = root.getBoundingClientRect();
+    return rect.top <= rootRect.bottom + LOAD_MORE_ROOT_MARGIN_PX && rect.bottom >= rootRect.top - LOAD_MORE_ROOT_MARGIN_PX;
+}
+/** Appends `more` to `shown`, skipping any uid already shown - a later page can repeat rows (Tier 1 and
+ * Tier 2/3 cursors advance independently, so the same message can come back from a different tier on a
+ * later page; a plain folder listing's pages shift when new mail arrives between fetches). */
+function appendUnseenMessages(shown, more) {
+    const seen = new Set(shown.map((m) => m.uid));
+    const unseen = [];
+    for (const message of more) {
+        if (!seen.has(message.uid)) {
+            seen.add(message.uid);
+            unseen.push(message);
+        }
+    }
+    return unseen.length === 0 ? shown : [...shown, ...unseen];
+}
+/** Flattens and sorts a per-mailbox fetch into one merged, newest-first list - the aggregate ("All
+ * Inboxes" etc.) equivalent of `mergeSearchResults()` above, but simpler: an aggregated message has no
+ * natural relevance score to normalize, so this only ever sorts by `receivedDate`. */
+function mergeInboxMessages(perMailbox) {
+    return perMailbox
+        .flatMap((entry) => entry.messages)
+        .sort((a, b) => new Date(b.receivedDate).getTime() - new Date(a.receivedDate).getTime());
+}
+/**
+ * Fans out one `listMessages()` call per accessible mailbox that has a folder of `type`, merges the
+ * results newest-first. A mailbox with no matching folder, or whose fetch fails, simply contributes
+ * nothing - one mailbox's absence/failure must not blank out every other mailbox's messages.
+ *
+ * **Pagination scope trim (deliberate, matching this file's own documented Tier 2/3 tradeoffs)**: there is
+ * no composite cursor across an arbitrary number of independently-paginated mailboxes in this pass - this
+ * always fetches exactly each mailbox's own first page (`MESSAGE_PAGE_SIZE`) and the caller never offers a
+ * "load more" for the result (see `InboxContent`'s own `hasMore` handling in aggregate mode) - a real
+ * composite-cursor "load more" per mailbox is a natural v2 if usage shows people scrolling past the first
+ * page in aggregate view often.
+ */
+async function fetchAggregateMessages(mailboxFolders, type) {
+    const perMailbox = await Promise.all(mailboxFolders.map(async ({ mailbox, folders }) => {
+        const folder = folders.find((f) => f.type === type);
+        if (!folder) {
+            return { mailbox, messages: [] };
+        }
+        const messages = await listMessages(folder.uid, { limit: MESSAGE_PAGE_SIZE }).catch(() => []);
+        return { mailbox, messages };
+    }));
+    return mergeInboxMessages(perMailbox);
 }
 export default function InboxPage(props) {
-    return (_jsx(MailShell, { ...props, children: _jsx(InboxContent, {}) }));
+    return (_jsx(MailShell, { ...props, children: _jsx(InboxContent, { userUid: props.userUid }) }));
 }
-function InboxContent() {
-    const { folderUid, mailboxUid, folders } = useMailShell();
+function InboxContent({ userUid }) {
+    const { folderUid, mailboxUid, mailboxes, mailboxFolders, aggregateFolderType } = useMailShell();
     const isMobile = useIsMobile();
+    const { requestUnlock } = useUnlockPrompt();
     const [viewMode, setViewMode] = useState("date");
     const [messages, setMessages] = useState([]);
     const [conversations, setConversations] = useState([]);
@@ -125,22 +341,194 @@ function InboxContent() {
     const [searchQuery, setSearchQuery] = useState("");
     const [snippets, setSnippets] = useState({});
     const [labels, setLabels] = useState([]);
-    const isSearching = viewMode === "date" && searchQuery.length > 0;
-    const pageRef = useRef(0);
-    const cursorRef = useRef(undefined);
+    // Tier 2's own reported window coverage for the current search - undefined outside a search, or
+    // before Tier 2 has resolved yet for this search pass.
+    const [coverage, setCoverage] = useState(undefined);
+    // Keyed by message uid - see decryptEncryptedRows(). Never cleared on folder/search switches (a
+    // decrypted row stays decrypted while its keys stay unlocked; re-decrypting on every navigation would
+    // waste work for no benefit) - only cleared when the mailbox's keys are locked (see the
+    // `subscribeKeySession()` effect below).
+    const [decryptedRows, setDecryptedRows] = useState({});
+    // Bumped after a successful on-demand unlock to re-run the search effect below - it's not a
+    // dependency the effect could otherwise react to (getUnlockedKeys() is a plain module-level read, not
+    // React state; see keySession.ts's own doc comment).
+    const [unlockRefresh, setUnlockRefresh] = useState(0);
+    // §_Progressive Results_: which of the current search's uids are still an unconfirmed Tier 1
+    // `metadataOnly` guess (rendered as a skeleton row - see the JSX below) - empty outside a search, and
+    // always empty again once every tier has reported for the current pass (each unresolved entry is by
+    // then either confirmed, real content, or pruned - see the search orchestration effect).
+    const [pendingUids, setPendingUids] = useState(new Set());
+    // Withholds a hard result count until every tier has reported for the current search pass (§_Progressive
+    // Results_: "Never show a hard count until every tier has reported... A settled count is the signal
+    // that ordering is final"). Reset on every fresh search; irrelevant outside search mode.
+    const [tier1Done, setTier1Done] = useState(false);
+    const [tier2Done, setTier2Done] = useState(false);
+    const [tier3Done, setTier3Done] = useState(false);
+    // Toggled by the "Search all mail" action next to the results count - removes Tier 3's own default
+    // bound (tightened to Tier 2's coverage window otherwise - see tightenBeforeToCoverage()) for one
+    // re-run. Stored as the mailbox/folder/query it was requested for, not a plain flag, so it resets the
+    // moment any of those change - derived in the same render, so the search effect never runs a new
+    // query with a previous query's unbounded Tier 3 window first.
+    const [searchAllMailKey, setSearchAllMailKey] = useState(null);
+    const searchAllMailScope = `${mailboxUid ?? ""}\n${folderUid ?? ""}\n${searchQuery}`;
+    const searchAllMail = searchAllMailKey === searchAllMailScope;
+    // Search stays real-folder-only - Tier 1/2/3 are all deeply mailbox/folder-scoped, and extending them
+    // to span an arbitrary number of mailboxes is out of scope for this pass (see the aggregate-fetch
+    // branch below, which the search effect never reaches while `folderUid` is unset).
+    const isSearching = viewMode === "date" && searchQuery.length > 0 && !aggregateFolderType;
+    // How far into the folder's *current* server-side listing the rows fetched so far reach. Offset
+    // paging, not a cursor (`listMessages()` has none): a row removed locally (archived, scheduled send
+    // cancelled) also left the folder server-side, shifting every later message back by one - so each
+    // removal steps this back too, or the next page would silently skip a message. See `loadMore()`.
+    const listedOffsetRef = useRef(0);
     const scrollContainerRef = useRef(null);
-    const sentinelRef = useRef(null);
+    // State (via a callback ref), not a plain ref: the sentinel mounts and unmounts as the list loads,
+    // filters, and empties, and the observer effect below must re-attach to whichever node is current.
+    const [sentinel, setSentinel] = useState(null);
+    const [loadMoreError, setLoadMoreError] = useState(null);
+    const loadMoreErrorRef = useRef(null);
+    loadMoreErrorRef.current = loadMoreError;
+    const loadMoreInFlightRef = useRef(false);
+    // Bumped by `loadMore()` for each page that added at least one row - the only event the continuation
+    // effect below keeps loading after. A counter rather than watching `loadingMore` flip back to false: a
+    // fast response can settle before React ever renders the `true`, so that flip isn't reliably observable.
+    const [appendedPageCount, setAppendedPageCount] = useState(0);
+    // Consecutive full pages that added no new rows (every row was already shown - e.g. new mail shifted the
+    // folder's pages). Such a page still counts as progress for the continuation effect, up to
+    // `MAX_EMPTY_PAGE_CONTINUATIONS` in a row; past that, `loadMoreStalled` shows a "Load more" button
+    // instead, so a server that keeps repeating rows is never looped on.
+    const emptyPageStreakRef = useRef(0);
+    const [loadMoreStalled, setLoadMoreStalled] = useState(false);
+    const messagesRef = useRef(messages);
+    messagesRef.current = messages;
+    // The mailbox unlock/decrypt call sites below treat as "the" mailbox when there's no single selected
+    // one (aggregate mode) - mirrors `MailShell`'s own identical `defaultMailboxUid` fallback. An
+    // aggregate-view row from a *different*, not-yet-unlocked mailbox stays locked until that mailbox's
+    // own folder view is opened directly - an accepted limitation, not a bug (see `MailShell`'s own doc
+    // comment on the same tradeoff for its `LocalIndexLifecycle`/`KeyEnrollmentGate` wiring).
+    const activeMailboxUid = mailboxUid ?? mailboxes.find((mb) => mb.ownerUserUid === userUid)?.uid ?? mailboxes[0]?.uid;
+    const mailboxKeys = mailboxes.find((mb) => mb.uid === activeMailboxUid)?.keys ?? [];
+    // Reset to a fresh Map at the start of every new search pass (see the search effect below) - see
+    // resolveHitsToMessages()'s own doc comment on why this needs to persist *within* one pass but not
+    // across passes (a stale `null` for a uid that's since become resolvable elsewhere must not stick).
+    const resolvedMessageCacheRef = useRef(new Map());
+    // Session-scoped, never explicitly cleared - see Tier3Cache's own doc comment above.
+    const tier3CacheRef = useRef(new Map());
+    // The latest composite cursor this search pass has reached - read by loadMore(), written at the end
+    // of both the fresh-search orchestration and loadMore() itself. Not React state: it never drives a
+    // render on its own, only what loadMore() does with it later.
+    const compositeCursorRef = useRef(undefined);
+    // Guards every async load below - each search stage, the plain folder/conversation/aggregate listings,
+    // and `loadMore()` - against a stale, still-in-flight pass clobbering state for a newer one that started
+    // after it (the query, folder, or view changed) - the same `loadSeq`-style monotonic-id pattern already used elsewhere in this codebase (e.g.
+    // `settings/privacy/index.tsx`'s `ExportSection`), generalized here across three independently-timed
+    // async stages instead of one.
+    const searchRunIdRef = useRef(0);
+    // Bumped whenever `activeMailboxUid`'s keys are locked (see the `subscribeKeySession()` effect below) - a
+    // decrypt that started before the lock checks it before storing its now-stale plaintext rows.
+    const lockGenerationRef = useRef(0);
+    // `messages` themselves aren't a dependency here on purpose - a message uid, once decrypted, is
+    // never re-decrypted just because the list re-renders with the same rows (e.g. a folder-unrelated
+    // state update elsewhere). New rows (a fresh page load, load-more, or a completed search) each
+    // re-trigger this the normal way, by changing `messages` itself.
+    //
+    // Scoped to `activeMailboxUid`'s own rows only - in aggregate mode `messages` can span several
+    // mailboxes, but only one mailbox's keys are ever being unlocked/tracked here (see `activeMailboxUid`'s
+    // own doc comment above); an encrypted row from any other mailbox simply isn't a candidate for this
+    // auto-decrypt or the manual unlock banner below.
+    const undecryptedEncryptedUids = messages
+        .filter((m) => m.subject === ENCRYPTED_SUBJECT_PLACEHOLDER && !decryptedRows[m.uid] && m.mailboxUid === activeMailboxUid)
+        .map((m) => m.uid);
+    // Once unlocked, silently decrypt this page's own encrypted rows to show their real subject/preview -
+    // no prompt needed here, the same way searchEncryptedCandidates() already auto-includes decrypted
+    // matches once unlocked without asking again. Only the *first* unlock (or a fresh page of messages
+    // arriving) needs this; `handleUnlockList()` below covers the not-yet-unlocked case explicitly.
+    useEffect(() => {
+        if (undecryptedEncryptedUids.length === 0 || !activeMailboxUid) {
+            return;
+        }
+        const unlocked = getUnlockedKeys(activeMailboxUid);
+        if (!unlocked) {
+            return;
+        }
+        let cancelled = false;
+        const lockGeneration = lockGenerationRef.current;
+        void decryptEncryptedRows(messages.filter((m) => undecryptedEncryptedUids.includes(m.uid)), unlocked).then((decrypted) => {
+            // A lock while this was in flight already cleared `decryptedRows` - never put them back.
+            if (!cancelled && lockGeneration === lockGenerationRef.current && Object.keys(decrypted).length > 0) {
+                setDecryptedRows((prev) => ({ ...prev, ...decrypted }));
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [messages, unlockRefresh]);
+    // Locking a mailbox's keys (idle timeout, "Destroy keys on this device now", sign-out) must take its
+    // decrypted content off screen too, not just out of memory: decrypted subjects/previews, search
+    // snippets (Tier 2/3 snippets are decrypted content), and the already-decrypted Tier 3 candidates. A
+    // live search re-runs, so Tier 2/3 contribute nothing again until the user unlocks. Read through a ref
+    // so the subscription itself doesn't churn on every render.
+    const keyLockStateRef = useRef({ activeMailboxUid, isSearching });
+    keyLockStateRef.current = { activeMailboxUid, isSearching };
+    useEffect(() => subscribeKeySession(({ mailboxUid: changedMailboxUid, state }) => {
+        const current = keyLockStateRef.current;
+        if (state !== "locked" || changedMailboxUid !== current.activeMailboxUid) {
+            return;
+        }
+        lockGenerationRef.current += 1;
+        setDecryptedRows({});
+        setSnippets({});
+        tier3CacheRef.current.clear();
+        if (current.isSearching) {
+            setUnlockRefresh((n) => n + 1);
+        }
+    }), []);
+    async function handleUnlockList() {
+        try {
+            const unlocked = await requestUnlock(activeMailboxUid, mailboxKeys);
+            const lockGeneration = lockGenerationRef.current;
+            const decrypted = await decryptEncryptedRows(messages.filter((m) => m.subject === ENCRYPTED_SUBJECT_PLACEHOLDER && m.mailboxUid === activeMailboxUid), unlocked);
+            if (lockGeneration === lockGenerationRef.current) {
+                setDecryptedRows((prev) => ({ ...prev, ...decrypted }));
+            }
+        }
+        catch {
+            // User dismissed the unlock dialog - rows stay exactly as they were.
+        }
+    }
+    async function handleUnlockSearch() {
+        try {
+            await requestUnlock(activeMailboxUid, mailboxKeys);
+            setUnlockRefresh((n) => n + 1);
+        }
+        catch {
+            // User dismissed the unlock dialog - the search results stay exactly as they were.
+        }
+    }
     // Labels are mailbox-wide, not folder-scoped - fetched once per mailbox rather than per message, and
-    // handed to every `MessageDetailPane` instance below. A failure here just means the Labels control
-    // stays hidden (an empty `labels` array) rather than blocking the rest of the inbox - it's a small
-    // enhancement, not critical path the way the message list itself is. No `mailboxUid` guard needed -
-    // `MailShell` never renders this component at all until `mailboxUid` has resolved (same invariant
-    // `searchMessages(mailboxUid!, ...)` below already relies on).
+    // handed to the detail pane below. A failure here just means the Labels control stays hidden (an empty
+    // `labels` array) rather than blocking the rest of the inbox. Keyed on the *selected message's own*
+    // mailbox: aggregate views and search results can show messages from a mailbox other than
+    // `activeMailboxUid`, and offering that mailbox's labels would let a label from the wrong mailbox be
+    // applied. The conversation view stays scoped to `activeMailboxUid`, the mailbox its threads come from.
+    const selectedMessageMailboxUid = messages.find((m) => m.uid === selectedUid)?.mailboxUid;
+    const labelsMailboxUid = viewMode === "date" ? (selectedMessageMailboxUid ?? activeMailboxUid) : activeMailboxUid;
+    // `labelsMailboxUid` is always set: `MailShell` only renders this component once at least one mailbox
+    // exists, so `activeMailboxUid` (its fallback) always resolves.
     useEffect(() => {
-        listLabels(mailboxUid, { limit: 200 })
-            .then(setLabels)
-            .catch(() => setLabels([]));
-    }, [mailboxUid]);
+        let cancelled = false;
+        setLabels([]);
+        listLabels(labelsMailboxUid, { limit: 200 })
+            .then((result) => {
+            if (!cancelled) {
+                setLabels(result);
+            }
+        })
+            .catch(() => undefined);
+        return () => {
+            cancelled = true;
+        };
+    }, [labelsMailboxUid]);
     // Debounce the raw input into the query actually searched, so every keystroke doesn't fire a request.
     useEffect(() => {
         const handle = setTimeout(() => setSearchQuery(searchInput.trim()), SEARCH_DEBOUNCE_MS);
@@ -153,20 +541,63 @@ function InboxContent() {
         setSelectedUid(null);
         setSelectedConversationId(null);
         setClassificationFilter("all");
-        pageRef.current = 0;
-        cursorRef.current = undefined;
+        listedOffsetRef.current = 0;
+        compositeCursorRef.current = undefined;
         setHasMore(false);
+        setLoadMoreError(null);
+        setLoadMoreStalled(false);
+        emptyPageStreakRef.current = 0;
+        // Every run - search or not - supersedes whatever an earlier run (or a `loadMore()` it started)
+        // still has in flight; each async callback below checks this before touching state.
+        searchRunIdRef.current += 1;
+        const myRunId = searchRunIdRef.current;
+        const isCurrentRun = () => searchRunIdRef.current === myRunId;
+        // Also invalidates on unmount, so nothing lands after the component is gone. Unconditional: this
+        // cleanup only ever runs for the latest run of this effect (React runs it before the next run
+        // bumps the id, or on unmount), so the id is always still `myRunId` here.
+        const invalidate = () => {
+            searchRunIdRef.current += 1;
+        };
         if (viewMode === "conversation") {
-            // `mailboxUid` is always set by this point — `MailShell` only ever resolves `folderUid`
-            // (this component's own guard just below, gating everything before this effect can even
-            // run with `viewMode === "conversation"`) after `mailboxUid` is already known.
+            // Conversations stay single-mailbox (not aggregated across mailboxes in this pass) - in
+            // aggregate mode this falls back to `activeMailboxUid`, the same mailbox unlock/labels use
+            // (always set - `MailShell` only renders this component once at least one mailbox exists).
             setLoading(true);
             setError(null);
-            listConversations(mailboxUid)
-                .then(setConversations)
-                .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Could not load conversations."))
-                .finally(() => setLoading(false));
-            return;
+            listConversations(activeMailboxUid)
+                .then((result) => {
+                if (isCurrentRun()) {
+                    setConversations(result);
+                }
+            })
+                .catch((err) => {
+                if (isCurrentRun()) {
+                    setError(err instanceof ApiRequestError ? err.message : "Could not load conversations.");
+                }
+            })
+                .finally(() => {
+                if (isCurrentRun()) {
+                    setLoading(false);
+                }
+            });
+            return invalidate;
+        }
+        if (aggregateFolderType) {
+            setLoading(true);
+            setError(null);
+            // hasMore stays false (set above) - see fetchAggregateMessages()'s own pagination scope trim.
+            void fetchAggregateMessages(mailboxFolders, aggregateFolderType)
+                .then((results) => {
+                if (isCurrentRun()) {
+                    setMessages(results);
+                }
+            })
+                .finally(() => {
+                if (isCurrentRun()) {
+                    setLoading(false);
+                }
+            });
+            return invalidate;
         }
         if (!folderUid) {
             setMessages([]);
@@ -176,74 +607,264 @@ function InboxContent() {
         setLoading(true);
         setError(null);
         if (isSearching) {
-            searchMessages(mailboxUid, searchQuery)
-                .then(({ messages: results, nextCursor, snippets: newSnippets }) => {
-                setMessages(results);
-                setSnippets(newSnippets);
-                setHasMore(!!nextCursor);
-                cursorRef.current = nextCursor;
-            })
-                .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Search failed."))
-                .finally(() => setLoading(false));
-            return;
+            setCoverage(undefined);
+            setPendingUids(new Set());
+            setTier1Done(false);
+            setTier2Done(false);
+            setTier3Done(false);
+            resolvedMessageCacheRef.current = new Map();
+            const parsed = parseSearchQuery(searchQuery);
+            const unlocked = getUnlockedKeys(mailboxUid);
+            const fingerprint = queryFingerprint(parsed);
+            // Recomputes and re-renders the merged list from whatever tiers have reported so far -
+            // called once after Tier 1+2 (interim: unconfirmed Tier 1 metadataOnly hits render as
+            // skeletons) and again after Tier 3 (final: anything still unconfirmed is pruned instead -
+            // §_Progressive Results_' "Skeletons resolve or disappear"). Bails out via `myRunId` if a
+            // newer search pass has since started.
+            async function reveal(tier1Hits, tier2Hits, tier3Hits, final) {
+                const capped = capSkeletons(tier1Hits);
+                const confirmed = new Set([...tier2Hits, ...tier3Hits].map((r) => r.entityUid));
+                const effectiveTier1 = final ? capped.filter((hit) => !hit.metadataOnly || confirmed.has(hit.entityUid)) : capped;
+                const merged = mergeSearchResults(effectiveTier1, tier2Hits, tier3Hits);
+                const { messages: resolved, snippets: resolvedSnippets } = await resolveHitsToMessages(merged, resolvedMessageCacheRef.current);
+                if (searchRunIdRef.current !== myRunId) {
+                    return;
+                }
+                setMessages(resolved);
+                setSnippets(resolvedSnippets);
+                if (final) {
+                    setPendingUids(new Set());
+                }
+                else {
+                    const pending = new Set();
+                    for (const hit of capped) {
+                        if (hit.metadataOnly && !confirmed.has(hit.entityUid)) {
+                            pending.add(hit.entityUid);
+                        }
+                    }
+                    setPendingUids(pending);
+                }
+            }
+            void (async () => {
+                try {
+                    const [tier1Page, tier2Page] = await Promise.all([
+                        searchMailbox(parsed.text, tier1SearchParams(parsed, undefined, mailboxUid)),
+                        searchLocalIndex(mailboxUid, parsed, unlocked, MESSAGE_PAGE_SIZE, 0),
+                    ]);
+                    if (searchRunIdRef.current !== myRunId) {
+                        return;
+                    }
+                    setTier1Done(true);
+                    setTier2Done(true);
+                    setCoverage(tier2Page.coverage);
+                    setLoading(false);
+                    await reveal(tier1Page.results, tier2Page.results, [], false);
+                    const windows = tier3Windows(parsed, tier2Page.coverage, searchAllMail);
+                    const cacheKey = tier3CacheKey(mailboxUid, windows, !!unlocked);
+                    let tier3Full = tier3CacheRef.current.get(cacheKey);
+                    if (!tier3Full) {
+                        tier3Full = await searchTier3Windows(windows, unlocked, mailboxUid);
+                        if (searchRunIdRef.current !== myRunId) {
+                            return;
+                        }
+                        tier3CacheRef.current.set(cacheKey, tier3Full);
+                    }
+                    const tier3Page = tier3Full.slice(0, MESSAGE_PAGE_SIZE);
+                    setTier3Done(true);
+                    compositeCursorRef.current = {
+                        tier1Cursor: tier1Page.nextCursor,
+                        tier2Offset: tier2Page.results.length,
+                        tier3Offset: tier3Page.length,
+                        tier3Key: cacheKey,
+                        fingerprint,
+                    };
+                    setHasMore(!!tier1Page.nextCursor || tier2Page.hasMore || tier3Page.length < tier3Full.length);
+                    await reveal(tier1Page.results, tier2Page.results, tier3Page, true);
+                }
+                catch (err) {
+                    if (searchRunIdRef.current === myRunId) {
+                        setError(err instanceof ApiRequestError ? err.message : "Search failed.");
+                        setLoading(false);
+                    }
+                }
+            })();
+            return invalidate;
         }
         listMessages(folderUid, { limit: MESSAGE_PAGE_SIZE })
             .then((results) => {
-            setMessages(results);
-            setHasMore(results.length === MESSAGE_PAGE_SIZE);
+            if (isCurrentRun()) {
+                setMessages(results);
+                listedOffsetRef.current = results.length;
+                setHasMore(results.length === MESSAGE_PAGE_SIZE);
+            }
         })
-            .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Could not load messages."))
-            .finally(() => setLoading(false));
-    }, [viewMode, folderUid, mailboxUid, isSearching, searchQuery]);
+            .catch((err) => {
+            if (isCurrentRun()) {
+                setError(err instanceof ApiRequestError ? err.message : "Could not load messages.");
+            }
+        })
+            .finally(() => {
+            if (isCurrentRun()) {
+                setLoading(false);
+            }
+        });
+        return invalidate;
+        // `unlockRefresh`/`searchAllMail` are dependencies solely so `handleUnlockSearch()`/"Search all
+        // mail" can force this effect to re-run the search above - Tier 3 (encrypted) results silently
+        // contribute nothing without unlocked keys, so this is what actually makes them appear once the
+        // user unlocks, and what makes "Search all mail" actually remove Tier 3's coverage bound. Neither
+        // has any effect on the non-search branch below; re-running it with identical inputs just
+        // re-fetches the same page.
+    }, [viewMode, folderUid, mailboxUid, isSearching, searchQuery, unlockRefresh, searchAllMail, aggregateFolderType, mailboxFolders, activeMailboxUid]);
+    function handleSearchAllMail() {
+        setSearchAllMailKey(searchAllMailScope);
+    }
     const loadMore = useCallback(async () => {
-        if (loadingMore || !hasMore || loading || viewMode !== "date" || !folderUid) {
+        const parsed = parseSearchQuery(searchQuery);
+        const fingerprint = queryFingerprint(parsed);
+        // While searching, a load-more continues from this query's own cursor - absent until its first page
+        // has fully finished (the ref may still hold an earlier query's), in which case there's nowhere to
+        // continue from yet.
+        const searchCursor = decodeCursor(compositeCursorRef.current, fingerprint);
+        if (loadMoreInFlightRef.current ||
+            !hasMore ||
+            loading ||
+            viewMode !== "date" ||
+            !folderUid ||
+            (isSearching && !searchCursor)) {
             return;
         }
+        // A ref, not `loadingMore` state: the observer and the continuation effect below can both call in the
+        // same tick, each closing over a render where `loadingMore` was still false.
+        loadMoreInFlightRef.current = true;
+        setLoadMoreError(null);
+        setLoadMoreStalled(false);
         setLoadingMore(true);
+        /** Records whether a landed page added rows, and whether the continuation effect should keep going. */
+        const notePageLanded = (addedRows, moreRemain) => {
+            if (addedRows) {
+                emptyPageStreakRef.current = 0;
+                setAppendedPageCount((n) => n + 1);
+            }
+            else if (moreRemain) {
+                emptyPageStreakRef.current += 1;
+                if (emptyPageStreakRef.current <= MAX_EMPTY_PAGE_CONTINUATIONS) {
+                    setAppendedPageCount((n) => n + 1);
+                }
+                else {
+                    emptyPageStreakRef.current = 0;
+                    setLoadMoreStalled(true);
+                }
+            }
+        };
+        // A query/folder/view change while this page is in flight bumps the run id (see the effect above) -
+        // its rows then belong to a list that's no longer on screen and must not be appended to the new one.
+        const myRunId = searchRunIdRef.current;
+        const isCurrentRun = () => searchRunIdRef.current === myRunId;
         try {
             if (isSearching) {
-                const { messages: more, nextCursor, snippets: moreSnippets } = await searchMessages(mailboxUid, searchQuery, cursorRef.current);
-                setMessages((prev) => [...prev, ...more]);
+                const unlocked = getUnlockedKeys(mailboxUid);
+                const cursor = searchCursor;
+                const [tier1Page, tier2Page] = await Promise.all([
+                    searchMailbox(parsed.text, tier1SearchParams(parsed, cursor.tier1Cursor, mailboxUid)),
+                    searchLocalIndex(mailboxUid, parsed, unlocked, MESSAGE_PAGE_SIZE, cursor.tier2Offset),
+                ]);
+                // The first page cached this pass under `tier3Key` before it created the cursor.
+                const tier3Full = tier3CacheRef.current.get(cursor.tier3Key);
+                const tier3Offset = cursor.tier3Offset;
+                const tier3Page = tier3Full.slice(tier3Offset, tier3Offset + MESSAGE_PAGE_SIZE);
+                // Unlike the fresh-search pass above, a load-more page is resolved and appended in one
+                // shot rather than progressively revealed - rows already on screen shouldn't reorder or
+                // grow skeletons out from under a reader who has since scrolled past them. Any Tier 1
+                // metadataOnly hit this page that neither Tier 2 nor Tier 3 (both already awaited above)
+                // confirms simply keeps showing its existing placeholder text rather than a live skeleton
+                // - a deliberate, documented scope trim of progressive reveal to the first page only.
+                const merged = mergeSearchResults(capSkeletons(tier1Page.results), tier2Page.results, tier3Page);
+                const { messages: more, snippets: moreSnippets } = await resolveHitsToMessages(merged, resolvedMessageCacheRef.current);
+                if (!isCurrentRun()) {
+                    return;
+                }
+                const addedRows = hasUnseenMessages(messagesRef.current, more);
+                setMessages((prev) => appendUnseenMessages(prev, more));
                 setSnippets((prev) => ({ ...prev, ...moreSnippets }));
-                setHasMore(!!nextCursor);
-                cursorRef.current = nextCursor;
+                const nextTier3Offset = tier3Offset + tier3Page.length;
+                compositeCursorRef.current = {
+                    tier1Cursor: tier1Page.nextCursor,
+                    tier2Offset: cursor.tier2Offset + tier2Page.results.length,
+                    tier3Offset: nextTier3Offset,
+                    tier3Key: cursor.tier3Key,
+                    fingerprint,
+                };
+                const moreRemain = !!tier1Page.nextCursor || tier2Page.hasMore || nextTier3Offset < tier3Full.length;
+                setHasMore(moreRemain);
+                notePageLanded(addedRows, moreRemain);
             }
             else {
-                const nextPage = pageRef.current + 1;
-                const more = await listMessages(folderUid, { page: nextPage, limit: MESSAGE_PAGE_SIZE });
-                setMessages((prev) => [...prev, ...more]);
+                // The page containing the first message not fetched yet. After a local removal that offset is
+                // no longer a page boundary, so this page overlaps rows already shown - `appendUnseenMessages()`
+                // drops those - rather than skipping the message that shifted back across the boundary.
+                const page = Math.floor(listedOffsetRef.current / MESSAGE_PAGE_SIZE);
+                const more = await listMessages(folderUid, { page, limit: MESSAGE_PAGE_SIZE });
+                if (!isCurrentRun()) {
+                    return;
+                }
+                const addedRows = hasUnseenMessages(messagesRef.current, more);
+                setMessages((prev) => appendUnseenMessages(prev, more));
                 setHasMore(more.length === MESSAGE_PAGE_SIZE);
-                pageRef.current = nextPage;
+                listedOffsetRef.current = page * MESSAGE_PAGE_SIZE + more.length;
+                notePageLanded(addedRows, more.length === MESSAGE_PAGE_SIZE);
             }
         }
         catch (err) {
-            setError(err instanceof ApiRequestError ? err.message : "Could not load more messages.");
+            // Shown next to the sentinel with a Retry button - never auto-retried (see the continuation
+            // effect below), so a failing server isn't hammered while the sentinel stays in view.
+            if (isCurrentRun()) {
+                setLoadMoreError(err instanceof ApiRequestError ? err.message : "Could not load more messages.");
+            }
         }
         finally {
+            loadMoreInFlightRef.current = false;
             setLoadingMore(false);
         }
-    }, [loadingMore, hasMore, loading, viewMode, folderUid, isSearching, searchQuery]);
+    }, [hasMore, loading, viewMode, folderUid, isSearching, searchQuery, mailboxUid]);
     // Always calls the latest `loadMore` closure so the effect below doesn't need `loadMore` itself in its
     // dependency array (it changes on every keystroke/page load, which would otherwise mean nothing here).
     const loadMoreRef = useRef(loadMore);
     loadMoreRef.current = loadMore;
-    // `hasMore` is deliberately a dependency: the sentinel div only renders while `hasMore` is true (see
-    // the JSX below), so this effect must re-run when it flips - otherwise a run that fires before the
-    // first page of results has loaded (sentinel not in the DOM yet, `sentinelRef.current` still null)
-    // would bail out once and never attach an observer to the sentinel that appears moments later.
+    // Keyed on the sentinel node itself (see `sentinel`'s own comment): it unmounts whenever the list shows
+    // "Loading..." and remounts afterwards, so an observer attached once to an earlier node would watch a
+    // detached element forever. Only ever rendered in "By date" mode, so no view-mode check is needed.
     useEffect(() => {
-        const sentinel = sentinelRef.current;
-        if (!sentinel || viewMode !== "date") {
+        if (!sentinel) {
             return;
         }
         const observer = new IntersectionObserver((entries) => {
-            if (entries[0]?.isIntersecting) {
+            if (entries.some((entry) => entry.isIntersecting) && !loadMoreErrorRef.current) {
                 void loadMoreRef.current();
             }
-        }, { root: scrollContainerRef.current, rootMargin: "200px" });
+        }, { root: scrollContainerRef.current, rootMargin: `${LOAD_MORE_ROOT_MARGIN_PX}px` });
         observer.observe(sentinel);
         return () => observer.disconnect();
-    }, [viewMode, folderUid, isSearching, searchQuery, hasMore]);
+    }, [sentinel]);
+    // An observer only reports *changes* - a sentinel still in view after a page lands (the new rows didn't
+    // push it out of view, e.g. the Focused/Other filter hid every one of them) never reports again, so
+    // keep loading while it's still in view. Only after a page that appended rows, or a full page of rows
+    // already shown (bounded - see `emptyPageStreakRef`), never after a failure, and only when the sentinel's
+    // real geometry says it's still in view (the observer's last report may predate the rows that just landed).
+    useEffect(() => {
+        if (appendedPageCount === 0) {
+            return;
+        }
+        // The scroll container is always mounted whenever a sentinel is (the sentinel lives inside it).
+        if (sentinel && isWithinLoadMoreRange(sentinel, scrollContainerRef.current)) {
+            void loadMoreRef.current();
+        }
+    }, [appendedPageCount]);
+    function removeListedMessage(uid) {
+        setMessages((prev) => prev.filter((m) => m.uid !== uid));
+        listedOffsetRef.current = Math.max(0, listedOffsetRef.current - 1);
+        setSelectedUid(null);
+    }
     const selected = messages.find((m) => m.uid === selectedUid) ?? null;
     const selectedConversation = conversations.find((c) => c.conversationId === selectedConversationId) ?? null;
     const attachments = useMessageAttachments(selected);
@@ -251,20 +872,26 @@ function InboxContent() {
     // Search results can span every folder in the mailbox, not just the one selected in the sidebar - a
     // selected message's own folderUid is the only reliable source for its actual folder type once
     // searching (outside search, every message in `messages` already comes from `folderUid` itself, so
-    // this falls back to the sidebar selection unchanged).
-    const selectedFolderUid = isSearching ? (selected?.folderUid ?? folderUid) : folderUid;
+    // this falls back to the sidebar selection unchanged). Aggregate views span every *mailbox* too, so
+    // the folder list consulted is the selected message's own mailbox's, not the shell's ambient one.
+    const spansFolders = isSearching || !!aggregateFolderType;
+    const selectedFolderUid = spansFolders ? (selected?.folderUid ?? folderUid) : folderUid;
+    const selectedMailboxUid = spansFolders ? (selected?.mailboxUid ?? activeMailboxUid) : mailboxUid;
+    const folders = mailboxFolders.find((mf) => mf.mailbox.uid === selectedMailboxUid)?.folders ?? [];
     const isSentItems = folders.find((f) => f.uid === selectedFolderUid)?.type === "sent_items";
     const isOutbox = folders.find((f) => f.uid === selectedFolderUid)?.type === "outbox";
     const isInbox = folders.find((f) => f.uid === selectedFolderUid)?.type === "inbox";
     const draftsFolderUid = folders.find((f) => f.type === "drafts")?.uid;
     // Focused/Other is an Inbox-only concept (see `MessageDetailPane`'s own `isInbox` doc comment) — the
     // sub-tabs only ever render there, so a message with no `inferenceClassification` (the common case:
-    // absent means Focused) or an explicit `"focused"` counts as Focused, everything else as Other.
-    const visibleMessages = !isSearching && isInbox && classificationFilter !== "all"
+    // absent means Focused) or an explicit `"focused"` counts as Focused, everything else as Other. Not
+    // offered for an aggregate view (each mailbox classifies independently; merging that is out of scope).
+    const visibleMessages = !isSearching && !aggregateFolderType && isInbox && classificationFilter !== "all"
         ? messages.filter((m) => classificationFilter === "other"
             ? m.inferenceClassification === "other"
             : m.inferenceClassification !== "other")
         : messages;
+    const loadMoreStatus = loadingMore ? ("Loading more…") : loadMoreError ? (_jsxs("span", { className: "inline-flex items-center gap-2", children: [_jsx("span", { role: "alert", className: "text-danger", children: loadMoreError }), _jsx("button", { type: "button", onClick: () => void loadMoreRef.current(), className: "text-primary-dark hover:underline font-medium", children: "Retry" })] })) : loadMoreStalled ? (_jsx("button", { type: "button", onClick: () => void loadMoreRef.current(), className: "text-primary-dark hover:underline font-medium", children: "Load more" })) : null;
     function handleSelect(message) {
         if (isMobile) {
             window.location.href = `/messages/${encodeURIComponent(message.uid)}`;
@@ -285,7 +912,7 @@ function InboxContent() {
         }
         setSelectedConversationId(conversation.conversationId);
     }
-    if (!folderUid) {
+    if (!folderUid && !aggregateFolderType) {
         // `MailShell` never renders this component at all until a mailbox is resolved (see its own
         // full-screen `MailboxProvisioning` takeover otherwise) — this is purely the brief gap before
         // that mailbox's own folder list has finished loading, not a "no mailbox" state. Distinct text
@@ -299,30 +926,36 @@ function InboxContent() {
                                 ].join(" "), children: "By date" }), _jsx("button", { type: "button", onClick: () => setViewMode("conversation"), className: [
                                     "flex-1 py-2 font-semibold",
                                     viewMode === "conversation" ? "text-primary-dark border-b-2 border-primary-dark" : "text-text-muted",
-                                ].join(" "), children: "By conversation" })] }), viewMode === "conversation" && (_jsx("p", { className: "p-3 text-xs text-text-muted border-b border-border", children: "Showing every conversation in this mailbox \u2014 the selected folder doesn't filter this view." })), viewMode === "date" && (_jsx("div", { className: "p-2 border-b border-border", children: _jsx("input", { type: "search", value: searchInput, onChange: (e) => setSearchInput(e.target.value), placeholder: "Search all mail\u2026", "aria-label": "Search all mail", className: "w-full text-sm px-3 py-1.5 rounded-md border border-border bg-surface" }) })), viewMode === "date" && isInbox && !isSearching && (_jsx("div", { className: "flex border-b border-border text-xs", children: ["all", "focused", "other"].map((value) => (_jsx("button", { type: "button", onClick: () => setClassificationFilter(value), className: [
+                                ].join(" "), children: "By conversation" })] }), viewMode === "conversation" && (_jsx("p", { className: "p-3 text-xs text-text-muted border-b border-border", children: "Showing every conversation in this mailbox \u2014 the selected folder doesn't filter this view." })), viewMode === "date" && (_jsx("div", { className: "p-2 border-b border-border", children: _jsx("input", { type: "search", value: searchInput, onChange: (e) => setSearchInput(e.target.value), placeholder: aggregateFolderType ? "Open a mailbox's own folder to search" : "Search all mail…", "aria-label": "Search all mail", disabled: !!aggregateFolderType, className: "w-full text-sm px-3 py-1.5 rounded-md border border-border bg-surface disabled:opacity-55" }) })), viewMode === "date" && isInbox && !isSearching && !aggregateFolderType && (_jsx("div", { className: "flex border-b border-border text-xs", children: ["all", "focused", "other"].map((value) => (_jsx("button", { type: "button", onClick: () => setClassificationFilter(value), className: [
                                 "flex-1 py-1.5 font-semibold",
                                 classificationFilter === value
                                     ? "text-primary-dark border-b-2 border-primary-dark"
                                     : "text-text-muted",
-                            ].join(" "), children: value === "all" ? "All" : value === "focused" ? "Focused" : "Other" }, value))) })), error && (_jsx("div", { className: "p-4", children: _jsx(Alert, { children: error }) })), loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : viewMode === "conversation" ? (_jsx(ConversationList, { conversations: conversations, selectedId: selectedConversationId, onSelect: handleSelectConversation })) : visibleMessages.length === 0 ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: isSearching
-                            ? `No messages match "${searchQuery}".`
-                            : classificationFilter === "all"
-                                ? "No messages in this folder."
-                                : "No messages here." })) : (_jsxs(_Fragment, { children: [_jsx("ul", { children: visibleMessages.map((message) => (_jsx("li", { children: _jsxs("button", { type: "button", onClick: () => handleSelect(message), className: [
+                            ].join(" "), children: value === "all" ? "All" : value === "focused" ? "Focused" : "Other" }, value))) })), isSearching && (_jsxs("div", { className: "px-4 py-1.5 text-xs text-text-muted border-b border-border flex items-center justify-between gap-2", children: [_jsx("span", { children: tier1Done && tier2Done && tier3Done
+                                    ? `${visibleMessages.length} result${visibleMessages.length === 1 ? "" : "s"}`
+                                    : `${visibleMessages.length} of ??` }), tier2Done && !searchAllMail && (_jsx("button", { type: "button", onClick: handleSearchAllMail, className: "text-primary-dark hover:underline font-medium shrink-0", children: "Search all mail" }))] })), isSearching && coverage?.indexedFrom && (_jsxs("div", { className: "px-4 py-1.5 text-xs text-text-muted border-b border-border", children: ["Local search covers messages back to ", new Date(coverage.indexedFrom).toLocaleDateString(), coverage.building ? " (still building)" : "", searchAllMail
+                                ? " - searching everything, not just recent mail."
+                                : " - older encrypted mail is still searched, just slower."] })), isSearching && !getUnlockedKeys(mailboxUid) && (_jsx("div", { className: "px-4 py-2 border-b border-border bg-surface-alt", children: _jsxs("button", { type: "button", onClick: handleUnlockSearch, className: "inline-flex items-center gap-1 text-xs font-medium text-primary-dark hover:underline", children: [_jsx(HiOutlineLockClosed, { size: 12, "aria-hidden": "true" }), "Unlock to include encrypted messages in these results"] }) })), !isSearching && viewMode === "date" && undecryptedEncryptedUids.length > 0 && !getUnlockedKeys(activeMailboxUid) && (_jsx("div", { className: "px-4 py-2 border-b border-border bg-surface-alt", children: _jsxs("button", { type: "button", onClick: handleUnlockList, className: "inline-flex items-center gap-1 text-xs font-medium text-primary-dark hover:underline", children: [_jsx(HiOutlineLockClosed, { size: 12, "aria-hidden": "true" }), "Unlock to show ", undecryptedEncryptedUids.length === 1 ? "an encrypted message's" : "encrypted messages'", " subject"] }) })), error && (_jsx("div", { className: "p-4", children: _jsx(Alert, { children: error }) })), loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : viewMode === "conversation" ? (_jsx(ConversationList, { conversations: conversations, selectedId: selectedConversationId, onSelect: handleSelectConversation })) : visibleMessages.length === 0 ? (_jsxs(_Fragment, { children: [_jsx("p", { className: "p-4 text-sm text-text-muted", children: isSearching
+                                    ? `No messages match "${searchQuery}".`
+                                    : classificationFilter === "all"
+                                        ? "No messages in this folder."
+                                        : "No messages here." }), hasMore && (_jsx("div", { ref: setSentinel, "data-testid": "load-more-sentinel", className: "p-4 text-center text-xs text-text-muted", children: loadMoreStatus }))] })) : (_jsxs(_Fragment, { children: [_jsx("ul", { children: visibleMessages.map((message) => (_jsx("li", { children: _jsxs("button", { type: "button", onClick: () => handleSelect(message), className: [
                                             "w-full text-left px-4 py-3 border-b border-border",
                                             message.uid === selectedUid ? "bg-primary/10" : "hover:bg-surface-alt",
                                             message.flags.read ? "" : "font-semibold",
-                                        ].join(" "), children: [_jsxs("div", { className: "flex items-center justify-between gap-2 text-sm", children: [_jsx("span", { className: "truncate", children: message.from.displayName || message.from.address }), _jsx("span", { className: "text-xs text-text-muted shrink-0", children: new Date(message.receivedDate).toLocaleDateString() })] }), _jsx("div", { className: "text-sm truncate", children: message.subject || "(no subject)" }), _jsx("div", { className: "text-xs text-text-muted truncate font-normal", children: snippets[message.uid] || message.bodyPreview })] }) }, message.uid))) }), hasMore && (_jsx("div", { ref: sentinelRef, className: "p-4 text-center text-xs text-text-muted", children: loadingMore ? "Loading more…" : "" }))] }))] }), _jsx("div", { className: "hidden md:flex flex-1 min-w-0", children: viewMode === "conversation" ? (_jsx(ConversationThreadPane, { conversation: selectedConversation, folders: folders, labels: labels })) : (_jsx(MessageDetailPane, { message: selected, attachments: attachments, isSentItems: isSentItems, onRecalled: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), isOutbox: isOutbox, isInbox: isInbox, onClassified: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), onReceiptHandled: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), draftsFolderUid: draftsFolderUid, onScheduledSendCanceled: (updated) => {
+                                        ].join(" "), children: [_jsxs("div", { className: "flex items-center justify-between gap-2 text-sm", children: [_jsx("span", { className: "truncate", children: message.from.displayName || message.from.address }), _jsx("span", { className: "text-xs text-text-muted shrink-0", children: new Date(message.receivedDate).toLocaleDateString() })] }), aggregateFolderType && (_jsx("div", { className: "text-xs text-text-muted truncate font-normal", children: mailboxes.find((mb) => mb.uid === message.mailboxUid)?.displayName })), isSearching && pendingUids.has(message.uid) ? (_jsxs("div", { className: "flex flex-col gap-1.5 py-0.5", children: [_jsx(Skeleton, { height: "h-3.5", className: "w-2/3 rounded-sm" }), _jsx(Skeleton, { height: "h-3", className: "w-full rounded-sm" })] })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "text-sm truncate", children: decryptedRows[message.uid]?.subject ||
+                                                            (message.subject === ENCRYPTED_SUBJECT_PLACEHOLDER
+                                                                ? "Encrypted message"
+                                                                : message.subject) ||
+                                                            "(no subject)" }), _jsx("div", { className: "text-xs text-text-muted truncate font-normal", children: snippets[message.uid] || decryptedRows[message.uid]?.preview || message.bodyPreview })] }))] }) }, message.uid))) }), hasMore && (_jsx("div", { ref: setSentinel, "data-testid": "load-more-sentinel", className: "p-4 text-center text-xs text-text-muted", children: loadMoreStatus })), aggregateFolderType && (_jsx("p", { className: "p-4 text-center text-xs text-text-muted", children: "Showing the most recent mail from each mailbox. Open a specific mailbox\u2019s folder to see older mail." }))] }))] }), _jsx("div", { className: "hidden md:flex flex-1 min-w-0", children: viewMode === "conversation" ? (_jsx(ConversationThreadPane, { conversation: selectedConversation, folders: mailboxFolders.find((mf) => mf.mailbox.uid === activeMailboxUid)?.folders ?? [], labels: labels })) : (_jsx(MessageDetailPane, { message: selected, attachments: attachments, isSentItems: isSentItems, onRecalled: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), isOutbox: isOutbox, isInbox: isInbox, onClassified: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), onReceiptHandled: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))), draftsFolderUid: draftsFolderUid, onScheduledSendCanceled: (updated) => {
                         // The message moved out of the currently-viewed Outbox folder (into Drafts)
                         // — unlike a recall, which patches a message in place, this removes it from
                         // the list entirely, matching what a real folder switch would show.
-                        setMessages((prev) => prev.filter((m) => m.uid !== updated.uid));
-                        setSelectedUid(null);
+                        removeListedMessage(updated.uid);
                     }, onArchived: (updated) => {
                         // Same reasoning as onScheduledSendCanceled above — the message moved out of
                         // whichever folder is currently being viewed (into Archive), so it's removed
                         // from the list rather than patched in place.
-                        setMessages((prev) => prev.filter((m) => m.uid !== updated.uid));
-                        setSelectedUid(null);
+                        removeListedMessage(updated.uid);
                     }, labels: labels, onLabelsChanged: (updated) => setMessages((prev) => prev.map((m) => (m.uid === updated.uid ? updated : m))) })) })] }));
 }