@rapidmx/web-client 0.35.0 → 0.37.0

package/dist/apps/shared/components/mail/InviteCard.js

@@ -7,6 +7,7 @@ import React, { useId, useState } from "react";
 import { HiOutlineCalendarDays, HiOutlineCheck } from "react-icons/hi2";
 import { acceptProposal, proposeNewTime, removeMessageInvite, respondToMessageInvite, } from "../../../../lib/calendar/inviteApi.js";
 import { guestPermissionsOf } from "../../../../lib/calendar/calendarApi.js";
+import { openSealedEvent } from "../../calendar/sealedEvents.js";
 import { formatMailAddress } from "../../../../lib/mail/mailAddress.js";
 import { useApiClient } from "../../../../lib/util/apiClientContext.js";
 import Button from "../../../../lib/components/buttons/Button.js";
@@ -134,7 +135,7 @@ export default function InviteCard({ messageUid, headingLevel = 2 }) {
     return (_jsxs("section", { "aria-labelledby": headingId, className: "rounded-sm border border-border bg-surface-alt px-3 py-3 flex flex-col gap-2 text-sm text-text", children: [_jsxs(Heading, { id: headingId, className: "flex items-center gap-2 text-sm font-semibold", children: [_jsx(HiOutlineCalendarDays, { size: 16, "aria-hidden": "true", className: "shrink-0" }), changeRequest ? CHANGE_REQUEST_HEADING : (HEADINGS[method] ?? "Calendar event")] }), isReply && (_jsxs("p", { className: "break-words", children: [senderNode, " ", (sender?.responseStatus && REPLY_VERBS[sender.responseStatus]) ?? "responded", "."] })), isCounter && !changeRequest && (_jsxs("p", { className: "break-words", children: [senderNode, " proposed a new time", when ? _jsxs(_Fragment, { children: [": ", when] }) : "."] })), changeRequest && (_jsx("p", { className: "break-words", children: changeRequest.applied ? (_jsxs(_Fragment, { children: [_jsx("span", { className: "font-semibold", children: senderName }), "\u2019s change was applied."] })) : (_jsxs(_Fragment, { children: [_jsx("span", { className: "font-semibold", children: senderName }), " requested a change."] })) })), _jsx("p", { className: "font-medium break-words", children: title }), !isReply && (_jsxs("dl", { className: "grid grid-cols-[auto_minmax(0,1fr)] gap-x-3 gap-y-1", children: [when && (!isCounter || !!changeRequest) && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "When" }), _jsxs("dd", { className: "break-words", children: [when, invite.recurring && _jsx("span", { className: "text-text-muted", children: " (Repeats)" })] })] })), invite.location && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "Where" }), _jsx("dd", { className: "break-words", children: invite.location })] })), hasDescription && (!isCounter || !!changeRequest) && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "Description" }), _jsx("dd", { className: "break-words", children: _jsx(EventDescriptionView, { html: invite.descriptionHtml, text: invite.description }) })] })), invite.organizer && !isCounter && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "Organizer" }), _jsx("dd", { className: "break-words", children: _jsx(ParticipantLink, { participant: invite.organizer, children: formatMailAddress(invite.organizer) }) })] })), attendees && (!isCounter || !!changeRequest) && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "Attendees" }), _jsx("dd", { className: "break-words", children: attendees })] })), visibility && !isCounter && (_jsxs(_Fragment, { children: [_jsx("dt", { className: "text-text-muted", children: "Visibility" }), _jsx("dd", { className: "break-words", children: visibility })] }))] })), isReply && when && _jsx("p", { className: "text-text-muted break-words", children: when }), conflicts && (_jsxs("p", { className: "text-danger break-words", children: [_jsx("span", { className: "font-medium", children: "Conflicts with:" }), " ", conflicts] })), invite.guestPermissions && !isReply && !isCounter && method !== "CANCEL" && (_jsx("p", { className: "text-xs text-text-muted break-words", children: describeGuestPermissions(permissions) })), invite.isOrganizer && !isReply && !isCounter && _jsx("p", { className: "text-text-muted", children: "You are the organizer of this meeting." }), method === "CANCEL" && _jsx("p", { className: "font-medium text-danger", children: "This meeting was canceled." }), invite.response && !invite.isOrganizer && !isReply && !isCounter && (_jsx("p", { role: "status", className: `font-medium ${ANSWER_CLASS[invite.response]}`, children: ANSWER_TEXT[invite.response] })), isCounter && invite.response === "accepted" && !changeRequest?.applied && (_jsx("p", { role: "status", className: "font-medium text-success", children: "You accepted the proposed time." })), proposed && (_jsx("p", { role: "status", className: "font-medium text-text", children: "Your proposed time was sent to the organizer." })), requested && (_jsx("p", { role: "status", className: "font-medium text-text", children: "Your change was sent to the organizer." })), invite.outdated && _jsx("p", { className: "text-xs text-text-muted", children: "A newer version of this meeting is already on your calendar." }), hasActions && (_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [showResponses && (_jsx("div", { role: "group", "aria-label": "Respond to this meeting", "aria-busy": busy || undefined, className: "flex flex-wrap gap-2", children: RESPONSES.map(({ response, label, failure }) => {
                             const current = invite.response === response;
                             return (_jsxs(Button, { type: "button", variant: "secondary", className: ["!w-auto", current ? "!bg-primary/10 !border-primary disabled:!opacity-100" : ""].join(" "), "aria-pressed": current, "aria-busy": pending === response || undefined, loading: pending === response, disabled: busy || current, onClick: () => void run(response, failure, () => respondToMessageInvite(messageUid, response, client)), children: [current && _jsx(HiOutlineCheck, { size: 14, "aria-hidden": "true" }), label] }, response));
-                        }) })), invite.canPropose && !proposing && (_jsx(Button, { type: "button", variant: "text", disabled: busy, onClick: () => setProposing(true), children: "Propose new time" })), canRequest && !requesting && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: busy, onClick: () => setRequesting(true), children: invite.canRequestChange ? "Request a change" : "Add guests" })), invite.canAcceptProposal && invite.response !== "accepted" && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-busy": pending === "acceptProposal" || undefined, loading: pending === "acceptProposal", disabled: busy, onClick: () => void run("acceptProposal", "Couldn't accept the proposed time", () => acceptProposal(messageUid, client)), children: "Accept proposal" })), invite.canAdd && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-busy": pending === "add" || undefined, loading: pending === "add", disabled: busy, 
+                        }) })), invite.canPropose && !proposing && (_jsx(Button, { type: "button", variant: "text", disabled: busy, onClick: () => setProposing(true), children: "Propose new time" })), canRequest && !requesting && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: busy, onClick: () => setRequesting(true), children: invite.canRequestChange ? "Request a change" : "Add guests" })), invite.canAcceptProposal && invite.response !== "accepted" && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-busy": pending === "acceptProposal" || undefined, loading: pending === "acceptProposal", disabled: busy, onClick: () => void run("acceptProposal", "Couldn't accept the proposed time", () => acceptProposal(messageUid, client, invite.calendarEventUid, openSealedEvent)), children: "Accept proposal" })), invite.canAdd && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-busy": pending === "add" || undefined, loading: pending === "add", disabled: busy, 
                         // A published event has no organizer to answer, so adding it is accepting it: the server sends no reply.
                         onClick: () => void run("add", "Couldn't add this event to your calendar", () => respondToMessageInvite(messageUid, "accepted", client)), children: "Add to calendar" })), invite.canRemove && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", "aria-busy": pending === "remove" || undefined, loading: pending === "remove", disabled: busy, onClick: () => void run("remove", "Couldn't remove this meeting from your calendar", () => removeMessageInvite(messageUid, client)), children: "Remove from calendar" })), invite.onCalendar && invite.calendarEventUid && (_jsx("a", { href: calendarHref(invite), className: "text-sm font-medium text-primary-dark hover:underline", children: "Open in Calendar" }))] })), requesting && (_jsx("div", { className: "rounded-md bg-surface p-3", children: _jsx(RequestChangeForm, { subject: {
                         uid: invite.calendarEventUid,
@@ -147,6 +148,15 @@ export default function InviteCard({ messageUid, headingLevel = 2 }) {
                         description: invite.description,
                         descriptionHtml: invite.descriptionHtml,
                         guestAddresses: invite.attendees.map((attendee) => attendee.address),
+                        // The invitation's own content: what a protected copy of the event is named by.
+                        invitationContent: invite.summary
+                            ? {
+                                title: invite.summary,
+                                location: invite.location ?? undefined,
+                                description: invite.description ?? undefined,
+                                descriptionHtml: invite.descriptionHtml ?? undefined,
+                            }
+                            : undefined,
                     }, canChange: !!invite.canRequestChange, canInvite: !!invite.canRequestInvite, onSent: () => {
                         setRequesting(false);
                         setRequested(true);

package/dist/apps/shared/components/mail/MessageDetailPane.js

@@ -12,11 +12,12 @@ import MoveToFolderDialog from "./MoveToFolderDialog.js";
 import InviteCard from "./InviteCard.js";
 import { isCalendarAttachment } from "./invite/inviteFormat.js";
 import { useMessageInvite } from "./invite/inviteStore.js";
+import { rememberSealedInvite } from "../../../../lib/calendar/sealedInvites.js";
 import { getUnlockedKeys, subscribeKeySession } from "../../../../lib/crypto/keySession.js";
 import { extractAddresses } from "../../../../lib/crypto/mime.js";
 import { SignerKeyConflictError, signingKeyFingerprints, trustSigner } from "../../../../lib/crypto/keyvaultApi.js";
 import { isLikelyMailingList } from "../../../../lib/crypto/composeSecurity.js";
-import { clearPinnedSignerCache, getPinnedSignerFingerprints, getSignerKeyState } from "./pinnedSigners.js";
+import { clearPinnedSignerCache, getPinnedSigners, getSignerKeyState } from "./pinnedSigners.js";
 import { currentVerificationSeal, getVaultGeneration, sendVerificationSeal } from "./verificationSeals.js";
 import { getMyMailboxAccess } from "../../../../lib/mail/mailboxAccessApi.js";
 import { useApiClient } from "../../../../lib/util/apiClientContext.js";
@@ -78,6 +79,9 @@ const SECURITY_INDICATOR = {
     // Verified when first opened (a verification seal), but not live: muted, never the green verified pill. A signer key
     // later reported compromised switches it to `LATER_COMPROMISED_INDICATOR_CLASS`.
     verified_at_first_open: { label: "Verified when first opened", className: "bg-surface-alt text-text-muted" },
+    // Sealed by the server on arrival (zero-access): distinct from "Encrypted" - the server held this message in the clear while it
+    // delivered it - and never worded as end-to-end, per the spec's indicator table.
+    protected_at_rest: { label: "Protected at rest", className: "bg-primary/5 text-text" },
 };
 /** The amber `verified_at_first_open` badge for a signer key since reported compromised. */
 const LATER_COMPROMISED_INDICATOR_CLASS = "bg-warning/15 text-text";
@@ -189,11 +193,14 @@ function IconAction({ icon, label, onClick, disabled, reason, busy, onPrefetch,
     const env = useKeyEnvironment();
     return (_jsx("button", { type: "button", "aria-label": label, title: reason ?? (shortcut ? withHint(label, shortcut, env) : label), "aria-keyshortcuts": shortcut ? ariaKeyShortcuts(shortcut, env) : undefined, "aria-busy": busy || undefined, disabled: disabled, onClick: onClick, onPointerEnter: onPrefetch, onFocus: onPrefetch, className: ICON_BUTTON_CLASS, children: icon }));
 }
-function SecurityIndicator({ security }) {
-    const { label, className } = SECURITY_INDICATOR[security.state];
+function SecurityIndicator({ security, zeroAccess }) {
+    // A zero-access message this device can't open yet (keys locked) evaluates as an encrypted one it has no key for: it is still
+    // labelled for what it is.
+    const state = zeroAccess && security.state === "encrypted" && security.decryptError !== undefined ? "protected_at_rest" : security.state;
+    const { label, className } = SECURITY_INDICATOR[state];
     if (security.state !== "verified_at_first_open") {
         // Every encrypted state carries a small lock, so the badge reads at a glance; the words are unchanged.
-        const encrypted = security.state.startsWith("encrypted");
+        const encrypted = state.startsWith("encrypted") || state === "protected_at_rest";
         return (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium shrink-0 py-1 px-2.5 rounded-pill ${className}`, children: [encrypted && _jsx(HiOutlineLockClosed, { size: 12, "aria-hidden": "true" }), label] }));
     }
     return (_jsxs("span", { className: `inline-flex items-center gap-1 text-xs font-medium shrink-0 py-1 px-2.5 rounded-pill ${security.laterCompromised ? LATER_COMPROMISED_INDICATOR_CLASS : className}`, children: [security.laterCompromised ? (_jsx(HiOutlineExclamationTriangle, { size: 12, "aria-hidden": "true" })) : (_jsx(HiOutlineCheck, { size: 12, "aria-hidden": "true" })), label] }));
@@ -256,7 +263,7 @@ export default function MessageDetailPane(props) {
  * surfaced as an attachment - so a message with neither flag can't carry a signature to verify, and
  * fetching its full raw source (attachments included) would be pure waste. */
 function needsRawSecurityEvaluation(message) {
-    return !!message.encrypted || message.hasAttachments;
+    return !!message.encrypted || !!message.zeroAccess || message.hasAttachments;
 }
 function MessageDetailContent({ message: messageProp, attachments, backHref, isSentItems, onRecalled, isOutbox, draftsFolderUid, onScheduledSendCanceled, folders, onMoved, onFolderCreated, onReceiptHandled, onArchived, onChanged, labels, onLabelsChanged, onLabelCreated, inThread, threadSubject, threadHeader, footer, shortcuts, }) {
     // A copy re-read from the server after an Outbox action was refused (409/403) or a send lease ran out - see
@@ -362,7 +369,7 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
         // mailbox's own signing keys when it sent the message itself. A failed lookup means no pins, which can only
         // ever make a signature "signer not verified", never verified.
         const senderAddress = message.from.address;
-        const pinsPromise = getPinnedSignerFingerprints(message.mailboxUid, senderAddress, client).then((fingerprints) => ({ loaded: true, fingerprints }), () => ({ loaded: false, fingerprints: [] }));
+        const pinsPromise = getPinnedSigners(message.mailboxUid, senderAddress, client).then((signers) => ({ loaded: true, ...signers }), () => ({ loaded: false, fingerprints: [], openPgpKeys: [] }));
         // Verification seals (see `verificationSeals.ts`) need unlocked keys and the vault's current master key
         // generation; without either the message is evaluated exactly as before, with no seal. The sender's key records
         // are loaded alongside, so a seal can say when the signer key was later revoked as compromised.
@@ -385,7 +392,8 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
             const ownPins = signingKeyFingerprints(ownKeys);
             const [contactPins, sealContext] = await Promise.all([pinsPromise, sealContextPromise]);
             const pins = [...new Set([...contactPins.fingerprints, ...ownPins])];
-            const pinned = pins.length > 0 ? pins : undefined;
+            // An OpenPGP signature is checked against the sender's pinned OpenPGP certificates themselves (it names only a key ID).
+            const pinned = contactPins.openPgpKeys.length > 0 ? { fingerprints: pins, openPgpKeys: contactPins.openPgpKeys } : pins.length > 0 ? pins : undefined;
             // The raw content is a byte string - only ever handed to evaluateMessageSecurity(), never shown. Keys
             // are read after the pin lookup's await, so a lock that happened meanwhile is honored.
             const unlocked = getUnlockedKeys(message.mailboxUid);
@@ -422,7 +430,7 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
                 const viaAlias = await messageSecurity.evaluateMessageSecurity(rawMime, unlocked, pinned, alias);
                 result = { ...result, notAddressedToReader: viaAlias.notAddressedToReader };
             }
-            const unpinned = contactPins.loaded && pins.length === 0;
+            const unpinned = contactPins.loaded && pins.length === 0 && contactPins.openPgpKeys.length === 0;
             const keyChanged = signerKeyChanged(result);
             const [keyState, access] = await Promise.all([
                 keyChanged || (unpinned && UNVERIFIED_SIGNER_STATES.has(result.state)) ? loadKeyState() : undefined,
@@ -437,13 +445,13 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
         })
             .catch(() => {
             if (!cancelled) {
-                setSecurity(message.encrypted ? { state: "encrypted", decryptError: ENCRYPTED_LOAD_ERROR } : { state: "unprotected" });
+                setSecurity(message.encrypted || message.zeroAccess ? { state: "encrypted", decryptError: ENCRYPTED_LOAD_ERROR } : { state: "unprotected" });
             }
         });
         return () => {
             cancelled = true;
         };
-    }, [message.uid, message.mailboxUid, message.from.address, message.encrypted, rawEvaluationNeeded, unlockRefresh, readerAddressesKey, client]);
+    }, [message.uid, message.mailboxUid, message.from.address, message.encrypted, message.zeroAccess?.keyFingerprint, rawEvaluationNeeded, unlockRefresh, readerAddressesKey, client]);
     // Whether the body is the locked state right now (an encrypted message this device holds no unlocked keys for), for the subscription below.
     const lockedRef = useRef(false);
     lockedRef.current = security?.decryptError !== undefined && !getUnlockedKeys(message.mailboxUid);
@@ -519,11 +527,11 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
     // Only ever invoked from the "Trust this signer" dialog, which only opens for an unverified-signer result carrying
     // `signerCertificate`. The pin goes on the contact in the mailbox the message belongs to; the evaluation is then
     // re-run against a fresh pinned-signer lookup, so the badge turns verified.
-    async function handleTrustSigner(address, certificate) {
+    async function handleTrustSigner(address, certificate, type) {
         setTrusting(true);
         setTrustError(null);
         try {
-            await trustSigner(message.mailboxUid, { address, certificate }, client);
+            await trustSigner(message.mailboxUid, { address, certificate, ...(type ? { type } : {}) }, client);
             clearPinnedSignerCache();
             setTrustConfirmOpen(false);
             setUnlockRefresh((n) => n + 1);
@@ -813,7 +821,11 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
     // A decrypted message whose signature failed still only has these (the server list is just `smime.p7m`); they're
     // listed with a warning. A signed-only failure never carries recovered attachments.
     const innerAttachments = security?.attachments !== undefined &&
-        (verifiedOrSealed || security.state === "encrypted" || security.state === "encrypted_unverified_signer" || security.state === "signature_failed")
+        (verifiedOrSealed ||
+            security.zeroAccess ||
+            security.state === "encrypted" ||
+            security.state === "encrypted_unverified_signer" ||
+            security.state === "signature_failed")
         ? security.attachments
         : undefined;
     // Any state with a valid signature shows the address actually signed for (the protected From when the message
@@ -835,7 +847,10 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
         ? security.signerCertificate
         : undefined;
     const keyChanged = security && signerKeyChanged(security) ? security : undefined;
-    const pinnedSignerKey = senderKeyState?.pinned[0];
+    // An OpenPGP signer's key is pinned as the contact's OpenPGP certificate, not a signing certificate.
+    const openPgpSigner = keyChanged?.signerKeyType === "openpgp";
+    const pinnedSignerKey = openPgpSigner ? senderKeyState?.openPgp?.[0] : senderKeyState?.pinned[0];
+    const pinnedSignerSince = openPgpSigner ? senderKeyState?.openPgpPinnedSince : senderKeyState?.pinnedSince;
     const recordedConflict = keyChanged && sameFingerprint(senderKeyState?.conflict?.observedKey.fingerprint, keyChanged.signerFingerprint)
         ? senderKeyState.conflict
         : undefined;
@@ -863,7 +878,17 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
     // Only a message the server can read and that carries a calendar file is worth asking about an invitation. An encrypted message is out: the
     // server holds only its ciphertext (the calendar file is inside it), so there is nothing for it to find. Drafts and Outbox hold messages
     // that are being written or sent, not received invitations.
-    const mayHoldInvite = !message.encrypted && !inOutbox && message.folderUid !== draftsFolderUid && attachments.some(isCalendarAttachment);
+    // A zero-access message's calendar file is inside the sealed copy: the server reads the invitation from the one decrypted here.
+    const sealedCalendar = security?.zeroAccess ? security.calendar : undefined;
+    // Registered while rendering, not in an effect: the invitation lookup below must find it the moment it is enabled. Writing the same
+    // file for the same message again is a no-op.
+    if (sealedCalendar !== undefined) {
+        rememberSealedInvite(message.uid, sealedCalendar, message.mailboxUid);
+    }
+    const mayHoldInvite = !message.encrypted &&
+        !inOutbox &&
+        message.folderUid !== draftsFolderUid &&
+        (attachments.some(isCalendarAttachment) || sealedCalendar !== undefined);
     // The calendar file of a message whose invitation card is drawn is the card, not a chip in the attachment list (a nameless "attachment" to click):
     // it is listed again if the card could not be drawn (no invitation the server can read, or the lookup failed), so the file is never out of reach.
     const { invite: shownInvite } = useMessageInvite(message.uid, mayHoldInvite);
@@ -934,7 +959,7 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
     /** The rules page's "New mail filter", started from this message: its sender and (for a message the server can read) its subject. */
     function handleCreateRule() {
         const params = new URLSearchParams({ mailboxUid: message.mailboxUid, from: message.from.address });
-        const subject = message.encrypted ? "" : withoutSubjectPrefixes(message.subject);
+        const subject = message.encrypted || message.zeroAccess ? "" : withoutSubjectPrefixes(message.subject);
         if (subject) {
             params.set("subject", subject);
         }
@@ -959,7 +984,7 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
         createRule: handleCreateRule,
     };
     // An encrypted message can be printed once it has been opened here: while it is still opening, or when it can't be, there is nothing to print.
-    const printReason = !message.encrypted
+    const printReason = !message.encrypted && !message.zeroAccess
         ? undefined
         : security === null
             ? "Still opening this message"
@@ -970,13 +995,13 @@ function MessageDetailContent({ message: messageProp, attachments, backHref, isS
                     : "This message can't be read, so it can't be printed";
     // In Junk Email the card's button is the way back (Not junk), which only needs the right to change the message.
     const reportReason = !writable ? "View-only mailbox" : undefined;
-    const card = (_jsxs(CardShell, { unread: cardUnread, children: [_jsxs("div", { className: ["flex flex-wrap items-start gap-x-3 gap-y-1 px-4 pt-3 pb-2", cardUnread ? "bg-primary/[0.07]" : ""].join(" "), children: [_jsx(SenderAvatar, { from: senderRecipient }), _jsxs("div", { className: "flex-1 min-w-[12rem]", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [threadHeader ? (_jsxs("h2", { className: "relative min-w-0 flex-1", style: BODY_FONT_STYLE, children: [_jsx("button", { type: "button", ref: threadHeader.buttonRef, onClick: threadHeader.onToggle, "aria-expanded": true, "aria-controls": threadHeader.bodyId, "aria-label": `${cardUnread ? "Unread. " : ""}${senderLabel}`, className: ["absolute inset-0 w-full rounded-sm", ROW_FOCUS_CLASS].join(" ") }), _jsx("span", { className: "pointer-events-none relative flex text-sm", children: _jsx(ParticipantLink, { participant: { address: senderAddress, displayName: senderName }, context: cardContext, label: `Contact card for ${senderLabel}`, className: "pointer-events-auto min-w-0 max-w-full", children: _jsx(MailAddress, { recipient: senderRecipient, className: senderClass(cardUnread) }) }) })] })) : (_jsxs("p", { className: "text-sm break-words min-w-0", children: ["From", " ", _jsx(ParticipantLink, { participant: { address: senderAddress, displayName: senderName }, context: cardContext, className: "font-semibold text-text", children: senderLabel })] })), security && _jsx(SecurityIndicator, { security: security })] }), senderNameCheck.misleading && (_jsxs("p", { role: "status", className: "mt-2 py-2 px-3 rounded-sm text-sm bg-warning/15 text-text", children: ["The sender\u2019s name \u201C", senderName, "\u201D looks like an email address, but this message was sent from ", _jsx("span", { className: "font-medium", children: senderAddress }), ". Don\u2019t trust it based on the name."] })), _jsx(RecipientLine, { label: "To", recipients: message.recipients.filter((r) => r.type !== "cc" && r.type !== "bcc"), context: cardContext }), _jsx(RecipientLine, { label: "Cc", recipients: message.recipients.filter((r) => r.type === "cc"), context: cardContext }), _jsx(RecipientLine, { label: "Bcc", recipients: message.recipients.filter((r) => r.type === "bcc"), context: cardContext })] }), _jsxs("div", { className: "ml-auto flex flex-wrap items-center justify-end gap-1", children: [_jsx("time", { dateTime: message.receivedDate, className: ["text-xs mr-1", dateClass(cardUnread)].join(" "), children: new Date(message.receivedDate).toLocaleString() }), adaptable && (_jsx("button", { type: "button", "aria-label": "View original", "aria-pressed": viewOriginal, title: viewOriginal ? "Follow the theme" : "View original", onClick: () => setViewOriginal(!viewOriginal), className: [
+    const card = (_jsxs(CardShell, { unread: cardUnread, children: [_jsxs("div", { className: ["flex flex-wrap items-start gap-x-3 gap-y-1 px-4 pt-3 pb-2", cardUnread ? "bg-primary/[0.07]" : ""].join(" "), children: [_jsx(SenderAvatar, { from: senderRecipient }), _jsxs("div", { className: "flex-1 min-w-[12rem]", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-x-2 gap-y-1", children: [threadHeader ? (_jsxs("h2", { className: "relative min-w-0 flex-1", style: BODY_FONT_STYLE, children: [_jsx("button", { type: "button", ref: threadHeader.buttonRef, onClick: threadHeader.onToggle, "aria-expanded": true, "aria-controls": threadHeader.bodyId, "aria-label": `${cardUnread ? "Unread. " : ""}${senderLabel}`, className: ["absolute inset-0 w-full rounded-sm", ROW_FOCUS_CLASS].join(" ") }), _jsx("span", { className: "pointer-events-none relative flex text-sm", children: _jsx(ParticipantLink, { participant: { address: senderAddress, displayName: senderName }, context: cardContext, label: `Contact card for ${senderLabel}`, className: "pointer-events-auto min-w-0 max-w-full", children: _jsx(MailAddress, { recipient: senderRecipient, className: senderClass(cardUnread) }) }) })] })) : (_jsxs("p", { className: "text-sm break-words min-w-0", children: ["From", " ", _jsx(ParticipantLink, { participant: { address: senderAddress, displayName: senderName }, context: cardContext, className: "font-semibold text-text", children: senderLabel })] })), security && _jsx(SecurityIndicator, { security: security, zeroAccess: !!message.zeroAccess })] }), security?.signerKeyUnknown && (_jsx("p", { role: "status", className: "mt-2 text-sm text-text-muted", children: "Signed with an OpenPGP key RapidMX doesn\u2019t have for this sender yet, so the signature couldn\u2019t be checked." })), senderNameCheck.misleading && (_jsxs("p", { role: "status", className: "mt-2 py-2 px-3 rounded-sm text-sm bg-warning/15 text-text", children: ["The sender\u2019s name \u201C", senderName, "\u201D looks like an email address, but this message was sent from ", _jsx("span", { className: "font-medium", children: senderAddress }), ". Don\u2019t trust it based on the name."] })), _jsx(RecipientLine, { label: "To", recipients: message.recipients.filter((r) => r.type !== "cc" && r.type !== "bcc"), context: cardContext }), _jsx(RecipientLine, { label: "Cc", recipients: message.recipients.filter((r) => r.type === "cc"), context: cardContext }), _jsx(RecipientLine, { label: "Bcc", recipients: message.recipients.filter((r) => r.type === "bcc"), context: cardContext })] }), _jsxs("div", { className: "ml-auto flex flex-wrap items-center justify-end gap-1", children: [_jsx("time", { dateTime: message.receivedDate, className: ["text-xs mr-1", dateClass(cardUnread)].join(" "), children: new Date(message.receivedDate).toLocaleString() }), adaptable && (_jsx("button", { type: "button", "aria-label": "View original", "aria-pressed": viewOriginal, title: viewOriginal ? "Follow the theme" : "View original", onClick: () => setViewOriginal(!viewOriginal), className: [
                                     "inline-flex items-center justify-center p-1.5 rounded-md border border-border text-sm text-text hover:bg-surface-alt",
                                     viewOriginal ? "bg-primary/10" : "",
                                 ].join(" "), children: viewOriginal ? _jsx(HiOutlineMoon, { size: 16, "aria-hidden": "true" }) : _jsx(HiOutlineSun, { size: 16, "aria-hidden": "true" }) })), _jsx(IconAction, { icon: _jsx(HiOutlineArrowUturnLeft, { size: 16, "aria-hidden": "true" }), label: "Reply", shortcut: keyboard ? SHORTCUTS.mail.reply : undefined, disabled: preparingCompose, onPrefetch: prefetchReply, onClick: () => void handleReplyOrForward("reply") }), _jsx(IconAction, { icon: _jsxs("span", { className: "inline-flex items-center", "aria-hidden": "true", children: [_jsx(HiOutlineArrowUturnLeft, { size: 16 }), _jsx(HiOutlineArrowUturnLeft, { size: 16, className: "-ml-2.5" })] }), label: "Reply All", shortcut: keyboard ? SHORTCUTS.mail.replyAll : undefined, disabled: preparingCompose, onPrefetch: prefetchReply, onClick: () => void handleReplyOrForward("replyAll") }), _jsx(IconAction, { icon: _jsx(HiOutlineArrowUturnRight, { size: 16, "aria-hidden": "true" }), label: "Forward", shortcut: keyboard ? SHORTCUTS.mail.forward : undefined, disabled: preparingCompose, onPrefetch: prefetchReply, onClick: () => void handleReplyOrForward("forward") }), archivable && (_jsx(IconAction, { icon: _jsx(HiOutlineArchiveBox, { size: 16, "aria-hidden": "true" }), label: "Archive", shortcut: keyboard ? SHORTCUTS.mail.archive : undefined, busy: archiving, disabled: archiving, onClick: handleArchive })), movable && (_jsx(IconAction, { icon: _jsx(HiOutlineFolderArrowDown, { size: 16, "aria-hidden": "true" }), label: "Move to", shortcut: keyboard ? SHORTCUTS.mail.move : undefined, onClick: () => setMovePrompt(true) })), reportable && (_jsx(IconAction, { icon: inJunk ? _jsx(HiOutlineInboxArrowDown, { size: 16, "aria-hidden": "true" }) : _jsx(HiOutlineNoSymbol, { size: 16, "aria-hidden": "true" }), label: inJunk ? "Not junk" : "Report junk", busy: messageActions.busy, disabled: messageActions.busy || reportReason !== undefined, reason: reportReason, onClick: () => void (inJunk ? messageActions.notJunk() : messageActions.reportJunk()) })), labels && labels.length > 0 && (_jsx(LabelMenuButton, { "aria-label": "Labels", label: "Labels", className: "border border-border py-1.5", labels: labels, mailboxUid: message.mailboxUid, onLabelCreated: onLabelCreated, applied: currentLabelsMessage.labelUids ?? [], onCommit: (labelUids) => void handleApplyLabels(labelUids), busy: savingLabels, note: "Ticked labels are applied to this message and unticked ones removed.", emptyNote: "This mailbox has no labels yet.", commit: { label: "Apply" }, clear: { label: "Remove all labels" } })), archivable && (_jsx(MessageMoreMenu, { actions: menuActions, senderAddress: message.from.address, read: currentLabelsMessage.flags.read === true, flagged: currentLabelsMessage.flags.flagged === true, writable: writable, busy: messageActions.busy, inJunk: inJunk, inDeletedItems: inDeletedItems, sent: !!isSentItems, ownSender: readerOwnAddresses.includes(message.from.address.toLowerCase()), canTrustSender: writable, printReason: printReason, composing: preparingCompose, triggerClassName: ICON_BUTTON_CLASS }))] })] }), (answered || forwarded) && (_jsx("p", { className: "px-4 py-1.5 text-xs text-text-muted bg-surface-alt border-y border-border", children: answered && forwarded ? "You replied to and forwarded this message." : answered ? "You replied to this message." : "You forwarded this message." })), _jsxs("div", { id: threadHeader?.bodyId, className: "px-4 pb-3 flex flex-col gap-2", children: [inThread && (subjectDiffers || !sameSubject(shownSubject, threadSubject)) && (_jsx("h3", { className: "text-sm font-semibold break-words", children: shownSubject })), _jsx("div", { className: "flex flex-wrap items-center gap-2 empty:hidden", children: sendingStatus }), inOutbox && message.scheduledSendError && _jsxs(Alert, { children: ["This message wasn\u2019t sent: ", message.scheduledSendError] }), cancelError && _jsx(Alert, { children: cancelError }), keyChangeNotice && (_jsx("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-surface-alt text-text", children: keyChangeNotice })), security && UNVERIFIED_SIGNER_STATES.has(security.state) && (_jsxs("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-surface-alt text-text", children: ["Signed, but the signer isn\u2019t a trusted contact key, so the sender isn\u2019t verified.", security.signerEmails && security.signerEmails.length > 0 && _jsxs(_Fragment, { children: [" Certificate for ", security.signerEmails.join(", "), "."] }), security.signerFingerprint && (_jsxs(_Fragment, { children: [" ", "Fingerprint ", _jsx("span", { className: "font-mono text-xs break-all", children: security.signerFingerprint }), "."] }))] })), pendingConflict && (_jsxs("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-warning/15 text-text", children: ["This sender has a signing key change waiting for your review, so this signer can\u2019t be trusted from here.", " ", _jsx("a", { href: `/contacts/${encodeURIComponent(senderKeyState.contactUid)}`, className: "font-medium text-primary-dark hover:underline", children: "Review it in Contacts" })] })), trustableCertificate && (_jsx("div", { children: _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: trusting, onClick: () => {
                                 setTrustError(null);
                                 setTrustConfirmOpen(true);
-                            }, children: "Trust this signer" }) })), subjectDiffers && (_jsxs("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-surface-alt text-text", children: ["The subject shown above is the one the sender signed. It differs from the subject this message was delivered with (\u201C", message.subject, "\u201D), which may have been changed on the way, e.g. by a mailing list."] })), security?.headerTamperDetected && (_jsx(Alert, { children: "This message's visible From/To/Cc/Date/Subject don't match what the sender actually signed or encrypted \u2014 an intermediary may have altered them after sending. Treat the fields shown above with caution." })), security?.state === "verified_at_first_open" && (_jsx("p", { role: "status", className: `py-2 px-3 rounded-sm text-sm text-text ${security.laterCompromised ? "bg-warning/15" : "bg-surface-alt"}`, children: verifiedAtFirstOpenMessage(security) })), keyChanged && (_jsxs("section", { "aria-label": "Signing key changed", className: "py-3 px-3 rounded-sm text-sm bg-warning/15 text-text flex flex-col gap-2", children: [_jsx("h2", { className: "font-semibold", children: "This sender\u2019s signing key changed" }), _jsxs("p", { children: ["The signature on this message is valid and its certificate names ", senderAddress, ", but it was made with a different key than the one you trust for this sender", keyChanged.state === "verified_at_first_open" ? "." : _jsx(_Fragment, { children: ", so it isn\u2019t verified." })] }), _jsx(KeyChangeReview, { mailboxUid: message.mailboxUid, address: senderAddress, useType: "sign", ownerName: "the sender", current: pinnedSignerKey && { fingerprint: pinnedSignerKey.fingerprint, since: senderKeyState.pinnedSince }, proposed: {
+                            }, children: "Trust this signer" }) })), subjectDiffers && (_jsxs("p", { role: "status", className: "py-2 px-3 rounded-sm text-sm bg-surface-alt text-text", children: ["The subject shown above is the one the sender signed. It differs from the subject this message was delivered with (\u201C", message.subject, "\u201D), which may have been changed on the way, e.g. by a mailing list."] })), security?.headerTamperDetected && (_jsx(Alert, { children: "This message's visible From/To/Cc/Date/Subject don't match what the sender actually signed or encrypted \u2014 an intermediary may have altered them after sending. Treat the fields shown above with caution." })), security?.state === "verified_at_first_open" && (_jsx("p", { role: "status", className: `py-2 px-3 rounded-sm text-sm text-text ${security.laterCompromised ? "bg-warning/15" : "bg-surface-alt"}`, children: verifiedAtFirstOpenMessage(security) })), keyChanged && (_jsxs("section", { "aria-label": "Signing key changed", className: "py-3 px-3 rounded-sm text-sm bg-warning/15 text-text flex flex-col gap-2", children: [_jsx("h2", { className: "font-semibold", children: "This sender\u2019s signing key changed" }), _jsxs("p", { children: ["The signature on this message is valid and its certificate names ", senderAddress, ", but it was made with a different key than the one you trust for this sender", keyChanged.state === "verified_at_first_open" ? "." : _jsx(_Fragment, { children: ", so it isn\u2019t verified." })] }), _jsx(KeyChangeReview, { mailboxUid: message.mailboxUid, address: senderAddress, useType: openPgpSigner ? "encrypt" : "sign", ...(openPgpSigner ? { keyType: "openpgp" } : {}), ownerName: "the sender", current: pinnedSignerKey && { fingerprint: pinnedSignerKey.fingerprint, since: pinnedSignerSince }, proposed: {
                                     fingerprint: keyChanged.signerFingerprint,
                                     emails: keyChanged.signerEmails,
                                     observedAt: recordedConflict?.observedAt,
@@ -990,6 +1015,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, 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" })] })] }) })] }));
+                        : 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 || message.zeroAccess) && 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 || !!message.zeroAccess }), _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, security?.signerKeyType), 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/ComposeWindow.js

@@ -21,7 +21,7 @@ import { notify } from "../../../notifications/store.js";
 import { isFileDrag, isInlineImage } from "./dropFiles.js";
 import { evaluateEncryptionRequirement } from "./encryptionRequirement.js";
 import { decideSend } from "../../../mail/outbox/sendDecision.js";
-import { sendDecisionInput, startSend } from "../../../mail/outbox/sendJob.js";
+import { sendDecisionInput, senderCanUseOpenPgp, startSend } from "../../../mail/outbox/sendJob.js";
 import { useCompose } from "./ComposeContext.js";
 import { ariaKeyShortcuts, withHint } from "../../../keyboard/format.js";
 import { SHORTCUTS } from "../../../keyboard/keymap.js";
@@ -362,7 +362,7 @@ export default function ComposeWindow({ session, onClose, onToggleMinimize, inli
                     return;
                 }
                 lookupFailuresRef.current.delete(key);
-                const status = resolveRecipientEncryption(mailbox.primarySmtpAddress, ownPrefersMutual, encryptionPolicy, recipient.address, result.lookup);
+                const status = resolveRecipientEncryption(mailbox.primarySmtpAddress, ownPrefersMutual, encryptionPolicy, recipient.address, result.lookup, senderCanUseOpenPgp(getUnlockedKeys(mailbox.uid)));
                 setRecipientStatuses((prev) => ({ ...prev, [key]: status }));
             });
         }

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

@@ -6,7 +6,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import { HiOutlineXMark } from "react-icons/hi2";
-import { fetchRecipientSuggestions, RECIPIENT_SUGGESTION_MIN_QUERY_LENGTH, } from "../../../../../lib/mail/directoryApi.js";
+import { fetchSuggestionsWithProtectedContacts } from "./protectedContactSuggestions.js";
+import { RECIPIENT_SUGGESTION_MIN_QUERY_LENGTH, } from "../../../../../lib/mail/directoryApi.js";
 import { formatRecipient, isValidRecipientAddress, parseRecipient, splitRecipientList, splitTypedRecipients } from "./recipients.js";
 /** How long typing must pause before suggestions are requested. */
 export const RECIPIENT_SUGGESTION_DEBOUNCE_MS = 150;
@@ -42,7 +43,7 @@ function dropdownPosition(anchor) {
  * least two characters, and a newer query aborts an older request. Arrow keys move through them, Enter or Tab picks
  * one (as `Name <address>`), Escape closes them, and Backspace in an empty input removes the last chip.
  */
-export default function RecipientInput({ id, label, value, onChange, onBlur, onCommit, mailboxUid, fetchSuggestions = fetchRecipientSuggestions, debounceMs = RECIPIENT_SUGGESTION_DEBOUNCE_MS, disabled, autoFocus, onEdit, initialPending = "", hideChip, placeholder, ariaLabel, listLabel, className, dropdownZIndex, }) {
+export default function RecipientInput({ id, label, value, onChange, onBlur, onCommit, mailboxUid, fetchSuggestions = fetchSuggestionsWithProtectedContacts, debounceMs = RECIPIENT_SUGGESTION_DEBOUNCE_MS, disabled, autoFocus, onEdit, initialPending = "", hideChip, placeholder, ariaLabel, listLabel, className, dropdownZIndex, }) {
     const [pending, setPending] = useState(initialPending);
     // With the query they were loaded for: a list for earlier text is not offered (Enter or Tab would put somebody else in place of what was typed).
     const [suggestionList, setSuggestionList] = useState({ query: "", items: [] });

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

@@ -5,6 +5,8 @@ import type { ResumeCompose } from "../../../mail/outbox/composeBridge.js";
  * What the compose window needs to continue `draft` - a message in the Drafts folder the reader opened rather than one a window of this tab
  * saved - read back from the server: its recipients and subject from the record, its body from the server's copy (with its embedded pictures)
  * and its attachments. `undefined` for a draft that cannot be edited here: an encrypted one holds only its ciphertext, which is never opened.
+ * A draft saved in a zero-access mailbox is stored sealed to the mailbox's zero-access key: it is decrypted here with the unlocked keys (its
+ * subject comes from the decrypted message too, the record holding only `[...]`), and is `undefined` - left to read - while they're locked.
  * Never rejects for a body that could not be loaded - the draft then opens with the preview, as a reply's quote does.
  */
 export declare function resumeFromDraft(draft: Message, client?: ApiClient): Promise<ResumeCompose | undefined>;

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

@@ -2,7 +2,9 @@
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
-import { listAttachments } from "../../../../../lib/mail/mailApi.js";
+import { getUnlockedKeys } from "../../../../../lib/crypto/keySession.js";
+import { evaluateMessageSecurity } from "../../../../../lib/crypto/messageSecurity.js";
+import { getMessageRawContent, listAttachments } from "../../../../../lib/mail/mailApi.js";
 import { formatMailAddress } from "../../../../../lib/mail/mailAddress.js";
 import { loadOriginalMessage } from "./quotedBody.js";
 /** The comma-separated address text a recipient field holds, for the recipients of one type. */
@@ -24,13 +26,22 @@ function textToHtml(text) {
  * What the compose window needs to continue `draft` - a message in the Drafts folder the reader opened rather than one a window of this tab
  * saved - read back from the server: its recipients and subject from the record, its body from the server's copy (with its embedded pictures)
  * and its attachments. `undefined` for a draft that cannot be edited here: an encrypted one holds only its ciphertext, which is never opened.
+ * A draft saved in a zero-access mailbox is stored sealed to the mailbox's zero-access key: it is decrypted here with the unlocked keys (its
+ * subject comes from the decrypted message too, the record holding only `[...]`), and is `undefined` - left to read - while they're locked.
  * Never rejects for a body that could not be loaded - the draft then opens with the preview, as a reply's quote does.
  */
 export async function resumeFromDraft(draft, client) {
     if (draft.encrypted) {
         return undefined;
     }
-    const [original, attachments] = await Promise.all([loadOriginalMessage(draft, null), listAttachments(draft.folderUid, draft.uid, client)]);
+    let security = null;
+    if (draft.zeroAccess) {
+        security = await openSealedDraft(draft, client);
+        if (!security) {
+            return undefined;
+        }
+    }
+    const [original, attachments] = await Promise.all([loadOriginalMessage(draft, security), listAttachments(draft.folderUid, draft.uid, client)]);
     const html = original.body.html !== undefined ? original.body.html : original.body.text !== undefined ? textToHtml(original.body.text) : textToHtml(draft.bodyPreview ?? "");
     return {
         draft,
@@ -38,7 +49,7 @@ export async function resumeFromDraft(draft, client) {
         to: recipientText(draft.recipients, "to"),
         cc: recipientText(draft.recipients, "cc"),
         bcc: recipientText(draft.recipients, "bcc"),
-        subject: draft.subject,
+        subject: security?.subject ?? draft.subject,
         html,
         attachments,
         requestReceipt: !!draft.requestReceipt,
@@ -46,3 +57,17 @@ export async function resumeFromDraft(draft, client) {
         encryptRequested: false,
     };
 }
+/** `draft`'s sealed message decrypted with its mailbox's unlocked keys, or `null` when they're locked or it won't open with them. */
+async function openSealedDraft(draft, client) {
+    const unlocked = getUnlockedKeys(draft.mailboxUid);
+    if (!unlocked) {
+        return null;
+    }
+    try {
+        const security = await evaluateMessageSecurity(await getMessageRawContent(draft.uid, client), unlocked);
+        return security.zeroAccess ? security : null;
+    }
+    catch {
+        return null;
+    }
+}

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

@@ -0,0 +1,14 @@
+import { type ContactSuggestionOptions, type RecipientSuggestion } from "../../../../../lib/mail/directoryApi.js";
+import type { ApiClient } from "../../../../../lib/util/api.js";
+/** How long a mailbox's protected contact names are kept: reading them is a crawl of the whole address book. */
+export declare const PROTECTED_NAMES_TTL_MS: number;
+/** How long suggestions wait, once the server's have arrived, for the protected contacts still being read. */
+export declare const PROTECTED_NAMES_WAIT_MS = 250;
+/** Forgets every mailbox's names (signing out, or the test seam). */
+export declare function clearProtectedContactNames(): void;
+/** Every address of the protected contacts of `mailboxUid` whose opened name contains `query` (case-insensitively). */
+export declare function searchProtectedContactNames(mailboxUid: string, query: string, client?: ApiClient): Promise<RecipientSuggestion[]>;
+/** `fetchRecipientSuggestions()` with the composing mailbox's protected contacts matched by name on the device, first - those read by the
+ * time the server's suggestions are in (plus `PROTECTED_NAMES_WAIT_MS`): a first search of a large address book shows the server's alone
+ * rather than waiting for the crawl, which goes on for the next keystroke. A failure to read them only leaves them out. */
+export declare function fetchSuggestionsWithProtectedContacts(query: string, options?: ContactSuggestionOptions, client?: ApiClient): Promise<RecipientSuggestion[]>;

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

@@ -0,0 +1,96 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+/**
+ * Recipient suggestions that include contacts zero-access encryption protects. Their names are sealed (restapi `specs/search.md` §3 *What
+ * It Covers*), so the server's contact search finds them only by address; this matches their opened names on the device and puts them
+ * first. Names are opened only - never the rest of a contact - and kept for ten minutes, and only while the mailbox is unlocked: its lock
+ * (and signing out) forgets them, as does a search that finds it locked. Reading them never holds up the server's suggestions: what isn't read by the time those arrive (plus
+ * `PROTECTED_NAMES_WAIT_MS`) is left to the next keystroke.
+ */
+import { listContacts, PINNED_FINGERPRINT_PAGE_SIZE } from "../../../../../lib/contacts/contactsApi.js";
+import { getUnlockedKeys, subscribeKeySession } from "../../../../../lib/crypto/keySession.js";
+import { fetchRecipientSuggestions, mergeRecipientSuggestions, RECIPIENT_SUGGESTION_DEFAULT_LIMIT, } from "../../../../../lib/mail/directoryApi.js";
+import { listFolders } from "../../../../../lib/mail/mailApi.js";
+import { isProtectedRecord, openSealedRecords } from "../../../../../lib/zeroAccess/sealedRecords.js";
+import { onSigningOut } from "./composeFlushRegistry.js";
+/** How long a mailbox's protected contact names are kept: reading them is a crawl of the whole address book. */
+export const PROTECTED_NAMES_TTL_MS = 10 * 60000;
+/** How long suggestions wait, once the server's have arrived, for the protected contacts still being read. */
+export const PROTECTED_NAMES_WAIT_MS = 250;
+/** At most this many contacts are read per contacts folder. */
+const MAX_PAGES = 20;
+const cache = new Map();
+/** Forgets every mailbox's names (signing out, or the test seam). */
+export function clearProtectedContactNames() {
+    cache.clear();
+}
+onSigningOut(clearProtectedContactNames);
+let watchingKeys = false;
+/** A mailbox's names go the moment it locks, so nothing opened outlives its key session. Subscribed with the first crawl, not on import. */
+function forgetOnLock() {
+    if (watchingKeys) {
+        return;
+    }
+    watchingKeys = true;
+    subscribeKeySession(({ mailboxUid, state }) => {
+        if (state === "locked") {
+            cache.delete(mailboxUid);
+        }
+    });
+}
+/** `mailboxUid`'s protected contacts with their names opened. */
+async function loadProtectedContacts(mailboxUid, client) {
+    const found = [];
+    // The folders side by side, each one's pages in turn.
+    await Promise.all((await listFolders(mailboxUid, client))
+        .filter((f) => f.type === "contacts")
+        .map(async (folder) => {
+        for (let page = 0; page < MAX_PAGES; page++) {
+            const batch = await listContacts(folder.uid, { limit: PINNED_FINGERPRINT_PAGE_SIZE, page }, client);
+            found.push(...batch.filter((contact) => isProtectedRecord(contact)));
+            if (batch.length < PINNED_FINGERPRINT_PAGE_SIZE) {
+                break;
+            }
+        }
+    }));
+    return openSealedRecords(found, ["displayName"]);
+}
+function protectedContacts(mailboxUid, client) {
+    let entry = cache.get(mailboxUid);
+    if (!entry || Date.now() - entry.loadedAt > PROTECTED_NAMES_TTL_MS) {
+        forgetOnLock();
+        const created = { loadedAt: Date.now(), contacts: loadProtectedContacts(mailboxUid, client) };
+        created.contacts.catch(() => cache.delete(mailboxUid));
+        cache.set(mailboxUid, created);
+        entry = created;
+    }
+    return entry.contacts;
+}
+/** Every address of the protected contacts of `mailboxUid` whose opened name contains `query` (case-insensitively). */
+export async function searchProtectedContactNames(mailboxUid, query, client) {
+    const wanted = query.trim().toLowerCase();
+    if (wanted.length < 2) {
+        return [];
+    }
+    if (!getUnlockedKeys(mailboxUid)?.zeroAccessKeys?.length) {
+        // Locked: nothing opened is kept, and nothing could be opened now.
+        cache.delete(mailboxUid);
+        return [];
+    }
+    return (await protectedContacts(mailboxUid, client))
+        .filter((contact) => contact.displayName.toLowerCase().includes(wanted))
+        .flatMap((contact) => contact.emails.map((email) => ({ displayName: contact.displayName, address: email.address, kind: "contact" })));
+}
+/** `fetchRecipientSuggestions()` with the composing mailbox's protected contacts matched by name on the device, first - those read by the
+ * time the server's suggestions are in (plus `PROTECTED_NAMES_WAIT_MS`): a first search of a large address book shows the server's alone
+ * rather than waiting for the crawl, which goes on for the next keystroke. A failure to read them only leaves them out. */
+export async function fetchSuggestionsWithProtectedContacts(query, options = {}, client) {
+    const local = options.mailboxUid ? searchProtectedContactNames(options.mailboxUid, query, client).catch(() => []) : Promise.resolve([]);
+    const server = await fetchRecipientSuggestions(query, options, client);
+    let timer;
+    const ready = await Promise.race([local, new Promise((resolve) => (timer = setTimeout(() => resolve([]), PROTECTED_NAMES_WAIT_MS)))]);
+    clearTimeout(timer);
+    return mergeRecipientSuggestions(ready, server, options.limit ?? RECIPIENT_SUGGESTION_DEFAULT_LIMIT);
+}

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

@@ -18,7 +18,7 @@ export declare const QUOTE_CACHE_MS = 30000;
 /**
  * Starts fetching what a Reply/Forward of `message` will quote, without waiting for the click - called when the pointer or
  * 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).
+ * Nothing to fetch for an encrypted or zero-access message (`loadOriginalMessage()` never asks the server for one's body).
  */
 export declare function prefetchOriginalMessage(message: Message, client?: ApiClient): void;
 /** Forgets every remembered body (the sign-out and test seam). */

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

@@ -78,10 +78,10 @@ function withTimeout(promise, ms) {
 /**
  * Starts fetching what a Reply/Forward of `message` will quote, without waiting for the click - called when the pointer or
  * 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).
+ * Nothing to fetch for an encrypted or zero-access message (`loadOriginalMessage()` never asks the server for one's body).
  */
 export function prefetchOriginalMessage(message, client) {
-    if (!message.encrypted) {
+    if (!message.encrypted && !message.zeroAccess) {
         void fetchContentHtml(message.uid, client);
     }
 }
@@ -173,7 +173,8 @@ export async function loadOriginalMessage(message, security, options = {}, clien
         ? [...headerRecipients(protectedHeaders.to, "to"), ...headerRecipients(protectedHeaders.cc, "cc")]
         : [];
     const result = { body: recovered ?? {}, ...(protectedRecipients.length > 0 ? { recipients: protectedRecipients } : {}) };
-    if (message.encrypted) {
+    // The server holds only ciphertext of an encrypted or zero-access message: its body is what `security` decrypted, or nothing.
+    if (message.encrypted || message.zeroAccess) {
         return result;
     }
     let needsRaw = !!options.recipients && result.recipients === undefined;