@rapidmx/web-client 0.9.0 → 0.11.0

package/dist/apps/www/messages/[uid].d.ts

@@ -1,11 +1,7 @@
-import React from "react";
 import { MailShellProps } from "../../shared/components/mail/layout/MailShell.js";
-/**
- * Only reached on mobile (below the `md` breakpoint) — desktop's `apps/www/index.tsx` keeps its existing
- * inline reading pane and never navigates here; see that file's `handleSelect`.
- */
-export default function MessageDetailPage(props: MailShellProps & {
+declare const _default: import("../../shared/navigation/AppRouter.js").RoutedPageComponent<MailShellProps & {
     params: {
         uid: string;
     };
-}): React.JSX.Element;
+}>;
+export default _default;

package/dist/apps/www/messages/[uid].js

@@ -3,19 +3,22 @@ import { jsx as _jsx } from "react/jsx-runtime";
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../_routedPage.js";
 import { useEffect, useState } from "react";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { getMessage } from "@rapidmx/react-shared/mail/mailApi.js";
 import { listLabels } from "@rapidmx/react-shared/mail/labelsApi.js";
-import { useMarkMessageRead, useMessageAttachments } from "@rapidmx/react-shared/mail/mailDetailHooks.js";
+import { useMessageAttachments } from "@rapidmx/react-shared/mail/mailDetailHooks.js";
+import { useMarkMessageRead } from "../../shared/mail/useMarkMessageRead.js";
 import MailShell, { useMailShell } from "../../shared/components/mail/layout/MailShell.js";
-import MessageDetailPane from "../../shared/components/mail/MessageDetailPane.js";
+import { LazyMessageDetailPane } from "../../shared/components/mail/LazyReadingPane.js";
+import { ReadingPaneSkeleton } from "../../shared/components/mail/reading/MessageCard.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 /**
  * Only reached on mobile (below the `md` breakpoint) — desktop's `apps/www/index.tsx` keeps its existing
  * inline reading pane and never navigates here; see that file's `handleSelect`.
  */
-export default function MessageDetailPage(props) {
+function MessageDetailPage(props) {
     return (_jsx(MailShell, { ...props, children: _jsx(MessageDetailContent, { uid: props.params.uid }) }));
 }
 function MessageDetailContent({ uid }) {
@@ -55,7 +58,8 @@ function MessageDetailContent({ uid }) {
     const attachments = useMessageAttachments(message);
     useMarkMessageRead(message, setMessage);
     if (loading) {
-        return _jsx("p", { className: "p-8 text-sm text-text-muted", children: "Loading\u2026" });
+        // The pane's own frame - a header card and a message card - rather than a line of text: what is coming is known, only not yet its contents.
+        return _jsx(ReadingPaneSkeleton, {});
     }
     if (error || !message) {
         return _jsx(Alert, { children: error ?? "Message not found." });
@@ -68,5 +72,6 @@ function MessageDetailContent({ uid }) {
     const isSentItems = folders.find((f) => f.uid === message.folderUid)?.type === "sent_items";
     const isOutbox = folders.find((f) => f.uid === message.folderUid)?.type === "outbox";
     const draftsFolderUid = folders.find((f) => f.type === "drafts")?.uid;
-    return (_jsx(MessageDetailPane, { message: message, attachments: attachments, backHref: backHref, isSentItems: isSentItems, onRecalled: setMessage, isOutbox: isOutbox, onReceiptHandled: setMessage, draftsFolderUid: draftsFolderUid, folders: folders, onMoved: setMessage, onFolderCreated: onFolderCreated, onScheduledSendCanceled: setMessage, onArchived: setMessage, labels: labels, onLabelsChanged: setMessage, onLabelCreated: (label) => setLabels((prev) => [...prev, label]) }));
+    return (_jsx(LazyMessageDetailPane, { shortcuts: true, message: message, attachments: attachments, backHref: backHref, isSentItems: isSentItems, onRecalled: setMessage, isOutbox: isOutbox, onReceiptHandled: setMessage, draftsFolderUid: draftsFolderUid, folders: folders, onMoved: setMessage, onFolderCreated: onFolderCreated, onScheduledSendCanceled: setMessage, onArchived: setMessage, labels: labels, onLabelsChanged: setMessage, onLabelCreated: (label) => setLabels((prev) => [...prev, label]) }));
 }
+export default routedPage("/messages/:uid", MessageDetailPage);

package/dist/apps/www/settings/appearance/index.d.ts

@@ -0,0 +1,4 @@
+import { SettingsShellProps } from "../../../shared/components/settings/layout/SettingsShell.js";
+export type SettingsAppearancePageProps = Omit<SettingsShellProps, "active">;
+declare const _default: import("../../../shared/navigation/AppRouter.js").RoutedPageComponent<SettingsAppearancePageProps>;
+export default _default;

package/dist/apps/www/settings/appearance/index.js

@@ -0,0 +1,13 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../../_routedPage.js";
+import SettingsShell from "../../../shared/components/settings/layout/SettingsShell.js";
+import AppearanceForm from "../../../shared/appearance/AppearanceForm.js";
+/** Settings > Appearance: the colour scheme, theme colours and background. Not mailbox-scoped - it is the signed-in user's own. */
+function SettingsAppearancePage(props) {
+    return (_jsx(SettingsShell, { ...props, active: "appearance", children: _jsx(AppearanceForm, {}) }));
+}
+export default routedPage("/settings/appearance", SettingsAppearancePage);

package/dist/apps/www/settings/auto-reply/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
 import { SettingsShellProps } from "../../../shared/components/settings/layout/SettingsShell.js";
 export type SettingsAutoReplyPageProps = Omit<SettingsShellProps, "active">;
-export default function SettingsAutoReplyPage(props: SettingsAutoReplyPageProps): React.JSX.Element;
+declare const _default: import("../../../shared/navigation/AppRouter.js").RoutedPageComponent<SettingsAutoReplyPageProps>;
+export default _default;

package/dist/apps/www/settings/auto-reply/index.js

@@ -3,15 +3,15 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../../_routedPage.js";
 import { useState } from "react";
-import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { toDatetimeLocal } from "@rapidmx/react-shared/util/dateInput.js";
 import { updateMailbox } from "@rapidmx/react-shared/mail/mailApi.js";
 import SettingsShell, { useSettingsShell } from "../../../shared/components/settings/layout/SettingsShell.js";
-import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+import { notifyApiError } from "../../../shared/notifications/apiErrors.js";
 const INPUT_CLASS = "w-full text-sm py-2 px-3 border border-border rounded-sm bg-surface text-text focus:outline-none focus:border-primary";
-export default function SettingsAutoReplyPage(props) {
+function SettingsAutoReplyPage(props) {
     return (_jsx(SettingsShell, { ...props, active: "auto-reply", children: _jsx(AutoReplyContent, {}) }));
 }
 function AutoReplyContent() {
@@ -27,12 +27,10 @@ function AutoReplyContent() {
     // `SettingsShell`'s `mailboxes` is fetched once - every save bumps the server's version, so a second
     // save without a reload must send the version the previous save returned, not the stale original.
     const [version, setVersion] = useState(mailbox.version);
-    const [error, setError] = useState(null);
     const [saving, setSaving] = useState(false);
     const [saved, setSaved] = useState(false);
     async function handleSubmit(e) {
         e.preventDefault();
-        setError(null);
         setSaved(false);
         setSaving(true);
         try {
@@ -49,11 +47,12 @@ function AutoReplyContent() {
             setSaved(true);
         }
         catch (err) {
-            setError(err instanceof ApiRequestError ? err.message : "Could not save automatic reply settings.");
+            notifyApiError(err, "Couldn't save the automatic reply settings");
         }
         finally {
             setSaving(false);
         }
     }
-    return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsxs("div", { className: "max-w-xl", children: [_jsx("h1", { className: "text-lg font-bold tracking-tight mb-1", children: "Automatic Replies" }), _jsxs("p", { className: "text-sm text-text-muted mb-4", children: ["Send an automatic reply to anyone who emails ", mailbox.displayName, " while you\u2019re away. A calendar event with its own automatic reply enabled takes over for its own start/end window."] }), error && _jsx(Alert, { children: error }), saved && !error && _jsx("div", { className: "mb-4 text-sm text-success font-medium", children: "Saved." }), _jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm font-medium", children: [_jsx("input", { type: "checkbox", checked: oofEnabled, onChange: (e) => setOofEnabled(e.target.checked) }), "Automatic replies are on"] }), oofEnabled && (_jsxs(_Fragment, { children: [_jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "Message" }), _jsx("textarea", { "aria-label": "Automatic reply message", className: INPUT_CLASS, rows: 5, value: oofMessage, onChange: (e) => setOofMessage(e.target.value) })] }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "Start (optional)" }), _jsx("input", { type: "datetime-local", "aria-label": "Automatic reply start", className: INPUT_CLASS, value: oofStartTime, onChange: (e) => setOofStartTime(e.target.value) })] }), _jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "End (optional)" }), _jsx("input", { type: "datetime-local", "aria-label": "Automatic reply end", className: INPUT_CLASS, value: oofEndTime, onChange: (e) => setOofEndTime(e.target.value) })] })] }), _jsx("p", { className: "text-xs text-text-muted -mt-2", children: "Leave both blank to stay on indefinitely until turned off." })] })), _jsx("div", { children: _jsx(Button, { type: "submit", loading: saving, disabled: saving, className: "!w-auto", children: "Save" }) })] })] }) }));
+    return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsxs("div", { className: "max-w-xl", children: [_jsx("h1", { className: "text-lg font-bold tracking-tight mb-1", children: "Automatic Replies" }), _jsxs("p", { className: "text-sm text-text-muted mb-4", children: ["Send an automatic reply to anyone who emails ", mailbox.displayName, " while you\u2019re away. A calendar event with its own automatic reply enabled takes over for its own start/end window."] }), saved && _jsx("div", { className: "mb-4 text-sm text-success font-medium", children: "Saved." }), _jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-4", children: [_jsxs("label", { className: "flex items-center gap-2 text-sm font-medium", children: [_jsx("input", { type: "checkbox", checked: oofEnabled, onChange: (e) => setOofEnabled(e.target.checked) }), "Automatic replies are on"] }), oofEnabled && (_jsxs(_Fragment, { children: [_jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "Message" }), _jsx("textarea", { "aria-label": "Automatic reply message", className: INPUT_CLASS, rows: 5, value: oofMessage, onChange: (e) => setOofMessage(e.target.value) })] }), _jsxs("div", { className: "grid grid-cols-2 gap-3", children: [_jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "Start (optional)" }), _jsx("input", { type: "datetime-local", "aria-label": "Automatic reply start", className: INPUT_CLASS, value: oofStartTime, onChange: (e) => setOofStartTime(e.target.value) })] }), _jsxs("label", { className: "flex flex-col gap-1.5 text-sm", children: [_jsx("span", { className: "font-semibold", children: "End (optional)" }), _jsx("input", { type: "datetime-local", "aria-label": "Automatic reply end", className: INPUT_CLASS, value: oofEndTime, onChange: (e) => setOofEndTime(e.target.value) })] })] }), _jsx("p", { className: "text-xs text-text-muted -mt-2", children: "Leave both blank to stay on indefinitely until turned off." })] })), _jsx("div", { children: _jsx(Button, { type: "submit", loading: saving, disabled: saving, className: "!w-auto", children: "Save" }) })] })] }) }));
 }
+export default routedPage("/settings/auto-reply", SettingsAutoReplyPage);

package/dist/apps/www/settings/encryption/index.d.ts

@@ -1,7 +1,7 @@
-import React from "react";
 import { SettingsShellProps } from "../../../shared/components/settings/layout/SettingsShell.js";
 /** Mirrors restapi's `BaseKeyVaultRoute` `MAX_MASTER_KEY_WRAPS` - `addMasterKeyWrap()` refuses a vault
  * already holding this many wraps (escrow included). */
 export declare const MAX_MASTER_KEY_WRAPS = 20;
 export type SettingsEncryptionPageProps = Omit<SettingsShellProps, "active">;
-export default function SettingsEncryptionPage(props: SettingsEncryptionPageProps): React.JSX.Element;
+declare const _default: import("../../../shared/navigation/AppRouter.js").RoutedPageComponent<SettingsEncryptionPageProps>;
+export default _default;

package/dist/apps/www/settings/encryption/index.js

@@ -3,9 +3,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../../_routedPage.js";
 import { useEffect, useState } from "react";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
-import { addMasterKeyWrap, cancelSignEnrollment, checkSignEnrollmentStatus, findActivePublicKey, getEscrowInfo, getKeyVault, rekey, removeMasterKeyWrap, startSignEnrollment, } from "@rapidmx/react-shared/crypto/keyvaultApi.js";
+import { addMasterKeyWrap, cancelSignEnrollment, findActivePublicKey, getCurrentSignEnrollment, getEscrowInfo, getKeyVault, rekey, removeMasterKeyWrap, startSignEnrollment, } from "@rapidmx/react-shared/crypto/keyvaultApi.js";
 import { ENCRYPTION_PRIVATE_KEY_AAD_PURPOSE, SIGNING_PRIVATE_KEY_AAD_PURPOSE, destroyUnlockedKeys, getUnlockedKeys, unlockWithPassword, } from "@rapidmx/react-shared/crypto/keySession.js";
 import { IDLE_TIMEOUT_OPTIONS_MINUTES, getIdleTimeoutMinutes, setIdleTimeoutMinutes } from "@rapidmx/react-shared/crypto/idleTimeout.js";
 import { LOCAL_INDEX_SIZE_OPTIONS, getDefaultLocalIndexByteBudget, getLocalIndexByteBudget, setLocalIndexByteBudget, } from "../../../shared/search/localIndexSizePreference.js";
@@ -18,13 +19,22 @@ import SettingsShell, { useSettingsShell } from "../../../shared/components/sett
 import KeyEnrollmentGate from "../../../shared/components/layout/KeyEnrollmentGate.js";
 import { useUnlockPrompt } from "../../../shared/components/layout/UnlockPromptProvider.js";
 import { destroyLocalIndex } from "../../../shared/search/localIndexRpcClient.js";
+import { notifyApiError } from "../../../shared/notifications/apiErrors.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import Button from "@rapidmx/react-shared/components/buttons/Button.js";
 import Modal from "@rapidmx/react-shared/components/overlays/Modal.js";
+import SigningCertificateCard from "../../../shared/components/settings/SigningCertificateCard.js";
+import { readStoredSignEnrollment, storeSignEnrollment } from "../../../shared/signing/enrollmentStorage.js";
+import { checkEnrollmentNow, forgetEnrollment, recordEnrollmentResult, useEnrollmentSnapshot, watchCurrentEnrollment, watchEnrollment, } from "../../../shared/signing/enrollmentTracker.js";
+import { STALE_REQUEST_TEXT, beforeRequestText, healthWarning, isInstalling, timeOf } from "../../../shared/signing/enrollmentView.js";
+import { useSigningEnrollmentInfo } from "../../../shared/signing/signingInfo.js";
 const MIN_PASSWORD_LENGTH = 8;
 /** Mirrors restapi's `BaseKeyVaultRoute` `MAX_MASTER_KEY_WRAPS` - `addMasterKeyWrap()` refuses a vault
  * already holding this many wraps (escrow included). */
 export const MAX_MASTER_KEY_WRAPS = 20;
+/** How often, and how many times, the page asks for the mailbox's keys while a certificate is issued but not installed yet. */
+const INSTALL_WATCH_INTERVAL_MS = 15000;
+const INSTALL_WATCH_ATTEMPTS = 40;
 const KEYS_LOCKED_MESSAGE = "Your encryption keys were locked before this could finish. Unlock them and try again.";
 /** Thrown inside `handleRotateKeys()` when the escrow wrap of the new master key can't be built - the rotation is
  * then abandoned before `rekey()`. */
@@ -122,38 +132,6 @@ async function rewrapVaultPrivateKeys(mailboxUid, currentMasterKey, wrappedKeys)
         }
     }
 }
-// RFC 8823 ACME issuance is a real email round-trip with a public CA - "likely minutes," not seconds -
-// so this polls infrequently rather than hammering the endpoint.
-const SIGNING_ENROLLMENT_POLL_INTERVAL_MS = 15000;
-/**
- * A started signing enrollment's id, per mailbox. Kept only so a reload can ask the server
- * (`checkSignEnrollmentStatus()`) whether that enrollment is still pending: a rotation while it is pending
- * would strand the enrollment's already-submitted private key under a master key that no longer exists. The
- * stored id is never trusted on its own - the server's answer decides the state, and restapi's own `rekey()`
- * refuses (409) a rotation during an enrollment this browser never saw (e.g. one started on another device).
- */
-const SIGN_ENROLLMENT_STORAGE_PREFIX = "rapidmx.signEnrollment.";
-function readStoredSignEnrollment(mailboxUid) {
-    try {
-        return localStorage.getItem(SIGN_ENROLLMENT_STORAGE_PREFIX + mailboxUid);
-    }
-    catch {
-        return null;
-    }
-}
-function storeSignEnrollment(mailboxUid, enrollmentId) {
-    try {
-        if (enrollmentId) {
-            localStorage.setItem(SIGN_ENROLLMENT_STORAGE_PREFIX + mailboxUid, enrollmentId);
-        }
-        else {
-            localStorage.removeItem(SIGN_ENROLLMENT_STORAGE_PREFIX + mailboxUid);
-        }
-    }
-    catch {
-        // Storage blocked - restapi's own 409 on rekey still guards a rotation.
-    }
-}
 const ROTATION_CONFLICT_MESSAGE = "Your keys were not rotated because the server reported a conflicting change. If a signing certificate enrollment is still in progress for this mailbox (it may have been started on another device), wait for it to finish, then try again. If this mailbox is under escrow, its escrow protection may have changed meanwhile - reload this page and try again. Nothing was changed.";
 const METHOD_LABELS = {
     password: "Password",
@@ -170,7 +148,7 @@ function idleTimeoutLabel(minutes) {
     }
     return `${minutes} minutes`;
 }
-export default function SettingsEncryptionPage(props) {
+function SettingsEncryptionPage(props) {
     return (_jsx(SettingsShell, { ...props, active: "encryption", children: _jsx(EncryptionGate, { userUid: props.userUid, impersonating: props.impersonating }) }));
 }
 /**
@@ -235,6 +213,12 @@ function EncryptionContent({ canManageKeys }) {
     const [signingEnrollmentId, setSigningEnrollmentId] = useState(null);
     const [signingError, setSigningError] = useState(null);
     const rotationBlockedBySigning = signingStatus !== "idle";
+    // What is known of the mailbox's signing-certificate enrollment: kept current by the shared tracker (`signing/enrollmentTracker.ts`), which reads
+    // the server with backoff while this page is visible, stops when the enrollment ends, and goes on in the app frame when this page is left.
+    const enrollment = useEnrollmentSnapshot(mailboxUid);
+    const enrollmentResult = enrollment?.result ?? null;
+    // How this deployment issues certificates (a public CA by itself, or an administrator by hand): what the card and the request say follows it. Only the owner asks.
+    const signingInfo = useSigningEnrollmentInfo(canManageKeys);
     const [cancelingEnrollment, setCancelingEnrollment] = useState(false);
     const [cancelEnrollmentError, setCancelEnrollmentError] = useState(null);
     // restapi's rekey() drops every old escrow wrap and requires a fresh one for the new master key (see
@@ -302,79 +286,80 @@ function EncryptionContent({ canManageKeys }) {
             setWrappingEscrow(false);
         }
     }
-    /** Applies a server-reported enrollment status - shared by the reload check and the poll below. */
-    async function applyEnrollmentResult(enrollmentId, result, isCancelled) {
-        if (result.status === "pending") {
-            setSigningEnrollmentId(enrollmentId);
-            setSigningStatus("pending");
-            return;
-        }
-        storeSignEnrollment(mailboxUid, null);
-        setSigningStatus("idle");
-        setSigningEnrollmentId(null);
-        if (result.status === "failed") {
-            setSigningError(result.error ?? "Signing certificate enrollment failed.");
-            return;
-        }
-        try {
-            const refreshed = await getMailbox(mailboxUid);
-            if (!isCancelled()) {
-                setRefreshedKeys(refreshed.keys ?? []);
-            }
-        }
-        catch {
-            // The new key shows on the next load - the enrollment itself is finished either way.
-        }
-    }
-    // Confirms an enrollment started before a reload with the server before rotation is offered again.
+    // Follows the enrollment this browser started (its stored id) - or, for the owner, the one the server names as the mailbox's current one (started
+    // on another device, or long ago), so a pending one blocks rotation and shows its progress here too.
     useEffect(() => {
         const storedId = readStoredSignEnrollment(mailboxUid);
-        if (!storedId) {
-            return;
-        }
         let cancelled = false;
-        setSigningStatus("checking");
-        checkSignEnrollmentStatus(mailboxUid, storedId)
-            .then((result) => (cancelled ? undefined : applyEnrollmentResult(storedId, result, () => cancelled)))
-            .catch((err) => {
-            if (cancelled) {
-                return;
-            }
-            if (err instanceof ApiRequestError && err.status === 404) {
-                // The server no longer knows this enrollment, so nothing is pending.
-                storeSignEnrollment(mailboxUid, null);
-                setSigningStatus("idle");
-                return;
-            }
-            // Unknown (e.g. a network error): assume it is still pending, and let polling keep asking.
-            setSigningEnrollmentId(storedId);
-            setSigningStatus("pending");
-        });
+        let release;
+        if (storedId) {
+            setSigningStatus("checking");
+            release = watchEnrollment(mailboxUid, storedId);
+        }
+        else if (canManageKeys) {
+            getCurrentSignEnrollment(mailboxUid)
+                .then((current) => {
+                if (!cancelled && current) {
+                    if (current.status === "pending") {
+                        storeSignEnrollment(mailboxUid, current.enrollmentId);
+                    }
+                    release = watchCurrentEnrollment(mailboxUid, current, current.status === "pending");
+                }
+            })
+                .catch(() => undefined);
+        }
         return () => {
             cancelled = true;
+            release?.();
         };
-    }, [mailboxUid]);
+    }, [mailboxUid, canManageKeys]);
+    // What the tracker knows becomes this page's state: pending (or not heard from yet - assume it is still going, and let the polling keep asking) blocks
+    // rotation; an enrollment that ended, or that the server no longer knows, does not.
     useEffect(() => {
-        if (signingStatus !== "pending" || !signingEnrollmentId) {
+        if (!enrollment) {
+            return;
+        }
+        if (enrollmentResult?.status === "pending" || (!enrollmentResult && enrollment.offline)) {
+            setSigningEnrollmentId(enrollment.enrollmentId);
+            setSigningStatus("pending");
+        }
+        else if (enrollmentResult || enrollment.gone) {
+            setSigningEnrollmentId(null);
+            setSigningStatus("idle");
+        }
+    }, [enrollment?.enrollmentId, enrollmentResult?.status, enrollment?.gone, enrollment?.offline]);
+    // Once a certificate is issued the server has installed a new signing key that `mailbox.keys` (fetched once by the shell) never saw. The server installs it
+    // with a job a few minutes after the CA issues it (`installedAt`): until then the key is not there, so ask again every 15 s (for ten minutes at most).
+    const issuedUntil = timeOf(enrollmentResult?.notAfter);
+    const keyIsCurrent = !!activeSigningKey && (issuedUntil === undefined || issuedUntil <= activeSigningKey.notAfter + 60000);
+    useEffect(() => {
+        if (enrollmentResult?.status !== "issued" || keyIsCurrent) {
             return;
         }
         let cancelled = false;
-        const interval = setInterval(async () => {
-            try {
-                const result = await checkSignEnrollmentStatus(mailboxUid, signingEnrollmentId);
-                if (!cancelled) {
-                    await applyEnrollmentResult(signingEnrollmentId, result, () => cancelled);
+        let timer;
+        let attempts = 0;
+        const refresh = () => {
+            getMailbox(mailboxUid)
+                .then((refreshed) => {
+                if (cancelled) {
+                    return;
                 }
-            }
-            catch {
-                // Transient network error - keep polling rather than surfacing a one-off failure.
-            }
-        }, SIGNING_ENROLLMENT_POLL_INTERVAL_MS);
+                const keys = refreshed.keys ?? [];
+                setRefreshedKeys(keys);
+                // Not installed yet, and the server said it is on its way: look again.
+                if (isInstalling(enrollmentResult) && ++attempts < INSTALL_WATCH_ATTEMPTS && !findActivePublicKey(keys, "sign")) {
+                    timer = setTimeout(refresh, INSTALL_WATCH_INTERVAL_MS);
+                }
+            })
+                .catch(() => undefined);
+        };
+        refresh();
         return () => {
             cancelled = true;
-            clearInterval(interval);
+            clearTimeout(timer);
         };
-    }, [signingStatus, signingEnrollmentId, mailboxUid]);
+    }, [enrollmentResult?.status, enrollmentResult?.installedAt, enrollment?.enrollmentId, keyIsCurrent, mailboxUid]);
     /** Cancels the pending enrollment (restapi's owner-only DELETE), which is what lets rotation run again. */
     async function handleCancelEnrollment(enrollmentId) {
         setCancelEnrollmentError(null);
@@ -386,18 +371,20 @@ function EncryptionContent({ canManageKeys }) {
             }
             else if (result.status === "failed") {
                 // Cancelled - the "failure" is the cancellation itself, not something to report.
+                forgetEnrollment(mailboxUid);
                 storeSignEnrollment(mailboxUid, null);
                 setSigningStatus("idle");
                 setSigningEnrollmentId(null);
             }
             else {
                 // Issued before the cancel landed: it finishes like any other issued enrollment.
-                await applyEnrollmentResult(enrollmentId, result, () => false);
+                recordEnrollmentResult(mailboxUid, enrollmentId, result);
             }
         }
         catch (err) {
             if (err instanceof ApiRequestError && err.status === 404) {
                 // The server no longer knows this enrollment, so nothing is pending.
+                forgetEnrollment(mailboxUid);
                 storeSignEnrollment(mailboxUid, null);
                 setSigningStatus("idle");
                 setSigningEnrollmentId(null);
@@ -423,6 +410,8 @@ function EncryptionContent({ canManageKeys }) {
                 wrappedKey: { ciphertext: wrappedKeySealed.ciphertext, nonce: wrappedKeySealed.nonce, algorithm: "AES-256-GCM" },
             });
             storeSignEnrollment(mailboxUid, enrollmentId);
+            // Followed from now on (and after this page is left): the server has just accepted it, so it is pending - no need to ask first.
+            watchEnrollment(mailboxUid, enrollmentId, { initial: { status: "pending" } });
             setSigningEnrollmentId(enrollmentId);
             setSigningStatus("pending");
         }
@@ -471,7 +460,8 @@ function EncryptionContent({ canManageKeys }) {
             await loadVault();
         }
         catch (err) {
-            setActionError(err instanceof ApiRequestError ? err.message : "Could not remove this unlock method.");
+            // A pop-up (the confirmation is already closed); `actionError` keeps the guidance tied to the forms below.
+            notifyApiError(err, "Couldn't remove this unlock method");
         }
         finally {
             setRemovingMethod(null);
@@ -763,8 +753,27 @@ function EncryptionContent({ canManageKeys }) {
         return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsx("div", { className: "max-w-xl", children: _jsx(Alert, { children: rotationRelockReason ??
                         "Your encryption keys have been removed from this session. Reload the page (or open Mail again) to unlock them when you need to read or send encrypted mail." }) }) }));
     }
+    // The "Digital signatures" section: a pending enrollment first (even while an older certificate is still active - it is a renewal); else the
+    // active certificate; else how the last enrollment ended (a failure, or a certificate that has since expired); else nothing has been requested.
+    const expiredSigningKey = displayedKeys
+        .filter((key) => key.useType === "sign" && !key.revokedAt && key.notAfter <= Date.now())
+        .sort((a, b) => b.notAfter - a.notAfter)[0];
+    // A certificate the CA has issued but the server has not installed yet counts as issued too (there is no key to show yet: the card says it is installing).
+    const installing = canManageKeys && isInstalling(enrollmentResult);
+    const certificateMode = signingStatus === "pending"
+        ? "pending"
+        : activeSigningKey || installing
+            ? canManageKeys
+                ? "issued"
+                : null
+            : canManageKeys && enrollmentResult?.status === "failed"
+                ? "failed"
+                : canManageKeys && expiredSigningKey
+                    ? "expired"
+                    : null;
+    const certificateEnrollment = certificateMode === "issued" && enrollmentResult?.status !== "issued" ? null : certificateMode === "expired" ? null : enrollmentResult;
     return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsxs("div", { className: "max-w-xl flex flex-col gap-6", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-lg font-bold tracking-tight mb-1", children: "Encryption" }), _jsxs("p", { className: "text-sm text-text-muted", children: ["Manage how ", mailbox.displayName, " unlocks its encryption keys on this and other devices."] })] }), loadError && _jsx(Alert, { children: loadError }), actionError && _jsx(Alert, { children: actionError }), !canManageKeys && (_jsx("p", { className: "text-sm text-text-muted", children: "Only this mailbox\u2019s owner, signed in as themselves, can change its encryption keys and unlock methods." })), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Encryption keys" }), displayedKeys.length > 0 ? (_jsx("ul", { className: "flex flex-col gap-1 text-sm", children: displayedKeys.map((key) => (_jsxs("li", { className: "font-mono text-xs", children: [key.useType === "sign" ? "Signing" : "Encryption", " key: ", key.fingerprint, key.revokedAt &&
-                                        (key.revocationReason === "superseded" ? (_jsx("span", { className: "text-text-muted", children: " (superseded)" })) : (_jsx("span", { className: "text-danger", children: " (revoked)" })))] }, key.fingerprint))) })) : (_jsx("p", { className: "text-sm text-text-muted", children: "No keys enrolled yet." }))] }), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Digital signatures" }), activeSigningKey ? (_jsx("p", { className: "text-sm text-text-muted", children: "Enabled \u2014 outgoing mail from this mailbox is signed with a publicly-trusted certificate." })) : signingStatus === "pending" ? (_jsx("p", { className: "text-sm text-text-muted", children: "Requested \u2014 a public certificate authority issues this via an automated email exchange, which can take a few minutes. You can leave this page; it finishes in the background and takes effect automatically once issued." })) : !canManageKeys ? (_jsx("p", { className: "text-sm text-text-muted", children: "Not enabled." })) : (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("p", { className: "text-xs text-text-muted", children: "Lets recipients verify that mail from this mailbox is genuinely from you. Optional \u2014 encryption already works without it." }), signingError && _jsx(Alert, { children: signingError }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: signingStatus === "enrolling", disabled: signingStatus !== "idle", onClick: handleEnrollSigning, children: "Enable digital signatures" })] }))] }), mailbox.escrowScopeId && (_jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Escrow" }), escrowError && _jsx(Alert, { children: escrowError }), hasEscrowWrap ? (_jsx("p", { className: "text-sm text-text-muted", children: "This mailbox is under legal/compliance escrow \u2014 an authorized holder in your organization can recover its encrypted mail if needed. This does not weaken protection against anyone else." })) : (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("p", { className: "text-xs text-text-muted", children: ["Your organization has assigned this mailbox to an escrow scope, but nothing has been protected yet \u2014 an authorized holder cannot recover this mailbox\u2019s encrypted mail until you complete this step.", " ", "This does not weaken protection against anyone else."] }), canManageKeys && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: wrappingEscrow, disabled: wrappingEscrow, onClick: handleWrapEscrow, children: "Add escrow protection" }))] }))] })), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Unlock methods" }), _jsxs("p", { className: "text-xs text-text-muted mb-3", children: ["Removing a method here stops it from being usable to unlock this mailbox going forward, but it is ", _jsx("strong", { children: "not" }), " full revocation \u2014 anyone who already captured a wrapped copy and knows its secret could still use it. For real revocation (e.g. after a lost device), rotate your keys entirely below instead."] }), vault && vault.masterKeyWraps.length > 0 ? (_jsx("ul", { className: "flex flex-col gap-2", children: [...passwordWraps, ...recoveryWraps, ...otherWraps].map((wrap) => {
+                                        (key.revocationReason === "superseded" ? (_jsx("span", { className: "text-text-muted", children: " (superseded)" })) : (_jsx("span", { className: "text-danger", children: " (revoked)" })))] }, key.fingerprint))) })) : (_jsx("p", { className: "text-sm text-text-muted", children: "No keys enrolled yet." }))] }), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Digital signatures" }), activeSigningKey && signingStatus !== "pending" && (_jsx("p", { className: ["text-sm text-text-muted", certificateMode ? "mb-3" : ""].join(" "), children: "Enabled \u2014 outgoing mail from this mailbox is signed with a publicly-trusted certificate." })), certificateMode && (_jsxs("div", { className: "flex flex-col gap-2", children: [certificateMode === "failed" && signingError && _jsx(Alert, { children: signingError }), _jsx(SigningCertificateCard, { mode: certificateMode, enrollment: certificateEnrollment, snapshot: enrollment, info: signingInfo, address: mailbox.primarySmtpAddress, keyNotAfter: certificateMode === "expired" ? expiredSigningKey?.notAfter : activeSigningKey?.notAfter, canRequest: canManageKeys, requesting: signingStatus === "enrolling", onCheck: canManageKeys ? () => void checkEnrollmentNow(mailboxUid) : undefined, onRequest: handleEnrollSigning })] })), !activeSigningKey && !certificateMode && !canManageKeys ? (_jsx("p", { className: "text-sm text-text-muted", children: "Not enabled." })) : activeSigningKey || certificateMode ? null : (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("p", { className: "text-xs text-text-muted", children: "Lets recipients verify that mail from this mailbox is genuinely from you. Optional \u2014 encryption already works without it." }), beforeRequestText(signingInfo, mailbox.primarySmtpAddress) && (_jsx("p", { className: "text-xs text-text-muted", children: beforeRequestText(signingInfo, mailbox.primarySmtpAddress) })), healthWarning(signingInfo) && _jsx(Alert, { children: healthWarning(signingInfo) }), enrollment?.gone && _jsx(Alert, { children: STALE_REQUEST_TEXT }), signingError && _jsx(Alert, { children: signingError }), signingInfo?.backend !== "none" && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: signingStatus === "enrolling", disabled: signingStatus !== "idle", onClick: handleEnrollSigning, children: "Enable digital signatures" }))] }))] }), mailbox.escrowScopeId && (_jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Escrow" }), escrowError && _jsx(Alert, { children: escrowError }), hasEscrowWrap ? (_jsx("p", { className: "text-sm text-text-muted", children: "This mailbox is under legal/compliance escrow \u2014 an authorized holder in your organization can recover its encrypted mail if needed. This does not weaken protection against anyone else." })) : (_jsxs("div", { className: "flex flex-col gap-2", children: [_jsxs("p", { className: "text-xs text-text-muted", children: ["Your organization has assigned this mailbox to an escrow scope, but nothing has been protected yet \u2014 an authorized holder cannot recover this mailbox\u2019s encrypted mail until you complete this step.", " ", "This does not weaken protection against anyone else."] }), canManageKeys && (_jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: wrappingEscrow, disabled: wrappingEscrow, onClick: handleWrapEscrow, children: "Add escrow protection" }))] }))] })), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Unlock methods" }), _jsxs("p", { className: "text-xs text-text-muted mb-3", children: ["Removing a method here stops it from being usable to unlock this mailbox going forward, but it is ", _jsx("strong", { children: "not" }), " full revocation \u2014 anyone who already captured a wrapped copy and knows its secret could still use it. For real revocation (e.g. after a lost device), rotate your keys entirely below instead."] }), vault && vault.masterKeyWraps.length > 0 ? (_jsx("ul", { className: "flex flex-col gap-2", children: [...passwordWraps, ...recoveryWraps, ...otherWraps].map((wrap) => {
                                 const key = `${wrap.method}:${wrap.methodId ?? ""}`;
                                 return (_jsxs("li", { className: "flex items-center justify-between gap-3 text-sm py-1.5 px-3 bg-surface-alt rounded-sm", children: [_jsx("span", { children: METHOD_LABELS[wrap.method] ?? wrap.method }), wrap.method !== "escrow" &&
                                             canManageKeys &&
@@ -773,3 +782,4 @@ function EncryptionContent({ canManageKeys }) {
                                         ? "Checking whether a signing certificate enrollment is still in progress..."
                                         : "Rotation is unavailable while a signing certificate enrollment is in progress - rotating now would lose the key being enrolled. Try again once it finishes, or cancel the enrollment." })), signingStatus === "pending" && signingEnrollmentId && (_jsxs("div", { className: "flex flex-col gap-2", children: [cancelEnrollmentError && _jsx(Alert, { children: cancelEnrollmentError }), _jsx("div", { children: _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto", loading: cancelingEnrollment, disabled: cancelingEnrollment, onClick: () => handleCancelEnrollment(signingEnrollmentId), children: "Cancel enrollment" }) })] })), _jsx("input", { type: "password", "aria-label": "New password for rotated keys", placeholder: "New password", className: "w-full text-sm border border-border rounded-sm py-1.5 px-2 bg-surface", value: rotationPassword, onChange: (e) => setRotationPassword(e.target.value), disabled: rotating || rotationBlockedBySigning, autoComplete: "new-password" }), _jsx("input", { type: "password", "aria-label": "Confirm new password for rotated keys", placeholder: "Confirm new password", className: "w-full text-sm border border-border rounded-sm py-1.5 px-2 bg-surface", value: rotationConfirmPassword, onChange: (e) => setRotationConfirmPassword(e.target.value), disabled: rotating || rotationBlockedBySigning, autoComplete: "new-password" }), _jsx("div", { children: _jsx(Button, { type: "submit", variant: "secondary", className: "!w-auto text-danger", loading: rotating, disabled: rotating || rotationBlockedBySigning, children: "Rotate keys now" }) })] })] })), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Session timeout" }), _jsx("p", { className: "text-xs text-text-muted mb-3", children: "Automatically destroys your unlocked keys on this device after this much time with no activity anywhere in the app - not just Mail or Settings. Applies the next time you open or reload the app." }), _jsx("select", { "aria-label": "Session timeout", className: "text-sm border border-border rounded-sm py-1.5 px-2 bg-surface", value: idleTimeoutMinutes, onChange: handleIdleTimeoutChange, children: IDLE_TIMEOUT_OPTIONS_MINUTES.map((minutes) => (_jsx("option", { value: minutes, children: idleTimeoutLabel(minutes) }, minutes))) })] }), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "Local search index size" }), _jsxs("p", { className: "text-xs text-text-muted mb-3", children: ["How much decrypted mail this device keeps in a local encrypted search index, so recent search results and inbox previews work instantly without contacting the server every time. Defaults to ", localIndexDefaultByteBudgetLabel, " on this device. Applies the next time this mailbox\u2019s index rebuilds (e.g. the next time you unlock it) \u2014 lowering it doesn\u2019t delete anything already indexed elsewhere, it just narrows what this device keeps a local copy of."] }), _jsx("select", { "aria-label": "Local search index size", className: "text-sm border border-border rounded-sm py-1.5 px-2 bg-surface", value: localIndexByteBudget, onChange: handleLocalIndexByteBudgetChange, children: LOCAL_INDEX_SIZE_OPTIONS.map((option) => (_jsx("option", { value: option.bytes, children: option.label }, option.bytes))) })] }), _jsxs("div", { children: [_jsx("h2", { className: "text-sm font-semibold mb-2", children: "This session" }), _jsx("p", { className: "text-xs text-text-muted mb-3", children: "Removes your unlocked keys from this browser tab\u2019s memory right now, without affecting any other device. You\u2019ll be asked to unlock again the next time you read or send encrypted mail here." }), _jsx(Button, { type: "button", variant: "secondary", className: "!w-auto text-danger", onClick: handleDestroyKeysNow, children: "Destroy keys on this device now" })] })] }) }));
 }
+export default routedPage("/settings/encryption", SettingsEncryptionPage);

package/dist/apps/www/settings/filters/[uid].d.ts

@@ -1,8 +1,8 @@
-import React from "react";
 import { SettingsShellProps } from "../../../shared/components/settings/layout/SettingsShell.js";
 export type MailFilterDetailPageProps = Omit<SettingsShellProps, "active"> & {
     params: {
         uid: string;
     };
 };
-export default function MailFilterDetailPage(props: MailFilterDetailPageProps): React.JSX.Element;
+declare const _default: import("../../../shared/navigation/AppRouter.js").RoutedPageComponent<MailFilterDetailPageProps>;
+export default _default;

package/dist/apps/www/settings/filters/[uid].js

@@ -3,6 +3,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../../_routedPage.js";
 import { useEffect, useState } from "react";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { listFolders } from "@rapidmx/react-shared/mail/mailApi.js";
@@ -13,8 +14,9 @@ import { MAIL_FILTER_CONDITION_FIELDS, buildMailFilterActionTypes } from "./_mai
 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 { notifyApiError } from "../../../shared/notifications/apiErrors.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 MailFilterDetailPage(props) {
+function MailFilterDetailPage(props) {
     return (_jsx(SettingsShell, { ...props, active: "filters", children: _jsx(MailFilterDetailContent, { uid: props.params.uid }) }));
 }
 function MailFilterDetailContent({ uid }) {
@@ -86,7 +88,8 @@ function MailFilterDetailContent({ uid }) {
             setSaved(true);
         }
         catch (err) {
-            setError(err instanceof ApiRequestError ? err.message : "Could not save this mail filter.");
+            // A pop-up: `error` is only this form's own validation (and the load failure above).
+            notifyApiError(err, "Couldn't save the mail filter");
         }
         finally {
             setSaving(false);
@@ -107,3 +110,4 @@ function MailFilterDetailContent({ uid }) {
     }
     return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsxs("div", { className: "max-w-3xl", children: [_jsx("a", { href: `/settings/filters?mailboxUid=${encodeURIComponent(mailboxUid)}`, className: "text-sm text-primary-dark hover:underline", children: "\u2190 All mail filters" }), _jsx("h1", { className: "text-lg font-bold tracking-tight mt-1 mb-5", children: original.name }), error && _jsx(Alert, { children: error }), saved && !error && _jsx("div", { className: "mb-4 text-sm text-success font-medium", children: "Saved." }), _jsxs("form", { onSubmit: handleSubmit, className: "flex flex-col gap-5", children: [_jsx("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) }) }) }), _jsx(RuleBuilder, { value: rule, onChange: setRule, conditionFields: MAIL_FILTER_CONDITION_FIELDS, actionTypes: buildMailFilterActionTypes(folders), showValidation: showValidation }), _jsx("div", { children: _jsx(Button, { type: "submit", loading: saving, disabled: saving, className: "!w-auto", children: "Save changes" }) })] })] }) }));
 }
+export default routedPage("/settings/filters/:uid", MailFilterDetailPage);

package/dist/apps/www/settings/filters/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
 import { SettingsShellProps } from "../../../shared/components/settings/layout/SettingsShell.js";
 export type SettingsFiltersPageProps = Omit<SettingsShellProps, "active">;
-export default function SettingsFiltersPage(props: SettingsFiltersPageProps): React.JSX.Element;
+declare const _default: import("../../../shared/navigation/AppRouter.js").RoutedPageComponent<SettingsFiltersPageProps>;
+export default _default;

package/dist/apps/www/settings/filters/index.js

@@ -3,13 +3,14 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
+import { routedPage } from "../../_routedPage.js";
 import { useEffect, useState } from "react";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { listMailFilterRules } from "@rapidmx/react-shared/mail/mailFilterRulesApi.js";
 import SettingsShell, { useSettingsShell } from "../../../shared/components/settings/layout/SettingsShell.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import Button from "@rapidmx/react-shared/components/buttons/Button.js";
-export default function SettingsFiltersPage(props) {
+function SettingsFiltersPage(props) {
     return (_jsx(SettingsShell, { ...props, active: "filters", children: _jsx(FiltersContent, {}) }));
 }
 function FiltersContent() {
@@ -28,3 +29,4 @@ function FiltersContent() {
     const sorted = [...rules].sort((a, b) => a.sequence - b.sequence);
     return (_jsx("div", { className: "flex-1 min-w-0 overflow-y-auto p-6", children: _jsxs("div", { className: "max-w-3xl", children: [_jsxs("div", { className: "flex items-center justify-between mb-5", children: [_jsx("h1", { className: "text-lg font-bold tracking-tight", children: "Mail Filters" }), _jsx("a", { href: `/settings/filters/new?mailboxUid=${encodeURIComponent(mailboxUid)}`, children: _jsx(Button, { type: "button", className: "!w-auto", children: "+ New filter" }) })] }), _jsx("p", { className: "text-sm text-text-muted mb-4", children: "Applied in order once a message is verdicted safe to deliver, before it reaches your Inbox." }), error && _jsx(Alert, { children: error }), loading ? (_jsx("p", { className: "text-sm text-text-muted", children: "Loading\u2026" })) : sorted.length === 0 ? (_jsx("p", { className: "text-sm text-text-muted", children: "No mail filters 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", "Name", "Enabled", "Actions", ""].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: sorted.map((rule) => (_jsxs("tr", { children: [_jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: rule.sequence }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: rule.name }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: rule.enabled ? "Yes" : "No" }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border", children: rule.actions.length }), _jsx("td", { className: "py-2.5 px-2.5 border-b border-border text-right", children: _jsx("a", { href: `/settings/filters/${encodeURIComponent(rule.uid)}?mailboxUid=${encodeURIComponent(mailboxUid)}`, className: "text-primary-dark hover:underline font-medium", children: "View" }) })] }, rule.uid))) })] }) }))] }) }));
 }
+export default routedPage("/settings/filters", SettingsFiltersPage);

package/dist/apps/www/settings/filters/new/index.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
 import { SettingsShellProps } from "../../../../shared/components/settings/layout/SettingsShell.js";
 export type NewMailFilterPageProps = Omit<SettingsShellProps, "active">;
-export default function NewMailFilterPage(props: NewMailFilterPageProps): React.JSX.Element;
+declare const _default: import("../../../../shared/navigation/AppRouter.js").RoutedPageComponent<NewMailFilterPageProps>;
+export default _default;