@rapidmx/web-client 0.34.0 → 0.35.0

package/apps/www/contacts/index.tsx

@@ -10,6 +10,7 @@ import {
     Contact,
     createContact,
     deleteContact,
+    getContact,
     listContacts,
     ensureSuggestedContacts,
     listContactsInFolders,
@@ -42,6 +43,18 @@ import { SHORTCUTS } from "../../shared/keyboard/keymap.js";
 import { useShortcut } from "../../shared/keyboard/useShortcut.js";
 import { notifyApiError } from "../../shared/notifications/apiErrors.js";
 import { notify } from "../../shared/notifications/store.js";
+import { changedItemOf, useFolderLiveUpdates } from "../../shared/live/useFolderLiveUpdates.js";
+
+/** The published model class name of a contact on either database (`ContactMongo`, `ContactSQL`) - not a `ContactList`'s. */
+const CONTACT_MODEL = /^Contact(Mongo|SQL)$/;
+
+/** The push client channel group (`PushClient.setChannels()`) the page's contacts folders are subscribed under. */
+const CONTACTS_CHANNEL_GROUP = "contacts";
+
+/** `list` with `contact` in place of the one with its uid, or added when it has none. */
+function upsertContact(list: Contact[], contact: Contact): Contact[] {
+    return list.some((existing) => existing.uid === contact.uid) ? list.map((existing) => (existing.uid === contact.uid ? contact : existing)) : [...list, contact];
+}
 
 const INPUT_CLASS =
     "w-full text-sm py-2 px-3 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
@@ -166,6 +179,45 @@ function ContactsContent({ userUid }: { userUid?: string }) {
         };
     }, [mailboxUid]);
 
+    // A contact created, changed or deleted anywhere - another tab, a phone over ActiveSync - is announced on its folder's channel. It is fetched again by
+    // its uid and filed in the list of the folder it is in now (the mailbox's contacts, or its suggested contacts), and taken out of the other; one that is
+    // gone (a delete, or a 404) leaves both. A failed fetch changes nothing: the next load shows it as it is.
+    useFolderLiveUpdates(
+        CONTACTS_CHANNEL_GROUP,
+        [folderUid, suggestedFolderUid].filter((uid): uid is string => !!uid),
+        (event) => changedItemOf(event, CONTACT_MODEL),
+        (change) => {
+            const remove = (uid: string) => {
+                setContacts((previous) => previous.filter((existing) => existing.uid !== uid));
+                setSuggestedContacts((previous) => previous.filter((existing) => existing.uid !== uid));
+            };
+            if (change.deleted) {
+                remove(change.uid);
+                return;
+            }
+            void getContact(change.uid, client).then(
+                (fresh) => {
+                    if (fresh.deleted === true) {
+                        remove(fresh.uid);
+                    } else if (fresh.folderUid === folderUid) {
+                        setContacts((previous) => upsertContact(previous, fresh));
+                        setSuggestedContacts((previous) => previous.filter((existing) => existing.uid !== fresh.uid));
+                    } else if (fresh.folderUid === suggestedFolderUid) {
+                        setSuggestedContacts((previous) => upsertContact(previous, fresh));
+                        setContacts((previous) => previous.filter((existing) => existing.uid !== fresh.uid));
+                    } else {
+                        remove(fresh.uid);
+                    }
+                },
+                (err: unknown) => {
+                    if (err instanceof ApiRequestError && err.status === 404) {
+                        remove(change.uid);
+                    }
+                },
+            );
+        },
+    );
+
     // restapi only honors `?deleted=true` for a caller with both delete and update rights on the contacts *folder*
     // (its ACL, which inherits the mailbox's but can carry its own records) - anyone else silently gets the *live*
     // contacts back, which the Deleted view would then present as deleted. There is no client API for the caller's
@@ -228,6 +280,9 @@ function ContactsContent({ userUid }: { userUid?: string }) {
                 return contacts;
             case "favorites":
                 return contacts.filter((c) => c.favorite);
+            case "everyone":
+                // The mailbox's own contacts and its suggested ones in one list (a person is in only one of them: a suggestion that is accepted is moved).
+                return [...contacts, ...suggestedContacts];
             case "suggested":
                 return suggestedContacts;
             case "list":
@@ -428,7 +483,8 @@ function ContactsContent({ userUid }: { userUid?: string }) {
 
     // A suggested contact becomes one of the mailbox's own: a copy in its contacts folder, and the suggestion removed (the person is not suggested again).
     const handleAddToContacts = singleFlight(async () => {
-        for (const contact of checkedContacts) {
+        // In the All contacts view the selection can hold contacts that already are the mailbox's own: only the suggested ones are added.
+        for (const contact of checkedContacts.filter((checked) => checked.folderUid === suggestedFolderUid)) {
             try {
                 await createContact(
                     {
@@ -540,7 +596,7 @@ function ContactsContent({ userUid }: { userUid?: string }) {
                     onToggleFavorite={handleToggleFavorite}
                     onAddCategory={handleAddCategory}
                     onExportVCard={handleExportVCard}
-                    onAddToContacts={view.type === "suggested" ? handleAddToContacts : undefined}
+                    onAddToContacts={view.type === "suggested" || view.type === "everyone" ? handleAddToContacts : undefined}
                     onImportFile={handleImportFile}
                     shortcuts
                     hideNew={isMobile}

package/apps/www/tasks/index.tsx

@@ -11,6 +11,7 @@ import {
     TaskPriority,
     createTask,
     deleteTask,
+    getTask,
     listTasks,
     setTaskCompleted,
     setTaskMyDay,
@@ -34,6 +35,13 @@ import { SHORTCUTS } from "../../shared/keyboard/keymap.js";
 import { useShortcut } from "../../shared/keyboard/useShortcut.js";
 import { useShortcutProps } from "../../shared/keyboard/useShortcutProps.js";
 import { notifyApiError } from "../../shared/notifications/apiErrors.js";
+import { changedItemOf, useFolderLiveUpdates } from "../../shared/live/useFolderLiveUpdates.js";
+
+/** The published model class name of a task on either database (`TaskMongo`, `TaskSQL`) - not a `TaskList`'s. */
+const TASK_MODEL = /^Task(Mongo|SQL)$/;
+
+/** The push client channel group (`PushClient.setChannels()`) the page's tasks folder is subscribed under. */
+const TASKS_CHANNEL_GROUP = "tasks";
 
 const INPUT_CLASS =
     "text-sm py-1.5 px-2 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
@@ -146,6 +154,40 @@ function TasksContent() {
         void reload();
     }, [folderUid]);
 
+    // A task created, changed or deleted anywhere - another tab, a phone over ActiveSync - is announced on its folder's channel. It is fetched again by its
+    // uid and replaces (or joins) the list while it is still in this folder; one that is gone (a delete, a 404, or moved to another folder) leaves it. A
+    // failed fetch changes nothing: the next load shows it as it is.
+    useFolderLiveUpdates(
+        TASKS_CHANNEL_GROUP,
+        folderUid ? [folderUid] : [],
+        (event) => changedItemOf(event, TASK_MODEL),
+        (change) => {
+            const remove = () => setTasks((previous) => previous.filter((existing) => existing.uid !== change.uid));
+            if (change.deleted) {
+                remove();
+                return;
+            }
+            void getTask(change.uid, client).then(
+                (fresh) => {
+                    if (fresh.folderUid !== folderUid) {
+                        remove();
+                        return;
+                    }
+                    setTasks((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) {
+                        remove();
+                    }
+                },
+            );
+        },
+    );
+
     useEffect(() => {
         setTargetMailboxUid(undefined);
         setAddedElsewhere(null);

package/dist/apps/shared/calendar/calendarLiveUpdates.js

@@ -3,6 +3,7 @@
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 /** Pure helper behind the calendar page's live updates: which push events say "an event changed". */
+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. */
 const EVENT_MODEL = /^CalendarEvent(Mongo|SQL)$/;
@@ -16,9 +17,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) {
-    if (!EVENT_MODEL.test(event.type) || (event.action !== "create" && event.action !== "update" && event.action !== "delete")) {
-        return undefined;
-    }
-    const data = event.data;
-    return typeof data?.uid === "string" ? { uid: data.uid, deleted: event.action === "delete" } : undefined;
+    return changedItemOf(event, EVENT_MODEL);
 }

package/dist/apps/shared/components/contacts/ContactsSidebar.d.ts

@@ -2,6 +2,8 @@ import React from "react";
 import { Contact } from "../../../../lib/contacts/contactsApi.js";
 export type ContactsView = {
     type: "all";
+} | {
+    type: "everyone";
 } | {
     type: "favorites";
 } | {
@@ -35,7 +37,7 @@ export interface ContactsSidebarProps {
     refreshToken?: number;
 }
 /**
- * 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

package/dist/apps/shared/components/contacts/ContactsSidebar.js

@@ -39,7 +39,7 @@ function NavItem({ label, count, active, onClick, swatch, }) {
         ].join(" "), children: [_jsxs("span", { className: "flex items-center gap-2 min-w-0", children: [swatch && _jsx("span", { "aria-hidden": "true", className: "w-2.5 h-2.5 rounded-full shrink-0", style: { backgroundColor: swatch } }), _jsx("span", { className: "truncate", children: label })] }), count !== undefined && _jsx("span", { className: "text-xs text-text-muted shrink-0", children: count })] }));
 }
 /**
- * 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
@@ -104,6 +104,6 @@ export default function ContactsSidebar({ mailboxUid, contacts, active, onSelect
     // A function, not a plain JSX constant — rendered both in the desktop `<nav>` and the mobile
     // `Drawer` (see MailShell/ContactsShell for the identical pattern and the duplicate-id reasoning
     // behind the `idPrefix`).
-    const navContent = (idPrefix) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-col gap-0.5", children: [_jsx(NavItem, { label: "Your contacts", count: contacts.length, active: active.type === "all", onClick: () => handleSelect({ type: "all" }) }), _jsx(NavItem, { label: "Favorites", count: favoriteCount, active: active.type === "favorites", onClick: () => handleSelect({ type: "favorites" }) }), suggestedCount !== undefined && (_jsx(NavItem, { label: "Suggested contacts", count: suggestedCount, active: active.type === "suggested", onClick: () => handleSelect({ type: "suggested" }) })), showDeleted && _jsx(NavItem, { label: "Deleted", active: active.type === "deleted", onClick: () => handleSelect({ type: "deleted" }) })] }), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between px-2.5 mb-1", children: [_jsx("h2", { className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: "Your contact lists" }), _jsx("button", { type: "button", onClick: () => setAddingList(true), "aria-label": "New contact list", className: "text-xs font-bold text-primary-dark hover:underline", children: "+" })] }), listsError && _jsx("p", { className: "px-2.5 text-xs text-danger", children: listsError }), _jsx("div", { className: "flex flex-col gap-0.5", children: lists.map((list) => (_jsx(NavItem, { label: list.name, count: listCounts.get(list.uid) ?? 0, active: active.type === "list" && active.uid === list.uid, onClick: () => handleSelect({ type: "list", uid: list.uid, name: list.name }) }, list.uid))) }), addingList && (_jsxs("form", { onSubmit: handleAddList, className: "flex items-center gap-1 px-2.5 mt-1", children: [_jsx("input", { type: "text", autoFocus: true, "aria-label": "New list name", id: `${idPrefix}-new-list-name`, value: newListName, onChange: (e) => setNewListName(e.target.value), className: "flex-1 text-xs py-1 px-1.5 border border-border rounded-sm bg-surface" }), _jsx("button", { type: "submit", className: "text-xs font-semibold text-primary-dark", children: "Add" })] }))] }), categories.length > 0 && (_jsxs("div", { children: [_jsx("h2", { className: "text-xs font-bold uppercase tracking-wide text-text-muted px-2.5 mb-1", children: "Categories" }), _jsx("div", { className: "flex flex-col gap-0.5", children: categories.map((name) => (_jsx(NavItem, { label: name, swatch: categoryColor(name), active: active.type === "category" && active.name === name, onClick: () => handleSelect({ type: "category", name }) }, name))) })] }))] }));
+    const navContent = (idPrefix) => (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex flex-col gap-0.5", children: [suggestedCount !== undefined && (_jsx(NavItem, { label: "All contacts", count: contacts.length + suggestedCount, active: active.type === "everyone", onClick: () => handleSelect({ type: "everyone" }) })), _jsx(NavItem, { label: "Your contacts", count: contacts.length, active: active.type === "all", onClick: () => handleSelect({ type: "all" }) }), _jsx(NavItem, { label: "Favorites", count: favoriteCount, active: active.type === "favorites", onClick: () => handleSelect({ type: "favorites" }) }), suggestedCount !== undefined && (_jsx(NavItem, { label: "Suggested contacts", count: suggestedCount, active: active.type === "suggested", onClick: () => handleSelect({ type: "suggested" }) })), showDeleted && _jsx(NavItem, { label: "Deleted", active: active.type === "deleted", onClick: () => handleSelect({ type: "deleted" }) })] }), _jsxs("div", { children: [_jsxs("div", { className: "flex items-center justify-between px-2.5 mb-1", children: [_jsx("h2", { className: "text-xs font-bold uppercase tracking-wide text-text-muted", children: "Your contact lists" }), _jsx("button", { type: "button", onClick: () => setAddingList(true), "aria-label": "New contact list", className: "text-xs font-bold text-primary-dark hover:underline", children: "+" })] }), listsError && _jsx("p", { className: "px-2.5 text-xs text-danger", children: listsError }), _jsx("div", { className: "flex flex-col gap-0.5", children: lists.map((list) => (_jsx(NavItem, { label: list.name, count: listCounts.get(list.uid) ?? 0, active: active.type === "list" && active.uid === list.uid, onClick: () => handleSelect({ type: "list", uid: list.uid, name: list.name }) }, list.uid))) }), addingList && (_jsxs("form", { onSubmit: handleAddList, className: "flex items-center gap-1 px-2.5 mt-1", children: [_jsx("input", { type: "text", autoFocus: true, "aria-label": "New list name", id: `${idPrefix}-new-list-name`, value: newListName, onChange: (e) => setNewListName(e.target.value), className: "flex-1 text-xs py-1 px-1.5 border border-border rounded-sm bg-surface" }), _jsx("button", { type: "submit", className: "text-xs font-semibold text-primary-dark", children: "Add" })] }))] }), categories.length > 0 && (_jsxs("div", { children: [_jsx("h2", { className: "text-xs font-bold uppercase tracking-wide text-text-muted px-2.5 mb-1", children: "Categories" }), _jsx("div", { className: "flex flex-col gap-0.5", children: categories.map((name) => (_jsx(NavItem, { label: name, swatch: categoryColor(name), active: active.type === "category" && active.name === name, onClick: () => handleSelect({ type: "category", name }) }, name))) })] }))] }));
     return (_jsxs(_Fragment, { children: [_jsx("button", { type: "button", className: "lg:hidden m-3 mb-0 w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text", "aria-label": "Open contacts menu", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), _jsx("nav", { "aria-label": "Contacts", className: "hidden lg:flex w-56 shrink-0 border-r border-border flex-col gap-4 p-3 overflow-y-auto", children: navContent("desktop") }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Contacts", fullScreen: true, children: _jsx("div", { className: "flex flex-col gap-4", children: navContent("mobile") }) })] }));
 }

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

@@ -26,8 +26,8 @@ export declare function findContact(folders: readonly Folder[], address: string,
 export declare function loadRecentMessages(mailboxes: readonly Mailbox[], address: string, client?: ApiClient): Promise<Message[]>;
 /** The next `CARD_LIST_SIZE` events within `UPCOMING_DAYS` from `now` that `address` organizes or is invited to, soonest first. */
 export declare function loadUpcomingEvents(folders: readonly Folder[], address: string, now: Date, client?: ApiClient): Promise<CalendarOccurrence[]>;
-/** A vCard attachment's text. */
-export declare 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 declare function fetchVCardText(attachmentUid: string, client?: ApiClient): Promise<string>;
 /**
  * The vCard of the context message that describes `participant`: the first attachment holding a card with their address, else - only for the
  * message's sender, whose own vCard it presumably is - the first card there is. `undefined` when there is none, and for any failure to read one:

package/dist/apps/shared/components/contacts/contactCardData.js

@@ -63,8 +63,11 @@ export async function loadUpcomingEvents(folders, address, now, client) {
         .sort((a, b) => Date.parse(a.startDate) - Date.parse(b.startDate))
         .slice(0, CARD_LIST_SIZE);
 }
-/** A vCard attachment's text. */
-export async function fetchVCardText(attachmentUid) {
+/** 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, client) {
+    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);
@@ -87,7 +90,7 @@ export async function loadParticipantCard(participant, context, client) {
         const isSender = !!context.message && normalizeAddress(context.message.from.address) === normalizeAddress(participant.address);
         let fallback;
         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/dist/apps/shared/components/mail/MessageDetailPane.js

@@ -143,6 +143,21 @@ function downloadFromUrl(url, filename) {
     a.click();
     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 = 60000;
+/**
+ * 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, path, filename, urls) {
+    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) {
@@ -290,6 +305,17 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
     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());
+    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).
@@ -526,11 +552,20 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
         const mailbox = readerMailbox ?? (await getMailbox(message.mailboxUid, {}, client).catch(() => undefined));
         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) {
+        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);
     }
     /**
      * Opens the compose window at once from what is already in memory - the message's own subject and sender, and the
@@ -554,7 +589,7 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
             // Never rejects: loadOriginalMessage() and ownAddresses() don't, and the rest is pure.
             const late = (async () => {
                 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") {
@@ -842,10 +877,10 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
      * 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(() => ({
+            const earlier = await mapWithConcurrency(older, PRINT_CONCURRENCY, (other) => printableOlderMessage(other, client).catch(() => ({
                 subject: other.subject || "(no subject)",
                 headers: printHeaders(other, formatMailAddress(other.from)),
                 content: { kind: "text", text: "This message could not be loaded, so it is not printed." },
@@ -955,6 +990,6 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
                         .filter((type) => (type === "delivery" ? message.deliveryReceiptPending : message.readReceiptPending))
                         .map((type) => (_jsxs("div", { className: "flex flex-wrap items-center gap-2 py-2 px-3 rounded-sm bg-surface-alt text-sm", children: [_jsxs("span", { children: [senderLabel, " requested a ", type, " receipt for this message."] }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: receiptBusy === type, disabled: receiptBusy !== null, onClick: () => handleReceipt(type, "approve"), children: "Send receipt" }), _jsx(Button, { type: "button", variant: "text", disabled: receiptBusy !== null, onClick: () => handleReceipt(type, "decline"), children: "Decline" })] }, type))), receiptError && _jsx(Alert, { children: receiptError }), mayHoldInvite && _jsx(InviteCard, { messageUid: message.uid, headingLevel: inThread ? 3 : 2 }), security?.state === "signature_failed" && innerAttachments && innerAttachments.length > 0 && (_jsx("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-warning/15 text-text", children: "These attachments come from a message whose signature couldn\u2019t be verified. Open them only if you trust the sender." })), innerAttachments
                         ? innerAttachments.length > 0 && (_jsx("ul", { className: "flex flex-wrap gap-2", children: innerAttachments.map((attachment, index) => (_jsx("li", { children: isVCardAttachment({ filename: attachment.filename, mimeType: attachment.contentType }) ? (_jsx(VCardAttachmentChip, { label: attachment.filename ?? `Unnamed ${attachment.contentType} attachment`, message: message, loadText: async () => new TextDecoder().decode(attachment.decode() ?? new Uint8Array(0)), onDownload: () => downloadMimeAttachment(attachment) })) : (_jsx("button", { type: "button", onClick: () => downloadMimeAttachment(attachment), className: "text-xs font-medium py-1 px-2.5 rounded-pill bg-surface-alt text-text-muted hover:text-primary-dark", children: attachment.filename ?? `Unnamed ${attachment.contentType} attachment` })) }, `${index}:${attachment.filename ?? ""}`))) }))
-                        : listedAttachments.length > 0 && (_jsx("ul", { className: "flex flex-wrap gap-2", children: listedAttachments.map((attachment) => (_jsx("li", { children: isVCardAttachment(attachment) ? (_jsx(VCardAttachmentChip, { label: `${attachment.filename} (${formatBytes(attachment.sizeBytes)})`, message: message, loadText: () => fetchVCardText(attachment.uid), onDownload: () => downloadFromUrl(attachmentContentUrl(attachment.uid), attachment.filename) })) : (_jsxs("a", { href: attachmentContentUrl(attachment.uid), className: "text-xs font-medium py-1 px-2.5 rounded-pill bg-surface-alt text-text-muted hover:text-primary-dark", children: [attachment.filename, " (", formatBytes(attachment.sizeBytes), ")"] })) }, attachment.uid))) })), _jsx("div", { ref: bodyRegionRef, tabIndex: -1, className: "outline-none", children: message.encrypted && security === null ? (_jsx(BodySkeleton, {})) : security?.decryptError !== undefined ? (_jsx(EncryptedBody, { locked: lockedRef.current, reason: security.decryptError, unlocking: unlocking, onUnlock: () => void handleUnlockToView() })) : (_jsx(MessageBody, { messageUid: message.uid, messageVersion: message.version, title: bodyTitle, content: bodyContent, attachments: attachments, inlineParts: innerAttachments, original: viewOriginal, onAdaptable: setAdaptable })) })] }), showFooter && (_jsxs("div", { className: "flex flex-wrap gap-2 px-4 py-3 border-t border-border print:hidden", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Reply to this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("reply"), children: "Reply" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Reply all to this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("replyAll"), children: "Reply All" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Forward this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("forward"), children: "Forward" })] }))] }));
+                        : listedAttachments.length > 0 && (_jsx("ul", { className: "flex flex-wrap gap-2", children: listedAttachments.map((attachment) => (_jsx("li", { children: isVCardAttachment(attachment) ? (_jsx(VCardAttachmentChip, { label: `${attachment.filename} (${formatBytes(attachment.sizeBytes)})`, message: message, loadText: () => fetchVCardText(attachment.uid, client), onDownload: () => saveAttachment(attachment) })) : client ? (_jsxs("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", children: [attachment.filename, " (", formatBytes(attachment.sizeBytes), ")"] })) : (_jsxs("a", { href: attachmentContentUrl(attachment.uid), className: "text-xs font-medium py-1 px-2.5 rounded-pill bg-surface-alt text-text-muted hover:text-primary-dark", children: [attachment.filename, " (", formatBytes(attachment.sizeBytes), ")"] })) }, attachment.uid))) })), _jsx("div", { ref: bodyRegionRef, tabIndex: -1, className: "outline-none", children: message.encrypted && security === null ? (_jsx(BodySkeleton, {})) : security?.decryptError !== undefined ? (_jsx(EncryptedBody, { locked: lockedRef.current, reason: security.decryptError, unlocking: unlocking, onUnlock: () => void handleUnlockToView() })) : (_jsx(MessageBody, { messageUid: message.uid, messageVersion: message.version, title: bodyTitle, content: bodyContent, attachments: attachments, inlineParts: innerAttachments, original: viewOriginal, onAdaptable: setAdaptable })) })] }), showFooter && (_jsxs("div", { className: "flex flex-wrap gap-2 px-4 py-3 border-t border-border print:hidden", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Reply to this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("reply"), children: "Reply" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Reply all to this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("replyAll"), children: "Reply All" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-label": "Forward this message", disabled: preparingCompose, onClick: () => void handleReplyOrForward("forward"), children: "Forward" })] }))] }));
     return (_jsxs("div", { className: inThread ? "min-w-0" : "flex-1 min-w-0 min-h-0 flex flex-col h-full", children: [inThread ? (card) : (_jsxs(_Fragment, { children: [backHref && (_jsx("a", { href: backHref, className: "text-sm text-primary-dark hover:underline block px-4 pt-3", children: "\u2190 Back to messages" })), _jsx(SubjectCard, { subject: shownSubject }), _jsx("div", { className: "flex-1 min-h-0 overflow-y-auto p-2 sm:p-3 flex flex-col gap-3", children: card })] })), _jsx(MoveToFolderDialog, { open: movePrompt, onClose: () => setMovePrompt(false), mailboxUid: message.mailboxUid, folders: folders ?? [], currentFolderUid: message.folderUid, onMove: handleMove, onFolderCreated: onFolderCreated }), messageActions.dialog, _jsx(MessageSourceDialog, { open: sourceView !== null, onClose: closeSource, mode: sourceView?.mode ?? "source", source: sourceView?.source ?? { status: "loading" }, encrypted: !!message.encrypted }), _jsxs(Modal, { open: confirming, onClose: () => setConfirming(false), title: "Recall this message?", children: [_jsx("p", { className: "text-sm text-text-muted mb-4", children: "This asks every original recipient's mail system to delete their copy, but only if it's still unread there \u2014 there's no way to guarantee it, and no confirmation once it either succeeds or fails. Recipients who already read the message will keep it." }), error && _jsx(Alert, { children: error }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { type: "button", loading: recalling, disabled: recalling, onClick: handleRecall, className: "!w-auto", children: "Recall message" }), _jsx(Button, { type: "button", variant: "secondary", disabled: recalling, onClick: () => setConfirming(false), className: "!w-auto", children: "Cancel" })] })] }), _jsx(Modal, { open: trustConfirmOpen && !!trustableCertificate, onClose: () => !trusting && setTrustConfirmOpen(false), title: "Trust this signer?", children: _jsxs("div", { className: "flex flex-col gap-3 text-sm", children: [_jsxs("p", { children: ["Mail from ", _jsx("span", { className: "font-medium", children: senderAddress }), " signed with this certificate will show as verified."] }), _jsxs("dl", { className: "flex flex-col gap-1", children: [_jsx("dt", { className: "text-xs text-text-muted", children: "Certificate issued to" }), _jsx("dd", { children: security?.signerEmails?.length ? security.signerEmails.join(", ") : "No email address" }), _jsx("dt", { className: "text-xs text-text-muted", children: "Fingerprint" }), _jsx("dd", { className: "font-mono text-xs break-all", children: security?.signerFingerprint ? formatFingerprint(security.signerFingerprint) : "Unknown" })] }), _jsx("p", { className: "text-text-muted", children: "Anyone can create a certificate naming any address. Before trusting it, confirm this fingerprint with the sender through another channel, such as a phone call." }), trustError && _jsx(Alert, { children: trustError }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { type: "button", className: "!w-auto", loading: trusting, disabled: trusting, onClick: () => handleTrustSigner(senderAddress, trustableCertificate), children: "Trust" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: trusting, onClick: () => setTrustConfirmOpen(false), children: "Cancel" })] })] }) })] }));
 }

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

@@ -1,3 +1,4 @@
+import { type ApiClient } from "../../../../../lib/util/api.js";
 import { Message, Recipient } from "../../../../../lib/mail/mailApi.js";
 import type { QuotedBody } from "../../../../../lib/mail/compose/composeQuoting.js";
 import type { MessageSecurityResult } from "../../../../../lib/crypto/messageSecurity.js";
@@ -19,7 +20,7 @@ export declare const QUOTE_CACHE_MS = 30000;
  * 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 declare function prefetchOriginalMessage(message: Message): void;
+export declare function prefetchOriginalMessage(message: Message, client?: ApiClient): void;
 /** Forgets every remembered body (the sign-out and test seam). */
 export declare function clearOriginalMessageCache(): void;
 /**
@@ -50,4 +51,4 @@ export declare function clearOriginalMessageCache(): void;
  */
 export declare function loadOriginalMessage(message: Message, security: MessageSecurityResult | null, options?: {
     recipients?: boolean;
-}): Promise<OriginalMessage>;
+}, client?: ApiClient): Promise<OriginalMessage>;

package/dist/apps/shared/components/mail/compose/quotedBody.js

@@ -28,9 +28,9 @@ const contentCache = new Map();
 /**
  * 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) {
+function fetchContentHtml(uid, client) {
     const cached = contentCache.get(uid);
     if (cached && Date.now() - cached.at < QUOTE_CACHE_MS) {
         return cached.promise;
@@ -39,6 +39,10 @@ function fetchContentHtml(uid) {
     const timer = setTimeout(() => controller.abort(), QUOTE_FETCH_TIMEOUT_MS);
     const promise = (async () => {
         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;
         }
@@ -76,9 +80,9 @@ function withTimeout(promise, ms) {
  * 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) {
+export function prefetchOriginalMessage(message, client) {
     if (!message.encrypted) {
-        void fetchContentHtml(message.uid);
+        void fetchContentHtml(message.uid, client);
     }
 }
 /** Forgets every remembered body (the sign-out and test seam). */
@@ -97,18 +101,26 @@ function headerRecipients(value, type) {
 }
 /** 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) {
+function serverImageResolver(message, client) {
     let attachments;
     return async (reference, signal) => {
         try {
-            attachments ?? (attachments = listAttachments(message.folderUid, message.uid));
+            attachments ?? (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;
+            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 {
@@ -152,7 +164,7 @@ function partImageResolver(parts) {
  *
  * The quote builders sanitize whatever HTML this returns (`sanitizeQuotedHtml()`), whichever source it came from.
  */
-export async function loadOriginalMessage(message, security, options = {}) {
+export async function loadOriginalMessage(message, security, options = {}, client) {
     const recovered = security?.text !== undefined ? { text: security.text } : security?.html !== undefined ? { html: security.html } : undefined;
     // Headers inside an unsigned (or badly signed) encrypted message are whatever its encrypter chose to write, so only a
     // verified signature makes them a source of recipients.
@@ -168,7 +180,7 @@ export async function loadOriginalMessage(message, security, options = {}) {
     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 };
         }
@@ -178,7 +190,7 @@ export async function loadOriginalMessage(message, security, options = {}) {
     }
     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 } : {};
@@ -194,7 +206,7 @@ export async function loadOriginalMessage(message, security, options = {}) {
         // 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/dist/apps/shared/components/mail/reading/MessageBody.js

@@ -8,6 +8,7 @@ import { ApiRequestError, apiUrl } from "../../../../../lib/util/api.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 { attachmentSource, cachedBodyContent, fetchBodyContent, makeCidResolver } from "./bodyContent.js";
 import { prepareBodyHtml } from "./bodyHtml.js";
@@ -43,6 +44,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) {
             return;
@@ -59,7 +62,7 @@ export default function MessageBody({ messageUid, messageVersion, title, content
         if (!revalidating) {
             setRemote({ status: "loading" });
         }
-        fetchBodyContent(messageUid, messageVersion, controller.signal).then((loaded) => setRemote({ status: "ready", content: loaded, uid: messageUid }), (err) => {
+        fetchBodyContent(messageUid, messageVersion, controller.signal, client).then((loaded) => setRemote({ status: "ready", content: loaded, uid: messageUid }), (err) => {
             if (!controller.signal.aborted && !revalidating) {
                 setRemote({ status: "error", message: err instanceof ApiRequestError ? err.message : "Could not load this message." });
             }

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

@@ -1,3 +1,4 @@
+import { type ApiClient } from "../../../../../lib/util/api.js";
 import { Attachment } from "../../../../../lib/mail/mailApi.js";
 import type { MimeAttachment } from "../../../../../lib/crypto/mime.js";
 /** What a message's body is: server-sanitized HTML, or plain text (a message with no HTML part, or the server's plain-text fallback). */
@@ -17,9 +18,10 @@ export declare function cachedBodyContent(uid: string, version: number): BodyCon
 /**
  * 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 declare function fetchBodyContent(uid: string, version: number, signal?: AbortSignal): Promise<BodyContent>;
+export declare function fetchBodyContent(uid: string, version: number, signal?: AbortSignal, client?: ApiClient): Promise<BodyContent>;
 /** The largest inline image embedded into a body from a signed or encrypted message. */
 export declare const MAX_INLINE_IMAGE_BYTES = 5000000;
 /** A server attachment record as it may really arrive: the model carries the part's `Content-ID`, though the client type doesn't list it. */

package/dist/apps/shared/components/mail/reading/bodyContent.js

@@ -23,28 +23,39 @@ export function cachedBodyContent(uid, version) {
 /**
  * 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, version, signal) {
+export async function fetchBodyContent(uid, version, signal, client) {
     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;
+    let contentType;
+    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;
     }
-    const text = await res.text();
-    const content = (res.headers.get("content-type") ?? "").toLowerCase().includes("text/html")
-        ? { kind: "html", html: text }
-        : { kind: "text", text };
+    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 content = contentType.toLowerCase().includes("text/html") ? { kind: "html", html: text } : { kind: "text", text };
     if (cache.size >= CACHE_LIMIT) {
         cache.delete(cache.keys().next().value);
     }

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

@@ -10,6 +10,7 @@ export declare function printHeaders(message: Message, from: string): PrintableM
 export declare function olderConversationMessages(message: Message, client?: ApiClient): Promise<Message[]>;
 /**
  * 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 declare function printableOlderMessage(message: Message): Promise<PrintableMessage>;
+export declare function printableOlderMessage(message: Message, client?: ApiClient): Promise<PrintableMessage>;