@remit/web-client 0.0.324 → 0.0.326

package/dist/src/components/compose/quoted-message.js

@@ -0,0 +1,162 @@
+import { wrapWithLanguage } from "@remit/ui";
+import { formatDate } from "../../lib/format";
+export const escapeHtml = (text) => text
+    .replace(/&/g, "&")
+    .replace(/</g, "&lt;")
+    .replace(/>/g, "&gt;")
+    .replace(/"/g, "&quot;");
+export const textToHtml = (text) => text
+    .split("\n")
+    .map((line) => `<p>${escapeHtml(line)}</p>`)
+    .join("");
+/**
+ * Elements that end the line they are on. Everything else is inline and runs
+ * into its neighbours, which is what separates a plain-text rendering of a
+ * message from its `textContent` — that returns one long line with the words
+ * of adjacent paragraphs joined together.
+ */
+const LINE_BREAKING_TAGS = new Set([
+    "ADDRESS",
+    "ARTICLE",
+    "BLOCKQUOTE",
+    "BR",
+    "DIV",
+    "H1",
+    "H2",
+    "H3",
+    "H4",
+    "H5",
+    "H6",
+    "HR",
+    "LI",
+    "OL",
+    "P",
+    "PRE",
+    "SECTION",
+    "TABLE",
+    "TR",
+    "UL",
+]);
+const htmlToPlainText = (html) => {
+    const parsed = new DOMParser().parseFromString(html, "text/html");
+    const lines = [];
+    let line = "";
+    const endLine = () => {
+        lines.push(line.trim());
+        line = "";
+    };
+    const visit = (node) => {
+        if (node.nodeType === node.TEXT_NODE) {
+            line += (node.textContent ?? "").replace(/\s+/g, " ");
+            return;
+        }
+        if (node.nodeType !== node.ELEMENT_NODE)
+            return;
+        const breaks = LINE_BREAKING_TAGS.has(node.tagName);
+        if (breaks && line !== "")
+            endLine();
+        for (const child of node.childNodes)
+            visit(child);
+        if (breaks)
+            endLine();
+    };
+    visit(parsed.body);
+    if (line !== "")
+        endLine();
+    return lines
+        .join("\n")
+        .replace(/\n{3,}/g, "\n\n")
+        .trim();
+};
+const addressLabel = (address) => address.displayName
+    ? `${address.displayName} <${address.normalizedEmail}>`
+    : address.normalizedEmail;
+const addressList = (addresses) => addresses.map(addressLabel).join(", ");
+/**
+ * An absolute date, because the attribution outlives the moment it was written
+ * — the relative form the message list uses would reach the recipient reading
+ * "Yesterday" about a day that is no longer yesterday.
+ */
+const quotedDate = (date) => formatDate(date, {
+    year: "numeric",
+    month: "short",
+    day: "numeric",
+    hour: "numeric",
+    minute: "numeric",
+});
+/** The form `snippet.ts` and the search chunker both recognise as a quote. */
+const attributionLine = (envelope) => {
+    const who = addressList(envelope.from) || "the sender";
+    const when = quotedDate(envelope.date);
+    if (!when)
+        return `${who} wrote:`;
+    return `On ${when}, ${who} wrote:`;
+};
+const FORWARD_RULE = "---------- Forwarded message ----------";
+const forwardHeader = (envelope) => {
+    const lines = [
+        FORWARD_RULE,
+        `From: ${addressList(envelope.from)}`,
+        `Date: ${quotedDate(envelope.date)}`,
+        `Subject: ${envelope.subject ?? ""}`,
+        `To: ${addressList(envelope.to)}`,
+    ];
+    if (envelope.cc.length > 0)
+        lines.push(`Cc: ${addressList(envelope.cc)}`);
+    return lines;
+};
+const quotePrefixed = (text) => text.split("\n").map((line) => (line === "" ? ">" : `> ${line}`));
+/**
+ * The original, as the message being written will carry it. One value, so what
+ * the composer shows under the editor is the same block that leaves for the
+ * API rather than a second rendering of the same source (#845.5).
+ *
+ * A reply indents the original behind an attribution line; a forward passes it
+ * on whole under the header block, because a forward is the original message
+ * rather than a passage cited from it.
+ */
+export const buildQuotedBlock = (kind, envelope, body) => {
+    const bodyText = body.kind === "text" ? body.content.trim() : htmlToPlainText(body.content);
+    const bodyHtml = body.kind === "html" ? body.content : textToHtml(body.content.trim());
+    if (kind === "forward") {
+        const header = forwardHeader(envelope);
+        return {
+            text: [...header, "", bodyText].join("\n"),
+            html: `${textToHtml(header.join("\n"))}${bodyHtml}`,
+        };
+    }
+    const attribution = attributionLine(envelope);
+    return {
+        text: [attribution, ...quotePrefixed(bodyText)].join("\n"),
+        html: `<p>${escapeHtml(attribution)}</p><blockquote type="cite">${bodyHtml}</blockquote>`,
+    };
+};
+const joinText = (written, quoted) => written === "" ? quoted : `${written}\n\n${quoted}`;
+/**
+ * What the two body columns carry for this mode.
+ *
+ * Plain mode writes the empty string rather than omitting `htmlBody`: absent
+ * means "leave alone" at every layer below, so a plain draft that omitted it
+ * would send the HTML it was written as before the switch. The empty string is
+ * defined, so the repository's update guard clears the column, and nodemailer
+ * branches on the value being truthy — an empty one builds no HTML alternative
+ * and the message leaves as a single `text/plain` part. It is also why the
+ * quote reaches a plain message through `textBody` alone: putting its markup in
+ * `htmlBody` would reopen the draft as rich and send the recipient an HTML
+ * alternative of a message written as plain text.
+ *
+ * Rich mode leaves `htmlBody` alone while it has nothing to say, so the moments
+ * before the lazily-loaded editor reports its document cannot write a draft
+ * back as plain. A quote is something to say, so a send pressed in those
+ * moments still carries the message it quotes.
+ */
+export const outgoingBody = (bodyMode, body, language, quoted) => {
+    const text = quoted ? joinText(body.text, quoted.text) : body.text;
+    if (bodyMode === "plain")
+        return { textBody: text || undefined, htmlBody: "" };
+    const html = quoted ? `${body.html}${quoted.html}` : body.html;
+    return {
+        textBody: text || undefined,
+        htmlBody: html ? wrapWithLanguage(html, language) : undefined,
+    };
+};

package/dist/src/components/compose/reply-with-times.d.ts

@@ -0,0 +1,6 @@
+export interface AnsweredMessage {
+    threadId: string;
+    messageId: string;
+}
+export type ReplyWithText = (message: AnsweredMessage, text: string) => void;
+export declare function useReplyWithText(): ReplyWithText;

package/dist/src/components/compose/reply-with-times.js

@@ -0,0 +1,12 @@
+import { useCallback } from "react";
+import { useOpenReply } from "../../routing";
+import { useCompose } from "./ComposeProvider";
+export function useReplyWithText() {
+    const { insertIntoOpenReply } = useCompose();
+    const openReply = useOpenReply();
+    return useCallback((message, text) => {
+        if (insertIntoOpenReply(message.messageId, text))
+            return;
+        openReply({ ...message, mode: "reply" }, { body: text });
+    }, [insertIntoOpenReply, openReply]);
+}

package/dist/src/components/config-import/ConfigImportWizard.d.ts

@@ -0,0 +1,24 @@
+/**
+ * Importing a configuration file, end to end (#1021 stage 5).
+ *
+ * The walk is: pick a file, dry-run it (`mode: validate`, which writes nothing
+ * and returns the report an apply would), read the per-item verdicts, settle a
+ * 409 against a non-empty instance, apply, then hand over the credentials the
+ * file deliberately does not carry — a password for a password account, a fresh
+ * Microsoft grant for an OAuth one. The folders IMAP has not produced yet are
+ * named at the end, because they are waiting rather than lost.
+ *
+ * The step is component state and not URL state. The picked file is a `File`
+ * handle that no reload can bring back, so a step in the address would restore
+ * a screen with nothing behind it (url-state.md R6) — the same reason
+ * `OnboardingWizard` keeps its own step in state.
+ */
+export interface ConfigImportWizardProps {
+    /**
+     * Leaving the wizard. `imported` only where an apply actually wrote — an
+     * abandoned 409 and a wizard closed on a rejected file are both `abandoned`,
+     * so nothing downstream records an import that never happened.
+     */
+    onDone: (outcome: "imported" | "abandoned") => void;
+}
+export declare function ConfigImportWizard({ onDone }: ConfigImportWizardProps): import("react").JSX.Element;

package/dist/src/components/config-import/ConfigImportWizard.js

@@ -0,0 +1,425 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * Importing a configuration file, end to end (#1021 stage 5).
+ *
+ * The walk is: pick a file, dry-run it (`mode: validate`, which writes nothing
+ * and returns the report an apply would), read the per-item verdicts, settle a
+ * 409 against a non-empty instance, apply, then hand over the credentials the
+ * file deliberately does not carry — a password for a password account, a fresh
+ * Microsoft grant for an OAuth one. The folders IMAP has not produced yet are
+ * named at the end, because they are waiting rather than lost.
+ *
+ * The step is component state and not URL state. The picked file is a `File`
+ * handle that no reload can bring back, so a step in the address would restore
+ * a screen with nothing behind it (url-state.md R6) — the same reason
+ * `OnboardingWizard` keeps its own step in state.
+ */
+import { accountDetailOperationsUpdateAccountMutation, configOperationsGetConfigOptions, configOperationsGetConfigQueryKey, configOperationsImportConfigMutation, microsoftOAuthOperationsMicrosoftOAuthStartMutation, syncOperationsTriggerSyncMutation, } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import { Banner } from "@remit/ui";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { Server } from "lucide-react";
+import { useCallback, useMemo, useState } from "react";
+import { REDIRECT_STALL_MESSAGE, useRedirectEnded, } from "../../hooks/useRedirectEnded";
+import { useReturnFromRedirect } from "../../hooks/useReturnFromRedirect";
+import { groupReportSections, pendingFolders, readConfigText, readConflict, readFailure, sectionResults, WRITE_FAILURE_CODE, writeFailure, } from "../../lib/config-import";
+import { softErrorStatuses } from "../../lib/error-classifier";
+import { ConnectionTestStep, CredentialsStep, } from "../onboarding/credential-steps";
+import { IMPORT_STEPS, StepAccountReconnectMicrosoft, StepChooseFile, StepCredentialsOverview, StepDryRunReport, StepFileRejected, StepInstanceAlreadyConfigured, StepPartialImport, StepPendingFolders, } from "./steps";
+const securityOf = (tls, startTls) => tls ? "tls" : startTls ? "starttls" : "none";
+const serverOf = (account) => ({
+    host: account.imapHost,
+    port: account.imapPort,
+    security: securityOf(account.imapTls, account.imapStartTls),
+});
+const smtpOf = (account) => ({
+    host: account.smtpEnabled ? account.smtpHost : "",
+    port: account.smtpPort,
+    security: securityOf(account.smtpTls, account.smtpStartTls),
+});
+/**
+ * An account the import landed, as the credentials screen reads it.
+ *
+ * `connectionState` is the server's eventual truth and not this screen's: the
+ * import writes `credentials_missing`, and only the imap worker clears it, on
+ * its next connection, minutes later. Reading readiness off that field alone
+ * left an account the reader had just signed in to sitting red with an "Enter
+ * password" button, so a credential this wizard verified and stored counts here
+ * and the field catches up behind it.
+ */
+const asImportedAccount = (account, failure, verified) => {
+    const connector = account.authType === "oauthMicrosoft" ? "microsoft" : "imap";
+    const waiting = !verified &&
+        (connector === "microsoft"
+            ? account.connectionState === "reauth_required"
+            : account.connectionState === "credentials_missing");
+    return {
+        accountId: account.accountId,
+        address: account.email,
+        displayName: account.displayName?.trim() || account.email,
+        connector,
+        server: `${account.imapHost}:${account.imapPort}`,
+        state: failure ? "failed" : waiting ? "needed" : "entered",
+        failure,
+    };
+};
+const heldSummary = (details) => {
+    if (!details)
+        return "This instance already holds configuration of its own.";
+    const parts = [
+        ["accounts", "account"],
+        ["labels", "label"],
+        ["filters", "rule"],
+        ["addressFlags", "flagged sender"],
+    ]
+        .map(([key, noun]) => ({ count: Number(details[key] ?? 0), noun }))
+        .filter((part) => part.count > 0)
+        .map((part) => `${part.count} ${part.noun}${part.count === 1 ? "" : "s"}`);
+    if (parts.length === 0) {
+        return "This instance already holds configuration of its own.";
+    }
+    return `${parts.join(", ")} are set up here already.`;
+};
+const errorText = (error, fallback) => {
+    if (error instanceof Error)
+        return error.message;
+    if (typeof error === "object" && error !== null) {
+        const message = error.message;
+        if (typeof message === "string")
+            return message;
+    }
+    return fallback;
+};
+export function ConfigImportWizard({ onDone }) {
+    const queryClient = useQueryClient();
+    const [step, setStep] = useState("file");
+    const [dragging, setDragging] = useState(false);
+    const [readingFile, setReadingFile] = useState(false);
+    const [file, setFile] = useState(undefined);
+    const [document, setDocument] = useState(undefined);
+    const [readFailureCopy, setReadFailureCopy] = useState(undefined);
+    const [report, setReport] = useState(undefined);
+    const [onExisting, setOnExisting] = useState("abort");
+    const [conflictChoice, setConflictChoice] = useState(undefined);
+    const [conflict, setConflict] = useState(undefined);
+    const [needingCredentials, setNeedingCredentials] = useState([]);
+    /** Accounts this wizard signed in and stored a credential for. */
+    const [verifiedAccountIds, setVerifiedAccountIds] = useState([]);
+    const [activeAccountId, setActiveAccountId] = useState(null);
+    const [credentials, setCredentials] = useState({
+        username: "",
+        password: "",
+    });
+    const [accountFailures, setAccountFailures] = useState({});
+    const [overviewError, setOverviewError] = useState(undefined);
+    const [reconnectingAccountId, setReconnectingAccountId] = useState(null);
+    const [importedFolders, setImportedFolders] = useState([]);
+    const { data: config } = useQuery({
+        ...configOperationsGetConfigOptions(),
+        enabled: needingCredentials.length > 0 || step === "folders",
+    });
+    const accountsById = useMemo(() => {
+        const index = new Map();
+        for (const account of config?.accounts ?? []) {
+            index.set(account.accountId, account);
+        }
+        return index;
+    }, [config]);
+    const accounts = useMemo(() => needingCredentials
+        .map((accountId) => accountsById.get(accountId))
+        .filter((account) => !!account)
+        .map((account) => asImportedAccount(account, accountFailures[account.accountId], verifiedAccountIds.includes(account.accountId))), [needingCredentials, accountsById, accountFailures, verifiedAccountIds]);
+    const activeAccount = activeAccountId
+        ? accountsById.get(activeAccountId)
+        : undefined;
+    const activePosition = activeAccountId
+        ? needingCredentials.indexOf(activeAccountId) + 1
+        : 0;
+    // Each of these owns exactly the refusals it renders, and nothing else. A
+    // blanket `softError` would also swallow the 401 that has to escalate to the
+    // signed-out state, and a 5xx escalates regardless of what is asked for here.
+    const importMutation = useMutation({
+        ...configOperationsImportConfigMutation(),
+        // 409 `config_not_empty` is not a fault: it is the abort-or-merge screen.
+        meta: softErrorStatuses(409),
+    });
+    const updateAccount = useMutation({
+        ...accountDetailOperationsUpdateAccountMutation(),
+        // The account is gone (404) or is not this configuration's (403); the
+        // credentials row states either where it stands.
+        meta: softErrorStatuses(403, 404),
+    });
+    const triggerSync = useMutation(syncOperationsTriggerSyncMutation());
+    // No meta: `POST /oauth/microsoft/start` declares no refusal. It answers 5xx
+    // when the tenant secret is missing, which must reach the fatal page rather
+    // than a wizard banner, and a transport failure is soft already — which is
+    // the failure the reconnect screen's own error line renders.
+    const oauthStart = useMutation(microsoftOAuthOperationsMicrosoftOAuthStartMutation());
+    // Microsoft hands the finished sign-in back to whichever window the platform
+    // picks, which need not be this one. Every return to this window re-reads the
+    // accounts, so a row states what the server says rather than what this window
+    // last saw.
+    useReturnFromRedirect(reconnectingAccountId !== null, () => {
+        queryClient.invalidateQueries({
+            queryKey: configOperationsGetConfigQueryKey(),
+        });
+        setReconnectingAccountId(null);
+    });
+    const markRedirectStarted = useRedirectEnded((end) => {
+        setReconnectingAccountId(null);
+        if (end === "stalled")
+            setOverviewError(REDIRECT_STALL_MESSAGE);
+    });
+    const handleChoose = useCallback((picked) => {
+        setDragging(false);
+        setReadingFile(true);
+        setFile({ name: picked.name, size: picked.size });
+        setReadFailureCopy(undefined);
+        setDocument(undefined);
+        picked
+            .text()
+            .then((text) => readConfigText(picked.name, picked.size, text))
+            .then((result) => {
+            setReadingFile(false);
+            if (!result.ok) {
+                setReadFailureCopy(result.failure);
+                return;
+            }
+            setDocument(result.document);
+        })
+            .catch((cause) => {
+            setReadingFile(false);
+            setReadFailureCopy({
+                title: "That file could not be read",
+                explanation: `The browser could not read ${picked.name} from disk, so nothing was sent.`,
+                fix: "Check the file is still there and try again.",
+                raw: errorText(cause, "the file read was refused"),
+            });
+        });
+    }, []);
+    const runImport = useCallback((mode, existing) => {
+        if (!document)
+            return;
+        setConflict(undefined);
+        importMutation.mutate({ body: { mode, onExisting: existing, document } }, {
+            onSuccess: (answer) => {
+                setReport(answer);
+                if (readFailure(answer)) {
+                    setStep("rejected");
+                    return;
+                }
+                if (writeFailure(answer)) {
+                    setStep("partial");
+                    return;
+                }
+                if (mode === "validate") {
+                    setStep("review");
+                    return;
+                }
+                setImportedFolders(pendingFolders(answer));
+                queryClient.invalidateQueries({
+                    queryKey: configOperationsGetConfigQueryKey(),
+                });
+                if (answer.accountsNeedingCredentials.length > 0) {
+                    setNeedingCredentials([...answer.accountsNeedingCredentials]);
+                    setStep("credentials");
+                    return;
+                }
+                setStep("folders");
+            },
+            onError: (cause) => {
+                const refused = readConflict(cause);
+                if (refused) {
+                    setConflict(refused);
+                    setConflictChoice(undefined);
+                    setStep("conflict");
+                    return;
+                }
+                setReadFailureCopy({
+                    title: "The import could not be sent",
+                    explanation: "The request to this instance failed before it produced a report, so nothing was written.",
+                    fix: "Check your connection and try again.",
+                    raw: errorText(cause, "POST /config/import failed"),
+                });
+                setStep("file");
+            },
+        });
+    }, [document, importMutation, queryClient]);
+    const openAccount = useCallback((account) => {
+        setActiveAccountId(account.accountId);
+        setOverviewError(undefined);
+        if (account.connector === "microsoft") {
+            setStep("account-oauth");
+            return;
+        }
+        const stored = accountsById.get(account.accountId);
+        setCredentials({
+            username: stored?.username || account.address,
+            password: "",
+        });
+        setStep("account-password");
+    }, [accountsById]);
+    const handleCredentialsVerified = useCallback(() => {
+        if (!activeAccountId)
+            return;
+        updateAccount.mutate({
+            path: { accountId: activeAccountId },
+            body: { password: credentials.password, isActive: true },
+        }, {
+            onSuccess: () => {
+                triggerSync.mutate({ path: { accountId: activeAccountId } });
+                setVerifiedAccountIds((ids) => ids.includes(activeAccountId) ? ids : [...ids, activeAccountId]);
+                setAccountFailures((failures) => {
+                    const next = { ...failures };
+                    delete next[activeAccountId];
+                    return next;
+                });
+                queryClient.invalidateQueries({
+                    queryKey: configOperationsGetConfigQueryKey(),
+                });
+                setCredentials({ username: "", password: "" });
+                setActiveAccountId(null);
+                setStep("credentials");
+            },
+            onError: (cause) => {
+                setAccountFailures((failures) => ({
+                    ...failures,
+                    [activeAccountId]: errorText(cause, "The password was verified but could not be stored. Try again."),
+                }));
+                setActiveAccountId(null);
+                setStep("credentials");
+            },
+        });
+    }, [
+        activeAccountId,
+        credentials.password,
+        queryClient,
+        triggerSync,
+        updateAccount,
+    ]);
+    const startReconnect = useCallback(() => {
+        if (!activeAccount)
+            return;
+        setReconnectingAccountId(activeAccount.accountId);
+        oauthStart.mutate({ body: { email: activeAccount.email } }, {
+            onSuccess: (data) => {
+                markRedirectStarted();
+                window.location.assign(data.authorizationUrl);
+            },
+            onError: (cause) => {
+                setReconnectingAccountId(null);
+                setAccountFailures((failures) => ({
+                    ...failures,
+                    [activeAccount.accountId]: errorText(cause, "Microsoft sign-in could not be started."),
+                }));
+                setActiveAccountId(null);
+                setStep("credentials");
+            },
+        });
+    }, [activeAccount, markRedirectStarted, oauthStart]);
+    const handleChangeCredentials = useCallback((username, password) => setCredentials({ username, password }), []);
+    /**
+     * What is still waiting when the wizard finishes: the warnings the apply
+     * produced, plus whatever the binder has not resolved since — `pendingImport`
+     * on GET /config is the live answer, and the warnings name which setting each
+     * path belongs to.
+     */
+    const foldersStillPending = useMemo(() => {
+        const live = config?.pendingImport?.folderPaths;
+        if (!live)
+            return importedFolders;
+        const named = new Set(live);
+        const known = importedFolders.filter((folder) => named.has(folder.path));
+        const unnamed = live
+            .filter((path) => !importedFolders.some((folder) => folder.path === path))
+            .map((path) => ({ path, waitingFor: "An imported setting" }));
+        return [...known, ...unnamed];
+    }, [config, importedFolders]);
+    const goToFile = useCallback(() => {
+        setReport(undefined);
+        setConflict(undefined);
+        setReadFailureCopy(undefined);
+        setFile(undefined);
+        setDocument(undefined);
+        setOnExisting("abort");
+        setStep("file");
+    }, []);
+    switch (step) {
+        case "file":
+            return (_jsx(StepChooseFile, { state: readingFile
+                    ? "reading"
+                    : importMutation.isPending
+                        ? "checking"
+                        : dragging
+                            ? "dragging"
+                            : "idle", file: file, ready: document !== undefined, failure: readFailureCopy, onChoose: handleChoose, onDragStateChange: setDragging, onNext: () => runImport("validate", onExisting) }));
+        case "rejected":
+            return (_jsx(StepFileRejected, { failure: (report && readFailure(report)) ??
+                    readFailureCopy ?? {
+                    title: "The file could not be imported",
+                    explanation: "The import was refused and nothing was written.",
+                    fix: "Re-export the configuration and try again.",
+                    raw: "no error was reported",
+                }, onBack: goToFile }));
+        case "conflict":
+            return (_jsx(StepInstanceAlreadyConfigured, { choice: conflictChoice, held: heldSummary(conflict?.details), onChoose: setConflictChoice, onBack: goToFile, onNext: () => {
+                    if (conflictChoice === "abort") {
+                        onDone("abandoned");
+                        return;
+                    }
+                    setOnExisting("merge");
+                    runImport("validate", "merge");
+                } }));
+        case "review":
+            return (_jsx(StepDryRunReport, { sections: groupReportSections(report?.items ?? []), fileName: file?.name ?? "the config file", warnings: (report?.warnings ?? []).map((warning) => warning.message), applying: importMutation.isPending, onBack: goToFile, onNext: () => runImport("apply", onExisting) }));
+        case "partial": {
+            if (!report)
+                return _jsx(StepMissingReport, { onBack: goToFile });
+            const failed = writeFailure(report);
+            return (_jsx(StepPartialImport, { results: sectionResults(report), message: failed?.message ?? "The import stopped before it finished.", raw: `${failed?.code ?? WRITE_FAILURE_CODE}: ${failed?.message ?? "no message"}`, nothingLanded: !report.applied, onBack: goToFile, onNext: () => runImport("apply", "merge") }));
+        }
+        case "credentials":
+            return (_jsx(StepCredentialsOverview, { accounts: accounts, busyAccountId: reconnectingAccountId ?? undefined, error: overviewError, onOpen: openAccount, 
+                // No way back: the apply has run, and the step behind this one is the
+                // dry run whose primary action would apply the same file again to an
+                // instance that is no longer empty.
+                onNext: () => setStep("folders") }));
+        case "account-password":
+            if (!activeAccount) {
+                return _jsx(StepMissingAccount, { onBack: () => onDone("abandoned") });
+            }
+            return (_jsx(CredentialsStep, { steps: IMPORT_STEPS, activeStep: 2, title: `Sign in to ${activeAccount.email}`, subtitle: `Account ${activePosition} of ${needingCredentials.length} · ${activeAccount.imapHost}:${activeAccount.imapPort}`, email: activeAccount.email, username: credentials.username, password: credentials.password, error: accountFailures[activeAccount.accountId], continueLabel: "Test and continue", notice: _jsxs("div", { className: "flex items-center gap-2 text-xs text-fg-muted", children: [_jsx(Server, { className: "size-3.5" }), "Server settings came from the config file \u2014 edit them in Settings if they are wrong."] }), onContinue: () => setStep("account-test"), onBack: () => {
+                    setActiveAccountId(null);
+                    setStep("credentials");
+                }, onChange: handleChangeCredentials }));
+        case "account-test":
+            if (!activeAccount) {
+                return _jsx(StepMissingAccount, { onBack: () => onDone("abandoned") });
+            }
+            return (_jsx(ConnectionTestStep, { steps: IMPORT_STEPS, activeStep: 2, email: activeAccount.email, imapConfig: serverOf(activeAccount), smtpConfig: smtpOf(activeAccount), username: credentials.username, password: credentials.password, credentialsBackLabel: "Back to the password", serversBackLabel: "Back to the password", successLabel: "Save and continue", onSuccess: handleCredentialsVerified, onBackToCredentials: () => setStep("account-password"), onBackToServers: () => setStep("account-password") }));
+        case "account-oauth":
+            if (!activeAccount) {
+                return _jsx(StepMissingAccount, { onBack: () => onDone("abandoned") });
+            }
+            return (_jsx(StepAccountReconnectMicrosoft, { account: asImportedAccount(activeAccount, accountFailures[activeAccount.accountId], verifiedAccountIds.includes(activeAccount.accountId)), position: activePosition, total: needingCredentials.length, error: accountFailures[activeAccount.accountId], busy: reconnectingAccountId === activeAccount.accountId, onBack: () => {
+                    setActiveAccountId(null);
+                    setStep("credentials");
+                }, onNext: startReconnect }));
+        case "folders":
+            return (_jsx(StepPendingFolders, { folders: foldersStillPending, onNext: () => onDone("imported") }));
+    }
+}
+function DeadEnd({ children, label, onBack, }) {
+    return (_jsxs("div", { className: "mx-auto max-w-lg p-6", children: [_jsx(Banner, { tone: "danger", children: children }), _jsx("button", { type: "button", className: "mt-3 text-sm text-accent underline", onClick: onBack, children: label })] }));
+}
+/**
+ * The account the wizard was about to ask for is gone from GET /config — it was
+ * deleted, or this configuration is not the one that was imported into. Saying
+ * so beats a blank screen the reader cannot leave.
+ */
+function StepMissingAccount({ onBack }) {
+    return (_jsx(DeadEnd, { label: "Go to inbox", onBack: onBack, children: "That account is no longer in this instance's configuration, so there is nothing left to sign in to. Open Settings \u203A Accounts to see what is here." }));
+}
+/** The partial-import screen with no report behind it — only reachable from a bug. */
+function StepMissingReport({ onBack }) {
+    return (_jsx(DeadEnd, { label: "Choose another file", onBack: onBack, children: "The import stopped but produced no report, so nothing here can say what it wrote. Open Settings to see what this instance holds before importing again." }));
+}

package/dist/src/components/config-import/config-import.fixtures.d.ts

@@ -0,0 +1,27 @@
+/**
+ * One exported configuration from a Dutch household setup — a personal domain
+ * over IMAP, a work account on Microsoft 365, and a consultancy address —
+ * carried into a second instance. Realistic enough that the dry-run report has
+ * something to say in every verdict, and shaped exactly as
+ * `POST /config/import` answers, so the stories render what the app renders.
+ */
+import type { ApiError, RemitImapConfigImportItemReport, RemitImapConfigImportReport } from "@remit/api-http-client/types.gen.ts";
+import type { ImportedAccount } from "./steps";
+export declare const CONFIG_FILE_NAME = "reader-config.example.json";
+export declare const mixedItems: RemitImapConfigImportItemReport[];
+/** A fresh install: nothing here to skip, nothing to reject. */
+export declare const cleanItems: RemitImapConfigImportItemReport[];
+export declare const folderWarnings: ApiError[];
+export declare const dryRunReport: RemitImapConfigImportReport;
+export declare const cleanRunReport: RemitImapConfigImportReport;
+export declare const rejectedReports: Record<string, RemitImapConfigImportReport>;
+export declare const partialImportReport: RemitImapConfigImportReport;
+/**
+ * The same stop with no section written: the first write was the one that
+ * failed, so the report carries no landed item and `applied` is false.
+ */
+export declare const nothingLandedImportReport: RemitImapConfigImportReport;
+export declare const importedAccounts: ImportedAccount[];
+export declare const accountsAllPending: ImportedAccount[];
+export declare const accountsAllConnected: ImportedAccount[];
+export declare const accountsOneFailed: ImportedAccount[];