@remit/web-client 0.0.325 → 0.0.326

package/dist/src/lib/compose-attachment-controller.d.ts

@@ -0,0 +1,90 @@
+import type { RemitImapOutboxAttachmentResponse } from "@remit/api-http-client/types.gen.ts";
+import type { ComposeAttachmentItem } from "@remit/ui";
+export type DraftForAttachment = {
+    outcome: "ready";
+    outboxMessageId: string;
+} | {
+    outcome: "refused";
+    reason: string;
+};
+export interface MintedAttachment {
+    outboxAttachmentId: string;
+    filename: string;
+    contentType: string;
+    contentId: string;
+    uploadUrl: string;
+}
+export interface CompletedAttachment {
+    contentUrl: string;
+}
+export interface AttachmentPlacement {
+    stored: (file: File, contentId: string) => void;
+    failed: (file: File) => void;
+}
+export interface StoredContent {
+    filename: string;
+    contentType: string;
+    contentUrl: string;
+}
+/** The four requests a file on a draft is made of. Each throws on failure. */
+export interface AttachmentTransport {
+    mint: (outboxMessageId: string, file: File) => Promise<MintedAttachment>;
+    put: (uploadUrl: string, file: File, signal: AbortSignal) => Promise<void>;
+    complete: (outboxMessageId: string, outboxAttachmentId: string) => Promise<CompletedAttachment>;
+    keep: (outboxMessageId: string, attachmentIds: string[]) => Promise<void>;
+}
+export interface ComposeAttachmentControllerDeps {
+    transport: () => AttachmentTransport;
+    ensureDraft: () => Promise<DraftForAttachment>;
+}
+/**
+ * The files on the draft being written, and the requests that put each one
+ * there: reserve room, upload the bytes, confirm them.
+ *
+ * What the draft keeps is stated to the server as a whole list, so a removal
+ * waits for every reservation still in flight: a list sent before one comes
+ * back would not name it, and the server would drop a file the writer kept.
+ * A file removed mid-upload is left out of that list once its reservation
+ * lands, which is what takes it off the draft — pulling the row alone would
+ * leave the upload to finish and the file to go out unseen.
+ */
+export declare class ComposeAttachmentController {
+    private readonly deps;
+    private entries;
+    private snapshot;
+    private readonly listeners;
+    private generation;
+    private draftId;
+    private nextKey;
+    private readonly reservationsInFlight;
+    private readonly inFlight;
+    private readonly mintedAfterRemoval;
+    private readonly removing;
+    private readonly removedListeners;
+    private loaded;
+    constructor(deps: ComposeAttachmentControllerDeps);
+    subscribe: (listener: () => void) => (() => void);
+    getSnapshot: () => ComposeAttachmentItem[];
+    owns: (contentId: string) => boolean;
+    storedContent: (contentId: string) => StoredContent | null;
+    isLoaded: () => boolean;
+    refreshLinks: (attachments: readonly RemitImapOutboxAttachmentResponse[]) => void;
+    onRemoved: (listener: (contentId: string) => void) => (() => void);
+    blockingReason: () => string | undefined;
+    private set;
+    private patch;
+    private reserve;
+    private upload;
+    private settleFailure;
+    private run;
+    /**
+     * Tell the server what the draft keeps, once no reservation is still out.
+     * Answers whether the server took it.
+     */
+    private syncKept;
+    attach: (files: File[], placement?: AttachmentPlacement) => Promise<void>;
+    retry: (key: string) => Promise<void>;
+    remove: (key: string) => Promise<void>;
+    load: (outboxMessageId: string, attachments: readonly RemitImapOutboxAttachmentResponse[]) => void;
+    reset: (outboxMessageId: string | undefined) => void;
+}

package/dist/src/lib/compose-attachment-controller.js

@@ -0,0 +1,359 @@
+import { formatErrorDetail } from "../components/ui/error-banners";
+const isRejection = (error) => typeof error === "object" &&
+    error !== null &&
+    "code" in error &&
+    error.code === "attachment_rejected" &&
+    "message" in error &&
+    typeof error.message === "string";
+/**
+ * Refusals about the file itself. Pressing again sends the same file and is
+ * refused the same way, so the row offers removal and nothing else.
+ */
+const FINAL_REASONS = new Set([
+    "EmptyFile",
+    "UnusableFilename",
+    "FileTooLarge",
+    "TooManyAttachments",
+]);
+const UPLOADING = { status: "uploading" };
+const ATTACHED = { status: "attached" };
+const failed = (reason, retryable) => ({
+    status: "failed",
+    reason,
+    retryable,
+});
+const refusalOf = (filename, error) => {
+    if (isRejection(error)) {
+        return failed(error.message, !FINAL_REASONS.has(error.reason));
+    }
+    return failed(`"${filename}" could not be attached: ${formatErrorDetail(error) ?? "the request failed"}. Try again.`, true);
+};
+const fromServer = (attachment) => ({
+    key: attachment.outboxAttachmentId,
+    serverId: attachment.outboxAttachmentId,
+    file: null,
+    placement: null,
+    contentId: attachment.contentId,
+    contentType: attachment.contentType,
+    contentUrl: attachment.contentUrl,
+    filename: attachment.filename,
+    sizeBytes: attachment.sizeBytes,
+    state: attachment.state === "Stored"
+        ? ATTACHED
+        : failed(`"${attachment.filename}" did not finish uploading. Remove it and attach it again.`, false),
+});
+/**
+ * The files on the draft being written, and the requests that put each one
+ * there: reserve room, upload the bytes, confirm them.
+ *
+ * What the draft keeps is stated to the server as a whole list, so a removal
+ * waits for every reservation still in flight: a list sent before one comes
+ * back would not name it, and the server would drop a file the writer kept.
+ * A file removed mid-upload is left out of that list once its reservation
+ * lands, which is what takes it off the draft — pulling the row alone would
+ * leave the upload to finish and the file to go out unseen.
+ */
+export class ComposeAttachmentController {
+    deps;
+    entries = [];
+    snapshot = [];
+    listeners = new Set();
+    generation = 0;
+    draftId;
+    nextKey = 0;
+    reservationsInFlight = new Set();
+    inFlight = new Map();
+    mintedAfterRemoval = new Map();
+    removing = new Map();
+    removedListeners = new Set();
+    loaded = false;
+    constructor(deps) {
+        this.deps = deps;
+    }
+    subscribe = (listener) => {
+        this.listeners.add(listener);
+        return () => this.listeners.delete(listener);
+    };
+    getSnapshot = () => this.snapshot;
+    owns = (contentId) => this.entries.some((entry) => entry.contentId === contentId);
+    storedContent = (contentId) => {
+        const entry = this.entries.find((candidate) => candidate.contentId === contentId && candidate.contentUrl !== null);
+        if (!entry?.contentUrl)
+            return null;
+        return {
+            filename: entry.filename,
+            contentType: entry.contentType,
+            contentUrl: entry.contentUrl,
+        };
+    };
+    isLoaded = () => this.loaded;
+    refreshLinks = (attachments) => {
+        const links = new Map(attachments.map((attachment) => [
+            attachment.outboxAttachmentId,
+            attachment.contentUrl,
+        ]));
+        this.set(this.entries.map((entry) => {
+            const contentUrl = entry.serverId === null ? undefined : links.get(entry.serverId);
+            return contentUrl === undefined ? entry : { ...entry, contentUrl };
+        }));
+    };
+    onRemoved = (listener) => {
+        this.removedListeners.add(listener);
+        return () => this.removedListeners.delete(listener);
+    };
+    blockingReason = () => {
+        const [removing] = this.removing.values();
+        if (removing !== undefined)
+            return `Removing "${removing}"…`;
+        const uploading = this.entries.find((entry) => entry.state.status === "uploading");
+        if (uploading)
+            return `"${uploading.filename}" is still uploading.`;
+        const broken = this.entries.find((entry) => entry.state.status === "failed");
+        if (broken) {
+            return `"${broken.filename}" is not attached. Try it again or remove it before sending.`;
+        }
+        return undefined;
+    };
+    set(next) {
+        this.entries = next;
+        this.snapshot = next.map(({ key, filename, sizeBytes, state }) => ({
+            key,
+            filename,
+            sizeBytes,
+            state,
+        }));
+        for (const listener of this.listeners)
+            listener();
+    }
+    patch(generation, key, change) {
+        if (generation !== this.generation)
+            return;
+        if (!this.entries.some((entry) => entry.key === key))
+            return;
+        this.set(this.entries.map((entry) => entry.key === key ? { ...entry, ...change } : entry));
+    }
+    reserve(outboxMessageId, file) {
+        let settle = () => { };
+        const slot = new Promise((resolve) => {
+            settle = () => {
+                this.reservationsInFlight.delete(slot);
+                resolve();
+            };
+        });
+        this.reservationsInFlight.add(slot);
+        return {
+            minted: this.deps.transport().mint(outboxMessageId, file),
+            settle,
+        };
+    }
+    upload = async (generation, key, file, outboxMessageId, signal) => {
+        if (signal.aborted)
+            return;
+        const transport = this.deps.transport();
+        const { minted: minting, settle } = this.reserve(outboxMessageId, file);
+        const minted = await minting.catch((error) => {
+            this.patch(generation, key, { state: refusalOf(file.name, error) });
+            return null;
+        });
+        if (minted !== null && signal.aborted) {
+            this.mintedAfterRemoval.set(key, minted.outboxAttachmentId);
+        }
+        if (minted !== null && !signal.aborted) {
+            this.patch(generation, key, {
+                serverId: minted.outboxAttachmentId,
+                filename: minted.filename,
+                contentId: minted.contentId,
+                contentType: minted.contentType,
+            });
+        }
+        settle();
+        if (minted === null || signal.aborted)
+            return;
+        const putFailure = await transport.put(minted.uploadUrl, file, signal).then(() => null, (error) => formatErrorDetail(error) ?? "the connection dropped");
+        if (signal.aborted)
+            return;
+        if (putFailure !== null) {
+            this.patch(generation, key, {
+                state: failed(`"${minted.filename}" did not finish uploading: ${putFailure}. Try again.`, true),
+            });
+            return;
+        }
+        const completed = await transport
+            .complete(outboxMessageId, minted.outboxAttachmentId)
+            .catch((error) => {
+            this.patch(generation, key, {
+                state: refusalOf(minted.filename, error),
+            });
+            return null;
+        });
+        if (completed === null || signal.aborted)
+            return;
+        this.patch(generation, key, {
+            state: ATTACHED,
+            contentUrl: completed.contentUrl,
+        });
+        if (generation !== this.generation)
+            return;
+        this.entries
+            .find((entry) => entry.key === key)
+            ?.placement?.stored(file, minted.contentId);
+    };
+    settleFailure(generation, key, file) {
+        if (generation !== this.generation)
+            return;
+        const entry = this.entries.find((candidate) => candidate.key === key);
+        if (entry?.state.status === "failed")
+            entry.placement?.failed(file);
+    }
+    run = async (generation, key, file, outboxMessageId, signal) => {
+        await this.upload(generation, key, file, outboxMessageId, signal);
+        if (this.inFlight.get(key)?.signal === signal)
+            this.inFlight.delete(key);
+        this.settleFailure(generation, key, file);
+    };
+    /**
+     * Tell the server what the draft keeps, once no reservation is still out.
+     * Answers whether the server took it.
+     */
+    syncKept = async (generation) => {
+        while (this.reservationsInFlight.size > 0) {
+            await Promise.all([...this.reservationsInFlight]);
+        }
+        const outboxMessageId = this.draftId;
+        if (generation !== this.generation || outboxMessageId === undefined) {
+            return null;
+        }
+        return this.deps
+            .transport()
+            .keep(outboxMessageId, this.entries.flatMap((entry) => entry.serverId === null ? [] : [entry.serverId]))
+            .then(() => null, (error) => error ?? new Error("the request failed"));
+    };
+    attach = async (files, placement) => {
+        const generation = this.generation;
+        const added = files.map((file) => {
+            this.nextKey += 1;
+            const entry = {
+                key: `local-${this.nextKey}`,
+                serverId: null,
+                file,
+                placement: placement ?? null,
+                contentId: null,
+                contentType: file.type || "application/octet-stream",
+                contentUrl: null,
+                filename: file.name,
+                sizeBytes: file.size,
+                state: UPLOADING,
+            };
+            const controller = new AbortController();
+            this.inFlight.set(entry.key, controller);
+            return { entry, file, signal: controller.signal };
+        });
+        this.set([...this.entries, ...added.map(({ entry }) => entry)]);
+        const draft = await this.deps.ensureDraft();
+        if (draft.outcome === "refused") {
+            for (const { entry, file } of added) {
+                this.inFlight.delete(entry.key);
+                this.patch(generation, entry.key, {
+                    state: failed(draft.reason, true),
+                });
+                this.settleFailure(generation, entry.key, file);
+            }
+            return;
+        }
+        if (generation !== this.generation)
+            return;
+        this.draftId = draft.outboxMessageId;
+        await Promise.all(added.map(({ entry, file, signal }) => this.run(generation, entry.key, file, draft.outboxMessageId, signal)));
+    };
+    retry = async (key) => {
+        const entry = this.entries.find((candidate) => candidate.key === key);
+        if (!entry || entry.file === null || this.inFlight.has(key))
+            return;
+        const file = entry.file;
+        const generation = this.generation;
+        const controller = new AbortController();
+        this.inFlight.set(key, controller);
+        this.patch(generation, key, { state: UPLOADING, serverId: null });
+        const draft = await this.deps.ensureDraft();
+        if (draft.outcome === "refused") {
+            this.inFlight.delete(key);
+            this.patch(generation, key, { state: failed(draft.reason, true) });
+            return;
+        }
+        this.draftId = draft.outboxMessageId;
+        if (entry.serverId !== null) {
+            const failure = await this.syncKept(generation);
+            if (failure !== null) {
+                this.inFlight.delete(key);
+                this.patch(generation, key, {
+                    serverId: entry.serverId,
+                    state: refusalOf(file.name, failure),
+                });
+                return;
+            }
+        }
+        await this.run(generation, key, file, draft.outboxMessageId, controller.signal);
+    };
+    remove = async (key) => {
+        const entry = this.entries.find((candidate) => candidate.key === key);
+        if (!entry)
+            return;
+        const generation = this.generation;
+        const uploading = this.inFlight.get(key);
+        this.set(this.entries.filter((candidate) => candidate.key !== key));
+        if (uploading) {
+            this.inFlight.delete(key);
+            uploading.abort();
+        }
+        if (entry.serverId === null && !uploading)
+            return;
+        // Until the server has dropped it the file is still on the draft, and a
+        // Send pressed in that window would carry it.
+        this.removing.set(key, entry.filename);
+        this.set(this.entries);
+        const failure = await this.syncKept(generation);
+        this.removing.delete(key);
+        this.set(this.entries);
+        const serverId = entry.serverId ?? this.mintedAfterRemoval.get(key) ?? null;
+        this.mintedAfterRemoval.delete(key);
+        if (generation !== this.generation)
+            return;
+        if (failure === null) {
+            if (entry.contentId === null)
+                return;
+            for (const listener of this.removedListeners)
+                listener(entry.contentId);
+            return;
+        }
+        if (serverId === null)
+            return;
+        this.set([
+            ...this.entries,
+            {
+                ...entry,
+                serverId,
+                file: null,
+                state: failed(`"${entry.filename}" could not be removed: ${formatErrorDetail(failure) ?? "the request failed"}. It is still on the draft — remove it again.`, false),
+            },
+        ]);
+    };
+    load = (outboxMessageId, attachments) => {
+        this.draftId = outboxMessageId;
+        this.loaded = true;
+        const listed = new Set(attachments.map((attachment) => attachment.outboxAttachmentId));
+        const attachedHere = this.entries.filter((entry) => entry.file !== null &&
+            (entry.serverId === null || !listed.has(entry.serverId)));
+        this.set([...attachments.map(fromServer), ...attachedHere]);
+    };
+    reset = (outboxMessageId) => {
+        this.generation += 1;
+        for (const controller of this.inFlight.values())
+            controller.abort();
+        this.inFlight.clear();
+        this.mintedAfterRemoval.clear();
+        this.removing.clear();
+        this.draftId = outboxMessageId;
+        this.loaded = false;
+        this.set([]);
+    };
+}

package/dist/src/lib/config-import.d.ts

@@ -0,0 +1,136 @@
+/**
+ * What a config import report means on screen (#1021).
+ *
+ * `POST /config/import` answers with one flat report: per-item verdicts, a list
+ * of blocking errors and a list of non-blocking warnings, each keyed by a code.
+ * The screens group that into sections, and turn a code into copy that says
+ * what failed and what to do about it. Nothing here touches the network or the
+ * DOM, so every branch the wizard can land in is decidable in a unit test.
+ */
+import type { ApiError, RemitImapConfigImportItemReport, RemitImapConfigImportReport } from "@remit/api-http-client/types.gen.ts";
+export declare const IMPORT_SECTION_ORDER: readonly ["accounts", "labels", "filters", "addressFlags", "settings"];
+export type ImportSection = (typeof IMPORT_SECTION_ORDER)[number];
+export declare const IMPORT_VERDICTS: readonly ["created", "updated", "unchanged", "skipped", "rejected"];
+export type ImportVerdict = (typeof IMPORT_VERDICTS)[number];
+export declare const verdictTone: Record<ImportVerdict, "neutral" | "positive" | "warning" | "danger" | "accent">;
+/**
+ * The wire model spells the verdict as a plain string, so a value this client
+ * does not know reads as rejected rather than as an unstyled row: an item the
+ * screen cannot vouch for is one the reader must look at.
+ */
+export declare const asVerdict: (value: string) => ImportVerdict;
+/**
+ * A section this client does not know is not folded into one it does. Quietly
+ * filing an unrecognised item under "settings" would tell the reader something
+ * false about what a newer Reader's file is doing to their configuration, which
+ * is the failure the whole format exists to prevent. Unknown reads as unknown,
+ * and the screen shows it under its own heading.
+ */
+export declare const UNKNOWN_SECTION: "unknown";
+export type ReportSectionId = ImportSection | typeof UNKNOWN_SECTION;
+export declare const asSection: (value: string) => ImportSection | undefined;
+export interface ReportEntry {
+    id: string;
+    label: string;
+    verdict: ImportVerdict;
+    reason?: string;
+}
+export interface ReportSection {
+    id: ReportSectionId;
+    title: string;
+    entries: ReportEntry[];
+}
+export declare const groupReportSections: (items: readonly RemitImapConfigImportItemReport[]) => ReportSection[];
+export type VerdictCounts = Record<ImportVerdict, number>;
+export declare const countVerdicts: (items: readonly RemitImapConfigImportItemReport[]) => VerdictCounts;
+/**
+ * A blocking failure, worded for the person holding the file: what the reader
+ * refused, why refusing beats importing around it, and the move that fixes it.
+ * `raw` is the server's own sentence, kept verbatim so a bug report carries it.
+ */
+export interface FailureCopy {
+    title: string;
+    explanation: string;
+    fix: string;
+    raw: string;
+}
+export declare const WRITE_FAILURE_CODE = "import_write_failed";
+export declare const CONFLICT_CODE = "config_not_empty";
+export interface ImportConflict {
+    message: string;
+    details?: Record<string, string>;
+}
+/**
+ * The 409 a non-empty configuration answers with, or nothing.
+ *
+ * The endpoint's body is flat — `code`, `message`, `details` — but it does not
+ * always arrive that way: `lib/client.ts` re-wraps every HTTP failure as an
+ * `ApiError` so the fail-fast classifier can read a status off it, and that
+ * moves the body onto `error.body`. Reading the code off the error itself finds
+ * nothing there and turns the refusal into "check your connection", which is
+ * how the abort-or-merge screen became unreachable. Both shapes are checked,
+ * and the code is what decides: a status is confirmation where there is one,
+ * never the thing being matched on.
+ */
+export declare const readConflict: (error: unknown) => ImportConflict | undefined;
+/**
+ * The blocking failure to render, when there is one. `import_write_failed` is
+ * deliberately not one of these: the import got past validation and part of it
+ * may be live, which is a different screen with a different instruction.
+ */
+export declare const readFailure: (report: RemitImapConfigImportReport) => FailureCopy | undefined;
+export declare const writeFailure: (report: RemitImapConfigImportReport) => ApiError | undefined;
+export type SectionOutcome = "landed" | "not-landed" | "failed" | "not-attempted" | "unknown";
+export interface SectionResult {
+    section: ImportSection;
+    title: string;
+    state: SectionOutcome;
+    detail: string;
+}
+/**
+ * What a stopped import wrote, section by section. The write order is fixed, so
+ * the section the failure names splits the document in three: what is before it
+ * ran, it did not, and what is after it was never reached.
+ *
+ * `applied` is the server's answer on whether any of it was written, because
+ * only the backend knows whether it had a transaction: false means no section
+ * of the file was written, however far the write order got. It does not say
+ * why — a transaction undid the earlier writes, or the first one failed — and
+ * the report carries no flag that does, so this says what the file put in and
+ * never what the instance now holds.
+ *
+ * A failure that names no section leaves the split undecidable, and every
+ * section reads `unknown` rather than `landed`. Telling someone their accounts
+ * are in when nothing said so is the one answer this screen must never give:
+ * they would stop looking.
+ */
+export declare const sectionResults: (report: RemitImapConfigImportReport) => SectionResult[];
+export declare const FOLDER_PENDING_CODE = "folder_not_found_yet";
+export interface PendingFolder {
+    path: string;
+    accountId?: string;
+    waitingFor: string;
+}
+/**
+ * The folders the file names that this account does not hold yet. They are
+ * recorded rather than dropped: the binder writes each setting the moment IMAP
+ * discovery produces its folder, so the copy has to say waiting, never lost.
+ */
+export declare const pendingFolders: (report: RemitImapConfigImportReport) => PendingFolder[];
+/**
+ * A config document is small — the largest realistic export is tens of
+ * kilobytes — so anything past this is a file picked by mistake, and saying so
+ * beats posting megabytes to be told the same thing.
+ */
+export declare const MAX_CONFIG_FILE_BYTES: number;
+export type ConfigDocument = Record<string, unknown>;
+export type FileReadResult = {
+    ok: true;
+    document: ConfigDocument;
+} | {
+    ok: false;
+    failure: FailureCopy;
+};
+export declare const readConfigText: (name: string, size: number, text: string) => Promise<FileReadResult>;
+export declare const exportFileName: (now: Date) => string;
+export declare const formatFileSize: (bytes: number) => string;