@rapidmx/web-client 0.35.0 → 0.37.0

package/dist/apps/shared/zeroAccess/useKeysLocked.js

@@ -0,0 +1,20 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useRef } from "react";
+import { subscribeKeySession } from "../../../lib/crypto/keySession.js";
+/**
+ * Calls `onLocked` with the mailbox whenever a mailbox's keys lock (the idle timeout, a lock from settings, signing out) - for a page that
+ * holds records it opened with them in its state: the opened-value caches are cleared on a lock, but a page's state is not, so it reloads
+ * (the reloaded records keep their placeholders) and closes what shows opened content. The latest `onLocked` is called; subscribed once.
+ */
+export function useKeysLocked(onLocked) {
+    const latest = useRef(onLocked);
+    latest.current = onLocked;
+    useEffect(() => subscribeKeySession(({ mailboxUid, state }) => {
+        if (state === "locked") {
+            latest.current(mailboxUid);
+        }
+    }), []);
+}

package/dist/apps/shared/zeroAccess/useOpenedRecord.d.ts

@@ -0,0 +1,18 @@
+import { type SealedRecord } from "../../../lib/zeroAccess/sealedRecords.js";
+/**
+ * `record` with all its protected fields opened (`openSealedRecord()`), for a view that shows or edits every field - a list opens only
+ * what it shows. `ready` is false while a protected record is first being opened; `record` is the one given meanwhile, and the given one
+ * again when it can't be opened (the mailbox is locked).
+ *
+ * A new object for the same record (same `uid`) keeps the opened one ready while it is opened in turn, so a form over it isn't unmounted by
+ * a live update (its in-progress edits kept); the new one - its new `version` - takes over once opened. The record's mailbox locking drops
+ * what was opened at once (nothing opened outlives its key session) and opens it again, which gives the placeholders; its unlocking opens it
+ * again too.
+ *
+ * `open` opens it, `openSealedRecord()` unless a kind of record has its own full open (a calendar event's `fullyOpenedEvent()`, which keeps
+ * the title opened from its sealed content) - a function defined once, not per render, so the record isn't opened again on every render.
+ */
+export declare function useOpenedRecord<T extends SealedRecord>(record: T | undefined, open?: (record: T) => Promise<T>): {
+    record: T | undefined;
+    ready: boolean;
+};

package/dist/apps/shared/zeroAccess/useOpenedRecord.js

@@ -0,0 +1,66 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useState } from "react";
+import { subscribeKeySession } from "../../../lib/crypto/keySession.js";
+import { isProtectedRecord, openSealedRecord } from "../../../lib/zeroAccess/sealedRecords.js";
+/** The record's `uid`, when it has one - a new object for the same record (a live update, the page's own reload) is the same record. */
+function uidOf(record) {
+    return record?.uid;
+}
+/**
+ * `record` with all its protected fields opened (`openSealedRecord()`), for a view that shows or edits every field - a list opens only
+ * what it shows. `ready` is false while a protected record is first being opened; `record` is the one given meanwhile, and the given one
+ * again when it can't be opened (the mailbox is locked).
+ *
+ * A new object for the same record (same `uid`) keeps the opened one ready while it is opened in turn, so a form over it isn't unmounted by
+ * a live update (its in-progress edits kept); the new one - its new `version` - takes over once opened. The record's mailbox locking drops
+ * what was opened at once (nothing opened outlives its key session) and opens it again, which gives the placeholders; its unlocking opens it
+ * again too.
+ *
+ * `open` opens it, `openSealedRecord()` unless a kind of record has its own full open (a calendar event's `fullyOpenedEvent()`, which keeps
+ * the title opened from its sealed content) - a function defined once, not per render, so the record isn't opened again on every render.
+ */
+export function useOpenedRecord(record, open = openSealedRecord) {
+    const [opened, setOpened] = useState(undefined);
+    const [generation, setGeneration] = useState(0);
+    const protectedRecord = isProtectedRecord(record);
+    const mailboxUid = record?.mailboxUid;
+    useEffect(() => {
+        if (!mailboxUid || !protectedRecord) {
+            return;
+        }
+        return subscribeKeySession((event) => {
+            if (event.mailboxUid !== mailboxUid) {
+                return;
+            }
+            if (event.state === "locked") {
+                setOpened(undefined);
+            }
+            setGeneration((current) => current + 1);
+        });
+    }, [mailboxUid, protectedRecord]);
+    useEffect(() => {
+        if (!record || !protectedRecord) {
+            return;
+        }
+        let cancelled = false;
+        void open(record).then((result) => {
+            if (!cancelled) {
+                setOpened({ from: record, record: result });
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [record, protectedRecord, generation, open]);
+    if (!record || !protectedRecord) {
+        return { record, ready: true };
+    }
+    if (opened?.from === record) {
+        return { record: opened.record, ready: true };
+    }
+    const uid = uidOf(record);
+    return opened && uid !== undefined && uidOf(opened.from) === uid ? { record: opened.record, ready: true } : { record, ready: false };
+}

package/dist/apps/www/_shell.d.ts

@@ -23,4 +23,4 @@ export type WwwShellProps = PropsWithChildren<Omit<AppShellProps, "active">>;
  * app. Anything else - Mail's `/` and `/messages/:uid` - is Mail.
  */
 export declare function activeAppOf(route: string): AppShellActive;
-export default function WwwShell({ children, userUid, authServerUrl, impersonating, impersonationBaseUrl, trusted, trustedRoles, pluginNav, branding, appearance, }: WwwShellProps): React.JSX.Element;
+export default function WwwShell({ children, userUid, authServerUrl, impersonating, impersonationBaseUrl, trusted, trustedRoles, pluginNav, branding, appearance, signOutHost, }: WwwShellProps): React.JSX.Element;

package/dist/apps/www/_shell.js

@@ -16,7 +16,7 @@ export function activeAppOf(route) {
     const app = route.split("/")[1];
     return app === "calendar" || app === "contacts" || app === "tasks" || app === "settings" ? app : "mail";
 }
-export default function WwwShell({ children, userUid, authServerUrl, impersonating, impersonationBaseUrl, trusted, trustedRoles, pluginNav, branding, appearance, }) {
+export default function WwwShell({ children, userUid, authServerUrl, impersonating, impersonationBaseUrl, trusted, trustedRoles, pluginNav, branding, appearance, signOutHost, }) {
     const { route, pending } = useRouter();
     const [takeovers, setTakeovers] = useState(0);
     const enterTakeover = useCallback(() => {
@@ -27,5 +27,5 @@ export default function WwwShell({ children, userUid, authServerUrl, impersonati
     // The content region is what a page load would have started at: focus it (it is only focusable by script), start at the top, and say the
     // page's title - without the unread count that the tab's title carries in front of it.
     useNavigationEffects({ focus: "#app-content", scroll: "top", announce: ({ title }) => titleWithUnread(title, 0) });
-    return (_jsx(AppFrameContext.Provider, { value: frame, children: _jsx(AppChrome, { active: activeAppOf(route), busy: pending, hideChrome: takeovers > 0, userUid: userUid, authServerUrl: authServerUrl, impersonating: impersonating, impersonationBaseUrl: impersonationBaseUrl, trusted: trusted, trustedRoles: trustedRoles, pluginNav: pluginNav, branding: branding, appearance: appearance, children: children }) }));
+    return (_jsx(AppFrameContext.Provider, { value: frame, children: _jsx(AppChrome, { active: activeAppOf(route), busy: pending, hideChrome: takeovers > 0, userUid: userUid, authServerUrl: authServerUrl, impersonating: impersonating, impersonationBaseUrl: impersonationBaseUrl, trusted: trusted, trustedRoles: trustedRoles, pluginNav: pluginNav, branding: branding, appearance: appearance, signOutHost: signOutHost, children: children }) }));
 }

package/dist/apps/www/calendar/index.js

@@ -12,16 +12,20 @@ import { addDays, addMonths, addWeeks, eachDayOfInterval, endOfDay, endOfMonth,
 import { ApiRequestError } from "../../../lib/util/api.js";
 import { useApiClient } from "../../../lib/util/apiClientContext.js";
 import useIsMobile from "../../../lib/util/useIsMobile.js";
-import { getCalendarEvent, listCalendarEvents } from "../../../lib/calendar/calendarApi.js";
+import { fullyOpenedEvent, getCalendarEvent, listCalendarEvents } from "../../../lib/calendar/calendarApi.js";
+import { isOpenedRecord, isProtectedRecord } from "../../../lib/zeroAccess/sealedRecords.js";
+import { isSealedRecord } from "../../../lib/zeroAccess/sealedMoves.js";
+import { useKeysLocked } from "../../shared/zeroAccess/useKeysLocked.js";
+import { openSealedEvent, openSealedEvents } from "../../shared/calendar/sealedEvents.js";
 import { useFolderLiveUpdates } from "../../shared/live/useFolderLiveUpdates.js";
-import { moveOccurrence, resizeOccurrenceEnd } from "../../../lib/calendar/calendarMutations.js";
+import { SealedOccurrenceError, moveOccurrence, resizeOccurrenceEnd } from "../../../lib/calendar/calendarMutations.js";
 import { resolveDragAction } from "../../../lib/calendar/calendarDragIds.js";
 import { createFolder } from "../../../lib/mail/mailApi.js";
 import { expandAllOccurrences, expandOccurrences } from "../../../lib/calendar/recurrence.js";
 import { useDayKey } from "../../../lib/calendar/useDayKey.js";
-import { allOccurrences, initialMatchIndex, occurrencesInRange, searchOccurrences, searchTerms, stepSequenceIndex } from "../../../lib/calendar/eventSearch.js";
+import { allOccurrences, initialMatchIndex, occurrencesInRange, searchOccurrences, searchTerms, stepSequenceIndex, } from "../../../lib/calendar/eventSearch.js";
 import Drawer from "../../../lib/components/overlays/Drawer.js";
-import CalendarShell, { useCalendarShell } from "../../shared/components/calendar/layout/CalendarShell.js";
+import CalendarShell, { useCalendarShell, } from "../../shared/components/calendar/layout/CalendarShell.js";
 import CalendarListSidebar from "../../shared/components/calendar/CalendarListSidebar.js";
 import CalendarSearchBox from "../../shared/components/calendar/CalendarSearchBox.js";
 import { ActiveOccurrenceContext } from "../../shared/components/calendar/activeOccurrence.js";
@@ -37,7 +41,7 @@ import SplitDayView from "../../shared/components/calendar/SplitDayView.js";
 import TimeGridView from "../../shared/components/calendar/TimeGridView.js";
 import Alert from "../../../lib/components/feedback/Alert.js";
 import Button from "../../../lib/components/buttons/Button.js";
-import { CALENDAR_VIEWS, getStoredCalendarView, isCalendarView, storeCalendarView } from "../../shared/components/calendar/calendarView.js";
+import { CALENDAR_VIEWS, getStoredCalendarView, isCalendarView, storeCalendarView, } from "../../shared/components/calendar/calendarView.js";
 import { SWIPE_PERIOD_SHIFT } from "../../shared/components/calendar/swipeNavigation.js";
 import { nextHalfHour } from "../../shared/components/calendar/timePicker.js";
 import { useSwipeSlide } from "../../shared/gestures/useSwipeSlide.js";
@@ -47,6 +51,8 @@ import { SHORTCUTS } from "../../shared/keyboard/keymap.js";
 import { useShortcut } from "../../shared/keyboard/useShortcut.js";
 import { useShortcutProps } from "../../shared/keyboard/useShortcutProps.js";
 import { notifyApiError } from "../../shared/notifications/apiErrors.js";
+import { notify } from "../../shared/notifications/store.js";
+import { KeysLockedError } from "../../../lib/crypto/masterKey.js";
 import { bookingSettingsHref } from "../../shared/calendar/bookingPlugin.js";
 import { changedEventOf } from "../../shared/calendar/calendarLiveUpdates.js";
 /** The push client channel group (`PushClient.setChannels()`) the page's calendars are subscribed under. */
@@ -56,7 +62,14 @@ const MAX_DATE_MS = 8.64e15;
 function CalendarPage(props) {
     return (_jsx(CalendarShell, { ...props, children: _jsx(CalendarContent, { userUid: props.userUid, bookingHref: bookingSettingsHref(props.pluginNav) }) }));
 }
-const VIEW_LABELS = { list: "List", month: "Month", week: "Week", workWeek: "Work Week", day: "Day", split: "Split" };
+const VIEW_LABELS = {
+    list: "List",
+    month: "Month",
+    week: "Week",
+    workWeek: "Work Week",
+    day: "Day",
+    split: "Split",
+};
 /** The shortcut that switches to a view (Outlook's Ctrl+Alt+1-4, the List one more); the split view has none. */
 const VIEW_SHORTCUTS = {
     list: SHORTCUTS.calendar.list,
@@ -66,7 +79,7 @@ const VIEW_SHORTCUTS = {
     month: SHORTCUTS.calendar.month,
 };
 /** One of the view switcher's buttons, with its shortcut in the tooltip. */
-function ViewButton({ view, current, onSelect }) {
+function ViewButton({ view, current, onSelect, }) {
     const shortcut = VIEW_SHORTCUTS[view];
     const hint = useShortcutProps(VIEW_LABELS[view], shortcut ?? SHORTCUTS.calendar.day, !!shortcut);
     return (_jsx("button", { type: "button", onClick: () => onSelect(view), ...hint, className: [
@@ -198,7 +211,7 @@ function CalendarContent({ userUid, bookingHref }) {
         }
         setLoading(true);
         setError(null);
-        void Promise.allSettled(targets.map((f) => listCalendarEvents(f.uid, client)))
+        void Promise.allSettled(targets.map((f) => listCalendarEvents(f.uid, client).then(openSealedEvents)))
             .then((results) => {
             if (seq !== reloadSeqRef.current) {
                 return;
@@ -237,7 +250,10 @@ function CalendarContent({ userUid, bookingHref }) {
     }
     // Keyed on stable string summaries (not the array/set objects themselves, which are new references
     // every render) so this only re-fires when the actual set of folders to fetch changes.
-    const calendarFolderUidsKey = calendarFolders.map((f) => f.uid).sort().join(",");
+    const calendarFolderUidsKey = calendarFolders
+        .map((f) => f.uid)
+        .sort()
+        .join(",");
     const checkedFolderUidsKey = Array.from(checkedFolderUids).sort().join(",");
     useEffect(reload, [calendarFolderUidsKey, checkedFolderUidsKey]);
     // An event that somebody creates, changes or deletes is announced on the push connection - a private or confidential one as its busy block, whatever the
@@ -254,7 +270,9 @@ function CalendarContent({ userUid, bookingHref }) {
             setEvents((previous) => previous.filter((existing) => existing.uid !== uid));
             return;
         }
-        void getCalendarEvent(uid, client).then((fresh) => {
+        void getCalendarEvent(uid, client)
+            .then(openSealedEvent)
+            .then((fresh) => {
             if (checkedFolderUidsRef.current.has(fresh.folderUid)) {
                 setEvents((previous) => previous.some((existing) => existing.uid === fresh.uid)
                     ? previous.map((existing) => (existing.uid === fresh.uid ? fresh : existing))
@@ -282,11 +300,41 @@ function CalendarContent({ userUid, bookingHref }) {
     // Today moves on at midnight: the List's "from today on" is worked out again then (`listDay` is only a dependency).
     const listDay = useDayKey();
     const dayOfList = view === "list" ? listDay : "";
+    // A search matches descriptions too, which a list leaves sealed (`EVENT_LIST_FIELDS`): the protected events are opened in full once one
+    // runs, and searched as they are until then.
+    const [searchable, setSearchable] = useState(null);
+    useEffect(() => {
+        if (!searching || !events.some((event) => isProtectedRecord(event) && !isOpenedRecord(event))) {
+            return;
+        }
+        let cancelled = false;
+        void Promise.all(events.map((event) => fullyOpenedEvent(event))).then((opened) => {
+            if (!cancelled) {
+                setSearchable({ from: events, events: opened });
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [events, searching]);
+    const searchedEvents = searchable?.from === events ? searchable.events : events;
+    // The calendar holds protected events opened with their mailboxes' keys: a lock of one takes them off screen - read again with their
+    // placeholders, the search's fully opened copies dropped, and an open card or form of a protected event closed - its own mailbox's
+    // lock closes it too when it isn't one of the listed events (opened from a reminder, its calendar unchecked).
+    useKeysLocked((locked) => {
+        const listed = events.some((event) => event.mailboxUid === locked);
+        setModal((current) => current?.occurrence && isSealedRecord(current.occurrence) && (listed || current.occurrence.mailboxUid === locked) ? null : current);
+        if (!listed) {
+            return;
+        }
+        reload();
+        setSearchable(null);
+    });
     const matches = useMemo(() => {
-        const found = searching ? searchOccurrences(events, query) : [];
+        const found = searching ? searchOccurrences(searchedEvents, query) : [];
         const today = new Date();
         return view === "list" ? found.filter((occurrence) => isUpcoming(occurrence, today)) : found;
-    }, [events, query, searching, view, dayOfList]);
+    }, [searchedEvents, query, searching, view, dayOfList]);
     const activeIndex = matches.findIndex((m) => m.occurrenceKey === activeKey);
     // What an open event card steps through, in order: the matches while a search runs, else every event of the checked calendars (bounded as a
     // search is). The List holds only what is from today on, so that is all its card steps through. Worked out only when something needs it.
@@ -305,7 +353,9 @@ function CalendarContent({ userUid, bookingHref }) {
         if (view === "list") {
             return sequence;
         }
-        return searching ? occurrencesInRange(matches, rangeStart, rangeEnd) : expandAllOccurrences(events, rangeStart, rangeEnd);
+        return searching
+            ? occurrencesInRange(matches, rangeStart, rangeEnd)
+            : expandAllOccurrences(events, rangeStart, rangeEnd);
     }, [events, matches, searching, view, sequence, rangeStart, rangeEnd]);
     /** Points at `match`, moving the view to the day it is on unless the view already shows it. */
     function showMatch(match) {
@@ -354,7 +404,9 @@ function CalendarContent({ userUid, bookingHref }) {
             searchedQueryRef.current = query;
             // The List holds every match: it starts at the first from the day being viewed on rather than the first of all.
             const from = startOfDay(viewDate);
-            showMatch(matches[view === "list" ? initialMatchIndex(matches, from, rangeEnd, from) : initialMatchIndex(matches, rangeStart, rangeEnd, from)]);
+            showMatch(matches[view === "list"
+                ? initialMatchIndex(matches, from, rangeEnd, from)
+                : initialMatchIndex(matches, rangeStart, rangeEnd, from)]);
         }
     }, [matches, query, searching]);
     const splitColumns = useMemo(() => calendarFolders
@@ -407,7 +459,9 @@ function CalendarContent({ userUid, bookingHref }) {
     // Brings the match being pointed at into sight (the views scroll their own hours; the page may too).
     useEffect(() => {
         const marked = Array.from(swipe.ref.current.querySelectorAll("[data-occurrence-key]"));
-        marked.find((el) => el.dataset.occurrenceKey === activeKey)?.scrollIntoView({ block: "nearest", inline: "nearest" });
+        marked
+            .find((el) => el.dataset.occurrenceKey === activeKey)
+            ?.scrollIntoView({ block: "nearest", inline: "nearest" });
     }, [activeKey, view === "list" ? null : viewDate, view, loading]);
     // The List scrolls to `viewDate` when this changes (Today, a day picked in the mini calendar), even when it is the date it already has.
     const [jumpNonce, setJumpNonce] = useState(0);
@@ -461,10 +515,12 @@ function CalendarContent({ userUid, bookingHref }) {
         const requestedStart = new Date(params.get("start") ?? "");
         navigateTo("/calendar", { replace: true });
         getCalendarEvent(eventUid, client)
+            .then(openSealedEvent)
             .then((event) => {
             const from = isNaN(requestedStart.getTime()) ? new Date(event.startDate) : requestedStart;
             const candidates = expandOccurrences(event, new Date(from.getTime() - 86400000), new Date(from.getTime() + 86400000));
-            const match = candidates.find((occurrence) => new Date(occurrence.startDate).getTime() === from.getTime()) ?? candidates[0];
+            const match = candidates.find((occurrence) => new Date(occurrence.startDate).getTime() === from.getTime()) ??
+                candidates[0];
             if (match) {
                 setViewDate(occurrenceDay(match));
                 openEvent(match);
@@ -515,7 +571,14 @@ function CalendarContent({ userUid, bookingHref }) {
             reload();
         }
         catch (err) {
-            notifyApiError(err, action.type === "move" ? "Couldn't move the event" : "Couldn't resize the event");
+            const context = action.type === "move" ? "Couldn't move the event" : "Couldn't resize the event";
+            if (err instanceof KeysLockedError || err instanceof SealedOccurrenceError) {
+                // A protected occurrence while the mailbox is locked, or one of a zero-access invitation: nothing was written.
+                notify({ kind: "warning", title: context, message: err.message });
+            }
+            else {
+                notifyApiError(err, context);
+            }
             // A refused change (a 409 most of all) means the page holds a stale version: load again, or every later drag of this event fails the same way.
             reload();
         }
@@ -535,12 +598,17 @@ function CalendarContent({ userUid, bookingHref }) {
     const writableMailboxes = useWritableMailboxes(mailboxes, userUid, modalMailboxUid);
     const mailboxOptions = useMemo(() => mailboxCalendars
         .filter((mc) => mc.calendarFolders.length > 0 && writableMailboxes.some((mb) => mb.uid === mc.mailbox.uid))
-        .map((mc) => ({ mailbox: mc.mailbox, calendars: mc.calendarFolders.map((f) => ({ uid: f.uid, name: f.name })) })), [mailboxCalendars, writableMailboxes]);
+        .map((mc) => ({
+        mailbox: mc.mailbox,
+        calendars: mc.calendarFolders.map((f) => ({ uid: f.uid, name: f.name })),
+    })), [mailboxCalendars, writableMailboxes]);
     const sidebarContent = (_jsxs(_Fragment, { children: [_jsx(MiniDatePicker, { selected: viewDate, onSelect: (date) => {
                     setViewDate(startOfDay(date));
                     setJumpNonce((n) => n + 1);
                 } }), _jsx(CalendarListSidebar, { mailboxCalendars: mailboxCalendars, checkedFolderUids: checkedFolderUids, onToggle: toggleCalendar, onAddCalendar: handleAddCalendar, colorFor: colorFor })] }));
-    return (_jsxs("div", { className: "flex-1 min-w-0 flex min-h-0", children: [_jsx("div", { className: "hidden lg:flex w-56 shrink-0 border-r border-border flex-col overflow-y-auto", children: sidebarContent }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Calendars", fullScreen: true, children: _jsx("div", { className: "flex flex-col", children: sidebarContent }) }), _jsxs("div", { className: "flex-1 min-w-0 flex flex-col min-h-0", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-2 p-3 border-b border-border shrink-0", children: [_jsx("button", { type: "button", className: "lg:hidden w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text shrink-0", "aria-label": "Open calendars", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), !isMobile && (_jsx(Button, { type: "button", onClick: (e) => openNewEvent(undefined, undefined, undefined, anchorOf(e.currentTarget, "below")), className: "!w-auto shrink-0", ...newEventHint, children: "+ New event" })), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { type: "button", onClick: () => shiftView(-1), "aria-label": "Previous", ...previousHint, className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u2039" }), _jsx("button", { type: "button", onClick: goToday, ...todayHint, className: "px-2 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "Today" }), _jsx("button", { type: "button", onClick: () => shiftView(1), "aria-label": "Next", ...nextHint, className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u203A" })] }), _jsx("h1", { className: "hidden md:block text-lg font-bold tracking-tight", children: title }), _jsx(CalendarSearchBox, { value: searchText, onChange: setSearchText, onSubmit: submitSearch, onClear: clearSearch, onPrevious: () => stepMatch(-1), onNext: () => stepMatch(1), active: searching, count: matches.length, position: activeIndex, inputRef: searchInputRef }), _jsx("div", { className: "flex flex-wrap gap-1", children: CALENDAR_VIEWS.map((v) => (_jsx(ViewButton, { view: v, current: view, onSelect: setView }, v))) })] }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), _jsx("div", { ref: swipe.ref, className: "flex-1 min-w-0 flex flex-col min-h-0 overflow-hidden", ...swipe.handlers, style: swipe.style, children: _jsx("div", { "data-swipe-phase": swipe.phase, className: "flex-1 min-w-0 flex flex-col min-h-0", style: swipe.contentStyle, children: _jsx("div", { className: "flex-1 min-w-0 flex flex-col min-h-0", style: wheelSlide.style, children: loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : (_jsx(ActiveOccurrenceContext.Provider, { value: searching ? activeKey : null, children: _jsx(DndContext, { sensors: sensors, onDragStart: () => setDragging(true), onDragEnd: handleDragEnd, onDragCancel: () => setDragging(false), children: view === "list" ? (_jsx(ListView, { occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, focusDate: viewDate, jumpNonce: jumpNonce, step: listStep })) : view === "month" ? (_jsx(MonthView, { viewDate: viewDate, occurrences: occurrences, folderColors: folderColors, onSelectDay: handleSelectDay, onSelectEvent: openEvent, onSelectSlot: (start, end, anchor) => openNewEvent(start, end, undefined, anchor, true) })) : view === "split" ? (_jsx(SplitDayView, { day: viewDate, columns: splitColumns, occurrences: occurrences, onSelectEvent: openEvent, onSelectSlot: (start, end, targetFolderUid, anchor) => openNewEvent(start, end, targetFolderUid, anchor) })) : (_jsx(TimeGridView, { days: days, occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, onSelectSlot: (start, end, anchor) => openNewEvent(start, end, undefined, anchor) })) }) })) }) }) }), modal && modalMailbox && (_jsx(EventModal, { open: true, onClose: closeModal, mailboxUid: modalMailbox.uid, folderUid: modalFolderUid, calendars: calendarFolders.filter((f) => f.mailboxUid === modalMailbox.uid).map((f) => ({ uid: f.uid, name: f.name })), mailboxOptions: mailboxOptions, folderColors: folderColors, organizerAddress: modalMailbox.primarySmtpAddress, organizerAliases: modalMailbox.aliasAddresses, occurrence: modal.occurrence, initialStart: modal.initialStart, initialEnd: modal.initialEnd, initialAllDay: modal.initialAllDay, anchor: modal.anchor, bookingHref: bookingHref, matchNav: modal.occurrence && sequence.length > 0
+    return (_jsxs("div", { className: "flex-1 min-w-0 flex min-h-0", children: [_jsx("div", { className: "hidden lg:flex w-56 shrink-0 border-r border-border flex-col overflow-y-auto", children: sidebarContent }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Calendars", fullScreen: true, children: _jsx("div", { className: "flex flex-col", children: sidebarContent }) }), _jsxs("div", { className: "flex-1 min-w-0 flex flex-col min-h-0", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-x-3 gap-y-2 p-3 border-b border-border shrink-0", children: [_jsx("button", { type: "button", className: "lg:hidden w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text shrink-0", "aria-label": "Open calendars", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), !isMobile && (_jsx(Button, { type: "button", onClick: (e) => openNewEvent(undefined, undefined, undefined, anchorOf(e.currentTarget, "below")), className: "!w-auto shrink-0", ...newEventHint, children: "+ New event" })), _jsxs("div", { className: "flex items-center gap-1", children: [_jsx("button", { type: "button", onClick: () => shiftView(-1), "aria-label": "Previous", ...previousHint, className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u2039" }), _jsx("button", { type: "button", onClick: goToday, ...todayHint, className: "px-2 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "Today" }), _jsx("button", { type: "button", onClick: () => shiftView(1), "aria-label": "Next", ...nextHint, className: "w-7 h-7 text-sm rounded-sm hover:bg-surface-alt", children: "\u203A" })] }), _jsx("h1", { className: "hidden md:block text-lg font-bold tracking-tight", children: title }), _jsx(CalendarSearchBox, { value: searchText, onChange: setSearchText, onSubmit: submitSearch, onClear: clearSearch, onPrevious: () => stepMatch(-1), onNext: () => stepMatch(1), active: searching, count: matches.length, position: activeIndex, inputRef: searchInputRef }), _jsx("div", { className: "flex flex-wrap gap-1", children: CALENDAR_VIEWS.map((v) => (_jsx(ViewButton, { view: v, current: view, onSelect: setView }, v))) })] }), error && (_jsx("div", { className: "p-3", children: _jsx(Alert, { children: error }) })), _jsx("div", { ref: swipe.ref, className: "flex-1 min-w-0 flex flex-col min-h-0 overflow-hidden", ...swipe.handlers, style: swipe.style, children: _jsx("div", { "data-swipe-phase": swipe.phase, className: "flex-1 min-w-0 flex flex-col min-h-0", style: swipe.contentStyle, children: _jsx("div", { className: "flex-1 min-w-0 flex flex-col min-h-0", style: wheelSlide.style, children: loading ? (_jsx("p", { className: "p-4 text-sm text-text-muted", children: "Loading\u2026" })) : (_jsx(ActiveOccurrenceContext.Provider, { value: searching ? activeKey : null, children: _jsx(DndContext, { sensors: sensors, onDragStart: () => setDragging(true), onDragEnd: handleDragEnd, onDragCancel: () => setDragging(false), children: view === "list" ? (_jsx(ListView, { occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, focusDate: viewDate, jumpNonce: jumpNonce, step: listStep })) : view === "month" ? (_jsx(MonthView, { viewDate: viewDate, occurrences: occurrences, folderColors: folderColors, onSelectDay: handleSelectDay, onSelectEvent: openEvent, onSelectSlot: (start, end, anchor) => openNewEvent(start, end, undefined, anchor, true) })) : view === "split" ? (_jsx(SplitDayView, { day: viewDate, columns: splitColumns, occurrences: occurrences, onSelectEvent: openEvent, onSelectSlot: (start, end, targetFolderUid, anchor) => openNewEvent(start, end, targetFolderUid, anchor) })) : (_jsx(TimeGridView, { days: days, occurrences: occurrences, folderColors: folderColors, onSelectEvent: openEvent, onSelectSlot: (start, end, anchor) => openNewEvent(start, end, undefined, anchor) })) }) })) }) }) }), modal && modalMailbox && (_jsx(EventModal, { open: true, onClose: closeModal, mailboxUid: modalMailbox.uid, folderUid: modalFolderUid, calendars: calendarFolders
+                            .filter((f) => f.mailboxUid === modalMailbox.uid)
+                            .map((f) => ({ uid: f.uid, name: f.name })), mailboxOptions: mailboxOptions, folderColors: folderColors, organizerAddress: modalMailbox.primarySmtpAddress, organizerAliases: modalMailbox.aliasAddresses, occurrence: modal.occurrence, initialStart: modal.initialStart, initialEnd: modal.initialEnd, initialAllDay: modal.initialAllDay, anchor: modal.anchor, bookingHref: bookingHref, matchNav: modal.occurrence && sequence.length > 0
                             ? {
                                 onPrevious: () => stepMatch(-1),
                                 onNext: () => stepMatch(1),
@@ -549,7 +617,7 @@ function CalendarContent({ userUid, bookingHref }) {
                                 noun: searching ? "match" : "event",
                                 slide,
                             }
-                            : undefined, onSaved: handleSaved, onDeleted: handleDeleted })), isMobile && mailboxUid && folderUid && !modal && _jsx(FloatingActionButton, { label: "New event", icon: HiOutlinePlus, onClick: () => openNewEvent() })] })] }));
+                            : undefined, onSaved: handleSaved, onDeleted: handleDeleted })), isMobile && mailboxUid && folderUid && !modal && (_jsx(FloatingActionButton, { label: "New event", icon: HiOutlinePlus, onClick: () => openNewEvent() }))] })] }));
 }
 export default CalendarPage;
 /** The tab's title: `Brand: Calendar` (see `pageTitle()`). */

package/dist/apps/www/contacts/index.js

@@ -7,7 +7,7 @@ import { pageTitle } from "../../shared/navigation/pageTitle.js";
 import { useNavigate } from "../../shared/navigation/index.js";
 import { useEffect, useMemo, useRef, useState } from "react";
 import { ApiRequestError } from "../../../lib/util/api.js";
-import { createContact, deleteContact, getContact, listContacts, ensureSuggestedContacts, listContactsInFolders, listDeletedContacts, setContactFavorite, updateContact, } from "../../../lib/contacts/contactsApi.js";
+import { createContact, deleteContact, getContact, CONTACT_LIST_FIELDS, CONTACT_MATCH_FIELDS, listContacts, ensureSuggestedContacts, listContactsInFolders, listDeletedContacts, setContactFavorite, updateContact, } from "../../../lib/contacts/contactsApi.js";
 import { VCARD_MAX_CHARS, VCARD_MAX_CONTACTS, contactsToVCardFile, contactToVCard, parseVCards } from "../../../lib/contacts/vcard.js";
 import { withoutDuplicates } from "../../shared/components/contacts/participantDetails.js";
 import useIsMobile from "../../../lib/util/useIsMobile.js";
@@ -34,6 +34,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)$/;
 /** The push client channel group (`PushClient.setChannels()`) the page's contacts folders are subscribed under. */
@@ -113,6 +115,7 @@ function ContactsContent({ userUid }) {
             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);
@@ -123,10 +126,24 @@ function ContactsContent({ userUid }) {
     useEffect(() => {
         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) => 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) {
         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);
     }
     // Asks the server to turn the people this mailbox has corresponded with into suggested contacts (it does so once for each person, so this is cheap when
@@ -158,7 +175,9 @@ function ContactsContent({ userUid }) {
             remove(change.uid);
             return;
         }
-        void getContact(change.uid, client).then((fresh) => {
+        void getContact(change.uid, client)
+            .then((fresh) => openSealedRecord(fresh, CONTACT_LIST_FIELDS))
+            .then((fresh) => {
             if (fresh.deleted === true) {
                 remove(fresh.uid);
             }
@@ -213,6 +232,7 @@ function ContactsContent({ userUid }) {
         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.
@@ -228,8 +248,8 @@ function ContactsContent({ userUid }) {
             .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) {
             case "all":
@@ -406,9 +426,17 @@ function ContactsContent({ userUid }) {
         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);
@@ -417,14 +445,30 @@ function ContactsContent({ userUid }) {
                 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();
     });
     // 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,
                     folderUid: folderUid,
@@ -445,11 +489,20 @@ function ContactsContent({ userUid }) {
                 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() {
-        downloadTextFile(checkedContacts.length === 1 ? `${checkedContacts[0].displayName}.vcf` : "contacts.vcf", checkedContacts.length === 1 ? contactToVCard(checkedContacts[0]) : contactsToVCardFile(checkedContacts));
+    async function handleExportVCard() {
+        // Exported in full: the list opened only what it shows.
+        const contacts = await openSealedRecords(checkedContacts);
+        downloadTextFile(contacts.length === 1 ? `${contacts[0].displayName}.vcf` : "contacts.vcf", contacts.length === 1 ? contactToVCard(contacts[0]) : contactsToVCardFile(contacts));
     }
     async function handleImportFile(file) {
         if (!mailboxUid || !folderUid) {
@@ -476,7 +529,7 @@ function ContactsContent({ userUid }) {
         // 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;
         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");

package/dist/apps/www/index.js

@@ -99,12 +99,28 @@ async function decryptEncryptedRows(messages, unlocked) {
     let securityModule;
     // A few at a time: each is a download and a public-key decryption.
     const entries = await mapWithConcurrency(encrypted, DECRYPT_CONCURRENCY, async (message) => {
+        // 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 = () => 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 ?? (securityModule = import("../../lib/crypto/messageSecurity.js")));
-            const security = await evaluateMessageSecurity(rawMime, unlocked);
+            const securityApi = await (securityModule ?? (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;