@rapidmx/web-client 0.34.0 → 0.35.0

package/apps/shared/calendar/calendarLiveUpdates.ts

@@ -5,6 +5,7 @@
 /** Pure helper behind the calendar page's live updates: which push events say "an event changed". */
 
 import type { PushEvent } from "../../../lib/mail/pushClient.js";
+import { changedItemOf } from "../live/useFolderLiveUpdates.js";
 
 /** The published model name of a calendar event on either database (`CalendarEventMongo`, `CalendarEventSQL`) - and not the reminder's `"CalendarEvent"`,
  * which has its own action. */
@@ -20,9 +21,5 @@ const EVENT_MODEL = /^CalendarEvent(Mongo|SQL)$/;
  * changed event is handled that way, an ordinary one (an invitation arriving, an edit on another device) included.
  */
 export function changedEventOf(event: PushEvent): { uid: string; deleted: boolean } | undefined {
-    if (!EVENT_MODEL.test(event.type) || (event.action !== "create" && event.action !== "update" && event.action !== "delete")) {
-        return undefined;
-    }
-    const data = event.data as { uid?: unknown } | null | undefined;
-    return typeof data?.uid === "string" ? { uid: data.uid, deleted: event.action === "delete" } : undefined;
+    return changedItemOf(event, EVENT_MODEL);
 }

package/apps/shared/components/contacts/ContactsSidebar.tsx

@@ -12,6 +12,7 @@ import { notifyApiError } from "../../notifications/apiErrors.js";
 
 export type ContactsView =
     | { type: "all" }
+    | { type: "everyone" }
     | { type: "favorites" }
     | { type: "suggested" }
     | { type: "list"; uid: string; name: string }
@@ -94,7 +95,7 @@ function NavItem({
 }
 
 /**
- * Contacts' Outlook-style left sidebar: "Your contacts" (all, with count), "Favorites", "Suggested contacts" (the people the mailbox has corresponded with, when there are any), "Your contact
+ * Contacts' Outlook-style left sidebar: "All contacts" (the mailbox's own and its suggested ones together, when there are suggested ones), "Your contacts" (the mailbox's own, with count), "Favorites", "Suggested contacts" (the people the mailbox has corresponded with, when there are any), "Your contact
  * lists" (real `ContactList` records, fetched here), "Deleted", and "Categories" (derived from the
  * distinct `categories` values across the loaded contacts — no separate category registry exists
  * server-side). Owns its own contact-list data-fetching, per this app's convention of keeping
@@ -166,6 +167,9 @@ export default function ContactsSidebar({ mailboxUid, contacts, active, onSelect
     const navContent = (idPrefix: string) => (
         <>
             <div className="flex flex-col gap-0.5">
+                {suggestedCount !== undefined && (
+                    <NavItem label="All contacts" count={contacts.length + suggestedCount} active={active.type === "everyone"} onClick={() => handleSelect({ type: "everyone" })} />
+                )}
                 <NavItem label="Your contacts" count={contacts.length} active={active.type === "all"} onClick={() => handleSelect({ type: "all" })} />
                 <NavItem label="Favorites" count={favoriteCount} active={active.type === "favorites"} onClick={() => handleSelect({ type: "favorites" })} />
                 {suggestedCount !== undefined && (

package/apps/shared/components/contacts/contactCardData.ts

@@ -104,8 +104,11 @@ export async function loadUpcomingEvents(folders: readonly Folder[], address: st
         .slice(0, CARD_LIST_SIZE);
 }
 
-/** A vCard attachment's text. */
-export async function fetchVCardText(attachmentUid: string): Promise<string> {
+/** A vCard attachment's text - through `client` (its origin and token) when given, else the cookie request it always was. */
+export async function fetchVCardText(attachmentUid: string, client?: ApiClient): Promise<string> {
+    if (client) {
+        return (await client.fetchBlob(`/mail/attachments/${encodeURIComponent(attachmentUid)}/content`)).text();
+    }
     const res = await fetch(attachmentContentUrl(attachmentUid), { credentials: "include" });
     if (!res.ok) {
         throw new ApiRequestError(res.statusText || "Could not load this contact card.", res.status);
@@ -130,7 +133,7 @@ export async function loadParticipantCard(participant: Participant, context: Con
         const isSender = !!context.message && normalizeAddress(context.message.from.address) === normalizeAddress(participant.address);
         let fallback: ParsedVCardContact | undefined;
         for (const attachment of await vCardAttachments(context, client)) {
-            const cards = parseVCards(await fetchVCardText(attachment.uid));
+            const cards = parseVCards(await fetchVCardText(attachment.uid, client));
             const match = cardForAddress(cards, participant.address, false);
             if (match) {
                 return match;

package/apps/shared/components/mail/MessageDetailPane.tsx

@@ -16,7 +16,7 @@ import {
     HiOutlineNoSymbol,
     HiOutlineSun,
 } from "react-icons/hi2";
-import { ApiRequestError } from "../../../../lib/util/api.js";
+import { ApiRequestError, type ApiClient } from "../../../../lib/util/api.js";
 import {
     Attachment,
     Folder,
@@ -200,6 +200,23 @@ function downloadFromUrl(url: string, filename: string): void {
     a.remove();
 }
 
+/** How long an attachment saved through an explicit client keeps its object URL: the download has started well before this. */
+const DOWNLOAD_URL_LIFETIME_MS = 60_000;
+
+/**
+ * Saves the file at `path` through `client` (its origin and token, which a link's `href` cannot carry): its bytes become an object URL handed to
+ * `downloadFromUrl()`. The URL stays in `urls` until it is revoked - after `DOWNLOAD_URL_LIFETIME_MS`, or when the pane unmounts.
+ */
+async function downloadThroughClient(client: ApiClient, path: string, filename: string, urls: Set<string>): Promise<void> {
+    const url = URL.createObjectURL(await client.fetchBlob(path));
+    urls.add(url);
+    downloadFromUrl(url, filename);
+    setTimeout(() => {
+        urls.delete(url);
+        URL.revokeObjectURL(url);
+    }, DOWNLOAD_URL_LIFETIME_MS);
+}
+
 /** Saves one attachment recovered from inside a signed/encrypted entity. Always handed to the browser as an
  * opaque download (`application/octet-stream`), never rendered in this origin. */
 function downloadMimeAttachment(attachment: MimeAttachment): void {
@@ -529,6 +546,17 @@ function MessageDetailContent({
     const { mailboxes, trackMessageChange } = useMailShell();
     const { requestUnlock } = useUnlockPrompt();
     const client = useApiClient();
+    // Object URLs of attachments saved through `client`, revoked when they have been left to lapse or when this pane unmounts.
+    const downloadUrls = useRef(new Set<string>());
+    useEffect(() => {
+        const urls = downloadUrls.current;
+        return () => {
+            for (const url of urls) {
+                URL.revokeObjectURL(url);
+            }
+            urls.clear();
+        };
+    }, []);
     // Bumped after a successful on-demand unlock to re-run the effect below - it's not a dependency the
     // effect could read reactively otherwise (getUnlockedKeys() is a plain module-level read, not React
     // state; see keySession.ts's own doc comment).
@@ -783,11 +811,23 @@ function MessageDetailContent({
         return mailbox ? [mailbox.primarySmtpAddress, ...(mailbox.aliasAddresses ?? [])] : [];
     }
 
+    /** Saves a listed attachment: through the explicit client when there is one (failures are reported, the file is an object URL), else as the
+     * cookie link always did. */
+    function saveAttachment(attachment: Attachment) {
+        if (client) {
+            downloadThroughClient(client, `/mail/attachments/${encodeURIComponent(attachment.uid)}/content`, attachment.filename, downloadUrls.current).catch(
+                (err) => notifyApiError(err, "Couldn't download this attachment"),
+            );
+            return;
+        }
+        downloadFromUrl(attachmentContentUrl(attachment.uid), attachment.filename);
+    }
+
     /** Starts fetching what Reply/Reply All/Forward will need (the compose window's code, the original's body) as the
      * pointer or keyboard reaches one of their buttons, so the click itself finds it already on its way or here. */
     function prefetchReply() {
         prefetchComposeWindow();
-        prefetchOriginalMessage(message);
+        prefetchOriginalMessage(message, client);
     }
 
     /**
@@ -812,7 +852,7 @@ function MessageDetailContent({
             // Never rejects: loadOriginalMessage() and ownAddresses() don't, and the rest is pure.
             const late = (async (): Promise<ComposeLateInput> => {
                 const [original, own] = await Promise.all([
-                    loadOriginalMessage(message, security, { recipients: kind === "replyAll" }),
+                    loadOriginalMessage(message, security, { recipients: kind === "replyAll" }, client),
                     kind === "forward" ? [] : (knownOwn ?? ownAddresses()),
                 ]);
                 if (kind === "forward") {
@@ -1141,11 +1181,11 @@ function MessageDetailContent({
      * sanitized body - in a frame of its own; see `printMessage.ts`. */
     async function handlePrint() {
         try {
-            const content = bodyContent ?? (await fetchBodyContent(message.uid, message.version));
+            const content = bodyContent ?? (await fetchBodyContent(message.uid, message.version, undefined, client));
             const older = await olderConversationMessages(message, client).catch(() => []);
             // A few at a time: a long conversation is hundreds of messages, each of them several requests.
             const earlier = await mapWithConcurrency(older, PRINT_CONCURRENCY, (other) =>
-                printableOlderMessage(other).catch(
+                printableOlderMessage(other, client).catch(
                     (): PrintableMessage => ({
                         subject: other.subject || "(no subject)",
                         headers: printHeaders(other, formatMailAddress(other.from)),
@@ -1643,9 +1683,18 @@ function MessageDetailContent({
                                           <VCardAttachmentChip
                                               label={`${attachment.filename} (${formatBytes(attachment.sizeBytes)})`}
                                               message={message}
-                                              loadText={() => fetchVCardText(attachment.uid)}
-                                              onDownload={() => downloadFromUrl(attachmentContentUrl(attachment.uid), attachment.filename)}
+                                              loadText={() => fetchVCardText(attachment.uid, client)}
+                                              onDownload={() => saveAttachment(attachment)}
                                           />
+                                      ) : client ? (
+                                          // Through the explicit client a link cannot carry the token, so the file is fetched and saved from a button.
+                                          <button
+                                              type="button"
+                                              onClick={() => saveAttachment(attachment)}
+                                              className="text-xs font-medium py-1 px-2.5 rounded-pill bg-surface-alt text-text-muted hover:text-primary-dark"
+                                          >
+                                              {attachment.filename} ({formatBytes(attachment.sizeBytes)})
+                                          </button>
                                       ) : (
                                           <a
                                               href={attachmentContentUrl(attachment.uid)}

package/apps/shared/components/mail/compose/quotedBody.ts

@@ -2,7 +2,7 @@
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
-import { apiUrl } from "../../../../../lib/util/api.js";
+import { type ApiClient, apiUrl } from "../../../../../lib/util/api.js";
 import { Message, Recipient, attachmentContentUrl, getMessageRawContent, listAttachments } from "../../../../../lib/mail/mailApi.js";
 import type { QuotedBody } from "../../../../../lib/mail/compose/composeQuoting.js";
 import { MAX_QUOTED_IMAGE_BYTES, QuotedImageReference, embedQuotedImages } from "../../../../../lib/mail/compose/quotedImages.js";
@@ -44,9 +44,9 @@ const contentCache = new Map<string, { at: number; promise: Promise<string | und
 /**
  * The server's sanitized HTML body of a message (`GET /mail/messages/:id/content`), or `undefined` when it has none (a
  * `text/plain` message is answered with its preview instead) or the request failed or timed out. Never rejects. Remembered
- * for `QUOTE_CACHE_MS` - except a failure, which is asked again the next time.
+ * for `QUOTE_CACHE_MS` - except a failure, which is asked again the next time. Through `client` when given, else the cookie request.
  */
-function fetchContentHtml(uid: string): Promise<string | undefined> {
+function fetchContentHtml(uid: string, client?: ApiClient): Promise<string | undefined> {
     const cached = contentCache.get(uid);
     if (cached && Date.now() - cached.at < QUOTE_CACHE_MS) {
         return cached.promise;
@@ -55,6 +55,10 @@ function fetchContentHtml(uid: string): Promise<string | undefined> {
     const timer = setTimeout(() => controller.abort(), QUOTE_FETCH_TIMEOUT_MS);
     const promise = (async (): Promise<string | undefined> => {
         try {
+            if (client) {
+                const blob = await client.fetchBlob(`/mail/messages/${encodeURIComponent(uid)}/content`, { signal: controller.signal });
+                return blob.type.toLowerCase().includes("text/html") ? await blob.text() : undefined;
+            }
             const res = await fetch(apiUrl(`/mail/messages/${encodeURIComponent(uid)}/content`), { credentials: "include", signal: controller.signal });
             return res.ok && (res.headers.get("content-type") ?? "").includes("text/html") ? await res.text() : undefined;
         } catch {
@@ -92,9 +96,9 @@ function withTimeout<T>(promise: Promise<T>, ms: number): Promise<T> {
  * keyboard reaches a Reply/Reply All/Forward button - so the request is usually already answered when it is clicked.
  * Nothing to fetch for an encrypted message (`loadOriginalMessage()` never asks the server for one's body).
  */
-export function prefetchOriginalMessage(message: Message): void {
+export function prefetchOriginalMessage(message: Message, client?: ApiClient): void {
     if (!message.encrypted) {
-        void fetchContentHtml(message.uid);
+        void fetchContentHtml(message.uid, client);
     }
 }
 
@@ -116,18 +120,28 @@ function headerRecipients(value: string | undefined, type: "to" | "cc"): Recipie
 
 /** The `data:` URI of the picture a quoted image of `message` stands for - one of the message's own attachments, fetched with the session -
  * or `undefined` when there is none, it is not a raster image, it is too large or it could not be had. Never rejects. */
-function serverImageResolver(message: Message): (reference: QuotedImageReference, signal?: AbortSignal) => Promise<string | undefined> {
+function serverImageResolver(
+    message: Message,
+    client?: ApiClient,
+): (reference: QuotedImageReference, signal?: AbortSignal) => Promise<string | undefined> {
     let attachments: Promise<Awaited<ReturnType<typeof listAttachments>>> | undefined;
     return async (reference, signal) => {
         try {
-            attachments ??= listAttachments(message.folderUid, message.uid);
+            attachments ??= listAttachments(message.folderUid, message.uid, client);
             const attachment = findInlineAttachment(await attachments, reference);
             const type = attachment?.mimeType.split(";")[0].trim().toLowerCase();
             if (!attachment || !type || !EMBEDDED_IMAGE_TYPES.test(type) || attachment.sizeBytes > MAX_QUOTED_IMAGE_BYTES) {
                 return undefined;
             }
-            const res = await fetch(attachmentContentUrl(attachment.uid), { credentials: "include", signal });
-            const bytes = res.ok ? new Uint8Array(await res.arrayBuffer()) : undefined;
+            let bytes: Uint8Array | undefined;
+            if (client) {
+                // A failed response rejects here, which the catch below turns into no picture - as an `!res.ok` answer always was.
+                const blob = await client.fetchBlob(`/mail/attachments/${encodeURIComponent(attachment.uid)}/content`, { signal });
+                bytes = new Uint8Array(await blob.arrayBuffer());
+            } else {
+                const res = await fetch(attachmentContentUrl(attachment.uid), { credentials: "include", signal });
+                bytes = res.ok ? new Uint8Array(await res.arrayBuffer()) : undefined;
+            }
             return bytes && bytes.length <= MAX_QUOTED_IMAGE_BYTES ? toDataUri(type, bytes) : undefined;
         } catch {
             return undefined;
@@ -176,6 +190,7 @@ export async function loadOriginalMessage(
     message: Message,
     security: MessageSecurityResult | null,
     options: { recipients?: boolean } = {},
+    client?: ApiClient,
 ): Promise<OriginalMessage> {
     const recovered: QuotedBody | undefined =
         security?.text !== undefined ? { text: security.text } : security?.html !== undefined ? { html: security.html } : undefined;
@@ -193,7 +208,7 @@ export async function loadOriginalMessage(
     if (!recovered) {
         // Never rejects; nothing (a plain-text message, a failure, a timeout) leaves the raw message below as the other way
         // to the body.
-        const html = await fetchContentHtml(message.uid);
+        const html = await fetchContentHtml(message.uid, client);
         if (html !== undefined) {
             result.body = { html };
         } else {
@@ -202,7 +217,7 @@ export async function loadOriginalMessage(
     }
     try {
         if (needsRaw) {
-            const entity = parseMimeEntity(await withTimeout(getMessageRawContent(message.uid), QUOTE_FETCH_TIMEOUT_MS));
+            const entity = parseMimeEntity(await withTimeout(getMessageRawContent(message.uid, client), QUOTE_FETCH_TIMEOUT_MS));
             if (!recovered && result.body.html === undefined) {
                 const body = extractDisplayBody(entity);
                 result.body = body.html !== undefined ? { html: body.html } : body.text !== undefined ? { text: body.text } : {};
@@ -217,7 +232,7 @@ export async function loadOriginalMessage(
         // message's own recipients.
     }
     if (result.body.html !== undefined) {
-        const resolver = recovered ? partImageResolver(security?.attachments ?? []) : serverImageResolver(message);
+        const resolver = recovered ? partImageResolver(security?.attachments ?? []) : serverImageResolver(message, client);
         const html = result.body.html;
         // Bounded like the body's own request: a picture that has not arrived by then is cancelled and left out of the quote, not waited for -
         // the ones that have arrived stay.

package/apps/shared/components/mail/reading/MessageBody.tsx

@@ -9,6 +9,7 @@ import type { MimeAttachment } from "../../../../../lib/crypto/mime.js";
 import Alert from "../../../../../lib/components/feedback/Alert.js";
 import Button from "../../../../../lib/components/buttons/Button.js";
 import Skeleton from "../../../../../lib/components/feedback/Skeleton.js";
+import { useApiClient } from "../../../../../lib/util/apiClientContext.js";
 import { useResolvedTheme } from "../../../appearance/resolvedTheme.js";
 import { BodyContent, attachmentSource, cachedBodyContent, fetchBodyContent, makeCidResolver } from "./bodyContent.js";
 import { prepareBodyHtml } from "./bodyHtml.js";
@@ -78,6 +79,8 @@ export default function MessageBody({ messageUid, messageVersion, title, content
     });
     const [attempt, setAttempt] = useState(0);
     const supplied = content !== undefined;
+    // The explicit ApiClient this body is rendered under, if any - undefined for the cookie-based web app.
+    const client = useApiClient();
 
     useEffect(() => {
         if (supplied) {
@@ -95,7 +98,7 @@ export default function MessageBody({ messageUid, messageVersion, title, content
         if (!revalidating) {
             setRemote({ status: "loading" });
         }
-        fetchBodyContent(messageUid, messageVersion, controller.signal).then(
+        fetchBodyContent(messageUid, messageVersion, controller.signal, client).then(
             (loaded) => setRemote({ status: "ready", content: loaded, uid: messageUid }),
             (err) => {
                 if (!controller.signal.aborted && !revalidating) {

package/apps/shared/components/mail/reading/bodyContent.ts

@@ -2,7 +2,7 @@
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
-import { ApiRequestError, apiUrl } from "../../../../../lib/util/api.js";
+import { ApiRequestError, type ApiClient, apiUrl } from "../../../../../lib/util/api.js";
 import { Attachment, attachmentContentUrl } from "../../../../../lib/mail/mailApi.js";
 import type { MimeAttachment } from "../../../../../lib/crypto/mime.js";
 import { bytesToBase64, findInlineAttachment, toDataUri } from "../../../../../lib/mail/inlineImages.js";
@@ -31,28 +31,38 @@ export function cachedBodyContent(uid: string, version: number): BodyContent | u
 /**
  * The message's body from the server's `GET /mail/messages/:id/content`: the HTML the server sanitized when it ingested the message
  * (`sanitizedHtmlBlobKey`), or - for a message with none - the plain-text preview. A request that fails throws an `ApiRequestError`.
- * Successful answers are remembered per uid and version.
+ * Successful answers are remembered per uid and version. With an explicit `client` the request goes through it (its origin and token) instead of
+ * the `jwt` cookie; without one it is the cookie request it always was.
  */
-export async function fetchBodyContent(uid: string, version: number, signal?: AbortSignal): Promise<BodyContent> {
+export async function fetchBodyContent(uid: string, version: number, signal?: AbortSignal, client?: ApiClient): Promise<BodyContent> {
     const cached = cachedBodyContent(uid, version);
     if (cached) {
         return cached;
     }
-    // Says what it can show, as a document request would: the server answers with the sanitized HTML, or its plain-text fallback.
-    const res = await fetch(apiUrl(`/mail/messages/${encodeURIComponent(uid)}/content`), {
-        credentials: "include",
-        headers: { Accept: ACCEPT },
-        signal,
-    });
-    if (!res.ok) {
-        const contentType = res.headers.get("content-type") ?? "";
-        const body = contentType.includes("application/json") ? await res.json().catch(() => undefined) : undefined;
-        throw new ApiRequestError((body && (body.message || body.error)) || res.statusText || "Could not load this message.", res.status, body?.code, body);
+    const path = `/mail/messages/${encodeURIComponent(uid)}/content`;
+    let text: string;
+    let contentType: string;
+    if (client) {
+        // `fetchBlob()` rejects with the same `ApiRequestError` a failed response gives, and its blob carries the response's own type.
+        const blob = await client.fetchBlob(path, { headers: { Accept: ACCEPT }, signal });
+        text = await blob.text();
+        contentType = blob.type;
+    } else {
+        // Says what it can show, as a document request would: the server answers with the sanitized HTML, or its plain-text fallback.
+        const res = await fetch(apiUrl(path), {
+            credentials: "include",
+            headers: { Accept: ACCEPT },
+            signal,
+        });
+        if (!res.ok) {
+            const resType = res.headers.get("content-type") ?? "";
+            const body = resType.includes("application/json") ? await res.json().catch(() => undefined) : undefined;
+            throw new ApiRequestError((body && (body.message || body.error)) || res.statusText || "Could not load this message.", res.status, body?.code, body);
+        }
+        text = await res.text();
+        contentType = res.headers.get("content-type") ?? "";
     }
-    const text = await res.text();
-    const content: BodyContent = (res.headers.get("content-type") ?? "").toLowerCase().includes("text/html")
-        ? { kind: "html", html: text }
-        : { kind: "text", text };
+    const content: BodyContent = contentType.toLowerCase().includes("text/html") ? { kind: "html", html: text } : { kind: "text", text };
     if (cache.size >= CACHE_LIMIT) {
         cache.delete(cache.keys().next().value as string);
     }

package/apps/shared/components/mail/reading/conversationPrint.ts

@@ -40,15 +40,16 @@ export async function olderConversationMessages(message: Message, client?: ApiCl
 
 /**
  * One earlier message of a conversation as it prints: the body the reading pane would show. An encrypted one is decrypted here when this device has
- * its mailbox's keys unlocked; when it can't be, it prints a line saying so rather than the ciphertext.
+ * its mailbox's keys unlocked; when it can't be, it prints a line saying so rather than the ciphertext. `client` is the explicit `ApiClient` every
+ * request goes through when given (see `useApiClient()`); without one they are the cookie requests they always were.
  */
-export async function printableOlderMessage(message: Message): Promise<PrintableMessage> {
-    const attachments = await listAttachments(message.folderUid, message.uid).catch(() => []);
+export async function printableOlderMessage(message: Message, client?: ApiClient): Promise<PrintableMessage> {
+    const attachments = await listAttachments(message.folderUid, message.uid, client).catch(() => []);
     if (message.encrypted) {
         const unlocked = getUnlockedKeys(message.mailboxUid);
         if (unlocked) {
             const { evaluateMessageSecurity } = await import("../../../../../lib/crypto/messageSecurity.js");
-            const security = await evaluateMessageSecurity(await getMessageRawContent(message.uid), unlocked);
+            const security = await evaluateMessageSecurity(await getMessageRawContent(message.uid, client), unlocked);
             const content =
                 security.text !== undefined ? ({ kind: "text", text: security.text } as const) : security.html !== undefined ? ({ kind: "html", html: security.html } as const) : undefined;
             if (content) {
@@ -70,7 +71,8 @@ export async function printableOlderMessage(message: Message): Promise<Printable
     return {
         subject: message.subject || "(no subject)",
         headers: printHeaders(message, formatMailAddress(message.from)),
-        content: await fetchBodyContent(message.uid, message.version),
+        // Without a client this is exactly the cookie request it always was.
+        content: await (client ? fetchBodyContent(message.uid, message.version, undefined, client) : fetchBodyContent(message.uid, message.version)),
         attachments,
     };
 }

package/apps/shared/live/useFolderLiveUpdates.ts

@@ -0,0 +1,59 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useRef } from "react";
+import { getPushClient, type PushEvent } from "../../../lib/mail/pushClient.js";
+
+/** An item a push event says was created, changed or deleted: its uid, and whether it is gone. */
+export interface FolderItemChange {
+    uid: string;
+    deleted: boolean;
+}
+
+/**
+ * The item a push event says was created, changed or deleted, when the event's `type` - the published model class name (`ContactMongo`,
+ * `TaskSQL`, ...) - matches `model`, or `undefined` for anything else the shared push connection delivers. Only the uid is taken: the payload
+ * is whatever every subscriber of the folder may see (a private calendar event's busy block), so a page fetches the item again by its uid.
+ */
+export function changedItemOf(event: PushEvent, model: RegExp): FolderItemChange | undefined {
+    if (!model.test(event.type) || (event.action !== "create" && event.action !== "update" && event.action !== "delete")) {
+        return undefined;
+    }
+    const data = event.data as { uid?: unknown } | null | undefined;
+    return typeof data?.uid === "string" ? { uid: data.uid, deleted: event.action === "delete" } : undefined;
+}
+
+/**
+ * Keeps a page's folders live: while the page is mounted the tab's push connection is subscribed to `folderUids` (under the page's own
+ * `group` - see `PushClient.setChannels()`; Mail's connection subscribes to mail folders only, so nothing else asks for a calendar,
+ * contacts or tasks folder), and `onChange` is called with every item `parse` recognizes - created, changed or deleted anywhere: another
+ * tab, a phone over ActiveSync, the server itself. `onChange` may change between renders; the latest is called.
+ */
+export function useFolderLiveUpdates(
+    group: string,
+    folderUids: readonly string[],
+    parse: (event: PushEvent) => FolderItemChange | undefined,
+    onChange: (change: FolderItemChange) => void,
+): void {
+    const key = [...new Set(folderUids)].sort().join(",");
+    useEffect(() => {
+        const client = getPushClient();
+        client.setChannels(key ? key.split(",") : [], group);
+        client.start();
+        return () => client.setChannels([], group);
+    }, [group, key]);
+
+    const latest = useRef({ parse, onChange });
+    latest.current = { parse, onChange };
+    useEffect(
+        () =>
+            getPushClient().onEvent((event) => {
+                const change = latest.current.parse(event);
+                if (change) {
+                    latest.current.onChange(change);
+                }
+            }),
+        [],
+    );
+}

package/apps/shared/mail/outbox/sendOutcomes.ts

@@ -64,9 +64,7 @@ async function openFailedDraft(event: SendEvent, client: ApiClient | undefined):
             });
             return;
         }
-        // loadOriginalMessage() (quotedBody.ts) does not yet accept an explicit ApiClient itself - out of scope here (that module is not one of
-        // this task's files); it still falls back to the default global session even under an ApiClientContext.Provider.
-        const original = await loadOriginalMessage(moved, null);
+        const original = await loadOriginalMessage(moved, null, {}, client);
         const attachments = await listAttachments(moved.folderUid, moved.uid, client).catch(() => []);
         const byType = (type: "to" | "cc" | "bcc") => moved.recipients.filter((recipient) => recipient.type === type).map(formatRecipient).join(", ");
         openComposeFromOutside({

package/apps/www/calendar/index.tsx

@@ -25,7 +25,7 @@ import { ApiRequestError } from "../../../lib/util/api.js";
 import { useApiClient } from "../../../lib/util/apiClientContext.js";
 import useIsMobile from "../../../lib/util/useIsMobile.js";
 import { CalendarEvent, getCalendarEvent, listCalendarEvents } from "../../../lib/calendar/calendarApi.js";
-import { getPushClient } from "../../../lib/mail/pushClient.js";
+import { useFolderLiveUpdates } from "../../shared/live/useFolderLiveUpdates.js";
 import { moveOccurrence, resizeOccurrenceEnd } from "../../../lib/calendar/calendarMutations.js";
 import { resolveDragAction } from "../../../lib/calendar/calendarDragIds.js";
 import { createFolder } from "../../../lib/mail/mailApi.js";
@@ -63,6 +63,9 @@ import { notifyApiError } from "../../shared/notifications/apiErrors.js";
 import { bookingSettingsHref } from "../../shared/calendar/bookingPlugin.js";
 import { changedEventOf } from "../../shared/calendar/calendarLiveUpdates.js";
 
+/** The push client channel group (`PushClient.setChannels()`) the page's calendars are subscribed under. */
+const CALENDAR_CHANNEL_GROUP = "calendar";
+
 /** The furthest instants a `Date` can hold: the List's "range" reaches both. */
 const MAX_DATE_MS = 8.64e15;
 
@@ -302,36 +305,35 @@ function CalendarContent({ userUid, bookingHref }: { userUid?: string; bookingHr
     // fetch changes nothing: the next load shows the event as it is.
     const checkedFolderUidsRef = useRef(checkedFolderUids);
     checkedFolderUidsRef.current = checkedFolderUids;
-    useEffect(
-        () =>
-            getPushClient().onEvent((event) => {
-                const change = changedEventOf(event);
-                if (!change) {
-                    return;
-                }
-                const { uid } = change;
-                if (change.deleted) {
-                    setEvents((previous) => previous.filter((existing) => existing.uid !== uid));
-                    return;
-                }
-                void getCalendarEvent(uid, client).then(
-                    (fresh) => {
-                        if (checkedFolderUidsRef.current.has(fresh.folderUid)) {
-                            setEvents((previous) =>
-                                previous.some((existing) => existing.uid === fresh.uid)
-                                    ? previous.map((existing) => (existing.uid === fresh.uid ? fresh : existing))
-                                    : [...previous, fresh],
-                            );
-                        }
-                    },
-                    (err: unknown) => {
-                        if (err instanceof ApiRequestError && err.status === 404) {
-                            setEvents((previous) => previous.filter((existing) => existing.uid !== uid));
-                        }
-                    },
-                );
-            }),
-        [client],
+    // Those events are published on the calendar's own channel, so the page subscribes to every calendar it lists - checked or not, so checking
+    // one needs no new subscription - while it is open.
+    useFolderLiveUpdates(
+        CALENDAR_CHANNEL_GROUP,
+        calendarFolders.map((f) => f.uid),
+        changedEventOf,
+        (change) => {
+            const { uid } = change;
+            if (change.deleted) {
+                setEvents((previous) => previous.filter((existing) => existing.uid !== uid));
+                return;
+            }
+            void getCalendarEvent(uid, client).then(
+                (fresh) => {
+                    if (checkedFolderUidsRef.current.has(fresh.folderUid)) {
+                        setEvents((previous) =>
+                            previous.some((existing) => existing.uid === fresh.uid)
+                                ? previous.map((existing) => (existing.uid === fresh.uid ? fresh : existing))
+                                : [...previous, fresh],
+                        );
+                    }
+                },
+                (err: unknown) => {
+                    if (err instanceof ApiRequestError && err.status === 404) {
+                        setEvents((previous) => previous.filter((existing) => existing.uid !== uid));
+                    }
+                },
+            );
+        },
     );
 
     // Search: `searchText` is the box, `query` what it held once typing paused (or Enter was pressed) and is what is searched for. A search covers every