@rapidmx/web-client 0.35.0 → 0.37.0

package/apps/www/contacts/index.tsx

@@ -11,6 +11,8 @@ import {
     createContact,
     deleteContact,
     getContact,
+    CONTACT_LIST_FIELDS,
+    CONTACT_MATCH_FIELDS,
     listContacts,
     ensureSuggestedContacts,
     listContactsInFolders,
@@ -44,6 +46,8 @@ 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";
+import { isOpenedRecord, isProtectedRecord, openSealedRecord, openSealedRecords } from "../../../lib/zeroAccess/sealedRecords.js";
+import { useKeysLocked } from "../../shared/zeroAccess/useKeysLocked.js";
 
 /** The published model class name of a contact on either database (`ContactMongo`, `ContactSQL`) - not a `ContactList`'s. */
 const CONTACT_MODEL = /^Contact(Mongo|SQL)$/;
@@ -142,6 +146,7 @@ function ContactsContent({ userUid }: { userUid?: string }) {
             void loadSuggested(suggestedFolderUid);
         }
         return listAllPages((page) => listContacts(folderUid, { limit: LIST_PAGE_SIZE, page }, client))
+            .then(async (result) => ({ ...result, items: await openSealedRecords(result.items, CONTACT_LIST_FIELDS) }))
             .then((result) => {
                 setContacts(result.items);
                 setTruncated(result.truncated);
@@ -154,10 +159,25 @@ function ContactsContent({ userUid }: { userUid?: string }) {
         void reload();
     }, [folderUid]);
 
+    // The lists hold protected contacts opened with the mailbox's keys: its lock takes them off screen, read again with their placeholders (the
+    // contacts, the suggested ones and the Deleted view). They leave the lists first, so a reload that fails can't leave them shown. An open
+    // contact's pane and form drop what they opened themselves (`useOpenedRecord`).
+    const [lockCount, setLockCount] = useState(0);
+    useKeysLocked((locked) => {
+        if (locked === mailboxUid) {
+            const readable = (list: Contact[]) => list.filter((contact) => !isProtectedRecord(contact));
+            setContacts(readable);
+            setSuggestedContacts(readable);
+            setDeletedContacts(readable);
+            void reload();
+            setLockCount((count) => count + 1);
+        }
+    });
+
     /** Reads the Suggested Contacts folder's contacts. A failure leaves the list as it was. */
     function loadSuggested(suggestedUid: string): Promise<void> {
         return listAllPages((page) => listContacts(suggestedUid, { limit: LIST_PAGE_SIZE, page }, client))
-            .then((result) => setSuggestedContacts(result.items))
+            .then(async (result) => setSuggestedContacts(await openSealedRecords(result.items, CONTACT_LIST_FIELDS)))
             .catch(() => undefined);
     }
 
@@ -195,7 +215,9 @@ function ContactsContent({ userUid }: { userUid?: string }) {
                 remove(change.uid);
                 return;
             }
-            void getContact(change.uid, client).then(
+            void getContact(change.uid, client)
+                .then((fresh) => openSealedRecord(fresh, CONTACT_LIST_FIELDS))
+                .then(
                 (fresh) => {
                     if (fresh.deleted === true) {
                         remove(fresh.uid);
@@ -256,6 +278,7 @@ function ContactsContent({ userUid }: { userUid?: string }) {
         setDeletedLoading(true);
         setDeletedError(null);
         listAllPages((page) => listDeletedContacts(folderUid, { limit: LIST_PAGE_SIZE, page }, client))
+            .then(async (result) => ({ ...result, items: await openSealedRecords(result.items, CONTACT_LIST_FIELDS) }))
             .then((result) => {
                 // A server that dropped the `deleted` filter (no delete+update right on this folder) answers with live
                 // contacts, which must never be listed as deleted.
@@ -271,8 +294,8 @@ function ContactsContent({ userUid }: { userUid?: string }) {
             .catch((err) => setDeletedError(err instanceof ApiRequestError ? err.message : "Could not load deleted contacts."))
             .finally(() => setDeletedLoading(false));
         // Re-fetches every time the Deleted view is (re-)selected, matching this page's own `reload()`
-        // convention elsewhere rather than caching a possibly-stale list across visits.
-    }, [view, folderUid]);
+        // convention elsewhere rather than caching a possibly-stale list across visits - and when the mailbox locks.
+    }, [view, folderUid, lockCount]);
 
     const viewFiltered = useMemo(() => {
         switch (view.type) {
@@ -467,9 +490,17 @@ function ContactsContent({ userUid }: { userUid?: string }) {
         if (!category?.trim()) {
             return;
         }
-        for (const contact of checkedContacts) {
-            const categories = Array.from(new Set([...(contact.categories ?? []), category.trim()]));
+        let locked = 0;
+        for (const listed of checkedContacts) {
             try {
+                // A protected one's categories are added to as opened: one that won't open here (the mailbox is locked) shows a placeholder
+                // (none), and saving that plus the new one would replace its real categories for good. It is left as it is.
+                const contact = await openSealedRecord(listed);
+                if (isProtectedRecord(contact) && !isOpenedRecord(contact)) {
+                    locked++;
+                    continue;
+                }
+                const categories = Array.from(new Set([...(contact.categories ?? []), category.trim()]));
                 // Only the changed field - sending the whole fetched contact back includes server-managed
                 // fields restapi rejects, and would overwrite any concurrent edit to the other fields.
                 await updateContact({ uid: contact.uid, version: contact.version, categories }, client);
@@ -477,6 +508,13 @@ function ContactsContent({ userUid }: { userUid?: string }) {
                 notifyApiError(err, "Couldn't update some of the contacts");
             }
         }
+        if (locked > 0) {
+            notify({
+                kind: "warning",
+                title: "Some contacts weren't categorized",
+                message: `${locked === 1 ? "A contact is" : `${locked} contacts are`} protected and can't be changed while your mailbox is locked. Unlock it, then add the category again.`,
+            });
+        }
         clearPinnedSignerCache();
         await reload();
     });
@@ -484,8 +522,17 @@ 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 () => {
         // 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)) {
+        let locked = 0;
+        for (const listed of checkedContacts.filter((checked) => checked.folderUid === suggestedFolderUid)) {
             try {
+                // Copied in full: the list opened only what it shows.
+                const contact = await openSealedRecord(listed);
+                // A protected one that won't open here (the mailbox is locked) holds only placeholders: copying them would replace its real
+                // name for good once the original is deleted. It is left as it is.
+                if (isProtectedRecord(contact) && !isOpenedRecord(contact)) {
+                    locked++;
+                    continue;
+                }
                 await createContact(
                     {
                         mailboxUid: contact.mailboxUid,
@@ -508,14 +555,23 @@ function ContactsContent({ userUid }: { userUid?: string }) {
                 notifyApiError(err, "Couldn't add some of the contacts");
             }
         }
+        if (locked > 0) {
+            notify({
+                kind: "warning",
+                title: "Some contacts weren't added",
+                message: `${locked === 1 ? "A suggested contact is" : `${locked} suggested contacts are`} protected and can't be opened while your mailbox is locked. Unlock it, then add ${locked === 1 ? "it" : "them"} again.`,
+            });
+        }
         setCheckedUids(new Set());
         await reload();
     });
 
-    function handleExportVCard() {
+    async function handleExportVCard() {
+        // Exported in full: the list opened only what it shows.
+        const contacts = await openSealedRecords(checkedContacts);
         downloadTextFile(
-            checkedContacts.length === 1 ? `${checkedContacts[0].displayName}.vcf` : "contacts.vcf",
-            checkedContacts.length === 1 ? contactToVCard(checkedContacts[0]) : contactsToVCardFile(checkedContacts),
+            contacts.length === 1 ? `${contacts[0].displayName}.vcf` : "contacts.vcf",
+            contacts.length === 1 ? contactToVCard(contacts[0]) : contactsToVCardFile(contacts),
         );
     }
 
@@ -543,7 +599,7 @@ function ContactsContent({ userUid }: { userUid?: string }) {
         // earlier card's in the file - is left alone. The folder is read in full for that, not just the page of it the list holds.
         let fresh: ParsedVCardContact[];
         try {
-            fresh = withoutDuplicates(parsed, await listContactsInFolders([folderUid], client)).fresh;
+            fresh = withoutDuplicates(parsed, await openSealedRecords(await listContactsInFolders([folderUid], client), CONTACT_MATCH_FIELDS)).fresh;
         } catch (err) {
             notifyApiError(err, "Couldn't check the file against your contacts");
             return;

package/apps/www/index.tsx

@@ -159,12 +159,28 @@ async function decryptEncryptedRows(messages: Message[], unlocked: UnlockedKeys)
         encrypted,
         DECRYPT_CONCURRENCY,
         async (message): Promise<[string, DecryptedRow] | null> => {
+            // A lock while a row was opened has already cleared the shared store: what it opened must not go back in (`decryptForDisplay()`
+            // asks the same). The caller's lock generation keeps it off this page.
+            const stillUnlocked = (): boolean => getUnlockedKeys(message.mailboxUid) === unlocked;
             try {
-                const rawMime = await getMessageRawContent(message.uid);
                 // Loaded here, on first use: the S/MIME code (PKI.js, ASN.1, X.509) is over half a megabyte and an inbox with
                 // no encrypted mail in it never needs it.
-                const { evaluateMessageSecurity } = await (securityModule ??= import("../../lib/crypto/messageSecurity.js"));
-                const security = await evaluateMessageSecurity(rawMime, unlocked);
+                const securityApi = await (securityModule ??= import("../../lib/crypto/messageSecurity.js"));
+                // A message sealed at rest carries its subject and preview sealed on the row: no download needed.
+                const summary = message.zeroAccess ? await securityApi.openZeroAccessSummary(message.zeroAccess.sealedSummary, unlocked.zeroAccessKeys) : undefined;
+                if (summary) {
+                    const preview = summary.preview.slice(0, LIST_PREVIEW_MAX_LENGTH);
+                    if (stillUnlocked()) {
+                        rememberDecrypted(message.uid, message.mailboxUid, { subject: summary.subject, preview });
+                    }
+                    return [message.uid, { subject: summary.subject, preview }];
+                }
+                const rawMime = await getMessageRawContent(message.uid);
+                const security = await securityApi.evaluateMessageSecurity(rawMime, unlocked);
+                // Nor is a lock a failure to decrypt.
+                if (!stillUnlocked()) {
+                    return null;
+                }
                 if (!security.subject && !security.html) {
                     markDecryptFailed(message.uid);
                     return null;

package/apps/www/settings/encryption/index.tsx

@@ -17,14 +17,17 @@ import {
     getCurrentSignEnrollment,
     getEscrowInfo,
     getKeyVault,
+    isOpenPgpKey,
     rekey,
     removeMasterKeyWrap,
     startSignEnrollment,
 } from "../../../../lib/crypto/keyvaultApi.js";
 import {
     ENCRYPTION_PRIVATE_KEY_AAD_PURPOSE,
+    OPENPGP_PRIVATE_KEY_AAD_PURPOSE,
     SIGNING_PRIVATE_KEY_AAD_PURPOSE,
     UnlockedKeys,
+    ZERO_ACCESS_PRIVATE_KEY_AAD_PURPOSE,
     destroyUnlockedKeys,
     getUnlockedKeys,
     unlockWithPassword,
@@ -51,6 +54,9 @@ import { notifyApiError } from "../../../shared/notifications/apiErrors.js";
 import Alert from "../../../../lib/components/feedback/Alert.js";
 import Button from "../../../../lib/components/buttons/Button.js";
 import Modal from "../../../../lib/components/overlays/Modal.js";
+import ZeroAccessSetting from "../../../shared/components/settings/ZeroAccessSetting.js";
+import KeyExportSetting from "../../../shared/components/settings/KeyExportSetting.js";
+import OpenPgpKeySetting from "../../../shared/components/settings/OpenPgpKeySetting.js";
 import SigningCertificateCard, { SigningCertificateMode } from "../../../shared/components/settings/SigningCertificateCard.js";
 import { readStoredSignEnrollment, storeSignEnrollment } from "../../../shared/signing/enrollmentStorage.js";
 import {
@@ -101,7 +107,14 @@ class StaleSessionKeysError extends Error {
 const STALE_KEYS_MESSAGE =
     "Your encryption keys were changed on another device (for example, rotated), so the copy unlocked in this session no longer works. Nothing was changed. Unlock again with your current password, then try again.";
 
+/** The AAD a vault key is sealed with - by what it is: an OpenPGP secret key, a zero-access key, a signing key or an encryption key. */
 function wrappedKeyAad(mailboxUid: string, entry: WrappedPrivateKey): Uint8Array {
+    if (isOpenPgpKey(entry)) {
+        return buildAad(mailboxUid, OPENPGP_PRIVATE_KEY_AAD_PURPOSE);
+    }
+    if (entry.useType === "zero-access") {
+        return buildAad(mailboxUid, ZERO_ACCESS_PRIVATE_KEY_AAD_PURPOSE);
+    }
     return buildAad(mailboxUid, entry.useType === "sign" ? SIGNING_PRIVATE_KEY_AAD_PURPOSE : ENCRYPTION_PRIVATE_KEY_AAD_PURPOSE);
 }
 
@@ -167,6 +180,8 @@ async function rewrapVaultPrivateKeys(
                 algorithm: "AES-256-GCM",
                 fingerprint: entry.fingerprint,
                 useType: entry.useType,
+                // An OpenPGP secret key stays one: without its type it would read back as an S/MIME key.
+                ...(isOpenPgpKey(entry) ? { type: entry.type } : {}),
             });
         }
         return { mk, wrappedKeys: rewrapped };
@@ -227,7 +242,8 @@ function EncryptionGate({ userUid, impersonating }: { userUid?: string; imperson
             mailboxKeys={mailbox.keys}
             canProvision={isOwner}
         >
-            <EncryptionContent canManageKeys={isOwner} />
+            {/* Mounted anew for each mailbox: switching mailbox keeps the page, and its settings seed their state from the mailbox. */}
+            <EncryptionContent key={mailboxUid} canManageKeys={isOwner} />
         </KeyEnrollmentGate>
     );
 }
@@ -975,6 +991,10 @@ function EncryptionContent({ canManageKeys }: { canManageKeys: boolean }) {
                     )}
                 </div>
 
+                <ZeroAccessSetting mailbox={mailbox} canManage={canManageKeys} />
+                <KeyExportSetting mailbox={mailbox} canManage={canManageKeys} />
+                <OpenPgpKeySetting mailbox={mailbox} canManage={canManageKeys} />
+
                 <div>
                     <h2 className="text-sm font-semibold mb-2">Digital signatures</h2>
                     {activeSigningKey && signingStatus !== "pending" && (

package/apps/www/settings/privacy/index.tsx

@@ -15,21 +15,25 @@ import {
 import {
     MailboxImportFormat,
     MailboxImportRequest,
+    ZERO_ACCESS_IMPORT_MESSAGE,
     listImportRequests,
+    mailIsZeroAccess,
     uploadMailboxImport,
 } from "../../../../lib/mail/mailboxImportApi.js";
+import { getEncryptionPolicy } from "../../../../lib/crypto/keyvaultApi.js";
 import {
     DataSubjectErasureRequest,
     createErasureRequest,
     listErasureRequests,
 } from "../../../../lib/mail/erasureRequestApi.js";
-import { Folder, listFolders } from "../../../../lib/mail/mailApi.js";
+import { Folder, Mailbox, listFolders } from "../../../../lib/mail/mailApi.js";
 import { useApiClient } from "../../../../lib/util/apiClientContext.js";
 import SettingsShell, { SettingsShellProps, useSettingsShell } from "../../../shared/components/settings/layout/SettingsShell.js";
 import Alert from "../../../../lib/components/feedback/Alert.js";
 import Button from "../../../../lib/components/buttons/Button.js";
 import Modal from "../../../../lib/components/overlays/Modal.js";
 import { notifyApiError } from "../../../shared/notifications/apiErrors.js";
+import { INVALID_REQUEST_CODE } from "../../../../lib/zeroAccess/sealedMoves.js";
 import GravatarSetting from "../../../shared/components/settings/GravatarSetting.js";
 
 const NON_MAIL_FOLDER_TYPES = new Set(["calendar", "contacts", "tasks", "notes"]);
@@ -89,7 +93,7 @@ function PrivacyContent({ userUid }: { userUid?: string }) {
                 {selectedIsOwn ? (
                     <>
                         <ExportSection mailboxUid={mailboxUid} mailboxLabel={`${selected.displayName} (${selected.primarySmtpAddress})`} />
-                        <ImportSection mailboxUid={mailboxUid} />
+                        <ImportSection mailboxUid={mailboxUid} mailbox={selected} />
                         <ErasureSection mailboxLabel={`${selected.displayName} (${selected.primarySmtpAddress})`} />
                     </>
                 ) : (
@@ -174,7 +178,8 @@ function ExportSection({ mailboxUid, mailboxLabel }: { mailboxUid?: string; mail
             <p className="text-xs text-text-muted mb-3">
                 Requests a copy of <strong>{mailboxLabel}</strong>&rsquo;s messages, contacts, calendar, tasks, and notes. This runs
                 in the background and can take a few minutes — check back here for a download link once it&rsquo;s
-                ready.
+                ready. Mail stored with zero-access encryption is exported encrypted: open it in a mail app that has your
+                exported keys (Settings &rsaquo; Encryption).
             </p>
 
             <form onSubmit={handleCreate} className="flex items-end gap-3 mb-5">
@@ -237,8 +242,36 @@ function ExportSection({ mailboxUid, mailboxLabel }: { mailboxUid?: string; mail
     );
 }
 
-function ImportSection({ mailboxUid }: { mailboxUid?: string }) {
+/**
+ * Uploads a mail archive for restapi's server-side import. Not offered for a mailbox whose mail is zero-access (`mailIsZeroAccess()`):
+ * restapi refuses it (409), since the archive would wait readable in its blob store until the import ran, and the reason is shown
+ * instead. The server's zero-access refusal given anyway (zero-access turned on since the page loaded) is shown in its place too; its other
+ * 409, an import already in progress, is not.
+ */
+function ImportSection({ mailboxUid, mailbox }: { mailboxUid?: string; mailbox: Mailbox }) {
     const client = useApiClient();
+    // Only when the mailbox's own fields say its mail is zero-access is the administrator's policy asked: `undefined` until it answers
+    // (counted as allowed), and a failed read counts as allowed too, so the upload is never offered only to be refused.
+    const zeroAccessCandidate = mailIsZeroAccess(mailbox, undefined);
+    const [allowZeroAccess, setAllowZeroAccess] = useState<boolean | undefined>(undefined);
+    const [refused, setRefused] = useState<string | null>(null);
+    useEffect(() => {
+        if (!zeroAccessCandidate) {
+            return;
+        }
+        let cancelled = false;
+        void getEncryptionPolicy(client)
+            .then((policy) => {
+                if (!cancelled) {
+                    setAllowZeroAccess(policy.allowZeroAccess);
+                }
+            })
+            .catch(() => undefined);
+        return () => {
+            cancelled = true;
+        };
+    }, [zeroAccessCandidate, client]);
+    const zeroAccess = mailIsZeroAccess(mailbox, allowZeroAccess);
     const [folders, setFolders] = useState<Folder[]>([]);
     const [targetFolderUid, setTargetFolderUid] = useState("");
     const [foldersError, setFoldersError] = useState<string | null>(null);
@@ -293,7 +326,18 @@ function ImportSection({ mailboxUid }: { mailboxUid?: string }) {
         setUploading(true);
         uploadMailboxImport(file, { format: importFormatFromFilename(file.name), targetFolderUid, mailboxUid: mailboxUid! }, client)
             .then(() => loadRequests())
-            .catch((err) => notifyApiError(err, "Couldn't upload the file"))
+            .catch((err) => {
+                if (err instanceof ApiRequestError && err.status === 409 && err.code === INVALID_REQUEST_CODE) {
+                    // The server refuses an import into this mailbox (its mail is zero-access): say why, in place of the upload.
+                    setRefused(err.message);
+                    return;
+                }
+                // Any other refusal - an import already in progress is a 409 too - leaves the upload offered, and shows that import.
+                notifyApiError(err, "Couldn't upload the file");
+                if (err instanceof ApiRequestError && err.status === 409) {
+                    void loadRequests();
+                }
+            })
             .finally(() => setUploading(false));
     }
 
@@ -305,43 +349,49 @@ function ImportSection({ mailboxUid }: { mailboxUid?: string }) {
                 choose below. This runs in the background — check back here for its progress.
             </p>
 
-            {folders.length > 0 && (
-                <label className="flex flex-col gap-1.5 text-sm mb-3 max-w-xs">
-                    <span className="font-semibold">Destination folder</span>
-                    <select
-                        aria-label="Destination folder"
-                        className="text-sm border border-border rounded-sm py-1.5 px-2 bg-surface"
-                        value={targetFolderUid}
-                        onChange={(e) => setTargetFolderUid(e.target.value)}
+            {zeroAccess || refused ? (
+                <Alert>{refused ?? ZERO_ACCESS_IMPORT_MESSAGE}</Alert>
+            ) : (
+                <>
+                    {folders.length > 0 && (
+                        <label className="flex flex-col gap-1.5 text-sm mb-3 max-w-xs">
+                            <span className="font-semibold">Destination folder</span>
+                            <select
+                                aria-label="Destination folder"
+                                className="text-sm border border-border rounded-sm py-1.5 px-2 bg-surface"
+                                value={targetFolderUid}
+                                onChange={(e) => setTargetFolderUid(e.target.value)}
+                            >
+                                {folders.map((folder) => (
+                                    <option key={folder.uid} value={folder.uid}>
+                                        {folder.name}
+                                    </option>
+                                ))}
+                            </select>
+                        </label>
+                    )}
+
+                    <Button
+                        type="button"
+                        variant="secondary"
+                        className="!w-auto mb-3"
+                        loading={uploading}
+                        disabled={uploading || !targetFolderUid}
+                        onClick={() => fileInputRef.current?.click()}
                     >
-                        {folders.map((folder) => (
-                            <option key={folder.uid} value={folder.uid}>
-                                {folder.name}
-                            </option>
-                        ))}
-                    </select>
-                </label>
+                        Upload Mbox or PST file
+                    </Button>
+                    <input
+                        ref={fileInputRef}
+                        type="file"
+                        accept=".mbox,.pst"
+                        aria-label="Upload mail archive"
+                        className="hidden"
+                        onChange={handleFileChange}
+                    />
+                </>
             )}
 
-            <Button
-                type="button"
-                variant="secondary"
-                className="!w-auto mb-3"
-                loading={uploading}
-                disabled={uploading || !targetFolderUid}
-                onClick={() => fileInputRef.current?.click()}
-            >
-                Upload Mbox or PST file
-            </Button>
-            <input
-                ref={fileInputRef}
-                type="file"
-                accept=".mbox,.pst"
-                aria-label="Upload mail archive"
-                className="hidden"
-                onChange={handleFileChange}
-            />
-
             {foldersError && <Alert>{foldersError}</Alert>}
             {loadError && <Alert>{loadError}</Alert>}
 

package/apps/www/tasks/index.tsx

@@ -36,6 +36,9 @@ 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";
+import ProtectedMark from "../../shared/zeroAccess/ProtectedMark.js";
+import { useKeysLocked } from "../../shared/zeroAccess/useKeysLocked.js";
+import { isProtectedRecord, openSealedRecord, openSealedRecords } from "../../../lib/zeroAccess/sealedRecords.js";
 
 /** The published model class name of a task on either database (`TaskMongo`, `TaskSQL`) - not a `TaskList`'s. */
 const TASK_MODEL = /^Task(Mongo|SQL)$/;
@@ -132,6 +135,7 @@ function TasksContent() {
         setLoading(true);
         setError(null);
         return listAllPages((page) => listTasks(folderUid, { limit: LIST_PAGE_SIZE, page }, client))
+            .then(async (result) => ({ ...result, items: await openSealedRecords(result.items) }))
             .then((result) => {
                 if (run === loadRun.current) {
                     setTasks(result.items);
@@ -154,6 +158,15 @@ function TasksContent() {
         void reload();
     }, [folderUid]);
 
+    // The list holds protected tasks opened with the mailbox's keys: its lock takes them off screen, read again with their placeholders. They
+    // leave the list first, so a reload that fails can't leave them shown.
+    useKeysLocked((locked) => {
+        if (locked === mailboxUid) {
+            setTasks((list) => list.filter((task) => !isProtectedRecord(task)));
+            void reload();
+        }
+    });
+
     // 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.
@@ -167,7 +180,7 @@ function TasksContent() {
                 remove();
                 return;
             }
-            void getTask(change.uid, client).then(
+            void getTask(change.uid, client).then(openSealedRecord).then(
                 (fresh) => {
                     if (fresh.folderUid !== folderUid) {
                         remove();
@@ -240,7 +253,7 @@ function TasksContent() {
                 setCreateError("That mailbox has no Tasks folder.");
                 return;
             }
-            const created = await createTask(
+            const created = await openSealedRecord(await createTask(
                 {
                     mailboxUid: target,
                     folderUid: targetFolderUid,
@@ -250,7 +263,7 @@ function TasksContent() {
                     priority,
                 },
                 client,
-            );
+            ));
             if (target === mailboxUid) {
                 setAddedElsewhere(null);
                 setTasks((prev) => [...prev, created]);
@@ -289,10 +302,12 @@ function TasksContent() {
         const nextCompleted = !task.completed;
         setTasks((prev) => prev.map((t) => (t.uid === task.uid ? { ...t, completed: nextCompleted } : t)));
         try {
-            const updated = await setTaskCompleted(task, nextCompleted, client);
+            const updated = await openSealedRecord(await setTaskCompleted(task, nextCompleted, client));
             setTasks((prev) => prev.map((t) => (t.uid === task.uid ? updated : t)));
         } catch (err) {
-            setTasks((prev) => prev.map((t) => (t.uid === task.uid ? task : t)));
+            // Only the flag goes back, on the row there now: `task` is the row as it was shown, opened, and a lock since may have
+            // reloaded it with its placeholders (#224), which putting it back whole would undo.
+            setTasks((prev) => prev.map((t) => (t.uid === task.uid ? { ...t, completed: task.completed } : t)));
             notifyApiError(err, "Couldn't update the task");
         } finally {
             setTogglePending(task.uid, false);
@@ -660,6 +675,7 @@ function TaskGroup({ label, tasks, checkedUids, onToggleChecked, onToggle, toggl
                         <CompletionToggle task={task} onToggle={onToggle} pending={toggling.has(task.uid)} />
                         <span className={["flex-1 text-sm", task.completed ? "line-through text-text-muted" : ""].join(" ")}>
                             {task.title}
+                            <ProtectedMark record={task} />
                         </span>
                         {task.priority !== "normal" && (
                             <span className={["text-xs font-medium", PRIORITY_CLASS[task.priority]].join(" ")}>
@@ -742,7 +758,9 @@ function TaskTable({ tasks, checkedUids, onToggleChecked, onToggle, toggling, on
                             <td className="px-3 py-2">
                                 <CompletionToggle task={task} onToggle={onToggle} pending={toggling.has(task.uid)} />
                             </td>
-                            <td className={["px-3 py-2", task.completed ? "line-through text-text-muted" : ""].join(" ")}>{task.title}</td>
+                            <td className={["px-3 py-2", task.completed ? "line-through text-text-muted" : ""].join(" ")}>{task.title}
+                                <ProtectedMark record={task} />
+                            </td>
                             <td className="px-3 py-2 text-text-muted">{task.dueDate ? parseDueDate(task.dueDate).toLocaleDateString() : ""}</td>
                             <td className={["px-3 py-2", PRIORITY_CLASS[task.priority]].join(" ")}>{PRIORITY_LABEL[task.priority]}</td>
                             <td className="px-3 py-2">

package/dist/apps/escrow/matters/[uid].js

@@ -182,7 +182,7 @@ function MatterDetailContent({ uid }) {
         try {
             const material = await getAccessRequestMaterial(request.uid);
             if (seq === materialSeq.current)
-                setMaterialText(JSON.stringify(material.masterKeyWraps, null, 2));
+                setMaterialText(JSON.stringify(material, null, 2));
         }
         catch (err) {
             if (seq === materialSeq.current) {
@@ -270,5 +270,5 @@ function MatterDetailContent({ uid }) {
                                                         ? "bg-surface-alt text-text-muted"
                                                         : "bg-success text-white",
                                             ].join(" "), children: request.status })] }), actionErrors[request.uid] && _jsx(Alert, { children: actionErrors[request.uid] }), _jsxs("div", { className: "flex gap-3 mt-3", children: [!matter.closedAt && request.status === "pending" && (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", className: "!w-auto", loading: actingOn[request.uid], disabled: actingOn[request.uid], onClick: () => setApproveTarget(request), children: "Approve" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: actingOn[request.uid], disabled: actingOn[request.uid], onClick: () => setDenyTarget(request), children: "Deny" })] })), !matter.closedAt && (request.status === "approved" || request.status === "fulfilled") && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => handleGetMaterial(request), children: "Get material" }))] })] }, request.uid))) })), _jsx(LoadMoreButton, { list: requests, label: "Load more access requests" })] }), _jsxs("div", { className: "bg-surface border border-border rounded-md p-6", children: [_jsxs("div", { className: "flex items-center justify-between mb-3", children: [_jsx("h2", { className: "text-base font-bold uppercase tracking-wide", children: "Export this matter" }), !matter.closedAt && (_jsx(Button, { type: "button", className: "!w-auto", loading: creatingExport, disabled: creatingExport, onClick: handleCreateExport, children: "+ New export" }))] }), _jsx("p", { className: "text-xs text-text-muted mb-3", children: "Exports messages (narrowed to this matter\u2019s own date range), plus full contacts, calendar events, tasks, and notes, from every custodian mailbox actually assigned to this matter\u2019s escrow scope, as one combined NDJSON file." }), exportError && _jsx(Alert, { children: exportError }), exportRequests.loadError && _jsx(Alert, { children: exportRequests.loadError }), matterExportRequests.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: exportRequests.loading ? "Loading…" : "No export requests yet." })) : (_jsx("ul", { className: "flex flex-col gap-2", children: matterExportRequests.map((request) => (_jsxs("li", { className: "flex items-center justify-between gap-3 text-sm py-1.5 px-3 bg-surface-alt rounded-sm", children: [_jsxs("span", { children: [new Date(request.dateCreated).toLocaleString(), request.status === "failed" && request.errorMessage && (_jsxs("span", { className: "text-danger", children: [" \u2014 ", request.errorMessage] }))] }), _jsxs("span", { className: "flex items-center gap-3", children: [_jsx("span", { className: `text-xs font-bold uppercase tracking-wide py-0.5 px-2 rounded-pill ${statusBadgeClass(request.status)}`, children: statusLabel(request.status) }), !matter.closedAt && request.status === "ready" && (_jsx("a", { href: matterExportRequestDownloadUrl(request.uid), className: "text-primary-dark hover:underline font-medium", children: "Download" }))] })] }, request.uid))) }))] }), _jsxs("div", { className: "bg-surface border border-border rounded-md p-6", children: [_jsx("h2", { className: "text-base font-bold uppercase tracking-wide mb-3", children: "Search this matter\u2019s custodians" }), matter.closedAt ? (_jsx("p", { className: "text-sm text-text-muted", children: "This matter is closed, so its custodians can no longer be searched or exported." })) : (_jsxs("form", { onSubmit: handleSearch, className: "flex gap-3 mb-4", children: [_jsx("input", { "aria-label": "Search this matter", className: INPUT_CLASS, value: searchText, onChange: (e) => setSearchText(e.target.value), placeholder: "Free text or an operator filter, e.g. from:alice@example.com" }), _jsx(Button, { type: "submit", className: "!w-auto shrink-0", loading: searching, disabled: searching || !searchText.trim(), children: "Search" })] })), searchError && _jsx(Alert, { children: searchError }), searchResults &&
-                        (Object.keys(searchResults).length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No custodian mailboxes could be searched." })) : (_jsx("div", { className: "flex flex-col gap-4", children: Object.entries(searchResults).map(([mailboxUid, page]) => (_jsxs("div", { children: [_jsx("h3", { className: "text-sm font-semibold mb-2", children: mailboxUid }), page.results.length === 0 ? (_jsx("p", { className: "text-xs text-text-muted", children: "No matches." })) : (_jsx("ul", { className: "flex flex-col gap-1", children: page.results.map((result) => (_jsxs("li", { className: "text-sm py-1 px-2 bg-surface-alt rounded-sm", children: [result.entityType, " \u00B7 ", result.entityUid, result.snippet && _jsxs("span", { className: "text-text-muted", children: [" \u2014 ", result.snippet] })] }, `${result.entityType}-${result.entityUid}`))) }))] }, mailboxUid))) })))] }), _jsxs(Modal, { open: confirmingClose, onClose: closeCloseModal, title: "Close matter", children: [_jsxs("p", { className: "text-sm mb-3", children: ["Close ", _jsx("strong", { children: matter.name }), "? Once closed, no new access requests, exports, searches, or key material reads are allowed under it. This cannot be reopened here."] }), _jsxs("dl", { className: "grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-sm mb-4", children: [_jsx("dt", { className: "text-text-muted", children: "Custodians" }), _jsx("dd", { className: "break-all", children: matter.custodianMailboxUids.join(", ") }), _jsx("dt", { className: "text-text-muted", children: "Date range" }), _jsx("dd", { children: formatDateRange(matter) })] }), closeError && _jsx(Alert, { children: closeError }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: closing, onClick: closeCloseModal, children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto !bg-none !bg-danger !border-danger hover:!bg-danger", loading: closing, disabled: closing, onClick: handleClose, children: "Close matter" })] })] }), _jsxs(Modal, { open: approveTarget !== null, onClose: () => setApproveTarget(null), title: "Approve access request", children: [_jsx("p", { className: "text-sm mb-3", children: "Approving lets holders of this matter\u2019s escrow scope read the key material for this mailbox once enough holders have approved." }), _jsxs("dl", { className: "grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-sm mb-4", children: [_jsx("dt", { className: "text-text-muted", children: "Matter" }), _jsx("dd", { children: matter.name }), _jsx("dt", { className: "text-text-muted", children: "Mailbox" }), _jsx("dd", { className: "break-all", children: approveTarget?.mailboxUid }), _jsx("dt", { className: "text-text-muted", children: "Date range" }), _jsx("dd", { children: formatDateRange(matter) }), _jsx("dt", { className: "text-text-muted", children: "Approvals" }), _jsxs("dd", { children: [approveTarget?.approvals.length, " of ", approveTarget?.requiredHoldersAtCreation, " so far, including requester ", approveTarget?.requestedByUserUid] })] }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => setApproveTarget(null), children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto", onClick: () => void handleApprove(), children: "Approve request" })] })] }), _jsxs(Modal, { open: denyTarget !== null, onClose: () => setDenyTarget(null), title: "Deny access request", children: [_jsxs("p", { className: "text-sm mb-3", children: ["Denying refuses this request for good: it can\u2019t be approved afterwards, and holders can\u2019t read the key material for mailbox ", _jsx("span", { className: "break-all font-semibold", children: denyTarget?.mailboxUid }), " through it. A new request has to be made to ask again."] }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => setDenyTarget(null), children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto !bg-none !bg-danger !border-danger hover:!bg-danger", onClick: () => void handleDeny(), children: "Deny request" })] })] }), _jsx(Modal, { open: showNewRequest, onClose: () => setShowNewRequest(false), title: "New access request", children: _jsxs("form", { onSubmit: handleCreateRequest, className: "flex flex-col gap-4", children: [newRequestError && _jsx(Alert, { children: newRequestError }), _jsx(FormField, { label: "Mailbox uid", htmlFor: "newRequestMailboxUid", children: _jsx("input", { id: "newRequestMailboxUid", type: "text", className: INPUT_CLASS, value: newRequestMailboxUid, onChange: (e) => setNewRequestMailboxUid(e.target.value) }) }), _jsx("p", { className: "text-xs text-text-muted", children: "Must be one of this matter's own custodian mailboxes, currently assigned to this matter's escrow scope. Your own creation counts as the first approval." }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: creatingRequest, onClick: () => setShowNewRequest(false), children: "Cancel" }), _jsx(Button, { type: "submit", className: "!w-auto", loading: creatingRequest, disabled: creatingRequest, children: "Create request" })] })] }) }), _jsx(Modal, { open: materialFor !== null, onClose: closeMaterialModal, title: "Escrow key material", children: loadingMaterial ? (_jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" })) : materialError ? (_jsx(Alert, { children: materialError })) : (_jsxs(_Fragment, { children: [_jsxs("p", { className: "text-sm text-text-muted mb-3", children: ["Still-encrypted master key wraps for ", _jsx("strong", { children: materialFor?.mailboxUid }), " \u2014 this server cannot decrypt these either. Copy the JSON below into your own offline tooling."] }), _jsx("pre", { className: "text-xs font-mono bg-surface-alt border border-border rounded-sm p-3 overflow-x-auto whitespace-pre-wrap break-all", children: materialText })] })) })] }));
+                        (Object.keys(searchResults).length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No custodian mailboxes could be searched." })) : (_jsx("div", { className: "flex flex-col gap-4", children: Object.entries(searchResults).map(([mailboxUid, page]) => (_jsxs("div", { children: [_jsx("h3", { className: "text-sm font-semibold mb-2", children: mailboxUid }), page.results.length === 0 ? (_jsx("p", { className: "text-xs text-text-muted", children: "No matches." })) : (_jsx("ul", { className: "flex flex-col gap-1", children: page.results.map((result) => (_jsxs("li", { className: "text-sm py-1 px-2 bg-surface-alt rounded-sm", children: [result.entityType, " \u00B7 ", result.entityUid, result.snippet && _jsxs("span", { className: "text-text-muted", children: [" \u2014 ", result.snippet] })] }, `${result.entityType}-${result.entityUid}`))) }))] }, mailboxUid))) })))] }), _jsxs(Modal, { open: confirmingClose, onClose: closeCloseModal, title: "Close matter", children: [_jsxs("p", { className: "text-sm mb-3", children: ["Close ", _jsx("strong", { children: matter.name }), "? Once closed, no new access requests, exports, searches, or key material reads are allowed under it. This cannot be reopened here."] }), _jsxs("dl", { className: "grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-sm mb-4", children: [_jsx("dt", { className: "text-text-muted", children: "Custodians" }), _jsx("dd", { className: "break-all", children: matter.custodianMailboxUids.join(", ") }), _jsx("dt", { className: "text-text-muted", children: "Date range" }), _jsx("dd", { children: formatDateRange(matter) })] }), closeError && _jsx(Alert, { children: closeError }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: closing, onClick: closeCloseModal, children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto !bg-none !bg-danger !border-danger hover:!bg-danger", loading: closing, disabled: closing, onClick: handleClose, children: "Close matter" })] })] }), _jsxs(Modal, { open: approveTarget !== null, onClose: () => setApproveTarget(null), title: "Approve access request", children: [_jsx("p", { className: "text-sm mb-3", children: "Approving lets holders of this matter\u2019s escrow scope read the key material for this mailbox once enough holders have approved." }), _jsxs("dl", { className: "grid grid-cols-[auto_1fr] gap-x-4 gap-y-1 text-sm mb-4", children: [_jsx("dt", { className: "text-text-muted", children: "Matter" }), _jsx("dd", { children: matter.name }), _jsx("dt", { className: "text-text-muted", children: "Mailbox" }), _jsx("dd", { className: "break-all", children: approveTarget?.mailboxUid }), _jsx("dt", { className: "text-text-muted", children: "Date range" }), _jsx("dd", { children: formatDateRange(matter) }), _jsx("dt", { className: "text-text-muted", children: "Approvals" }), _jsxs("dd", { children: [approveTarget?.approvals.length, " of ", approveTarget?.requiredHoldersAtCreation, " so far, including requester ", approveTarget?.requestedByUserUid] })] }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => setApproveTarget(null), children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto", onClick: () => void handleApprove(), children: "Approve request" })] })] }), _jsxs(Modal, { open: denyTarget !== null, onClose: () => setDenyTarget(null), title: "Deny access request", children: [_jsxs("p", { className: "text-sm mb-3", children: ["Denying refuses this request for good: it can\u2019t be approved afterwards, and holders can\u2019t read the key material for mailbox ", _jsx("span", { className: "break-all font-semibold", children: denyTarget?.mailboxUid }), " through it. A new request has to be made to ask again."] }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => setDenyTarget(null), children: "Cancel" }), _jsx(Button, { type: "button", className: "!w-auto !bg-none !bg-danger !border-danger hover:!bg-danger", onClick: () => void handleDeny(), children: "Deny request" })] })] }), _jsx(Modal, { open: showNewRequest, onClose: () => setShowNewRequest(false), title: "New access request", children: _jsxs("form", { onSubmit: handleCreateRequest, className: "flex flex-col gap-4", children: [newRequestError && _jsx(Alert, { children: newRequestError }), _jsx(FormField, { label: "Mailbox uid", htmlFor: "newRequestMailboxUid", children: _jsx("input", { id: "newRequestMailboxUid", type: "text", className: INPUT_CLASS, value: newRequestMailboxUid, onChange: (e) => setNewRequestMailboxUid(e.target.value) }) }), _jsx("p", { className: "text-xs text-text-muted", children: "Must be one of this matter's own custodian mailboxes, currently assigned to this matter's escrow scope. Your own creation counts as the first approval." }), _jsxs("div", { className: "flex gap-3 justify-end", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", disabled: creatingRequest, onClick: () => setShowNewRequest(false), children: "Cancel" }), _jsx(Button, { type: "submit", className: "!w-auto", loading: creatingRequest, disabled: creatingRequest, children: "Create request" })] })] }) }), _jsx(Modal, { open: materialFor !== null, onClose: closeMaterialModal, title: "Escrow key material", children: loadingMaterial ? (_jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" })) : materialError ? (_jsx(Alert, { children: materialError })) : (_jsxs(_Fragment, { children: [_jsxs("p", { className: "text-sm text-text-muted mb-3", children: ["Still-encrypted key material for ", _jsx("strong", { children: materialFor?.mailboxUid }), ": the escrow master key wrap, and the private keys that read its mail, sealed under that master key. This server cannot decrypt any of it either. Copy the JSON below into your own offline tooling."] }), _jsx("pre", { className: "text-xs font-mono bg-surface-alt border border-border rounded-sm p-3 overflow-x-auto whitespace-pre-wrap break-all", children: materialText })] })) })] }));
 }

package/dist/apps/shared/calendar/calendarReminders.d.ts

@@ -12,7 +12,21 @@ export interface CalendarReminderNotice {
     /** The event's own `location`, verbatim - `undefined`/`null` when the event has none. Not necessarily a URL;
      * see `joinMeetingUrl()` for when it's shown as a join link. */
     location?: string | null;
+    /** The event is of a calendar zero-access encryption protects, or was made from a zero-access invitation: `title` and `location` are
+     * placeholders (`openedReminder()`). */
+    protected?: boolean;
+    /** Set by `openedReminder()` on a protected notice it opened: the placeholder title the push carried, for anything recorded beyond
+     * this tab's memory (the notification history is kept in `sessionStorage` and outlives a mailbox lock). */
+    sealedTitle?: string;
+    /** Set with `sealedTitle`: the placeholder location the push carried, which `sealedReminder()` puts back. */
+    sealedLocation?: string | null;
 }
+/** `notice` with a protected event's real title and location, read from the event itself (opened with the mailbox's keys); `notice` as it
+ * came when the event can't be read or opened - the alarm still goes off, with the placeholder. Never rejects. */
+export declare function openedReminder(notice: CalendarReminderNotice): Promise<CalendarReminderNotice>;
+/** `notice` as the push carried it, when `openedReminder()` opened it - for an alarm still shown, or snoozed, when the mailbox locks: its real
+ * title and location go with the keys that opened them. `openedReminder()` opens it again (it is still `protected`). */
+export declare function sealedReminder(notice: CalendarReminderNotice): CalendarReminderNotice;
 /** A `notice.location` worth offering as a one-click "Join Meeting" link - a plain `http(s)://` URL and nothing
  * else (a room name, an address, free-text instructions are all real, common `location` values this must not
  * treat as a link). Trimmed first, so incidental whitespace never hides a real link. */