@rapidmx/web-client 0.20.0 → 0.22.0

package/apps/shared/components/mail/compose/quotedBody.ts

@@ -1,161 +1,161 @@
-///////////////////////////////////////////////////////////////////////////////
-// Copyright (C) 2026 Jean-Philippe Steinmetz
-// SPDX-License-Identifier: MPL-2.0
-///////////////////////////////////////////////////////////////////////////////
-import { apiUrl } from "@rapidmx/react-shared/util/api.js";
-import { Message, Recipient, getMessageRawContent } from "@rapidmx/react-shared/mail/mailApi.js";
-import type { QuotedBody } from "@rapidmx/react-shared/mail/compose/composeQuoting.js";
-import type { MessageSecurityResult } from "@rapidmx/react-shared/crypto/messageSecurity.js";
-import { decodeHeaderText, extractDisplayBody, parseMimeEntity } from "@rapidmx/react-shared/crypto/mime.js";
-import { parseRecipientList } from "./recipients.js";
-
-/** What a Reply/Reply All/Forward needs from the message being answered, beyond what its `Message` record holds. */
-export interface OriginalMessage {
-    /** The body to quote. Empty when none could be loaded - the quote builders then fall back to `bodyPreview`. */
-    body: QuotedBody;
-    /** The original To and Cc recipients, recovered from the message's own headers - `undefined` when they couldn't
-     * be. Only asked for by Reply All (see `loadOriginalMessage()`). */
-    recipients?: Recipient[];
-}
-
-/** How long a reply waits for the original's body before it goes ahead with the preview - a slow or hung request must not
- * leave the window waiting on it (or, before it opened at once, keep it from opening) indefinitely. */
-export const QUOTE_FETCH_TIMEOUT_MS = 10_000;
-/** How long a fetched (or prefetched) body is remembered, so hovering Reply and then clicking it costs one request. */
-export const QUOTE_CACHE_MS = 30_000;
-
-const contentCache = new Map<string, { at: number; promise: Promise<string | undefined> }>();
-
-/**
- * The server's sanitized HTML body of a message (`GET /mail/messages/:id/content`), or `undefined` when it has none (a
- * `text/plain` message is answered with its preview instead) or the request failed or timed out. Never rejects. Remembered
- * for `QUOTE_CACHE_MS` - except a failure, which is asked again the next time.
- */
-function fetchContentHtml(uid: string): Promise<string | undefined> {
-    const cached = contentCache.get(uid);
-    if (cached && Date.now() - cached.at < QUOTE_CACHE_MS) {
-        return cached.promise;
-    }
-    const controller = new AbortController();
-    const timer = setTimeout(() => controller.abort(), QUOTE_FETCH_TIMEOUT_MS);
-    const promise = (async (): Promise<string | undefined> => {
-        try {
-            const res = await fetch(apiUrl(`/mail/messages/${encodeURIComponent(uid)}/content`), { credentials: "include", signal: controller.signal });
-            return res.ok && (res.headers.get("content-type") ?? "").includes("text/html") ? await res.text() : undefined;
-        } catch {
-            return undefined;
-        } finally {
-            clearTimeout(timer);
-        }
-    })();
-    contentCache.set(uid, { at: Date.now(), promise });
-    void promise.then((html) => {
-        if (html === undefined && contentCache.get(uid)?.promise === promise) {
-            contentCache.delete(uid);
-        }
-    });
-    return promise;
-}
-
-/** Rejects when `promise` hasn't settled within `ms` (`getMessageRawContent()` takes no `AbortSignal`, so it is raced rather than aborted). */
-function withTimeout<T>(promise: Promise<T>, ms: number): Promise<T> {
-    let timer: ReturnType<typeof setTimeout>;
-    const timeout = new Promise<never>((_resolve, reject) => {
-        timer = setTimeout(() => reject(new Error("Timed out.")), ms);
-    });
-    return Promise.race([promise, timeout]).finally(() => clearTimeout(timer));
-}
-
-/**
- * Starts fetching what a Reply/Forward of `message` will quote, without waiting for the click - called when the pointer or
- * keyboard reaches a Reply/Reply All/Forward button - so the request is usually already answered when it is clicked.
- * Nothing to fetch for an encrypted message (`loadOriginalMessage()` never asks the server for one's body).
- */
-export function prefetchOriginalMessage(message: Message): void {
-    if (!message.encrypted) {
-        void fetchContentHtml(message.uid);
-    }
-}
-
-/** Forgets every remembered body (the sign-out and test seam). */
-export function clearOriginalMessageCache(): void {
-    contentCache.clear();
-}
-
-/** The recipients one address-list header names, RFC 2047-decoded, with their display names. */
-function headerRecipients(value: string | undefined, type: "to" | "cc"): Recipient[] {
-    if (!value) {
-        return [];
-    }
-    return parseRecipientList(decodeHeaderText(value))
-        .filter((recipient) => recipient.address.includes("@"))
-        .map((recipient) => ({ address: recipient.address, ...(recipient.displayName ? { displayName: recipient.displayName } : {}), type }));
-}
-
-/**
- * Loads what a Reply/Reply All/Forward needs from `message`: the full body to quote - the same content
- * `MessageDetailPane` shows, never the truncated `bodyPreview` unless nothing else can be had - and, with
- * `options.recipients`, who the message was originally addressed to. Never rejects.
- *
- * Content the pane recovered client-side (`security.text`/`security.html`: a decrypted or verified body) is used as
- * is. For an encrypted message that's the plaintext, so the caller must keep the reply encrypted (see
- * `MessageDetailPane`'s reply handlers).
- *
- * An encrypted message without recovered content (locked keys, a failed decrypt, evaluation still running) quotes
- * nothing: the server only holds ciphertext, which is never fetched or quoted.
- *
- * Otherwise the server's sanitized HTML body (`GET /mail/messages/:id/content`) is used. That route falls back to the
- * preview for a message without an HTML part, so a `text/plain` answer is replaced by the text part of the message's
- * raw MIME.
- *
- * The recipients come from the verified message's protected headers when it has them, else from the raw message's own
- * `To`/`Cc` headers - restapi records only the envelope recipient of a delivered message (`ScanQueueJob`), so
- * `message.recipients` alone would reduce every Reply All to a plain reply. Unprotected headers are the sender's own
- * claim, exactly as in every other mail client's Reply All.
- *
- * The quote builders sanitize whatever HTML this returns (`sanitizeQuotedHtml()`), whichever source it came from.
- */
-export async function loadOriginalMessage(
-    message: Message,
-    security: MessageSecurityResult | null,
-    options: { recipients?: boolean } = {},
-): Promise<OriginalMessage> {
-    const recovered: QuotedBody | undefined =
-        security?.text !== undefined ? { text: security.text } : security?.html !== undefined ? { html: security.html } : undefined;
-    const protectedHeaders = security?.protectedHeaders;
-    const protectedRecipients = protectedHeaders
-        ? [...headerRecipients(protectedHeaders.to, "to"), ...headerRecipients(protectedHeaders.cc, "cc")]
-        : [];
-    const result: OriginalMessage = { body: recovered ?? {}, ...(protectedRecipients.length > 0 ? { recipients: protectedRecipients } : {}) };
-    if (message.encrypted) {
-        return result;
-    }
-    let needsRaw = !!options.recipients && result.recipients === undefined;
-    if (!recovered) {
-        // Never rejects; nothing (a plain-text message, a failure, a timeout) leaves the raw message below as the other way
-        // to the body.
-        const html = await fetchContentHtml(message.uid);
-        if (html !== undefined) {
-            result.body = { html };
-        } else {
-            needsRaw = true;
-        }
-    }
-    try {
-        if (needsRaw) {
-            const entity = parseMimeEntity(await withTimeout(getMessageRawContent(message.uid), QUOTE_FETCH_TIMEOUT_MS));
-            if (!recovered && result.body.html === undefined) {
-                const body = extractDisplayBody(entity);
-                result.body = body.html !== undefined ? { html: body.html } : body.text !== undefined ? { text: body.text } : {};
-            }
-            const headers = [...headerRecipients(entity.headers["to"], "to"), ...headerRecipients(entity.headers["cc"], "cc")];
-            if (options.recipients && result.recipients === undefined && headers.length > 0) {
-                result.recipients = headers;
-            }
-        }
-    } catch {
-        // Whatever was loaded before the failure stands: the quote falls back to the preview, Reply All to the
-        // message's own recipients.
-    }
-    return result;
-}
+///////////////////////////////////////////////////////////////////////////////
+// Copyright (C) 2026 Jean-Philippe Steinmetz
+// SPDX-License-Identifier: MPL-2.0
+///////////////////////////////////////////////////////////////////////////////
+import { apiUrl } from "../../../../../lib/util/api.js";
+import { Message, Recipient, getMessageRawContent } from "../../../../../lib/mail/mailApi.js";
+import type { QuotedBody } from "../../../../../lib/mail/compose/composeQuoting.js";
+import type { MessageSecurityResult } from "../../../../../lib/crypto/messageSecurity.js";
+import { decodeHeaderText, extractDisplayBody, parseMimeEntity } from "../../../../../lib/crypto/mime.js";
+import { parseRecipientList } from "./recipients.js";
+
+/** What a Reply/Reply All/Forward needs from the message being answered, beyond what its `Message` record holds. */
+export interface OriginalMessage {
+    /** The body to quote. Empty when none could be loaded - the quote builders then fall back to `bodyPreview`. */
+    body: QuotedBody;
+    /** The original To and Cc recipients, recovered from the message's own headers - `undefined` when they couldn't
+     * be. Only asked for by Reply All (see `loadOriginalMessage()`). */
+    recipients?: Recipient[];
+}
+
+/** How long a reply waits for the original's body before it goes ahead with the preview - a slow or hung request must not
+ * leave the window waiting on it (or, before it opened at once, keep it from opening) indefinitely. */
+export const QUOTE_FETCH_TIMEOUT_MS = 10_000;
+/** How long a fetched (or prefetched) body is remembered, so hovering Reply and then clicking it costs one request. */
+export const QUOTE_CACHE_MS = 30_000;
+
+const contentCache = new Map<string, { at: number; promise: Promise<string | undefined> }>();
+
+/**
+ * The server's sanitized HTML body of a message (`GET /mail/messages/:id/content`), or `undefined` when it has none (a
+ * `text/plain` message is answered with its preview instead) or the request failed or timed out. Never rejects. Remembered
+ * for `QUOTE_CACHE_MS` - except a failure, which is asked again the next time.
+ */
+function fetchContentHtml(uid: string): Promise<string | undefined> {
+    const cached = contentCache.get(uid);
+    if (cached && Date.now() - cached.at < QUOTE_CACHE_MS) {
+        return cached.promise;
+    }
+    const controller = new AbortController();
+    const timer = setTimeout(() => controller.abort(), QUOTE_FETCH_TIMEOUT_MS);
+    const promise = (async (): Promise<string | undefined> => {
+        try {
+            const res = await fetch(apiUrl(`/mail/messages/${encodeURIComponent(uid)}/content`), { credentials: "include", signal: controller.signal });
+            return res.ok && (res.headers.get("content-type") ?? "").includes("text/html") ? await res.text() : undefined;
+        } catch {
+            return undefined;
+        } finally {
+            clearTimeout(timer);
+        }
+    })();
+    contentCache.set(uid, { at: Date.now(), promise });
+    void promise.then((html) => {
+        if (html === undefined && contentCache.get(uid)?.promise === promise) {
+            contentCache.delete(uid);
+        }
+    });
+    return promise;
+}
+
+/** Rejects when `promise` hasn't settled within `ms` (`getMessageRawContent()` takes no `AbortSignal`, so it is raced rather than aborted). */
+function withTimeout<T>(promise: Promise<T>, ms: number): Promise<T> {
+    let timer: ReturnType<typeof setTimeout>;
+    const timeout = new Promise<never>((_resolve, reject) => {
+        timer = setTimeout(() => reject(new Error("Timed out.")), ms);
+    });
+    return Promise.race([promise, timeout]).finally(() => clearTimeout(timer));
+}
+
+/**
+ * Starts fetching what a Reply/Forward of `message` will quote, without waiting for the click - called when the pointer or
+ * keyboard reaches a Reply/Reply All/Forward button - so the request is usually already answered when it is clicked.
+ * Nothing to fetch for an encrypted message (`loadOriginalMessage()` never asks the server for one's body).
+ */
+export function prefetchOriginalMessage(message: Message): void {
+    if (!message.encrypted) {
+        void fetchContentHtml(message.uid);
+    }
+}
+
+/** Forgets every remembered body (the sign-out and test seam). */
+export function clearOriginalMessageCache(): void {
+    contentCache.clear();
+}
+
+/** The recipients one address-list header names, RFC 2047-decoded, with their display names. */
+function headerRecipients(value: string | undefined, type: "to" | "cc"): Recipient[] {
+    if (!value) {
+        return [];
+    }
+    return parseRecipientList(decodeHeaderText(value))
+        .filter((recipient) => recipient.address.includes("@"))
+        .map((recipient) => ({ address: recipient.address, ...(recipient.displayName ? { displayName: recipient.displayName } : {}), type }));
+}
+
+/**
+ * Loads what a Reply/Reply All/Forward needs from `message`: the full body to quote - the same content
+ * `MessageDetailPane` shows, never the truncated `bodyPreview` unless nothing else can be had - and, with
+ * `options.recipients`, who the message was originally addressed to. Never rejects.
+ *
+ * Content the pane recovered client-side (`security.text`/`security.html`: a decrypted or verified body) is used as
+ * is. For an encrypted message that's the plaintext, so the caller must keep the reply encrypted (see
+ * `MessageDetailPane`'s reply handlers).
+ *
+ * An encrypted message without recovered content (locked keys, a failed decrypt, evaluation still running) quotes
+ * nothing: the server only holds ciphertext, which is never fetched or quoted.
+ *
+ * Otherwise the server's sanitized HTML body (`GET /mail/messages/:id/content`) is used. That route falls back to the
+ * preview for a message without an HTML part, so a `text/plain` answer is replaced by the text part of the message's
+ * raw MIME.
+ *
+ * The recipients come from the verified message's protected headers when it has them, else from the raw message's own
+ * `To`/`Cc` headers - restapi records only the envelope recipient of a delivered message (`ScanQueueJob`), so
+ * `message.recipients` alone would reduce every Reply All to a plain reply. Unprotected headers are the sender's own
+ * claim, exactly as in every other mail client's Reply All.
+ *
+ * The quote builders sanitize whatever HTML this returns (`sanitizeQuotedHtml()`), whichever source it came from.
+ */
+export async function loadOriginalMessage(
+    message: Message,
+    security: MessageSecurityResult | null,
+    options: { recipients?: boolean } = {},
+): Promise<OriginalMessage> {
+    const recovered: QuotedBody | undefined =
+        security?.text !== undefined ? { text: security.text } : security?.html !== undefined ? { html: security.html } : undefined;
+    const protectedHeaders = security?.protectedHeaders;
+    const protectedRecipients = protectedHeaders
+        ? [...headerRecipients(protectedHeaders.to, "to"), ...headerRecipients(protectedHeaders.cc, "cc")]
+        : [];
+    const result: OriginalMessage = { body: recovered ?? {}, ...(protectedRecipients.length > 0 ? { recipients: protectedRecipients } : {}) };
+    if (message.encrypted) {
+        return result;
+    }
+    let needsRaw = !!options.recipients && result.recipients === undefined;
+    if (!recovered) {
+        // Never rejects; nothing (a plain-text message, a failure, a timeout) leaves the raw message below as the other way
+        // to the body.
+        const html = await fetchContentHtml(message.uid);
+        if (html !== undefined) {
+            result.body = { html };
+        } else {
+            needsRaw = true;
+        }
+    }
+    try {
+        if (needsRaw) {
+            const entity = parseMimeEntity(await withTimeout(getMessageRawContent(message.uid), QUOTE_FETCH_TIMEOUT_MS));
+            if (!recovered && result.body.html === undefined) {
+                const body = extractDisplayBody(entity);
+                result.body = body.html !== undefined ? { html: body.html } : body.text !== undefined ? { text: body.text } : {};
+            }
+            const headers = [...headerRecipients(entity.headers["to"], "to"), ...headerRecipients(entity.headers["cc"], "cc")];
+            if (options.recipients && result.recipients === undefined && headers.length > 0) {
+                result.recipients = headers;
+            }
+        }
+    } catch {
+        // Whatever was loaded before the failure stands: the quote falls back to the preview, Reply All to the
+        // message's own recipients.
+    }
+    return result;
+}

package/apps/shared/components/mail/compose/recipients.ts

@@ -7,7 +7,7 @@
  * semicolons, each either a bare address or `Display Name <address>` (the name optionally quoted, so it can hold a comma
  * or semicolon itself). Separators inside quotes or angle brackets don't split.
  */
-import type { ComposeRecipientInput } from "@rapidmx/react-shared/mail/mailApi.js";
+import type { ComposeRecipientInput } from "../../../../../lib/mail/mailApi.js";
 
 /** One plain address: something, one `@`, something - no whitespace, brackets, quotes or separators. */
 const ADDRESS_PATTERN = /^[^\s@<>()",;]+@[^\s@<>()",;]+$/;

package/apps/shared/components/mail/invite/InviteRowChip.tsx

@@ -4,8 +4,8 @@
 ///////////////////////////////////////////////////////////////////////////////
 import React, { useRef, useState } from "react";
 import { HiOutlineCalendarDays } from "react-icons/hi2";
-import type { Message } from "@rapidmx/react-shared/mail/mailApi.js";
-import type { MessageInvite } from "@rapidmx/react-shared/calendar/inviteApi.js";
+import type { Message } from "../../../../../lib/mail/mailApi.js";
+import type { MessageInvite } from "../../../../../lib/calendar/inviteApi.js";
 import { ANSWER_LABEL, formatRowStart } from "./inviteFormat.js";
 import { useMessageInvite } from "./inviteStore.js";
 import InviteRsvpPopover from "./InviteRsvpPopover.js";

package/apps/shared/components/mail/invite/InviteRsvpPopover.tsx

@@ -4,11 +4,12 @@
 ///////////////////////////////////////////////////////////////////////////////
 import React, { RefObject, useEffect, useId, useRef, useState } from "react";
 import { HiOutlineCheck, HiOutlineEllipsisHorizontal } from "react-icons/hi2";
-import { InviteResponse, MessageInvite, ProposedTime, proposeNewTime, respondToMessageInvite } from "@rapidmx/react-shared/calendar/inviteApi.js";
-import Button from "@rapidmx/react-shared/components/buttons/Button.js";
-import Modal from "@rapidmx/react-shared/components/overlays/Modal.js";
-import PopoverPortal from "@rapidmx/react-shared/components/overlays/PopoverPortal.js";
-import useIsMobile from "@rapidmx/react-shared/util/useIsMobile.js";
+import { InviteResponse, MessageInvite, ProposedTime, proposeNewTime, respondToMessageInvite } from "../../../../../lib/calendar/inviteApi.js";
+import Button from "../../../../../lib/components/buttons/Button.js";
+import Modal from "../../../../../lib/components/overlays/Modal.js";
+import PopoverPortal from "../../../../../lib/components/overlays/PopoverPortal.js";
+import { useApiClient } from "../../../../../lib/util/apiClientContext.js";
+import useIsMobile from "../../../../../lib/util/useIsMobile.js";
 import { notifyApiError } from "../../../notifications/apiErrors.js";
 import { calendarHref, conflictSummary, formatInviteWhen } from "./inviteFormat.js";
 import InviteTimeline from "./InviteTimeline.js";
@@ -58,6 +59,7 @@ interface RsvpPanelProps {
 /** What is inside the RSVP popover (or dialog): the meeting, a day view around it and the buttons that answer it. */
 function RsvpPanel({ messageUid, invite, onDone, onClose, onProposingChange }: RsvpPanelProps) {
     const titleId = useId();
+    const client = useApiClient();
     const [pending, setPending] = useState<InviteResponse | "propose" | null>(null);
     const [proposing, setProposingState] = useState(false);
     const [menuOpen, setMenuOpen] = useState(false);
@@ -80,7 +82,7 @@ function RsvpPanel({ messageUid, invite, onDone, onClose, onProposingChange }: R
     async function answer(response: InviteResponse, failure: string) {
         setPending(response);
         try {
-            onDone(await respondToMessageInvite(messageUid, response));
+            onDone(await respondToMessageInvite(messageUid, response, client));
         } catch (err) {
             notifyApiError(err, failure);
             setPending(null);
@@ -90,7 +92,7 @@ function RsvpPanel({ messageUid, invite, onDone, onClose, onProposingChange }: R
     async function propose(proposal: ProposedTime) {
         setPending("propose");
         try {
-            onDone(await proposeNewTime(messageUid, proposal));
+            onDone(await proposeNewTime(messageUid, proposal, client));
         } catch (err) {
             notifyApiError(err, "Couldn't send the proposed time");
             setPending(null);

package/apps/shared/components/mail/invite/InviteTimeline.tsx

@@ -3,7 +3,7 @@
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import React from "react";
-import type { InviteScheduleEntry, MessageInvite } from "@rapidmx/react-shared/calendar/inviteApi.js";
+import type { InviteScheduleEntry, MessageInvite } from "../../../../../lib/calendar/inviteApi.js";
 import { validDate } from "./inviteFormat.js";
 
 /** How tall one hour is drawn, in px. */

package/apps/shared/components/mail/invite/ProposeTimeForm.tsx

@@ -3,8 +3,8 @@
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import React, { useId, useState } from "react";
-import type { MessageInvite, ProposedTime } from "@rapidmx/react-shared/calendar/inviteApi.js";
-import Button from "@rapidmx/react-shared/components/buttons/Button.js";
+import type { MessageInvite, ProposedTime } from "../../../../../lib/calendar/inviteApi.js";
+import Button from "../../../../../lib/components/buttons/Button.js";
 import { isoDay, validDate } from "./inviteFormat.js";
 
 const INPUT_CLASS = "w-full text-sm border border-border rounded-sm py-1.5 px-2 bg-surface text-text";

package/apps/shared/components/mail/invite/inviteFormat.ts

@@ -2,8 +2,8 @@
 // Copyright (C) 2026 Jean-Philippe Steinmetz
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
-import type { Attachment } from "@rapidmx/react-shared/mail/mailApi.js";
-import type { InviteResponse, MessageInvite } from "@rapidmx/react-shared/calendar/inviteApi.js";
+import type { Attachment } from "../../../../../lib/mail/mailApi.js";
+import type { InviteResponse, MessageInvite } from "../../../../../lib/calendar/inviteApi.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

package/apps/shared/components/mail/invite/inviteStore.ts

@@ -3,7 +3,9 @@
 // SPDX-License-Identifier: MPL-2.0
 ///////////////////////////////////////////////////////////////////////////////
 import { useCallback, useEffect, useReducer } from "react";
-import { MessageInvite, getMessageInvite } from "@rapidmx/react-shared/calendar/inviteApi.js";
+import { MessageInvite, getMessageInvite } from "../../../../../lib/calendar/inviteApi.js";
+import { ApiClient } from "../../../../../lib/util/api.js";
+import { useApiClient } from "../../../../../lib/util/apiClientContext.js";
 
 /**
  * A per-message cache of the calendar invitation the server reads out of a message, shared by everything that draws one: the reading pane's
@@ -41,15 +43,20 @@ function normalize(invite: MessageInvite | null): MessageInvite | null {
     return { ...invite, attendees: partial.attendees ?? [], conflicts: partial.conflicts ?? [], schedule: partial.schedule ?? [] };
 }
 
-/** Reads a message's invitation, from the cache when it is fresh. Rejects when the lookup fails. */
-export function loadInvite(uid: string): Promise<MessageInvite | null> {
+/**
+ * Reads a message's invitation, from the cache when it is fresh. Rejects when the lookup fails. `client` (see
+ * `useApiClient()`) is only consulted for a lookup this call actually makes - a fresh entry already in flight or
+ * cached keeps whichever client (or lack of one) started it, same as every other cache-by-uid shortcut here; the
+ * cache itself is keyed only by `uid`, not by account, so it assumes distinct accounts never share one.
+ */
+export function loadInvite(uid: string, client?: ApiClient): Promise<MessageInvite | null> {
     const existing = entries.get(uid);
     if (existing && (existing.value === undefined || Date.now() - existing.at < INVITE_TTL_MS)) {
         return existing.promise;
     }
     const entry: Entry = {
         at: Date.now(),
-        promise: getMessageInvite(uid).then(
+        promise: getMessageInvite(uid, client).then(
             (invite) => {
                 entry.value = normalize(invite);
                 entry.at = Date.now();
@@ -87,6 +94,7 @@ export function clearInviteCache(): void {
  */
 export function useMessageInvite(uid: string, enabled = true): { invite: MessageInvite | null; settled: boolean; setInvite: (invite: MessageInvite) => void } {
     const [, rerender] = useReducer((n: number) => n + 1, 0);
+    const client = useApiClient();
     useEffect(() => {
         if (!enabled) {
             return;
@@ -100,14 +108,14 @@ export function useMessageInvite(uid: string, enabled = true): { invite: Message
         const set = listeners.get(uid) ?? new Set();
         set.add(update);
         listeners.set(uid, set);
-        loadInvite(uid).then(update, () => {
+        loadInvite(uid, client).then(update, () => {
             // Nothing to show, and nothing worth interrupting the reader with: the message reads the same without it.
         });
         return () => {
             cancelled = true;
             set.delete(update);
         };
-    }, [uid, enabled]);
+    }, [uid, enabled, client]);
     const setInvite = useCallback((invite: MessageInvite) => storeInvite(uid, invite), [uid]);
     const value = enabled ? entries.get(uid)?.value : undefined;
     return { invite: value ?? null, settled: value !== undefined, setInvite };

package/apps/shared/components/mail/labelMenu.tsx

@@ -4,12 +4,13 @@
 ///////////////////////////////////////////////////////////////////////////////
 import React, { useState } from "react";
 import { HiOutlineTag } from "react-icons/hi2";
-import { ApiRequestError } from "@rapidmx/react-shared/util/api.js";
-import { Label, createLabel } from "@rapidmx/react-shared/mail/labelsApi.js";
-import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
-import Button from "@rapidmx/react-shared/components/buttons/Button.js";
-import FormField from "@rapidmx/react-shared/components/forms/FormField.js";
-import Modal from "@rapidmx/react-shared/components/overlays/Modal.js";
+import { ApiRequestError } from "../../../../lib/util/api.js";
+import { Label, createLabel } from "../../../../lib/mail/labelsApi.js";
+import { useApiClient } from "../../../../lib/util/apiClientContext.js";
+import Alert from "../../../../lib/components/feedback/Alert.js";
+import Button from "../../../../lib/components/buttons/Button.js";
+import FormField from "../../../../lib/components/forms/FormField.js";
+import Modal from "../../../../lib/components/overlays/Modal.js";
 import MenuButton, { MenuSectionSpec } from "./MenuButton.js";
 
 /**
@@ -159,6 +160,7 @@ export interface NewLabelDialogProps {
  * has no place for a text field. Colour is left to Settings > Labels; this is the quick path from a
  * message, so it only asks for the name. */
 export function NewLabelDialog({ open, onClose, mailboxUid, onCreated }: NewLabelDialogProps) {
+    const client = useApiClient();
     const [name, setName] = useState("");
     const [saving, setSaving] = useState(false);
     const [error, setError] = useState<string | null>(null);
@@ -167,7 +169,7 @@ export function NewLabelDialog({ open, onClose, mailboxUid, onCreated }: NewLabe
         setSaving(true);
         setError(null);
         try {
-            onCreated(await createLabel({ mailboxUid, name: name.trim() }));
+            onCreated(await createLabel({ mailboxUid, name: name.trim() }, client));
             setName("");
             onClose();
         } catch (err) {

package/apps/shared/components/mail/layout/MailShell.tsx

@@ -4,10 +4,10 @@
 ///////////////////////////////////////////////////////////////////////////////
 import React, { createContext, PropsWithChildren, ReactNode, useCallback, useContext, useEffect, useMemo, useState } from "react";
 import { HiOutlineBars3, HiOutlinePencilSquare } from "react-icons/hi2";
-import Drawer from "@rapidmx/react-shared/components/overlays/Drawer.js";
-import { Folder, Mailbox, Message } from "@rapidmx/react-shared/mail/mailApi.js";
-import Alert from "@rapidmx/react-shared/components/feedback/Alert.js";
-import Skeleton, { SkeletonList } from "@rapidmx/react-shared/components/feedback/Skeleton.js";
+import Drawer from "../../../../../lib/components/overlays/Drawer.js";
+import { Folder, Mailbox, Message } from "../../../../../lib/mail/mailApi.js";
+import Alert from "../../../../../lib/components/feedback/Alert.js";
+import Skeleton, { SkeletonList } from "../../../../../lib/components/feedback/Skeleton.js";
 import AppShell, { AppShellProps } from "../../layout/AppShell.js";
 import FloatingActionButton from "../../layout/FloatingActionButton.js";
 import { useLocation, useNavigate } from "../../../navigation/index.js";

package/apps/shared/components/mail/listPreferences.ts

@@ -22,8 +22,8 @@ import {
     MessageListFilter,
     MessageListSort,
     MessageSortOrder,
-} from "@rapidmx/react-shared/mail/mailApi.js";
-import { ConversationSummary } from "@rapidmx/react-shared/mail/conversationsApi.js";
+} from "../../../../lib/mail/mailApi.js";
+import { ConversationSummary } from "../../../../lib/mail/conversationsApi.js";
 
 const STORAGE_KEY_PREFIX = "rapidmx:mail-list-preferences:";