@rapidmx/web-client 0.20.0 → 0.21.0

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

@@ -9,7 +9,7 @@ import { useRouter } from "@rapidrest/react/client";
 import { HiOutlineClipboardDocumentList, HiOutlineClock, HiOutlineCpuChip, HiOutlineDocumentArrowDown, HiOutlineDocumentCheck, HiOutlineGlobeAlt, HiOutlineInboxStack, HiOutlineKey, HiOutlineLockClosed, HiOutlinePaintBrush, HiOutlinePuzzlePiece, HiOutlineQueueList, HiOutlineRocketLaunch, HiOutlineShieldCheck, HiOutlineShieldExclamation, HiOutlineUserGroup, HiOutlineWrenchScrewdriver, HiOutlineBars3, } from "react-icons/hi2";
 import { apiFetch, ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { getSetupStatus } from "@rapidmx/react-shared/admin/setupApi.js";
-import { useRedirectIfUnauthenticated } from "@rapidmx/react-shared/auth/session.js";
+import { useSessionRefresh } from "@rapidmx/react-shared/auth/session.js";
 import useBranding from "@rapidmx/react-shared/branding/useBranding.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import Button from "@rapidmx/react-shared/components/buttons/Button.js";
@@ -118,7 +118,7 @@ export default function AdminShell({ active, userUid, authServerUrl, pluginNav,
     // console. `useBranding()` is still what injects the custom stylesheet and supplies the rail's icon.
     const { branding, iconSrc } = useBranding();
     const footer = useBrandingHtml(branding?.footerHtml);
-    useRedirectIfUnauthenticated(userUid, authServerUrl);
+    useSessionRefresh(userUid, authServerUrl);
     useEffect(() => {
         if (!userUid) {
             return;

package/dist/apps/shared/components/admin/settings/BrandingForm.js

@@ -12,9 +12,9 @@ import CopyButton from "@rapidmx/react-shared/components/buttons/CopyButton.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";
 const MAX_UPLOAD_BYTES = 5 * 1024 * 1024;
 /** A header that uses both variables - the snippet the Branding page offers to copy. */
-export const HEADER_HTML_EXAMPLE = `<div style="display:flex; align-items:center; justify-content:space-between; padding:0.5rem 1rem">
-    <span>{APP_TITLE}</span>
-    <span>{USER_MENU}</span>
+export const HEADER_HTML_EXAMPLE = `<div style="display:flex; align-items:center; justify-content:space-between; padding:0.5rem 1rem">
+    <span>{APP_TITLE}</span>
+    <span>{USER_MENU}</span>
 </div>`;
 /** SVG logo/icon uploads are refused (the server refuses them too): an SVG served from this origin can carry script. */
 export function isSvgFile(file) {

package/dist/apps/shared/components/escrow/layout/EscrowShell.js

@@ -8,7 +8,7 @@ import { useEffect, useState } from "react";
 import { HiOutlineClipboardDocumentList, HiOutlineFolderOpen } from "react-icons/hi2";
 import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
 import { listMatters } from "@rapidmx/react-shared/admin/mattersApi.js";
-import { useRedirectIfUnauthenticated } from "@rapidmx/react-shared/auth/session.js";
+import { useSessionRefresh } from "@rapidmx/react-shared/auth/session.js";
 import { getBranding } from "@rapidmx/react-shared/branding/brandingApi.js";
 import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
 import BottomTabBar from "@rapidmx/react-shared/components/navigation/BottomTabBar.js";
@@ -41,7 +41,7 @@ export default function EscrowShell({ active, userUid, authServerUrl, children }
     const [status, setStatus] = useState("checking");
     const [error, setError] = useState(null);
     const [iconSrc, setIconSrc] = useState(DEFAULT_ICON_SRC);
-    useRedirectIfUnauthenticated(userUid, authServerUrl);
+    useSessionRefresh(userUid, authServerUrl);
     // Only the icon is taken from branding here. The escrow console deliberately skips `useBranding()`, which
     // would inject the custom stylesheet, and never renders the admin-configured header/footer HTML - this
     // console handles escrow key material, so no admin-supplied markup or CSS runs on it.

package/dist/apps/shared/components/layout/AppShell.js

@@ -7,7 +7,7 @@ import "../../styles/app.css";
 import { useEffect, useLayoutEffect, useRef, useState } from "react";
 import { HiOutlineCalendarDays, HiOutlineClipboardDocumentList, HiOutlineEnvelope, HiOutlinePuzzlePiece, HiOutlineUsers, } from "react-icons/hi2";
 import { useRouter } from "@rapidrest/react/client";
-import { useRedirectIfUnauthenticated } from "@rapidmx/react-shared/auth/session.js";
+import { useSessionRefresh } from "@rapidmx/react-shared/auth/session.js";
 import { getSetupStatus } from "@rapidmx/react-shared/admin/setupApi.js";
 import { stopImpersonating } from "@rapidmx/react-shared/mail/mailApi.js";
 import useBranding from "@rapidmx/react-shared/branding/useBranding.js";
@@ -118,7 +118,9 @@ export function AppChrome({ active, userUid, authServerUrl, impersonating, imper
     useSigningEnrollmentWatcher({ userUid, mailboxes: mail.mailboxes, enabled: inFrame });
     // A meeting reminder pops up on whichever page they are - see the hook.
     useCalendarReminders({ userUid, enabled: inFrame });
-    useRedirectIfUnauthenticated(userUid, authServerUrl);
+    // A refused refresh means the sign-in has ended: open compose windows save what they hold (the access token still works for a while) and the
+    // browser goes to sign-in. Not while viewing as another user - the refresh cookie is the admin's own, and refreshing would end the impersonation.
+    useSessionRefresh(userUid, authServerUrl, { paused: impersonating, beforeRedirect: () => flushComposeDrafts(LOGOUT_TIMEOUT_MS) });
     // Any request this app makes that the server answers with a 401 - the session ended - raises one "Your session expired" pop-up with a
     // Sign in action (see `notifySessionExpired()`), whichever request noticed first, a background refresh included.
     useEffect(() => {

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

@@ -12,12 +12,18 @@ export interface ComposeWindowProps {
     /** How long (ms) after the last edit the draft is autosaved. Defaults to `DEFAULT_AUTOSAVE_DELAY_MS`;
      * only overridden by tests. */
     autosaveDelayMs?: number;
+    /** The longest (ms) an unsaved edit waits before the draft is saved even though typing hasn't paused - so a
+     * message written without a 2-second break is still saved regularly. Defaults to `DEFAULT_AUTOSAVE_MAX_WAIT_MS`
+     * and is never shorter than `autosaveDelayMs`; only overridden by tests. */
+    autosaveMaxWaitMs?: number;
     /** Backoff (ms) between automatic retries of a failed mailbox/encryption-policy load, one entry per retry.
      * Defaults to `DEFAULT_CRYPTO_RETRY_DELAYS_MS`; only overridden by tests. */
     cryptoRetryDelaysMs?: number[];
 }
 /** Debounce between the last edit and the draft autosave. */
 export declare const DEFAULT_AUTOSAVE_DELAY_MS = 2000;
+/** The longest an edit stays unsaved while the user keeps typing (the debounce above restarts on every keystroke, so it alone never fires then). */
+export declare const DEFAULT_AUTOSAVE_MAX_WAIT_MS = 30000;
 /** Automatic, silent retries of a failed mailbox/encryption-policy (or recipient key) load, one entry per retry - a flapping gateway is waited out
  * in the background, without a word to the user. */
 export declare const DEFAULT_CRYPTO_RETRY_DELAYS_MS: number[];
@@ -35,4 +41,4 @@ export declare const DEFAULT_CRYPTO_RETRY_DELAYS_MS: number[];
  * see `ComposeContext.tsx`'s own doc comment for how that interacts with several sessions being open at
  * once.
  */
-export default function ComposeWindow({ session, onClose, onToggleMinimize, userUid, trusted, autosaveDelayMs, cryptoRetryDelaysMs, }: ComposeWindowProps): React.JSX.Element;
+export default function ComposeWindow({ session, onClose, onToggleMinimize, userUid, trusted, autosaveDelayMs, autosaveMaxWaitMs, cryptoRetryDelaysMs, }: ComposeWindowProps): React.JSX.Element;

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

@@ -36,6 +36,8 @@ import Button from "@rapidmx/react-shared/components/buttons/Button.js";
 import Modal from "@rapidmx/react-shared/components/overlays/Modal.js";
 /** Debounce between the last edit and the draft autosave. */
 export const DEFAULT_AUTOSAVE_DELAY_MS = 2000;
+/** The longest an edit stays unsaved while the user keeps typing (the debounce above restarts on every keystroke, so it alone never fires then). */
+export const DEFAULT_AUTOSAVE_MAX_WAIT_MS = 30000;
 /** Automatic, silent retries of a failed mailbox/encryption-policy (or recipient key) load, one entry per retry - a flapping gateway is waited out
  * in the background, without a word to the user. */
 export const DEFAULT_CRYPTO_RETRY_DELAYS_MS = [1000, 2000, 4000, 8000, 15000, 30000, 60000];
@@ -96,7 +98,7 @@ function HeaderButton({ label, onClick, icon: Icon, disabled, shortcut, }) {
  * see `ComposeContext.tsx`'s own doc comment for how that interacts with several sessions being open at
  * once.
  */
-export default function ComposeWindow({ session, onClose, onToggleMinimize, userUid, trusted, autosaveDelayMs = DEFAULT_AUTOSAVE_DELAY_MS, cryptoRetryDelaysMs = DEFAULT_CRYPTO_RETRY_DELAYS_MS, }) {
+export default function ComposeWindow({ session, onClose, onToggleMinimize, userUid, trusted, autosaveDelayMs = DEFAULT_AUTOSAVE_DELAY_MS, autosaveMaxWaitMs = DEFAULT_AUTOSAVE_MAX_WAIT_MS, cryptoRetryDelaysMs = DEFAULT_CRYPTO_RETRY_DELAYS_MS, }) {
     const { id, initialTo, initialCc, initialSubject, initialQuotedHtml, initialEncrypt, signatureContext, suppressSigning, minimized, quotePending, late, resume } = session;
     // What a reply worked out after this window opened (see `OpenComposeInput.pending`): better recipients, applied below
     // only to fields still exactly as they opened - so these, not `initialTo`/`initialCc`, are what "untouched" is measured against.
@@ -197,6 +199,8 @@ export default function ComposeWindow({ session, onClose, onToggleMinimize, user
     const lastSavedRef = useRef(null);
     /** An edit is waiting on the autosave debounce - flushed if the window unmounts first. */
     const pendingSaveRef = useRef(false);
+    /** Fires the save when an edit has waited `autosaveMaxWaitMs` without the debounce ever getting a pause to fire in. */
+    const maxWaitTimerRef = useRef(undefined);
     /** Send was pressed and is being validated/handed over: a second press (a double click, the shortcut held or repeated) does nothing. */
     const submittingRef = useRef(false);
     /** Attachment/inline-image uploads on the wire, and who is waiting for them to finish (Send pressed meanwhile). */
@@ -751,6 +755,8 @@ export default function ComposeWindow({ session, onClose, onToggleMinimize, user
         const target = latestRef.current.draft;
         const previous = saveInFlightRef.current;
         pendingSaveRef.current = false;
+        clearTimeout(maxWaitTimerRef.current);
+        maxWaitTimerRef.current = undefined;
         setSaveStatus("saving");
         const outcome = (async () => {
             const before = await previous;
@@ -1022,14 +1028,27 @@ export default function ComposeWindow({ session, onClose, onToggleMinimize, user
             lastSavedRef.current !== `${draft.uid}:${contentKey}`;
         pendingSaveRef.current = due;
         if (!due) {
+            clearTimeout(maxWaitTimerRef.current);
+            maxWaitTimerRef.current = undefined;
             return;
         }
+        // The debounce below restarts on every edit, so steady typing never lets it fire: this timer, started by the first unsaved edit and stopped
+        // by the save that follows, is what saves such a message at a regular interval.
+        if (maxWaitTimerRef.current === undefined) {
+            maxWaitTimerRef.current = setTimeout(() => {
+                maxWaitTimerRef.current = undefined;
+                if (pendingSaveRef.current && !finishedRef.current) {
+                    void saveDraftNow();
+                }
+            }, Math.max(autosaveMaxWaitMs, autosaveDelayMs));
+        }
         const timer = setTimeout(() => void saveDraftNow(), autosaveDelayMs);
         return () => clearTimeout(timer);
     }, [draft, contentReady, autosaveSuppressed, hasUserContent, contentKey]);
     // Unmounting with an edit still waiting on the debounce (e.g. the whole app shell unmounting) saves it
     // right away rather than losing it.
     useEffect(() => () => {
+        clearTimeout(maxWaitTimerRef.current);
         if (pendingSaveRef.current && !finishedRef.current) {
             void saveDraftNow();
         }

package/dist/apps/shared/components/mail/reading/printMessage.js

@@ -1,17 +1,17 @@
 import { attachmentSource, makeCidResolver } from "./bodyContent.js";
 import { prepareBodyHtml } from "./bodyHtml.js";
 import { frameCsp } from "./frameDocument.js";
-const PRINT_CSS = `
-html{font:14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:#000;background:#fff}
-body{margin:0;padding:24px}
-h1{font-size:20px;margin:0 0 12px}
-dl{margin:0 0 12px;display:grid;grid-template-columns:max-content 1fr;gap:2px 12px}
-dt{font-weight:600;color:#444}
-dd{margin:0;overflow-wrap:anywhere}
-hr{border:0;border-top:1px solid #999;margin:0 0 16px}
-#rr-body{overflow-wrap:break-word}
-#rr-body img{max-width:100%;height:auto}
-#rr-body pre,pre.rr-text{white-space:pre-wrap;font:inherit;margin:0}
+const PRINT_CSS = `
+html{font:14px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:#000;background:#fff}
+body{margin:0;padding:24px}
+h1{font-size:20px;margin:0 0 12px}
+dl{margin:0 0 12px;display:grid;grid-template-columns:max-content 1fr;gap:2px 12px}
+dt{font-weight:600;color:#444}
+dd{margin:0;overflow-wrap:anywhere}
+hr{border:0;border-top:1px solid #999;margin:0 0 16px}
+#rr-body{overflow-wrap:break-word}
+#rr-body img{max-width:100%;height:auto}
+#rr-body pre,pre.rr-text{white-space:pre-wrap;font:inherit;margin:0}
 `;
 export function escapeHtml(text) {
     return text.replace(/&/g, "&amp;").replace(/</g, "&lt;").replace(/>/g, "&gt;").replace(/"/g, "&quot;").replace(/'/g, "&#39;");