@rapidmx/web-client 0.23.0 → 0.25.1

package/dist/apps/shared/components/calendar/eventFormat.js

@@ -169,6 +169,19 @@ export function formatStoredWhen(startDate, endDate, allDay, now = new Date()) {
     }
     return formatWhen(new Date(startDate), new Date(endDate), false, now);
 }
+/** The date the form's start falls on, for reading a zone's offset as it will be for the event (daylight saving); now while there is no date. */
+export function zoneDate(start) {
+    const day = new Date(`${start.slice(0, 10)}T12:00:00Z`);
+    return Number.isNaN(day.getTime()) ? new Date() : day;
+}
+/** `formatWhen()` for a stored timed event as `zone`'s clock reads it, whatever zone the viewer is in. */
+export function formatStoredWhenInZone(startDate, endDate, zone, now = new Date()) {
+    const onZoneClock = (iso) => {
+        const wall = new Date(toEventWallClock(new Date(iso).getTime(), zone, false));
+        return new Date(wall.getUTCFullYear(), wall.getUTCMonth(), wall.getUTCDate(), wall.getUTCHours(), wall.getUTCMinutes());
+    };
+    return formatWhen(onZoneClock(startDate), onZoneClock(endDate), false, now);
+}
 /** Adds the guests typed or pasted into the guests field to `current` - recipients separated by commas or semicolons, each an address or
  * `Name <address>` (see `applyGuestChips()`, which keeps who is already there): an address already on the list (in any case) or in
  * `skipAddresses` is skipped, and what is not an address comes back as `invalid` for the field to keep. */

package/dist/apps/shared/components/calendar/timePicker.d.ts

@@ -0,0 +1,31 @@
+/** The step between the times a time field offers. */
+export declare const TIME_STEP_MINUTES = 15;
+/**
+ * The start a new event gets when nothing was clicked: the next half hour (11:12 becomes 11:30; a time already on the half hour stays), with the
+ * event lasting an hour from there.
+ */
+export declare function nextHalfHour(now: Date): Date;
+/** `HH:mm` (24 hour) as a 12 hour clock reading: "13:05" is "1:05 PM". */
+export declare function formatTimeOfDay(time: string): string;
+/**
+ * What was typed into a time field as `HH:mm`, or `null` when it isn't a time. Takes 24 hour and 12 hour readings, with or without the colon and
+ * the space: "15:45", "3:45 pm", "3:45p", "345pm", "1130" and a bare hour such as "9" (9:00) are all times.
+ */
+export declare function parseTimeInput(text: string): string | null;
+/** Every time of a day, a quarter hour apart, as `HH:mm`. */
+export declare function dayTimes(): string[];
+/** A length of time as a menu says it: "15 mins", "1 hr", "1.5 hrs", "2 hrs". */
+export declare function formatDuration(minutes: number): string;
+export interface EndTimeOption {
+    /** The end as `YYYY-MM-DDTHH:mm`. */
+    value: string;
+    /** The time of day, as a 12 hour clock reading. */
+    label: string;
+    /** How long the event would last, "(1.5 hrs)". */
+    hint: string;
+}
+/**
+ * The ends a time field offers for an event starting at `start` (`YYYY-MM-DDTHH:mm`): each quarter hour on the clock after the start, up to a
+ * day later, with the length of the event that end would make.
+ */
+export declare function endTimeOptions(start: string): EndTimeOption[];

package/dist/apps/shared/components/calendar/timePicker.js

@@ -0,0 +1,89 @@
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { format } from "date-fns";
+/** The step between the times a time field offers. */
+export const TIME_STEP_MINUTES = 15;
+const MS_PER_MINUTE = 60000;
+/**
+ * The start a new event gets when nothing was clicked: the next half hour (11:12 becomes 11:30; a time already on the half hour stays), with the
+ * event lasting an hour from there.
+ */
+export function nextHalfHour(now) {
+    const slot = 30 * MS_PER_MINUTE;
+    return new Date(Math.ceil(now.getTime() / slot) * slot);
+}
+/** `HH:mm` (24 hour) as a 12 hour clock reading: "13:05" is "1:05 PM". */
+export function formatTimeOfDay(time) {
+    // A cleared date leaves no time to read: the field is empty, not an error.
+    if (!/^\d\d:\d\d$/.test(time)) {
+        return "";
+    }
+    const [hours, minutes] = time.split(":").map(Number);
+    return format(new Date(2000, 0, 1, hours, minutes), "h:mm a");
+}
+/**
+ * What was typed into a time field as `HH:mm`, or `null` when it isn't a time. Takes 24 hour and 12 hour readings, with or without the colon and
+ * the space: "15:45", "3:45 pm", "3:45p", "345pm", "1130" and a bare hour such as "9" (9:00) are all times.
+ */
+export function parseTimeInput(text) {
+    const match = /^\s*(\d{1,2})(?::?(\d{2}))?\s*(?:([ap])\.?m?\.?)?\s*$/i.exec(text);
+    if (!match) {
+        return null;
+    }
+    let hours = Number(match[1]);
+    const minutes = match[2] === undefined ? 0 : Number(match[2]);
+    const meridiem = match[3]?.toLowerCase();
+    if (minutes > 59) {
+        return null;
+    }
+    if (meridiem) {
+        if (hours < 1 || hours > 12) {
+            return null;
+        }
+        hours = (hours % 12) + (meridiem === "p" ? 12 : 0);
+    }
+    else if (hours > 23) {
+        return null;
+    }
+    return `${String(hours).padStart(2, "0")}:${String(minutes).padStart(2, "0")}`;
+}
+/** Every time of a day, a quarter hour apart, as `HH:mm`. */
+export function dayTimes() {
+    return Array.from({ length: (24 * 60) / TIME_STEP_MINUTES }, (_, i) => {
+        const minutes = i * TIME_STEP_MINUTES;
+        return `${String(Math.floor(minutes / 60)).padStart(2, "0")}:${String(minutes % 60).padStart(2, "0")}`;
+    });
+}
+/** A length of time as a menu says it: "15 mins", "1 hr", "1.5 hrs", "2 hrs". */
+export function formatDuration(minutes) {
+    if (minutes < 60) {
+        return `${minutes} min${minutes === 1 ? "" : "s"}`;
+    }
+    const hours = Math.round((minutes / 60) * 100) / 100;
+    return `${hours} ${hours === 1 ? "hr" : "hrs"}`;
+}
+/** `YYYY-MM-DDTHH:mm` read as a wall clock, in minutes since the epoch (no zone: the daylight saving changes of a zone are not this field's business). */
+function wallMinutes(value) {
+    return Date.parse(`${value.slice(0, 16)}:00Z`) / MS_PER_MINUTE;
+}
+function wallString(minutes) {
+    return new Date(minutes * MS_PER_MINUTE).toISOString().slice(0, 16);
+}
+/**
+ * The ends a time field offers for an event starting at `start` (`YYYY-MM-DDTHH:mm`): each quarter hour on the clock after the start, up to a
+ * day later, with the length of the event that end would make.
+ */
+export function endTimeOptions(start) {
+    if (!/^\d{4}-\d\d-\d\dT\d\d:\d\d/.test(start)) {
+        return [];
+    }
+    const startMinutes = wallMinutes(start);
+    const options = [];
+    for (let at = Math.floor(startMinutes / TIME_STEP_MINUTES + 1) * TIME_STEP_MINUTES; at <= startMinutes + 24 * 60; at += TIME_STEP_MINUTES) {
+        const value = wallString(at);
+        options.push({ value, label: formatTimeOfDay(value.slice(11, 16)), hint: `(${formatDuration(at - startMinutes)})` });
+    }
+    return options;
+}

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

@@ -4,7 +4,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import { useContext, useId, useRef } from "react";
-import { HiOutlineComputerDesktop, HiOutlineMoon, HiOutlineSun } from "react-icons/hi2";
+import { HiOutlineComputerDesktop, HiOutlineMoon, HiOutlinePaintBrush, HiOutlineSun } from "react-icons/hi2";
 import { AppearanceContext, INERT_APPEARANCE } from "../../appearance/appearanceContext.js";
 const CHOICES = [
     { mode: "system", label: "System", hint: "System - follow this device", Icon: HiOutlineComputerDesktop },
@@ -42,7 +42,7 @@ export default function ThemeSwitch() {
             choose(target, true);
         }
     }
-    return (_jsxs("div", { className: "flex items-center justify-between gap-3 px-3.5 py-2 border-b border-border", children: [_jsx("span", { id: labelId, className: "text-sm text-text", children: "Theme" }), _jsx("div", { role: "radiogroup", "aria-labelledby": labelId, className: "inline-flex rounded-sm border border-border bg-surface-alt p-0.5", children: CHOICES.map(({ mode, label, hint, Icon }, index) => {
+    return (_jsxs("div", { className: "flex items-center justify-between gap-3 px-3.5 py-2 border-b border-border", children: [_jsxs("span", { id: labelId, className: "flex items-center gap-2 text-sm text-text", children: [_jsx(HiOutlinePaintBrush, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Theme"] }), _jsx("div", { role: "radiogroup", "aria-labelledby": labelId, className: "inline-flex rounded-sm border border-border bg-surface-alt p-0.5", children: CHOICES.map(({ mode, label, hint, Icon }, index) => {
                     const selected = mode === current;
                     return (_jsx("button", { ref: (element) => {
                             buttons.current[index] = element;

package/dist/apps/shared/components/layout/UserMenu.d.ts

@@ -18,8 +18,7 @@ export interface UserMenuProps {
     trustedRoles?: readonly string[];
     /** Shows a "Settings" item, above "Admin"/"Sign Out" — an account-scoped surface (like "Admin"), not
      * a content-scoped one, so it lives here rather than as a 5th `AppShell` rail icon. Links straight to
-     * `/settings/auto-reply`, the only settings section that exists today; repoint this at a real
-     * `/settings` landing page once a second section (Mail Filters, Signatures) makes one worth building. */
+     * `/settings/profile`, the first settings section; repoint this at a real `/settings` landing page once one is worth building. */
     showSettingsLink?: boolean;
     /** Shows the notification controls, above "Admin Console"/"Sign Out": a "Notifications" on/off switch for every pop-up and,
      * while the browser hasn't been asked, "Turn on desktop notifications". Both are per browser (see `notifications/preferences.ts`

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

@@ -6,7 +6,7 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { useContext, useEffect, useLayoutEffect, useRef, useState } from "react";
 import { createPortal } from "react-dom";
 import useIsMobile from "../../../../lib/util/useIsMobile.js";
-import { HiOutlineArrowUturnLeft, HiOutlineShieldCheck } from "react-icons/hi2";
+import { HiOutlineArrowRightOnRectangle, HiOutlineArrowUturnLeft, HiOutlineBell, HiOutlineBellAlert, HiOutlineClock, HiOutlineCog6Tooth, HiOutlineCommandLine, HiOutlineShieldCheck, HiOutlineUserCircle, } from "react-icons/hi2";
 import { formatProfileName, getMyProfile, getMyUsername, profileInitials } from "../../../../lib/auth/profileApi.js";
 import { listMailboxes } from "../../../../lib/mail/mailApi.js";
 import { useApiClient } from "../../../../lib/util/apiClientContext.js";
@@ -206,11 +206,11 @@ export default function UserMenu({ userUid, authServerUrl, onSignOut, showAdminL
     const accountUrl = accountUrlOf(authServerUrl);
     return (_jsxs("div", { className: "relative", ref: containerRef, children: [_jsxs("button", { type: "button", onClick: () => setOpen((o) => !o), "aria-haspopup": "true", "aria-expanded": open, "aria-label": "Account menu", className: "relative flex items-center gap-1.5 rounded-pill py-1 pl-1 pr-2 hover:bg-surface-alt", children: [_jsx(Avatar, { profile: profile, initials: initials }), unseenErrors > 0 && (_jsx("span", { "data-testid": "unseen-errors-dot", "aria-hidden": "true", className: "absolute right-0.5 top-0.5 h-2.5 w-2.5 rounded-full border-2 border-surface bg-danger" })), _jsx("svg", { width: "14", height: "14", viewBox: "0 0 20 20", fill: "none", className: `text-text-muted transition-transform ${open ? "rotate-180" : ""}`, "aria-hidden": "true", children: _jsx("path", { d: "M5 7.5L10 12.5L15 7.5", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round" }) })] }), open &&
                 anchor &&
-                createPortal(_jsxs("div", { ref: menuRef, role: "menu", style: { position: "fixed", right: anchor.right, top: anchor.top, bottom: anchor.bottom }, className: "w-60 max-w-[calc(100vw-1rem)] max-h-[calc(100vh-5rem)] overflow-y-auto bg-surface border border-border rounded-md shadow-modal py-1.5 z-[70]", children: [_jsxs("div", { className: "flex items-center gap-3 px-3.5 py-2.5 border-b border-border", children: [_jsx(Avatar, { profile: profile, initials: initials, large: true }), _jsx("span", { className: "text-sm font-semibold text-text truncate", children: name })] }), showMailLink && (_jsxs("a", { role: "menuitem", href: APP_HREFS.mail, className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineArrowUturnLeft, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Back to mail"] })), _jsx(ThemeSwitch, {}), accountUrl && (_jsx("a", { role: "menuitem", href: accountUrl, className: "block px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: "Account" })), showSettingsLink && (_jsx("a", { role: "menuitem", href: SETTINGS_HREF, className: "block px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: "Settings" })), showNotificationSettings && (_jsxs("button", { role: "menuitemcheckbox", "aria-checked": popups, type: "button", onClick: togglePopups, className: "flex w-full items-center justify-between gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsx("span", { children: "Notifications" }), _jsx("span", { className: "text-xs font-semibold text-text-muted", children: popups ? "On" : "Off" })] })), showNotificationSettings && permission === "default" && (_jsx("button", { role: "menuitem", type: "button", onClick: () => void enableDesktopNotifications(), className: "block w-full px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: "Turn on desktop notifications" })), onShowNotifications && (_jsxs("button", { role: "menuitem", type: "button", onClick: () => {
+                createPortal(_jsxs("div", { ref: menuRef, role: "menu", style: { position: "fixed", right: anchor.right, top: anchor.top, bottom: anchor.bottom }, className: "w-60 max-w-[calc(100vw-1rem)] max-h-[calc(100vh-5rem)] overflow-y-auto bg-surface border border-border rounded-md shadow-modal py-1.5 z-[70]", children: [_jsxs("div", { className: "flex items-center gap-3 px-3.5 py-2.5 border-b border-border", children: [_jsx(Avatar, { profile: profile, initials: initials, large: true }), _jsx("span", { className: "text-sm font-semibold text-text truncate", children: name })] }), showMailLink && (_jsxs("a", { role: "menuitem", href: APP_HREFS.mail, className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineArrowUturnLeft, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Back to mail"] })), _jsx(ThemeSwitch, {}), accountUrl && (_jsxs("a", { role: "menuitem", href: accountUrl, className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineUserCircle, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Account"] })), showSettingsLink && (_jsxs("a", { role: "menuitem", href: SETTINGS_HREF, className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineCog6Tooth, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Settings"] })), showNotificationSettings && (_jsxs("button", { role: "menuitemcheckbox", "aria-checked": popups, type: "button", onClick: togglePopups, className: "flex w-full items-center justify-between gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(HiOutlineBell, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Notifications"] }), _jsx("span", { className: "text-xs font-semibold text-text-muted", children: popups ? "On" : "Off" })] })), showNotificationSettings && permission === "default" && (_jsxs("button", { role: "menuitem", type: "button", onClick: () => void enableDesktopNotifications(), className: "flex w-full items-center gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineBellAlert, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Turn on desktop notifications"] })), onShowNotifications && (_jsxs("button", { role: "menuitem", type: "button", onClick: () => {
                                 setOpen(false);
                                 onShowNotifications();
-                            }, className: "flex w-full items-center justify-between gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsx("span", { children: "Recent notifications" }), unseenErrors > 0 && (_jsxs("span", { className: "rounded-pill bg-danger px-1.5 text-xs font-bold text-white", children: [_jsx("span", { "aria-hidden": "true", children: unseenErrors }), _jsxs("span", { className: "sr-only", children: [unseenErrors, " unseen ", unseenErrors === 1 ? "error" : "errors"] })] }))] })), onShowShortcuts && !isMobile && (_jsx("button", { role: "menuitem", type: "button", "aria-keyshortcuts": ariaKeyShortcuts(SHORTCUTS.global.help, env), onClick: () => {
+                            }, className: "flex w-full items-center justify-between gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsxs("span", { className: "flex items-center gap-2", children: [_jsx(HiOutlineClock, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Recent notifications"] }), unseenErrors > 0 && (_jsxs("span", { className: "rounded-pill bg-danger px-1.5 text-xs font-bold text-white", children: [_jsx("span", { "aria-hidden": "true", children: unseenErrors }), _jsxs("span", { className: "sr-only", children: [unseenErrors, " unseen ", unseenErrors === 1 ? "error" : "errors"] })] }))] })), onShowShortcuts && !isMobile && (_jsxs("button", { role: "menuitem", type: "button", "aria-keyshortcuts": ariaKeyShortcuts(SHORTCUTS.global.help, env), onClick: () => {
                                 setOpen(false);
                                 onShowShortcuts();
-                            }, className: "block w-full px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: "Keyboard shortcuts" })), (showAdminLink || detectedAdmin) && (_jsxs("a", { role: "menuitem", href: "/admin", className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineShieldCheck, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Admin Console"] })), _jsx("button", { role: "menuitem", type: "button", onClick: onSignOut, className: "block w-full text-left px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: "Sign Out" })] }), document.body)] }));
+                            }, className: "flex w-full items-center gap-2 px-3.5 py-2 text-left text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineCommandLine, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Keyboard shortcuts"] })), (showAdminLink || detectedAdmin) && (_jsxs("a", { role: "menuitem", href: "/admin", className: "flex items-center gap-2 px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineShieldCheck, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Admin Console"] })), _jsxs("button", { role: "menuitem", type: "button", onClick: onSignOut, className: "flex w-full items-center gap-2 text-left px-3.5 py-2 text-sm text-text hover:bg-surface-alt", children: [_jsx(HiOutlineArrowRightOnRectangle, { size: 16, "aria-hidden": "true", className: "shrink-0 text-text-muted" }), "Sign Out"] })] }), document.body)] }));
 }

package/dist/apps/shared/components/mail/invite/inviteFormat.js

@@ -1,3 +1,4 @@
+import { describeTimeZone, deviceTimeZone } from "../../../../../lib/util/timeZone.js";
 import { APP_HREFS } from "../../../navigation/appHrefs.js";
 /** Whether an attachment is a calendar file - what tells the pane a message may carry an invitation worth asking the server about. By type
  * or by name, since mail clients disagree about which one they set (`text/calendar`, `application/ics`, or a bare `.ics` as octet-stream). */
@@ -43,15 +44,15 @@ export function formatInviteWhen(invite) {
     }
     const date = new Intl.DateTimeFormat(undefined, DAY_FORMAT);
     const time = new Intl.DateTimeFormat(undefined, CLOCK_FORMAT);
-    // The zone is named once, after the last time shown: the times are the reader's own, not the organizer's.
-    const timeAndZone = new Intl.DateTimeFormat(undefined, { ...CLOCK_FORMAT, timeZoneName: "short" });
+    // The zone is named once, in full, after the last time shown: the times are the reader's own, not the organizer's.
+    const zone = describeTimeZone(deviceTimeZone(), end ?? start);
     const startDay = date.format(start);
     if (!end) {
-        return `${startDay}, ${timeAndZone.format(start)}`;
+        return `${startDay}, ${time.format(start)} • ${zone}`;
     }
     return startDay === date.format(end)
-        ? `${startDay}, ${time.format(start)} - ${timeAndZone.format(end)}`
-        : `${startDay}, ${time.format(start)} - ${date.format(end)}, ${timeAndZone.format(end)}`;
+        ? `${startDay}, ${time.format(start)} - ${time.format(end)} • ${zone}`
+        : `${startDay}, ${time.format(start)} - ${date.format(end)}, ${time.format(end)} • ${zone}`;
 }
 /** The meeting's start the way a list row writes it - `Thu 9/24/2026 1:00 PM` (dates only for an all-day event), in the reader's zone. */
 export function formatRowStart(invite) {

package/dist/apps/shared/components/mail/layout/MailShell.js

@@ -22,6 +22,7 @@ import { primaryMailboxUid } from "../../../mail/primaryMailbox.js";
 import { badgeFor, countOfFolder, inboxUnreadTotal, unreadBadgeTotal, } from "../../../mail/folderCounts.js";
 import { ALL_MAILBOXES_SECTION, useSidebarSections } from "../../../mail/useCollapsedSections.js";
 import FolderBadgeChip from "./FolderBadgeChip.js";
+import { FolderTypeIcon, SharedMailboxMark } from "./folderIcons.js";
 import SidebarSection from "./SidebarSection.js";
 import { useUnreadTitle } from "../../../mail/useUnreadTitle.js";
 import { pendingCountFor, usePendingSends } from "../../../mail/outbox/pendingSends.js";
@@ -220,13 +221,13 @@ export default function MailShell({ userUid, authServerUrl, impersonating, imper
                                         aggregateFolderType === type
                                             ? "bg-primary/10 text-primary-dark font-semibold"
                                             : "text-text hover:bg-surface-alt",
-                                    ].join(" "), children: [_jsx("span", { className: badge?.kind === "unread" ? "font-semibold" : undefined, children: FOLDER_LABELS[type] }), badge && _jsx(FolderBadgeChip, { badge: badge })] }, type));
-                            }) })), mailboxFolders.map(({ mailbox, folders, error: mailboxError }) => (_jsx(SidebarSection, { domId: `${idPrefix}-mail-section-${mailbox.uid}`, label: _jsxs(_Fragment, { children: [mailbox.displayName, mailbox.ownerUserUid ? "" : " (shared)"] }), collapsible: collapsible, expanded: sections.isExpanded(mailbox.uid), onToggle: () => sections.toggle(mailbox.uid), unread: unreadBadgeTotal(folders, counts), notice: mailboxError && (_jsx("div", { className: "px-2.5 pb-1", children: _jsx(Alert, { children: mailboxError }) })), children: folderRows(folders, pendingCountFor(mailbox.uid, pendingSends)).map((row) => {
+                                    ].join(" "), children: [_jsxs("span", { className: ["flex items-center gap-2.5 min-w-0", badge?.kind === "unread" ? "font-semibold" : ""].join(" "), children: [_jsx(FolderTypeIcon, { type: type }), _jsx("span", { className: "truncate", children: FOLDER_LABELS[type] })] }), badge && _jsx(FolderBadgeChip, { badge: badge })] }, type));
+                            }) })), mailboxFolders.map(({ mailbox, folders, error: mailboxError }) => (_jsx(SidebarSection, { domId: `${idPrefix}-mail-section-${mailbox.uid}`, label: _jsxs(_Fragment, { children: [mailbox.displayName, !mailbox.ownerUserUid && _jsx(SharedMailboxMark, {})] }), collapsible: collapsible, expanded: sections.isExpanded(mailbox.uid), onToggle: () => sections.toggle(mailbox.uid), unread: unreadBadgeTotal(folders, counts), notice: mailboxError && (_jsx("div", { className: "px-2.5 pb-1", children: _jsx(Alert, { children: mailboxError }) })), children: folderRows(folders, pendingCountFor(mailbox.uid, pendingSends)).map((row) => {
                                 if (row.kind === "placeholder") {
                                     // A folder the server has not made (or told us about) yet - the Outbox and Sent Items are made with the first message
                                     // sent - shown the moment a message is on its way. Nothing to open; the real folder replaces it when it arrives.
                                     const sending = pendingCountFor(mailbox.uid, pendingSends);
-                                    return (_jsxs("div", { "data-folder-placeholder": row.type, className: "flex items-center justify-between text-sm rounded-sm py-1.5 px-2.5 text-text-muted", children: [_jsx("span", { children: FOLDER_LABELS[row.type] }), row.type === "outbox" && _jsx(OutboxBadge, { total: sending, pendingHere: sending })] }, `placeholder-${row.type}`));
+                                    return (_jsxs("div", { "data-folder-placeholder": row.type, className: "flex items-center justify-between text-sm rounded-sm py-1.5 px-2.5 text-text-muted", children: [_jsxs("span", { className: "flex items-center gap-2.5 min-w-0", children: [_jsx(FolderTypeIcon, { type: row.type }), _jsx("span", { className: "truncate", children: FOLDER_LABELS[row.type] })] }), row.type === "outbox" && _jsx(OutboxBadge, { total: sending, pendingHere: sending })] }, `placeholder-${row.type}`));
                                 }
                                 const folder = row.folder;
                                 const badge = badgeFor(folder.type, countOfFolder(folder, counts));
@@ -235,7 +236,7 @@ export default function MailShell({ userUid, authServerUrl, impersonating, imper
                                         folder.uid === folderUid
                                             ? "bg-primary/10 text-primary-dark font-semibold"
                                             : "text-text hover:bg-surface-alt",
-                                    ].join(" "), children: [_jsx("span", { className: badge?.kind === "unread" ? "font-semibold" : undefined, children: FOLDER_LABELS[folder.type] ?? folder.name }), badge &&
+                                    ].join(" "), children: [_jsxs("span", { className: ["flex items-center gap-2.5 min-w-0", badge?.kind === "unread" ? "font-semibold" : ""].join(" "), children: [_jsx(FolderTypeIcon, { type: folder.type }), _jsx("span", { className: "truncate", children: FOLDER_LABELS[folder.type] ?? folder.name })] }), badge &&
                                             (folder.type === "outbox" ? (_jsx(OutboxBadge, { total: badge.value, status: outboxStatuses[folder.uid], pendingHere: pendingCountFor(mailbox.uid, pendingSends) })) : (_jsx(FolderBadgeChip, { badge: badge })))] }, folder.uid));
                             }) }, mailbox.uid)))] }))] }));
         inner = (_jsxs(_Fragment, { children: [_jsx(MailShortcuts, { mailboxUid: defaultMailboxUid }), _jsx("aside", { className: "hidden md:flex w-64 shrink-0 bg-surface border-r border-border flex-col", children: sidebarContent("desktop") }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Folders", fullScreen: true, children: _jsx("div", { className: "flex flex-col", children: sidebarContent("mobile") }) }), _jsxs("main", { className: "flex-1 min-w-0 overflow-y-auto", children: [_jsxs("div", { className: "md:hidden flex items-center gap-2 p-3", children: [_jsx("button", { type: "button", className: "shrink-0 w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text", "aria-label": "Open folders", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), _jsx("div", { ref: setMobileSearchSlot, className: "flex-1 min-w-0" })] }), _jsx(MobileComposeButton, { mailboxUid: defaultMailboxUid }), _jsx(MailShellContext.Provider, { value: contextValue, children: children })] })] }));

package/dist/apps/shared/components/mail/layout/folderIcons.d.ts

@@ -0,0 +1,8 @@
+import React from "react";
+import type { FolderType } from "../../../../../lib/mail/mailApi.js";
+/** The icon drawn to the left of a folder's name: one per well-known folder, a plain folder for the user's own. */
+export declare function FolderTypeIcon({ type }: {
+    type: FolderType | string;
+}): React.JSX.Element;
+/** What marks a mailbox other people share with this user, beside its name: the group icon, and for a screen reader the word it stands for. */
+export declare function SharedMailboxMark(): React.JSX.Element;

package/dist/apps/shared/components/mail/layout/folderIcons.js

@@ -0,0 +1,25 @@
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { HiOutlineArchiveBox, HiOutlineArrowUpTray, HiOutlineBookOpen, HiOutlineCalendarDays, HiOutlineClipboardDocumentList, HiOutlineFolder, HiOutlineInbox, HiOutlinePaperAirplane, HiOutlinePencilSquare, HiOutlineShieldExclamation, HiOutlineTrash, HiOutlineUsers, HiUserGroup, } from "react-icons/hi2";
+const FOLDER_ICONS = {
+    inbox: HiOutlineInbox,
+    drafts: HiOutlinePencilSquare,
+    sent_items: HiOutlinePaperAirplane,
+    outbox: HiOutlineArrowUpTray,
+    junk: HiOutlineShieldExclamation,
+    archive: HiOutlineArchiveBox,
+    deleted_items: HiOutlineTrash,
+    calendar: HiOutlineCalendarDays,
+    contacts: HiOutlineUsers,
+    tasks: HiOutlineClipboardDocumentList,
+    notes: HiOutlineBookOpen,
+    user: HiOutlineFolder,
+};
+/** The icon drawn to the left of a folder's name: one per well-known folder, a plain folder for the user's own. */
+export function FolderTypeIcon({ type }) {
+    const Icon = FOLDER_ICONS[type] ?? HiOutlineFolder;
+    return _jsx(Icon, { size: 18, "aria-hidden": "true", className: "shrink-0 text-text-muted" });
+}
+/** What marks a mailbox other people share with this user, beside its name: the group icon, and for a screen reader the word it stands for. */
+export function SharedMailboxMark() {
+    return (_jsxs(_Fragment, { children: [_jsx(HiUserGroup, { size: 14, "aria-hidden": "true", className: "inline-block ml-1.5 align-[-2px] shrink-0 text-text-muted" }), " ", _jsx("span", { className: "sr-only", children: "(shared)" })] }));
+}

package/dist/apps/shared/components/settings/layout/SettingsShell.d.ts

@@ -1,4 +1,5 @@
 import React, { PropsWithChildren } from "react";
+import type { IconType } from "react-icons";
 import { Mailbox } from "../../../../../lib/mail/mailApi.js";
 import { AppShellProps } from "../../layout/AppShell.js";
 import { PluginNav } from "../../../plugins/pluginNav.js";
@@ -6,6 +7,8 @@ export interface SettingsSectionDef {
     id: string;
     href: string;
     label: string;
+    /** Drawn beside the label in the sidebar. */
+    icon: IconType;
 }
 /** Every settings section with its own sidebar entry. */
 export declare const SETTINGS_SECTIONS: SettingsSectionDef[];

package/dist/apps/shared/components/settings/layout/SettingsShell.js

@@ -4,7 +4,7 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import { createContext, useContext, useEffect, useMemo, useState } from "react";
-import { HiOutlineBars3 } from "react-icons/hi2";
+import { HiOutlineArrowUturnLeft, HiOutlineBars3, HiOutlineEnvelopeOpen, HiOutlineFunnel, HiOutlineLockClosed, HiOutlineNoSymbol, HiOutlinePaintBrush, HiOutlinePencilSquare, HiOutlinePuzzlePiece, HiOutlineShieldCheck, HiOutlineTag, HiOutlineUserCircle, HiOutlineUsers, } from "react-icons/hi2";
 import { ApiRequestError } from "../../../../../lib/util/api.js";
 import Drawer from "../../../../../lib/components/overlays/Drawer.js";
 import { listMailboxes } from "../../../../../lib/mail/mailApi.js";
@@ -18,17 +18,17 @@ import { orderMailboxes, primaryMailboxUid } from "../../../mail/primaryMailbox.
 import { mergePluginNavItems } from "../../../plugins/pluginNav.js";
 /** Every settings section with its own sidebar entry. */
 export const SETTINGS_SECTIONS = [
-    { id: "profile", href: "/settings/profile", label: "Profile" },
-    { id: "appearance", href: "/settings/appearance", label: "Appearance" },
-    { id: "auto-reply", href: "/settings/auto-reply", label: "Automatic Replies" },
-    { id: "filters", href: "/settings/filters", label: "Mail Filters" },
-    { id: "blocked-senders", href: "/settings/blocked-senders", label: "Blocked & Safe Senders" },
-    { id: "signatures", href: "/settings/signatures", label: "Signatures" },
-    { id: "labels", href: "/settings/labels", label: "Labels" },
-    { id: "read-receipts", href: "/settings/read-receipts", label: "Read Receipts" },
-    { id: "encryption", href: "/settings/encryption", label: "Encryption" },
-    { id: "sharing", href: "/settings/sharing", label: "Sharing" },
-    { id: "privacy", href: "/settings/privacy", label: "Privacy & Data" },
+    { id: "profile", href: "/settings/profile", label: "Profile", icon: HiOutlineUserCircle },
+    { id: "appearance", href: "/settings/appearance", label: "Appearance", icon: HiOutlinePaintBrush },
+    { id: "auto-reply", href: "/settings/auto-reply", label: "Automatic Replies", icon: HiOutlineArrowUturnLeft },
+    { id: "filters", href: "/settings/filters", label: "Mail Filters", icon: HiOutlineFunnel },
+    { id: "blocked-senders", href: "/settings/blocked-senders", label: "Blocked & Safe Senders", icon: HiOutlineNoSymbol },
+    { id: "signatures", href: "/settings/signatures", label: "Signatures", icon: HiOutlinePencilSquare },
+    { id: "labels", href: "/settings/labels", label: "Labels", icon: HiOutlineTag },
+    { id: "read-receipts", href: "/settings/read-receipts", label: "Read Receipts", icon: HiOutlineEnvelopeOpen },
+    { id: "encryption", href: "/settings/encryption", label: "Encryption", icon: HiOutlineLockClosed },
+    { id: "sharing", href: "/settings/sharing", label: "Sharing", icon: HiOutlineUsers },
+    { id: "privacy", href: "/settings/privacy", label: "Privacy & Data", icon: HiOutlineShieldCheck },
 ];
 /** `SETTINGS_SECTIONS` followed by the plugins' `settingsSections` items, core ids winning - see
  * `mergePluginNavItems`. */
@@ -37,6 +37,7 @@ export function settingsSections(pluginNav) {
         id,
         href,
         label,
+        icon: HiOutlinePuzzlePiece,
     }));
 }
 const SettingsShellContext = createContext({ mailboxes: [] });
@@ -111,7 +112,7 @@ export default function SettingsShell({ active, userUid, authServerUrl, imperson
                                 // server didn't send its nav item, so that falls back to the current path.
                                 const href = sections.find((s) => s.id === active)?.href ?? window.location.pathname;
                                 navigate(`${href}?mailboxUid=${encodeURIComponent(e.target.value)}`);
-                            }, children: mailboxes.map((mb) => (_jsxs("option", { value: mb.uid, children: [mb.displayName, mb.ownerUserUid ? "" : " (shared)"] }, mb.uid))) })] })), _jsx("nav", { "aria-label": "Settings sections", className: "flex flex-col gap-0.5", children: sections.map((section) => (_jsx("a", { 
+                            }, children: mailboxes.map((mb) => (_jsxs("option", { value: mb.uid, children: [mb.displayName, mb.ownerUserUid ? "" : " (shared)"] }, mb.uid))) })] })), _jsx("nav", { "aria-label": "Settings sections", className: "flex flex-col gap-0.5", children: sections.map((section) => (_jsxs("a", { 
                         // `inner` (this whole branch) is only ever computed once `status === "ready"`
                         // and `mailboxUid` has already resolved truthy — a falsy `mailboxUid` returns
                         // `<MailboxProvisioning />` above instead (which is what the `!` below records,
@@ -120,9 +121,9 @@ export default function SettingsShell({ active, userUid, authServerUrl, imperson
                         // structurally can't trigger" removal precedent (e.g.
                         // `DomainDetailContent.handleVerify`).
                         href: `${section.href}?mailboxUid=${encodeURIComponent(mailboxUid)}`, "aria-current": section.id === active ? "page" : undefined, className: [
-                            "block px-2.5 py-1.5 rounded-sm text-sm",
+                            "flex items-center gap-2.5 px-2.5 py-1.5 rounded-sm text-sm",
                             section.id === active ? "bg-primary/10 text-primary-dark font-medium" : "text-text hover:bg-surface-alt",
-                        ].join(" "), children: section.label }, section.id))) })] }));
+                        ].join(" "), children: [_jsx(section.icon, { size: 18, "aria-hidden": "true", className: "shrink-0" }), section.label] }, section.id))) })] }));
         inner = (_jsxs(_Fragment, { children: [_jsx("aside", { className: "hidden md:flex w-56 shrink-0 bg-surface border-r border-border flex-col p-3 gap-3", children: sidebarContent("desktop") }), _jsx(Drawer, { open: drawerOpen, onClose: () => setDrawerOpen(false), title: "Settings", fullScreen: true, children: _jsx("div", { className: "flex flex-col gap-3", children: sidebarContent("mobile") }) }), _jsxs("main", { className: "flex-1 min-w-0 flex flex-col", children: [_jsx("button", { type: "button", className: "md:hidden m-3 self-start w-9 h-9 flex items-center justify-center rounded-sm text-text-muted hover:bg-surface-alt hover:text-text", "aria-label": "Open settings menu", onClick: () => setDrawerOpen(true), children: _jsx(HiOutlineBars3, { size: 20, "aria-hidden": "true" }) }), _jsx(SettingsShellContext.Provider, { value: contextValue, children: children })] })] }));
     }
     return (_jsx(AppShell, { active: "settings", userUid: userUid, authServerUrl: authServerUrl, impersonating: impersonating, impersonationBaseUrl: impersonationBaseUrl, trusted: trusted, trustedRoles: trustedRoles, pluginNav: pluginNav, children: inner }));

package/dist/apps/shared/navigation/appHrefs.d.ts

@@ -6,9 +6,9 @@ export declare const APP_HREFS: {
     readonly tasks: "/tasks";
 };
 /**
- * Settings is reached from the account menu, not the rail. It links straight to the first settings section, the only one that always
- * exists - repoint this at a real `/settings` landing page once there is one.
+ * Settings is reached from the account menu, not the rail. It links straight to the Profile section, the first of them and the one that
+ * always exists - repoint this at a real `/settings` landing page once there is one.
  */
-export declare const SETTINGS_HREF = "/settings/auto-reply";
+export declare const SETTINGS_HREF = "/settings/profile";
 /** Whether `pathname` is a page of Settings (any section), which is what "already there" means for it. */
 export declare function isSettingsPath(pathname: string): boolean;

package/dist/apps/shared/navigation/appHrefs.js

@@ -10,10 +10,10 @@ export const APP_HREFS = {
     tasks: "/tasks",
 };
 /**
- * Settings is reached from the account menu, not the rail. It links straight to the first settings section, the only one that always
- * exists - repoint this at a real `/settings` landing page once there is one.
+ * Settings is reached from the account menu, not the rail. It links straight to the Profile section, the first of them and the one that
+ * always exists - repoint this at a real `/settings` landing page once there is one.
  */
-export const SETTINGS_HREF = "/settings/auto-reply";
+export const SETTINGS_HREF = "/settings/profile";
 /** Whether `pathname` is a page of Settings (any section), which is what "already there" means for it. */
 export function isSettingsPath(pathname) {
     return pathname === "/settings" || pathname.startsWith("/settings/");

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

@@ -31,6 +31,7 @@ import TimeGridView from "../../shared/components/calendar/TimeGridView.js";
 import Alert from "../../../lib/components/feedback/Alert.js";
 import Button from "../../../lib/components/buttons/Button.js";
 import { SWIPE_PERIOD_SHIFT } from "../../shared/components/calendar/swipeNavigation.js";
+import { nextHalfHour } from "../../shared/components/calendar/timePicker.js";
 import { useSwipeSlide } from "../../shared/gestures/useSwipeSlide.js";
 import { useEnterSlide } from "../../shared/gestures/useEnterSlide.js";
 import { useWheelPaging } from "../../shared/gestures/useWheelPaging.js";
@@ -275,10 +276,12 @@ function CalendarContent({ userUid, bookingHref }) {
         if (!mailboxUid || !folderUid) {
             return;
         }
+        // With nothing clicked, the next half hour, for an hour.
+        const from = start ?? nextHalfHour(new Date());
         setModal({
             occurrence: null,
-            initialStart: start ?? new Date(),
-            initialEnd: end ?? new Date(Date.now() + 30 * 60000),
+            initialStart: from,
+            initialEnd: end ?? new Date(from.getTime() + 60 * 60000),
             targetFolderUid,
             anchor,
             initialAllDay,

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

@@ -6,7 +6,8 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { pageTitle } from "../../../shared/navigation/pageTitle.js";
 import { useMemo, useState } from "react";
 import { freeBusyVisibilityOf, isSharedWithMe, updateMailbox } from "../../../../lib/mail/mailApi.js";
-import { DEFAULT_TIME_ZONE, deviceTimeZone, timeZoneOptions } from "../../../../lib/util/timeZone.js";
+import TimeZonePicker from "../../../../lib/components/pickers/TimeZonePicker.js";
+import { DEFAULT_TIME_ZONE, describeTimeZone, deviceTimeZone, timeZoneOptions } from "../../../../lib/util/timeZone.js";
 import SettingsShell, { useSettingsShell } from "../../../shared/components/settings/layout/SettingsShell.js";
 import { useApiClient } from "../../../../lib/util/apiClientContext.js";
 import Button from "../../../../lib/components/buttons/Button.js";
@@ -112,13 +113,13 @@ function ProfileContent() {
                                         setDisplayName(e.target.value);
                                         setNameError(null);
                                         setSaved(false);
-                                    }, "aria-invalid": nameError ? true : undefined, "aria-describedby": nameError ? "profile-display-name-error" : "profile-display-name-help" }), nameError && (_jsx("p", { id: "profile-display-name-error", role: "alert", className: "mt-1 text-xs text-danger", children: nameError })), _jsx("p", { id: "profile-display-name-help", className: "mt-1 text-xs text-text-muted", children: "The sender name on mail you send, shown to recipients beside your address (for example \u201CJane Doe\u201D). It can\u2019t contain an \u201C@\u201D." })] }), _jsxs(FormField, { label: "Time zone", htmlFor: "profile-time-zone", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx("select", { id: "profile-time-zone", className: SELECT_CLASS, value: timezone, onChange: (e) => {
-                                                setTimezone(e.target.value);
+                                    }, "aria-invalid": nameError ? true : undefined, "aria-describedby": nameError ? "profile-display-name-error" : "profile-display-name-help" }), nameError && (_jsx("p", { id: "profile-display-name-error", role: "alert", className: "mt-1 text-xs text-danger", children: nameError })), _jsx("p", { id: "profile-display-name-help", className: "mt-1 text-xs text-text-muted", children: "The sender name on mail you send, shown to recipients beside your address (for example \u201CJane Doe\u201D). It can\u2019t contain an \u201C@\u201D." })] }), _jsxs(FormField, { label: "Time zone", htmlFor: "profile-time-zone", children: [_jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsx(TimeZonePicker, { id: "profile-time-zone", className: SELECT_CLASS, value: timezone, zones: zones, onChange: (zone) => {
+                                                setTimezone(zone);
                                                 setSaved(false);
-                                            }, "aria-describedby": "profile-time-zone-help", children: zones.map((zone) => (_jsx("option", { value: zone, children: zone }, zone))) }), timezone !== deviceZone && (_jsxs(Button, { type: "button", variant: "text", className: "!w-auto", onClick: () => {
+                                            }, "aria-describedby": "profile-time-zone-help" }), timezone !== deviceZone && (_jsxs(Button, { type: "button", variant: "text", className: "!w-auto", onClick: () => {
                                                 setTimezone(deviceZone);
                                                 setSaved(false);
-                                            }, children: ["Use this device\u2019s time zone (", deviceZone, ")"] }))] }), zoneWasPreselected && (_jsx("p", { className: "mt-1 text-xs text-text-muted", children: "Your mailbox has no time zone chosen yet; this device\u2019s is preselected. Save to keep it." })), _jsx("p", { id: "profile-time-zone-help", className: "mt-1 text-xs text-text-muted", children: "How calendar times and reminders are shown and scheduled for this mailbox, such as when an event or a reminder falls." })] }), _jsxs(FormField, { label: "Free/busy visibility", htmlFor: "profile-free-busy", children: [_jsx("select", { id: "profile-free-busy", className: SELECT_CLASS, value: freeBusy, disabled: !canChangeFreeBusy, onChange: (e) => {
+                                            }, children: ["Use this device\u2019s time zone (", describeTimeZone(deviceZone), ")"] }))] }), zoneWasPreselected && (_jsx("p", { className: "mt-1 text-xs text-text-muted", children: "Your mailbox has no time zone chosen yet; this device\u2019s is preselected. Save to keep it." })), _jsx("p", { id: "profile-time-zone-help", className: "mt-1 text-xs text-text-muted", children: "How calendar times and reminders are shown and scheduled for this mailbox, such as when an event or a reminder falls." })] }), _jsxs(FormField, { label: "Free/busy visibility", htmlFor: "profile-free-busy", children: [_jsx("select", { id: "profile-free-busy", className: SELECT_CLASS, value: freeBusy, disabled: !canChangeFreeBusy, onChange: (e) => {
                                         setFreeBusy(e.target.value);
                                         setSaved(false);
                                     }, "aria-describedby": "profile-free-busy-help", children: FREE_BUSY_CHOICES.map((choice) => (_jsx("option", { value: choice.value, children: choice.label }, choice.value))) }), _jsx("p", { id: "profile-free-busy-help", className: "mt-1 text-xs text-text-muted", children: FREE_BUSY_CHOICES.find((choice) => choice.value === freeBusy).help }), _jsx("p", { className: "mt-1 text-xs text-text-muted", children: "Who can see the hours you are busy when they look for a time to meet - never the title, place or guests of an event." }), !canChangeFreeBusy && (_jsx("p", { className: "mt-1 text-xs text-text-muted", children: "This mailbox is shared with you: only its owner can change who sees its free/busy times." }))] }), _jsx("div", { children: _jsx(Button, { type: "submit", loading: saving, disabled: saving, className: "!w-auto", children: "Save" }) })] })] }) }));

package/dist/lib/auth/session.d.ts

@@ -17,6 +17,18 @@ export declare const SESSION_RELOAD_GUARD_MS: number;
  * @returns `true` when a refresh was made, `false` when one was not needed.
  */
 export declare function refreshSession(authServerUrl: string, force?: boolean): Promise<boolean>;
+/** How long the outcome of a recovery is reused for: requests that fail together share one refresh, and a session that will not come back is not asked again at once. */
+export declare const SESSION_RECOVERY_COOLDOWN_MS: number;
+/**
+ * Renews the session because a request was refused for lack of one, whatever this browser's record of the last refresh says. Every request
+ * refused at about the same time shares one refresh, and its outcome is reused for `SESSION_RECOVERY_COOLDOWN_MS`. A refusal also clears the record of
+ * the last refresh, so the next regular check asks again (and sends the browser to sign-in if the refresh token is truly gone).
+ *
+ * @returns Whether the session was renewed.
+ */
+export declare function recoverSession(authServerUrl: string): Promise<boolean>;
+/** Forgets what recoveries have done (for tests). */
+export declare function resetSessionRecovery(): void;
 /**
  * Redirects the browser to auth-server's sign-in page when `userUid` is absent, carrying the current URL as
  * `return_to` so auth-server can send the browser back here afterward. A no-op once `userUid` is present.
@@ -51,7 +63,8 @@ export interface SessionRefreshOptions {
  * lifetime, or reopened later): attempts one silent refresh and reloads so the server renders the page with the new
  * cookie. If the refresh is refused (the refresh token expired or was revoked, or there was none), or a reload just
  * made still found no session, redirects to sign-in as `useRedirectIfUnauthenticated()` does.
- * - `userUid` set: refreshes once the token is `SESSION_REFRESH_AFTER_MS` old (and right away when this browser has no
+ * - `userUid` set: also renews the session when a request is refused for lack of one (`apiFetch()` asks `recoverSession()` and sends the request
+ * again), so a token that ran out while timers were stopped costs nothing. Refreshes once the token is `SESSION_REFRESH_AFTER_MS` old (and right away when this browser has no
  * record of a recent refresh, since the page's token age is unknown), checked every `SESSION_REFRESH_CHECK_MS` and
  * whenever the tab becomes visible or the network returns, because a sleeping laptop stops timers. A failure that is
  * not a rejection is simply retried at the next check. A rejection (`401`/`403`: the refresh token expired or was