@rapidmx/web-client 0.2.0 → 0.3.1

package/dist/apps/escrow/audit-log/index.js

@@ -0,0 +1,66 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useState } from "react";
+import { apiFetch, ApiRequestError } from "@rapidmx/react-shared/util/api.js";
+import { listAuditLogEntries, verifyAuditChain, } from "@rapidmx/react-shared/admin/escrowAuditLogApi.js";
+import EscrowShell from "../../shared/components/escrow/layout/EscrowShell.js";
+import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
+import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+const PAGE_SIZE = 25;
+const ACTION_LABELS = {
+    "escrow_access_request.created": "Access request created",
+    "escrow_access_request.approved": "Access request approved",
+    "escrow_access_request.material_read": "Material read",
+};
+export default function EscrowAuditLogPage(props) {
+    return (_jsx(EscrowShell, { ...props, active: "auditLog", children: _jsx(EscrowAuditLogContent, {}) }));
+}
+function EscrowAuditLogContent() {
+    const [page, setPage] = useState(0);
+    const [entries, setEntries] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    // `GET /admin/release-notes` is the same side-effect-free trusted-role canary `AdminShell` itself
+    // uses (any `BaseAdminRoute` endpoint works — see that route's own doc comment) — reused here only to
+    // decide whether to show the "Verify chain integrity" button at all, not to gate this whole page the
+    // way `AdminShell` gates `apps/admin`. `EscrowAuditLogRoute.verify()` is `@RequiresTrustedRole()`-only
+    // server-side regardless of what this probe finds; hiding the button for a non-trusted holder just
+    // avoids an inevitable, confusing 403 on click, it isn't itself the enforcement.
+    const [isTrustedAdmin, setIsTrustedAdmin] = useState(false);
+    const [verifying, setVerifying] = useState(false);
+    const [verifyError, setVerifyError] = useState(null);
+    const [verifyResult, setVerifyResult] = useState(null);
+    useEffect(() => {
+        apiFetch("/admin/release-notes")
+            .then(() => setIsTrustedAdmin(true))
+            .catch(() => setIsTrustedAdmin(false));
+    }, []);
+    useEffect(() => {
+        setLoading(true);
+        setError(null);
+        listAuditLogEntries({ page, limit: PAGE_SIZE })
+            .then(setEntries)
+            .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Could not load the audit log."))
+            .finally(() => setLoading(false));
+    }, [page]);
+    async function handleVerify() {
+        setVerifying(true);
+        setVerifyError(null);
+        setVerifyResult(null);
+        try {
+            setVerifyResult(await verifyAuditChain());
+        }
+        catch (err) {
+            setVerifyError(err instanceof ApiRequestError ? err.message : "Could not verify the audit chain.");
+        }
+        finally {
+            setVerifying(false);
+        }
+    }
+    const hasNextPage = entries.length === PAGE_SIZE;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between mb-5", children: [_jsx("h1", { className: "text-xl font-bold uppercase tracking-wide", children: "Escrow audit log" }), isTrustedAdmin && (_jsx(Button, { type: "button", className: "!w-auto", loading: verifying, disabled: verifying, onClick: handleVerify, children: "Verify chain integrity" }))] }), _jsx("p", { className: "text-sm text-text-muted mb-5", children: "Every escrow access lifecycle event visible to you \u2014 matters under a scope you hold. A trusted administrator sees every entry across every scope instead." }), verifyError && _jsx(Alert, { children: verifyError }), verifyResult &&
+                (verifyResult.valid ? (_jsx("div", { className: "mb-5 py-3 px-3.5 rounded-sm text-sm bg-success/10 text-success font-medium", children: "Chain verified \u2014 no tampering detected." })) : (_jsxs(Alert, { children: ["Chain integrity broken at sequence ", verifyResult.brokenAtSequence, "."] }))), error && _jsx(Alert, { children: error }), loading ? (_jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" })) : entries.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No audit log entries visible to you yet." })) : (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm border-collapse", children: [_jsx("thead", { children: _jsx("tr", { children: ["Sequence", "Action", "Holder", "Mailbox", "Occurred"].map((h) => (_jsx("th", { className: "text-left text-xs uppercase tracking-wide text-text-muted py-2 px-2.5 border-b border-border", children: h }, h))) }) }), _jsx("tbody", { children: entries.map((entry) => (_jsxs("tr", { children: [_jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: entry.sequence }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: ACTION_LABELS[entry.action] }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: entry.holderUserUid }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: entry.mailboxUid }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: new Date(entry.occurredAt).toLocaleString() })] }, entry.uid))) })] }) })), _jsxs("div", { className: "flex gap-3 items-center mt-4", children: [_jsx(Button, { variant: "secondary", type: "button", className: "!w-auto", disabled: page === 0 || loading, onClick: () => setPage((p) => Math.max(0, p - 1)), children: "Previous" }), _jsxs("span", { className: "text-sm text-text-muted", children: ["Page ", page + 1] }), _jsx(Button, { variant: "secondary", type: "button", className: "!w-auto", disabled: !hasNextPage || loading, onClick: () => setPage((p) => p + 1), children: "Next" })] })] }));
+}

package/dist/apps/escrow/index.js

@@ -0,0 +1,31 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useState } from "react";
+import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
+import { listMatters } from "@rapidmx/react-shared/admin/mattersApi.js";
+import EscrowShell from "../shared/components/escrow/layout/EscrowShell.js";
+import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
+import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+const PAGE_SIZE = 25;
+export default function MattersPage(props) {
+    return (_jsx(EscrowShell, { ...props, active: "matters", children: _jsx(MattersContent, {}) }));
+}
+function MattersContent() {
+    const [page, setPage] = useState(0);
+    const [matters, setMatters] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        setLoading(true);
+        setError(null);
+        listMatters({ page, limit: PAGE_SIZE })
+            .then(setMatters)
+            .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Could not load matters."))
+            .finally(() => setLoading(false));
+    }, [page]);
+    const hasNextPage = matters.length === PAGE_SIZE;
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "flex items-center justify-between mb-5", children: [_jsx("h1", { className: "text-xl font-bold uppercase tracking-wide", children: "Matters" }), _jsx("a", { href: "/escrow/matters/new", children: _jsx(Button, { type: "button", className: "!w-auto", children: "+ New matter" }) })] }), _jsx("p", { className: "text-sm text-text-muted mb-5", children: "Only matters under an escrow scope you hold are ever shown here \u2014 this list is already scoped to you server-side." }), error && _jsx(Alert, { children: error }), loading ? (_jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" })) : matters.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No matters yet \u2014 either none exist under a scope you hold, or you don't currently hold any escrow scope." })) : (_jsx("div", { className: "overflow-x-auto", children: _jsxs("table", { className: "w-full text-sm border-collapse", children: [_jsx("thead", { children: _jsx("tr", { children: ["Name", "Custodians", "Date range", "Status", ""].map((h) => (_jsx("th", { className: "text-left text-xs uppercase tracking-wide text-text-muted py-2 px-2.5 border-b border-border", children: h }, h))) }) }), _jsx("tbody", { children: matters.map((matter) => (_jsxs("tr", { children: [_jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: matter.name }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: matter.custodianMailboxUids.length }), _jsxs("td", { className: "py-2.5 px-2.5 border-b border-border", children: [new Date(matter.dateRangeStart).toLocaleDateString(), " \u2013", " ", new Date(matter.dateRangeEnd).toLocaleDateString()] }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: matter.closedAt ? (_jsx("span", { className: "text-xs font-bold uppercase tracking-wide py-0.5 px-2 rounded-pill bg-surface-alt text-text-muted", children: "Closed" })) : (_jsx("span", { className: "text-xs font-bold uppercase tracking-wide py-0.5 px-2 rounded-pill bg-success text-white", children: "Open" })) }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border text-right", children: _jsx("a", { href: `/escrow/matters/${encodeURIComponent(matter.uid)}`, className: "text-primary-dark hover:underline font-medium", children: "View" }) })] }, matter.uid))) })] }) })), _jsxs("div", { className: "flex gap-3 items-center mt-4", children: [_jsx(Button, { variant: "secondary", type: "button", className: "!w-auto", disabled: page === 0 || loading, onClick: () => setPage((p) => Math.max(0, p - 1)), children: "Previous" }), _jsxs("span", { className: "text-sm text-text-muted", children: ["Page ", page + 1] }), _jsx(Button, { variant: "secondary", type: "button", className: "!w-auto", disabled: !hasNextPage || loading, onClick: () => setPage((p) => p + 1), children: "Next" })] })] }));
+}

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

@@ -0,0 +1,234 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useEffect, useState } from "react";
+import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
+import { closeMatter, getMatter } from "@rapidmx/react-shared/admin/mattersApi.js";
+import { approveAccessRequest, createAccessRequest, denyAccessRequest, getAccessRequestMaterial, listAccessRequests, } from "@rapidmx/react-shared/admin/escrowAccessRequestsApi.js";
+import { createMatterExportRequest, listMatterExportRequests, matterExportRequestDownloadUrl, } from "@rapidmx/react-shared/admin/matterExportApi.js";
+import { searchMatter } from "@rapidmx/react-shared/admin/matterSearchApi.js";
+import { parseSearchQuery } from "@rapidmx/react-shared/search/queryGrammar.js";
+import EscrowShell from "../../shared/components/escrow/layout/EscrowShell.js";
+import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
+import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+import FormField from "@rapidmx/react-shared/components/forms/FormField.js";
+import Modal from "@rapidmx/react-shared/components/overlays/Modal.js";
+const INPUT_CLASS = "w-full text-sm py-2.5 px-3 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
+// `BaseEscrowAccessRequestRoute.find()` always returns every request under every scope the caller holds
+// (it unconditionally overwrites any `matterId` filter with its own held-scopes-derived one — see
+// `escrowAccessRequestsApi.ts`'s own doc comment) — there is no server-side way to ask for just this one
+// matter's requests. This page fetches a generously-sized single page and filters client-side instead of
+// paginating a second, matter-scoped list UI on top of an already-scoped one; a holder with more than this
+// many *total* in-flight requests across every matter they hold is not the common case this v1 targets.
+const REQUESTS_FETCH_LIMIT = 200;
+function statusBadgeClass(status) {
+    if (status === "denied" || status === "failed")
+        return "bg-danger-bg text-danger";
+    if (status === "pending")
+        return "bg-surface-alt text-text-muted";
+    return "bg-success text-white";
+}
+export default function MatterDetailPage(props) {
+    return (_jsx(EscrowShell, { ...props, active: "matters", children: _jsx(MatterDetailContent, { uid: props.params.uid }) }));
+}
+function MatterDetailContent({ uid }) {
+    const [matter, setMatter] = useState(null);
+    const [requests, setRequests] = useState([]);
+    const [loading, setLoading] = useState(true);
+    const [error, setError] = useState(null);
+    const [closing, setClosing] = useState(false);
+    const [closeError, setCloseError] = useState(null);
+    const [showNewRequest, setShowNewRequest] = useState(false);
+    const [newRequestMailboxUid, setNewRequestMailboxUid] = useState("");
+    const [creatingRequest, setCreatingRequest] = useState(false);
+    const [newRequestError, setNewRequestError] = useState(null);
+    // Keyed by request uid — several rows can be independently mid-action at once.
+    const [actionErrors, setActionErrors] = useState({});
+    const [actingOn, setActingOn] = useState({});
+    const [materialFor, setMaterialFor] = useState(null);
+    const [materialText, setMaterialText] = useState("");
+    const [materialError, setMaterialError] = useState(null);
+    const [loadingMaterial, setLoadingMaterial] = useState(false);
+    const [exportRequests, setExportRequests] = useState([]);
+    const [creatingExport, setCreatingExport] = useState(false);
+    const [exportError, setExportError] = useState(null);
+    const [searchText, setSearchText] = useState("");
+    const [searching, setSearching] = useState(false);
+    const [searchError, setSearchError] = useState(null);
+    const [searchResults, setSearchResults] = useState(null);
+    // Same "no server-side single-matter filter, fetch a generous page and filter client-side" shape
+    // REQUESTS_FETCH_LIMIT's own doc comment already establishes for access requests -
+    // listMatterExportRequests() has the identical held-scopes-derived scoping, not a per-matter one.
+    function reload() {
+        setLoading(true);
+        setError(null);
+        Promise.all([getMatter(uid), listAccessRequests({ limit: REQUESTS_FETCH_LIMIT }), listMatterExportRequests()])
+            .then(([loadedMatter, allRequests, allExportRequests]) => {
+            setMatter(loadedMatter);
+            setRequests(allRequests.filter((r) => r.matterId === uid));
+            setExportRequests(allExportRequests.filter((r) => r.matterId === uid));
+        })
+            .catch((err) => setError(err instanceof ApiRequestError ? err.message : "Could not load this matter."))
+            .finally(() => setLoading(false));
+    }
+    useEffect(() => {
+        reload();
+    }, [uid]);
+    // Only ever invoked from the "Close matter" button below, which itself only renders once `matter` is
+    // resolved (children only render once loaded — see the early returns further down) — the non-null
+    // assertion reflects that real invariant, not an unchecked assumption. Matches `DomainDetailContent.
+    // handleVerify`'s identical pattern.
+    async function handleClose() {
+        setClosing(true);
+        setCloseError(null);
+        try {
+            const updated = await closeMatter(matter.uid);
+            setMatter(updated);
+        }
+        catch (err) {
+            setCloseError(err instanceof ApiRequestError ? err.message : "Could not close this matter.");
+        }
+        finally {
+            setClosing(false);
+        }
+    }
+    async function handleCreateRequest(e) {
+        e.preventDefault();
+        setNewRequestError(null);
+        if (!newRequestMailboxUid.trim()) {
+            setNewRequestError("A mailbox uid is required.");
+            return;
+        }
+        setCreatingRequest(true);
+        try {
+            await createAccessRequest({ matterId: uid, mailboxUid: newRequestMailboxUid.trim() });
+            setShowNewRequest(false);
+            setNewRequestMailboxUid("");
+            reload();
+        }
+        catch (err) {
+            setNewRequestError(err instanceof ApiRequestError ? err.message : "Could not create this access request.");
+        }
+        finally {
+            setCreatingRequest(false);
+        }
+    }
+    async function handleApprove(request) {
+        setActingOn((prev) => ({ ...prev, [request.uid]: true }));
+        setActionErrors((prev) => ({ ...prev, [request.uid]: "" }));
+        try {
+            const updated = await approveAccessRequest(request.uid);
+            setRequests((prev) => prev.map((r) => (r.uid === updated.uid ? updated : r)));
+        }
+        catch (err) {
+            setActionErrors((prev) => ({
+                ...prev,
+                [request.uid]: err instanceof ApiRequestError ? err.message : "Could not approve this request.",
+            }));
+        }
+        finally {
+            setActingOn((prev) => ({ ...prev, [request.uid]: false }));
+        }
+    }
+    async function handleDeny(request) {
+        setActingOn((prev) => ({ ...prev, [request.uid]: true }));
+        setActionErrors((prev) => ({ ...prev, [request.uid]: "" }));
+        try {
+            const updated = await denyAccessRequest(request.uid);
+            setRequests((prev) => prev.map((r) => (r.uid === updated.uid ? updated : r)));
+        }
+        catch (err) {
+            setActionErrors((prev) => ({
+                ...prev,
+                [request.uid]: err instanceof ApiRequestError ? err.message : "Could not deny this request.",
+            }));
+        }
+        finally {
+            setActingOn((prev) => ({ ...prev, [request.uid]: false }));
+        }
+    }
+    async function handleGetMaterial(request) {
+        setMaterialFor(request);
+        setMaterialText("");
+        setMaterialError(null);
+        setLoadingMaterial(true);
+        try {
+            const material = await getAccessRequestMaterial(request.uid);
+            setMaterialText(JSON.stringify(material.masterKeyWraps, null, 2));
+        }
+        catch (err) {
+            setMaterialError(err instanceof ApiRequestError ? err.message : "Could not read this request's material.");
+        }
+        finally {
+            setLoadingMaterial(false);
+        }
+    }
+    function closeMaterialModal() {
+        setMaterialFor(null);
+    }
+    async function handleCreateExport() {
+        setExportError(null);
+        setCreatingExport(true);
+        try {
+            await createMatterExportRequest(uid);
+            reload();
+        }
+        catch (err) {
+            setExportError(err instanceof ApiRequestError ? err.message : "Could not start this export.");
+        }
+        finally {
+            setCreatingExport(false);
+        }
+    }
+    async function handleSearch(e) {
+        e.preventDefault();
+        setSearchError(null);
+        setSearching(true);
+        try {
+            // Same "parse the operator grammar once, client-side, before hitting the server" convention
+            // apps/www/index.tsx's own inbox search already establishes - searchMatter()/buildSearchParams()
+            // expect the caller to have already extracted operators into discrete params, not embedded in
+            // the raw `q` text (see queryGrammar.ts's own doc comment). Passing the unparsed box text
+            // straight through, as this previously did, silently treated e.g. "from:alice@example.com" as
+            // four literal free-text words instead of a sender filter.
+            const parsed = parseSearchQuery(searchText);
+            const results = await searchMatter(uid, parsed.text, {
+                types: parsed.entityTypes,
+                from: parsed.from,
+                to: parsed.to,
+                cc: parsed.cc,
+                subject: parsed.subject,
+                hasAttachment: parsed.hasAttachment,
+                before: parsed.before,
+                after: parsed.after,
+                folderUid: parsed.folderUid,
+                flags: parsed.flags,
+                labels: parsed.labels,
+            });
+            setSearchResults(results);
+        }
+        catch (err) {
+            setSearchError(err instanceof ApiRequestError ? err.message : "Could not search this matter.");
+        }
+        finally {
+            setSearching(false);
+        }
+    }
+    if (loading) {
+        return _jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" });
+    }
+    if (error || !matter) {
+        return _jsx(Alert, { children: error ?? "Matter not found." });
+    }
+    return (_jsxs("div", { className: "max-w-4xl flex flex-col gap-5", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("a", { href: "/escrow", className: "text-sm text-primary-dark hover:underline", children: "\u2190 All matters" }), _jsx("h1", { className: "text-xl font-bold tracking-tight mt-1", children: matter.name })] }), !matter.closedAt && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto shrink-0", loading: closing, disabled: closing, onClick: handleClose, children: "Close matter" }))] }), closeError && _jsx(Alert, { children: closeError }), _jsx("div", { className: "bg-surface border border-border rounded-md p-6", children: _jsxs("dl", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-6 gap-y-3 text-sm", children: [_jsx("dt", { className: "text-text-muted", children: "Description" }), _jsx("dd", { children: matter.description ?? "None" }), _jsx("dt", { className: "text-text-muted", children: "Escrow scope" }), _jsx("dd", { className: "font-mono text-xs", children: matter.escrowScopeId }), _jsx("dt", { className: "text-text-muted", children: "Custodian mailboxes" }), _jsx("dd", { children: matter.custodianMailboxUids.join(", ") }), _jsx("dt", { className: "text-text-muted", children: "Date range" }), _jsxs("dd", { children: [new Date(matter.dateRangeStart).toLocaleDateString(), " \u2013", " ", new Date(matter.dateRangeEnd).toLocaleDateString()] }), _jsx("dt", { className: "text-text-muted", children: "Status" }), _jsx("dd", { children: matter.closedAt ? `Closed ${new Date(matter.closedAt).toLocaleString()}` : "Open" })] }) }), _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: "Access requests" }), !matter.closedAt && (_jsx(Button, { type: "button", className: "!w-auto", onClick: () => setShowNewRequest(true), children: "+ New access request" }))] }), requests.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No access requests yet." })) : (_jsx("ul", { className: "flex flex-col gap-3", children: requests.map((request) => (_jsxs("li", { className: "border border-border rounded-sm p-4", children: [_jsxs("div", { className: "flex items-center justify-between gap-3 flex-wrap", children: [_jsxs("div", { children: [_jsx("div", { className: "text-sm font-semibold", children: request.mailboxUid }), _jsxs("div", { className: "text-xs text-text-muted", children: [request.approvals.length, " of ", request.requiredHoldersAtCreation, " approvals \u00B7 requested by ", request.requestedByUserUid] })] }), _jsx("span", { className: [
+                                                "text-xs font-bold uppercase tracking-wide py-0.5 px-2 rounded-pill",
+                                                request.status === "denied"
+                                                    ? "bg-danger-bg text-danger"
+                                                    : request.status === "pending"
+                                                        ? "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: [request.status === "pending" && (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", className: "!w-auto", loading: actingOn[request.uid], disabled: actingOn[request.uid], onClick: () => handleApprove(request), children: "Approve" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: actingOn[request.uid], disabled: actingOn[request.uid], onClick: () => handleDeny(request), children: "Deny" })] })), (request.status === "approved" || request.status === "fulfilled") && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: () => handleGetMaterial(request), children: "Get material" }))] })] }, request.uid))) }))] }), _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" }), _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.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No export requests yet." })) : (_jsx("ul", { className: "flex flex-col gap-2", children: exportRequests.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: request.status }), 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" }), _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))) })))] }), _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 })] })) })] }));
+}

package/dist/apps/escrow/matters/new/index.js

@@ -0,0 +1,75 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { useState } from "react";
+import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
+import { toDatetimeLocal } from "@rapidmx/react-shared/util/dateInput.js";
+import { createMatter } from "@rapidmx/react-shared/admin/mattersApi.js";
+import EscrowShell from "../../../shared/components/escrow/layout/EscrowShell.js";
+import StringListField from "../../../shared/components/forms/StringListField.js";
+import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
+import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+import FormField from "@rapidmx/react-shared/components/forms/FormField.js";
+const INPUT_CLASS = "w-full text-sm py-2.5 px-3 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
+export default function NewMatterPage(props) {
+    return (_jsx(EscrowShell, { ...props, active: "matters", children: _jsx(NewMatterForm, {}) }));
+}
+function NewMatterForm() {
+    const [name, setName] = useState("");
+    const [description, setDescription] = useState("");
+    // No dropdown here: `EscrowScope` (BaseEscrowScopeRoute) is trusted-admin-only end to end, so this
+    // app has no holder-readable "list the scopes I hold" endpoint to populate one from — a holder is
+    // told their own escrowScopeId out of band by whichever admin granted them the role. Same
+    // "server fills a gap, or here, deliberately doesn't paper over one restapi itself doesn't expose"
+    // posture as `BaseEscrowInfoRoute`'s own doc comment on the mailbox-owner side of this feature.
+    const [escrowScopeId, setEscrowScopeId] = useState("");
+    const [custodianMailboxUids, setCustodianMailboxUids] = useState([]);
+    // Defaults to the last 24 hours rather than "now" for both ends - a `dateRangeStart === dateRangeEnd`
+    // default would always fail this form's own "start must be before end" check the instant it's opened,
+    // forcing every holder to touch both fields even when they'd otherwise leave one at its default.
+    const [dateRangeStart, setDateRangeStart] = useState(toDatetimeLocal(new Date(Date.now() - 24 * 60 * 60000).toISOString()));
+    const [dateRangeEnd, setDateRangeEnd] = useState(toDatetimeLocal(new Date().toISOString()));
+    const [error, setError] = useState(null);
+    const [saving, setSaving] = useState(false);
+    async function handleSubmit(e) {
+        e.preventDefault();
+        setError(null);
+        if (!name.trim()) {
+            setError("A name is required.");
+            return;
+        }
+        if (!escrowScopeId.trim()) {
+            setError("An escrow scope uid is required.");
+            return;
+        }
+        if (custodianMailboxUids.length === 0) {
+            setError("At least one custodian mailbox is required.");
+            return;
+        }
+        if (new Date(dateRangeStart).getTime() >= new Date(dateRangeEnd).getTime()) {
+            setError("The date range start must be before its end.");
+            return;
+        }
+        setSaving(true);
+        try {
+            const created = await createMatter({
+                name: name.trim(),
+                description: description.trim() || undefined,
+                escrowScopeId: escrowScopeId.trim(),
+                custodianMailboxUids,
+                dateRangeStart: new Date(dateRangeStart).toISOString(),
+                dateRangeEnd: new Date(dateRangeEnd).toISOString(),
+            });
+            window.location.href = `/escrow/matters/${encodeURIComponent(created.uid)}`;
+        }
+        catch (err) {
+            setError(err instanceof ApiRequestError ? err.message : "Could not create the matter.");
+        }
+        finally {
+            setSaving(false);
+        }
+    }
+    return (_jsxs("div", { className: "max-w-3xl", children: [_jsx("h1", { className: "text-xl font-bold uppercase tracking-wide mb-1", children: "New matter" }), _jsx("p", { className: "text-sm text-text-muted mb-5", children: "You must already be a holder of the escrow scope you name below \u2014 this server checks that at creation time, the same as every other action in this console." }), error && _jsx(Alert, { children: error }), _jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-5", children: [_jsxs("div", { className: "bg-surface border border-border rounded-md p-6", children: [_jsx(FormField, { label: "Name", htmlFor: "name", children: _jsx("input", { id: "name", type: "text", className: INPUT_CLASS, value: name, onChange: (e) => setName(e.target.value), placeholder: "Smith v. Acme" }) }), _jsx(FormField, { label: "Description (optional)", htmlFor: "description", children: _jsx("input", { id: "description", type: "text", className: INPUT_CLASS, value: description, onChange: (e) => setDescription(e.target.value) }) }), _jsx(FormField, { label: "Escrow scope uid", htmlFor: "escrowScopeId", children: _jsx("input", { id: "escrowScopeId", type: "text", className: INPUT_CLASS, value: escrowScopeId, onChange: (e) => setEscrowScopeId(e.target.value) }) }), _jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-4", children: [_jsx(FormField, { label: "Date range start", htmlFor: "dateRangeStart", children: _jsx("input", { id: "dateRangeStart", type: "datetime-local", className: INPUT_CLASS, value: dateRangeStart, onChange: (e) => setDateRangeStart(e.target.value) }) }), _jsx(FormField, { label: "Date range end", htmlFor: "dateRangeEnd", children: _jsx("input", { id: "dateRangeEnd", type: "datetime-local", className: INPUT_CLASS, value: dateRangeEnd, onChange: (e) => setDateRangeEnd(e.target.value) }) })] })] }), _jsx("div", { className: "bg-surface border border-border rounded-md p-6", children: _jsx(StringListField, { label: "Custodian mailbox uids", id: "custodianMailboxUids", values: custodianMailboxUids, onChange: setCustodianMailboxUids, placeholder: "Mailbox uid to add", emptyMessage: "No custodian mailboxes added yet." }) }), _jsxs("div", { className: "flex gap-3", children: [_jsx(Button, { type: "submit", loading: saving, disabled: saving, className: "!w-auto", children: "Create matter" }), _jsx("a", { href: "/escrow", children: _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", children: "Cancel" }) })] })] })] }));
+}

package/dist/apps/shared/components/admin/escrowScopes/EscrowScopeKeyAndHoldersFields.js

@@ -0,0 +1,26 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { toDatetimeLocal } from "@rapidmx/react-shared/util/dateInput.js";
+import FormField from "@rapidmx/react-shared/components/forms/FormField.js";
+import StringListField from "../../forms/StringListField.js";
+const INPUT_CLASS = "w-full text-sm py-2.5 px-3 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
+/** Builds an all-zeroes starting point for the "new" page — `notBefore`/`notAfter` default to "now" so an
+ * admin pasting in a cert's own dates only has to touch what actually differs. */
+export function emptyEscrowScopeKeyAndHoldersValue() {
+    const now = toDatetimeLocal(new Date().toISOString());
+    return {
+        publicKey: "",
+        keyType: "x509",
+        fingerprint: "",
+        notBefore: now,
+        notAfter: now,
+        holderUserUids: [],
+        requiredHolders: 1,
+        notifySubjectOnAccess: false,
+    };
+}
+export default function EscrowScopeKeyAndHoldersFields({ value, onChange, disabled }) {
+    function set(key, next) {
+        onChange({ ...value, [key]: next });
+    }
+    return (_jsxs(_Fragment, { children: [_jsxs("div", { className: "bg-surface border border-border rounded-md p-6", children: [_jsx("h2", { className: "text-base font-bold uppercase tracking-wide mb-1", children: "Public key" }), _jsx("p", { className: "text-sm text-text-muted mb-4", children: "The fields of an already-issued certificate \u2014 this server never generates or holds the corresponding private key." }), _jsx(FormField, { label: "Public key (base64)", htmlFor: "publicKey", children: _jsx("textarea", { id: "publicKey", className: `${INPUT_CLASS} font-mono text-xs`, rows: 4, value: value.publicKey, disabled: disabled, onChange: (e) => set("publicKey", e.target.value) }) }), _jsx(FormField, { label: "Key type", htmlFor: "keyType", children: _jsx("input", { id: "keyType", type: "text", className: INPUT_CLASS, value: value.keyType, disabled: disabled, onChange: (e) => set("keyType", e.target.value), placeholder: "x509" }) }), _jsx(FormField, { label: "Fingerprint (hex SHA-256)", htmlFor: "fingerprint", children: _jsx("input", { id: "fingerprint", type: "text", className: `${INPUT_CLASS} font-mono`, value: value.fingerprint, disabled: disabled, onChange: (e) => set("fingerprint", e.target.value) }) }), _jsxs("div", { className: "grid grid-cols-1 sm:grid-cols-2 gap-x-4", children: [_jsx(FormField, { label: "Not before", htmlFor: "notBefore", children: _jsx("input", { id: "notBefore", type: "datetime-local", className: INPUT_CLASS, value: value.notBefore, disabled: disabled, onChange: (e) => set("notBefore", e.target.value) }) }), _jsx(FormField, { label: "Not after", htmlFor: "notAfter", children: _jsx("input", { id: "notAfter", type: "datetime-local", className: INPUT_CLASS, value: value.notAfter, disabled: disabled, onChange: (e) => set("notAfter", e.target.value) }) })] })] }), _jsxs("div", { className: "bg-surface border border-border rounded-md p-6", children: [_jsx("h2", { className: "text-base font-bold uppercase tracking-wide mb-1", children: "Holders & dual control" }), _jsx("p", { className: "text-sm text-text-muted mb-4", children: "Every uid below is granted the eDiscovery/compliance holder role for this scope \u2014 a deliberately separate role from server administration. At least one holder is required." }), _jsx(StringListField, { label: "Holder user uids", id: "holderUserUids", values: value.holderUserUids, onChange: (holderUserUids) => set("holderUserUids", holderUserUids), placeholder: "User uid to add", emptyMessage: "No holders added yet.", disabled: disabled }), _jsx(FormField, { label: "Required holders (M-of-N dual control)", htmlFor: "requiredHolders", children: _jsx("input", { id: "requiredHolders", type: "number", className: INPUT_CLASS, value: value.requiredHolders, disabled: disabled, onChange: (e) => set("requiredHolders", Number(e.target.value) || 1) }) }), _jsxs("label", { className: "flex items-center gap-2 text-sm", children: [_jsx("input", { type: "checkbox", checked: value.notifySubjectOnAccess, disabled: disabled, onChange: (e) => set("notifySubjectOnAccess", e.target.checked) }), "Notify subject on access"] })] })] }));
+}

package/dist/apps/shared/components/admin/layout/AdminShell.js

@@ -5,7 +5,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 ///////////////////////////////////////////////////////////////////////////////
 import "../../../styles/app.css";
 import { useEffect, useState } from "react";
-import { HiOutlineClipboardDocumentList, HiOutlineGlobeAlt, HiOutlineInboxStack, HiOutlinePaintBrush, HiOutlineQueueList, HiOutlineShieldCheck, HiOutlineShieldExclamation, HiOutlineUserGroup, } from "react-icons/hi2";
+import { HiOutlineClipboardDocumentList, HiOutlineClock, HiOutlineDocumentArrowDown, HiOutlineGlobeAlt, HiOutlineInboxStack, HiOutlineKey, HiOutlinePaintBrush, HiOutlineQueueList, HiOutlineShieldCheck, HiOutlineShieldExclamation, HiOutlineUserGroup, } from "react-icons/hi2";
 import { apiFetch, ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { useRedirectIfUnauthenticated } from "@rapidmx/react-shared/auth/session.js";
 import useBranding from "@rapidmx/react-shared/branding/useBranding.js";
@@ -33,6 +33,24 @@ const NAV_ITEMS = [
         label: "Transport Rules",
         icon: HiOutlineShieldCheck,
     },
+    {
+        id: "escrowScopes",
+        href: "/admin/escrow-scopes",
+        label: "Escrow Scopes",
+        icon: HiOutlineKey,
+    },
+    {
+        id: "retentionPolicy",
+        href: "/admin/retention-policy",
+        label: "Retention Policy",
+        icon: HiOutlineClock,
+    },
+    {
+        id: "dataRequests",
+        href: "/admin/data-requests",
+        label: "Data Requests",
+        icon: HiOutlineDocumentArrowDown,
+    },
     { id: "branding", href: "/admin/branding", label: "Branding", icon: HiOutlinePaintBrush },
 ];
 /** Mailbox-scoped sections — not part of the global nav rail/tab bar (see `NAV_ITEMS` above), but

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

@@ -1,11 +1,20 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import ContactAvatar from "@rapidmx/react-shared/components/avatar/ContactAvatar.js";
+/** Groups a hex fingerprint into 4-character blocks (`ab12 cd34 ...`) for out-of-band verification -
+ * the spec's own use case ("compare this over the phone") is materially easier with a grouped string
+ * than one 64-character run. */
+function formatFingerprint(fingerprint) {
+    return fingerprint.match(/.{1,4}/g)?.join(" ") ?? fingerprint;
+}
 /**
  * A contact's read-only detail view. Shared by the desktop inline pane (`apps/www/contacts/index.tsx`,
  * always visible alongside the contact list) and the mobile detail route
  * (`apps/www/contacts/[uid].tsx`, a full page on its own reached by tapping a contact row).
  */
 export default function ContactDetailPane({ contact, onEdit, onDelete, backHref }) {
-    return (_jsxs("div", { role: "region", "aria-label": "Contact details", className: "max-w-xl flex flex-col gap-5", children: [backHref && (_jsx("a", { href: backHref, className: "text-sm text-primary-dark hover:underline", children: "\u2190 Back to contacts" })), _jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(ContactAvatar, { displayName: contact.displayName, size: 48 }), _jsxs("div", { children: [_jsx("h1", { className: "text-xl font-bold tracking-tight", children: contact.displayName }), contact.jobTitle && contact.company && (_jsxs("p", { className: "text-sm text-text-muted mt-0.5", children: [contact.jobTitle, " at ", contact.company] }))] })] }), _jsxs("div", { className: "flex gap-2 shrink-0", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: onEdit, children: "Edit" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto text-danger", onClick: onDelete, children: "Delete" })] })] }), _jsxs("div", { className: "bg-surface border border-border rounded-md p-6 flex flex-col gap-4 text-sm", children: [contact.emails.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Email" }), contact.emails.map((e, i) => (_jsxs("div", { children: [e.address, " ", _jsxs("span", { className: "text-text-muted", children: ["(", e.type, ")"] })] }, i)))] })), contact.phones.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Phone" }), contact.phones.map((p, i) => (_jsxs("div", { children: [p.phoneNumber, " ", _jsxs("span", { className: "text-text-muted", children: ["(", p.type, ")"] })] }, i)))] })), contact.addresses.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Address" }), contact.addresses.map((a, i) => (_jsx("div", { children: [a.street, a.city, a.state, a.postalCode, a.country].filter(Boolean).join(", ") }, i)))] })), contact.categories && contact.categories.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Categories" }), _jsx("div", { children: contact.categories.join(", ") })] })), contact.notes && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Notes" }), _jsx("div", { children: contact.notes })] }))] })] }));
+    return (_jsxs("div", { role: "region", "aria-label": "Contact details", className: "max-w-xl flex flex-col gap-5", children: [backHref && (_jsx("a", { href: backHref, className: "text-sm text-primary-dark hover:underline", children: "\u2190 Back to contacts" })), _jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { className: "flex items-center gap-3", children: [_jsx(ContactAvatar, { displayName: contact.displayName, size: 48 }), _jsxs("div", { children: [_jsx("h1", { className: "text-xl font-bold tracking-tight", children: contact.displayName }), contact.jobTitle && contact.company && (_jsxs("p", { className: "text-sm text-text-muted mt-0.5", children: [contact.jobTitle, " at ", contact.company] }))] })] }), _jsxs("div", { className: "flex gap-2 shrink-0", children: [_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", onClick: onEdit, children: "Edit" }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto text-danger", onClick: onDelete, children: "Delete" })] })] }), _jsxs("div", { className: "bg-surface border border-border rounded-md p-6 flex flex-col gap-4 text-sm", children: [contact.emails.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Email" }), contact.emails.map((e, i) => (_jsxs("div", { children: [e.address, " ", _jsxs("span", { className: "text-text-muted", children: ["(", e.type, ")"] })] }, i)))] })), contact.phones.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Phone" }), contact.phones.map((p, i) => (_jsxs("div", { children: [p.phoneNumber, " ", _jsxs("span", { className: "text-text-muted", children: ["(", p.type, ")"] })] }, i)))] })), contact.addresses.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Address" }), contact.addresses.map((a, i) => (_jsx("div", { children: [a.street, a.city, a.state, a.postalCode, a.country].filter(Boolean).join(", ") }, i)))] })), contact.categories && contact.categories.length > 0 && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Categories" }), _jsx("div", { children: contact.categories.join(", ") })] })), contact.notes && (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Notes" }), _jsx("div", { children: contact.notes })] })), (contact.keys && contact.keys.length > 0) || contact.encryptPreference || contact.keyConflict ? (_jsxs("div", { children: [_jsx("div", { className: "text-text-muted text-xs font-bold uppercase tracking-wide mb-1", children: "Encryption" }), contact.keyConflict && (_jsx("div", { className: "mb-2", children: _jsxs(Alert, { children: [_jsxs("p", { className: "mb-2", children: ["A different encryption key was observed for this contact on", " ", new Date(contact.keyConflict.observedAt).toLocaleDateString(), ". The previously verified key below is still the one in use \u2014 this is routine after a device change or reinstall, but it\u2019s also what a real attack looks like, so verify the new fingerprint with ", contact.displayName, " ", "directly (e.g. by phone) before trusting it. There is no automatic way to accept or reject this yet."] }), _jsxs("p", { className: "font-mono text-xs", children: ["Newly observed: ", formatFingerprint(contact.keyConflict.observedFingerprint)] })] }) })), contact.encryptPreference && (_jsx("div", { className: "mb-1", children: contact.encryptPreference.preferEncrypt === "mutual"
+                                    ? "This contact also encrypts to you — messages to them can be encrypted."
+                                    : "This contact has not indicated a mutual encryption preference." })), contact.keys?.map((key) => (_jsxs("div", { className: "font-mono text-xs py-0.5", children: [key.useType === "sign" ? "Signing" : "Encryption", " key: ", formatFingerprint(key.fingerprint), key.revokedAt && _jsx("span", { className: "text-danger", children: " (revoked)" })] }, key.fingerprint)))] })) : null] })] }));
 }