@aglyn/plugins-crm 1.0.0-beta.221 → 1.0.0-beta.222

package/src/lib/components/csv-import-drawer.js

@@ -1,757 +0,0 @@
-/**
- * @license
- * Copyright 2026 Aglyn LLC
- *
- * Licensed under the Apache License, Version 2.0 (the "License");
- * you may not use this file except in compliance with the License.
- * You may obtain a copy of the License at
- *
- *   http://www.apache.org/licenses/LICENSE-2.0
- *
- * Unless required by applicable law or agreed to in writing, software
- * distributed under the License is distributed on an "AS IS" BASIS,
- * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
- * See the License for the specific language governing permissions and
- * limitations under the License.
- */ 'use client';
-import { _ as _extends } from "@swc/helpers/_/_extends";
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-/**
- * IMPORTING A CSV INTO A CRM COLLECTION — the screen, for whichever
- * collection (AGL-2602, shared since AGL-2621).
- *
- * The contact import settled the walk from a file on disk to a result the
- * operator can act on: choose the file, read what is in it, match its
- * columns to fields with the first row beside each, preview the ten rows
- * the mapping produces, run it in bounded requests with a progress bar,
- * and report what was added, updated and skipped with the skipped rows as
- * a file to fix. A companies file walks the same path with a different
- * vocabulary, so the walk lives here once and each collection hands in a
- * {@link CsvImportVocabulary}: its fields and their labels, the one field
- * every row needs, its route, its tally, its template.
- *
- * ## The file is read in the browser, and judged on the server
- *
- * `parseCsv` — the same parser the list import and the dataset import run
- * — turns the file into cells here, so the operator can map and preview
- * without a round trip and without uploading a file they may still decide
- * not to import. Nothing is VALIDATED here beyond counting the rows whose
- * required cell is unusable, and that count is a courtesy: every row is
- * judged by the route, through the normalizers every other door uses, and
- * the numbers on the result panel are the server's.
- *
- * ## Bounded requests, and closing stops them
- *
- * A chunk per request, as many requests as the file needs, and a progress
- * bar between them. Closing the drawer mid-run stops the loop after the
- * request in flight; the rows already written stay written and the result
- * panel says how far it got. There is no durable job to resume — an import
- * is idempotent by construction (the door dedupes on the address, or the
- * domain and the name), so running the same file again finishes what a
- * closed drawer left, reporting the earlier rows as merged.
- */ import { customImportTarget, customImportTargetKey, importNoMailServerSentence, CSV_UPLOAD_MAX_CHARACTERS, parseCsv } from "@aglyn/aglyn";
-import { ICON_VARIANT_CLOSE } from "@aglyn/shared-data-enums";
-import { Container, HelpTip, MdiIcon, SrOnly } from "@aglyn/shared-ui-jsx";
-import { NavigationDrawerComponent } from "@aglyn/shared-ui-jsx/components/navigation-drawer.component";
-import { ScrollTable } from "@aglyn/shared-ui-jsx/components/scroll-table.component";
-import { useSnackbar } from "@aglyn/shared-ui-snackstack";
-import { authorizedFetch } from "@aglyn/shared-util-http/authorized-token";
-import { useOrgDataScope, useUser } from "@aglyn/tenant-feature-instance";
-import { useConsoleWidgetSlot } from "@aglyn/aglyn/app-utils/console-widget-slot-context";
-import { Alert, AlertTitle, Box, Button, Chip, IconButton, LinearProgress, MenuItem, Stack, TableBody, TableCell, TableHead, TableRow, TextField, Typography } from "@mui/material";
-import { useCallback, useEffect, useMemo, useRef, useState } from "react";
-import { useCrmOrgMount } from "../hooks/use-crm-org-mount.js";
-import { downloadTextFile } from "../model/contacts-csv.js";
-import { importColumns } from "../model/import-column-shapes.js";
-import { CrmSitePicker } from "./crm-site-picker.js";
-/** The value the mapping select shows for a column that is not imported. */ const SKIP_TARGET = '';
-/** What a target is called — a standard field's label, or the custom field's. */ function targetLabel(target, vocabulary) {
-    var _vocabulary_fieldLabels_target;
-    const customKey = customImportTargetKey(target);
-    if (customKey) {
-        var _ref;
-        var _vocabulary_customFields_find, _vocabulary_customFields;
-        return (_ref = (_vocabulary_customFields = vocabulary.customFields) == null ? void 0 : (_vocabulary_customFields_find = _vocabulary_customFields.find((field)=>field.key === customKey)) == null ? void 0 : _vocabulary_customFields_find.label) != null ? _ref : customKey;
-    }
-    return (_vocabulary_fieldLabels_target = vocabulary.fieldLabels[target]) != null ? _vocabulary_fieldLabels_target : target;
-}
-/** What a dropped-value field is called in the result panel — the label without its hint. */ function droppedFieldLabel(field, vocabulary) {
-    return targetLabel(field, vocabulary).replace(/ \(.*\)$/, '');
-}
-export function CsvImportDrawer(props) {
-    var _ref, _rows_;
-    const { open, onClose, hostId, vocabulary } = props;
-    const { data: user } = useUser();
-    const { enqueueSnackbar } = useSnackbar();
-    // The site every row is captured under: the mounted one, or at the
-    // organization level the one the picker named — `null` until it has.
-    const mount = useCrmOrgMount();
-    const createHostId = (_ref = hostId != null ? hostId : mount == null ? void 0 : mount.createHostId) != null ? _ref : null;
-    const [fileName, setFileName] = useState('');
-    const [columns, setColumns] = useState([]);
-    const [rows, setRows] = useState([]);
-    /** How many rows the file had past the ceiling, so the drawer can say so. */ const [overCeiling, setOverCeiling] = useState(0);
-    const [mapping, setMapping] = useState({});
-    const [result, setResult] = useState(null);
-    const [progress, setProgress] = useState(null);
-    const [busy, setBusy] = useState(false);
-    /**
-   * Set when the drawer closes mid-run, read by the loop.
-   *
-   * A ref and not state, for the reason the list import gives: the loop is
-   * an `async` function that captured its closure when it started, and a
-   * state value it read would be the one from that render.
-   */ const abandoned = useRef(false);
-    useEffect(()=>{
-        if (open) abandoned.current = false;
-    }, [
-        open
-    ]);
-    const reset = useCallback(()=>{
-        setFileName('');
-        setColumns([]);
-        setRows([]);
-        setOverCeiling(0);
-        setMapping({});
-        setResult(null);
-        setProgress(null);
-    }, []);
-    const handleClose = useCallback(()=>{
-        abandoned.current = true;
-        onClose();
-    }, [
-        onClose
-    ]);
-    const handleFile = useCallback(async (file)=>{
-        if (!file) return;
-        const contents = await file.text().catch(()=>'');
-        if (contents.length > CSV_UPLOAD_MAX_CHARACTERS) {
-            return void enqueueSnackbar('That file is too large to read in one go. Split it and import the ' + 'pieces.', {
-                variant: 'warning',
-                allowDuplicate: true
-            });
-        }
-        const table = parseCsv(contents).filter((cells)=>cells.some((cell)=>String(cell != null ? cell : '').trim()));
-        if (table.length < 2) {
-            return void enqueueSnackbar('That file needs a header row and at least one row under it.', {
-                variant: 'warning',
-                allowDuplicate: true
-            });
-        }
-        const header = table[0].map((cell)=>String(cell != null ? cell : '').trim());
-        const body = table.slice(1);
-        setFileName(file.name);
-        setColumns(header);
-        setRows(body.slice(0, vocabulary.maxRows));
-        setOverCeiling(Math.max(0, body.length - vocabulary.maxRows));
-        setMapping(vocabulary.guessMapping(header));
-        setResult(null);
-        setProgress(null);
-    }, [
-        enqueueSnackbar,
-        vocabulary
-    ]);
-    const requiredMapped = Object.values(mapping).includes(vocabulary.requiredField);
-    /** Rows whose required cell the server would refuse. */ const unusableRows = useMemo(()=>{
-        var _ref, _vocabulary_unusable;
-        var _Object_entries_find;
-        const at = Number((_ref = (_Object_entries_find = Object.entries(mapping).find(([, target])=>target === vocabulary.requiredField)) == null ? void 0 : _Object_entries_find[0]) != null ? _ref : -1);
-        if (at < 0) return rows.length;
-        const unusable = (_vocabulary_unusable = vocabulary.unusable) != null ? _vocabulary_unusable : (cell)=>!cell.trim();
-        return rows.filter((cells)=>{
-            var _cells_at;
-            return unusable(String((_cells_at = cells[at]) != null ? _cells_at : ''));
-        }).length;
-    }, [
-        mapping,
-        rows,
-        vocabulary
-    ]);
-    const preview = useMemo(()=>rows.slice(0, vocabulary.previewRows).map((cells)=>vocabulary.mapRow(cells, mapping)), [
-        rows,
-        mapping,
-        vocabulary
-    ]);
-    // The collection's own warning over the whole mapped file, when it has one.
-    const rowsNotice = useMemo(()=>vocabulary.rowsNotice && rows.length ? vocabulary.rowsNotice(rows.map((cells)=>vocabulary.mapRow(cells, mapping))) : null, [
-        rows,
-        mapping,
-        vocabulary
-    ]);
-    const mappedTargets = useMemo(()=>Object.entries(mapping).sort(([a], [b])=>Number(a) - Number(b)).map(([, target])=>target), [
-        mapping
-    ]);
-    /*
-   * The `importMapping` zone (AGL-2917), hosted through the shell's renderer:
-   * a widget there reads each column's header and shape, never a cell, and
-   * proposes a matching, which replaces the table's above for the preview to
-   * show. A target this import does not offer, or one a column before it
-   * already took, is dropped, as the table itself would refuse it.
-   */ const MappingSlot = useConsoleWidgetSlot();
-    const { orgId } = useOrgDataScope({
-        hostId: hostId != null ? hostId : undefined,
-        orgId: mount == null ? void 0 : mount.orgId
-    });
-    const shapedColumns = useMemo(()=>importColumns(columns, rows), [
-        columns,
-        rows
-    ]);
-    const offeredTargets = useMemo(()=>{
-        var _vocabulary_customFields;
-        return new Set([
-            ...vocabulary.fields,
-            ...((_vocabulary_customFields = vocabulary.customFields) != null ? _vocabulary_customFields : []).map((field)=>customImportTarget(field.key))
-        ]);
-    }, [
-        vocabulary
-    ]);
-    const proposeMapping = useCallback((proposed)=>{
-        const taken = new Set();
-        const next = {};
-        for (const [column, target] of Object.entries(proposed).sort(([a], [b])=>Number(a) - Number(b))){
-            const index = Number(column);
-            if (!Number.isInteger(index) || index < 0 || index >= columns.length) continue;
-            if (!offeredTargets.has(target) || taken.has(target)) continue;
-            taken.add(target);
-            next[index] = target;
-        }
-        setMapping(next);
-    }, [
-        offeredTargets,
-        columns.length
-    ]);
-    const handleMap = useCallback((index, target)=>{
-        setMapping((previous)=>{
-            const next = {};
-            for (const [column, existing] of Object.entries(previous)){
-                // One column per target: choosing a target already taken moves it
-                // here rather than importing one field from two columns.
-                if (Number(column) !== index && existing !== target) {
-                    next[Number(column)] = existing;
-                }
-            }
-            if (target !== SKIP_TARGET) next[index] = target;
-            return next;
-        });
-    }, []);
-    /**
-   * Runs the file, one bounded request at a time.
-   *
-   * Every chunk's result is folded into the running total as it arrives,
-   * so a file that stops halfway — a lost connection, a closed drawer —
-   * still reports what it did rather than nothing.
-   */ const handleImport = useCallback(async ()=>{
-        if (busy || !rows.length || !requiredMapped || !createHostId) return;
-        setBusy(true);
-        let total = vocabulary.emptyResult();
-        setResult(total);
-        setProgress({
-            sent: 0,
-            total: rows.length
-        });
-        try {
-            for(let offset = 0; offset < rows.length; offset += vocabulary.chunkSize){
-                if (abandoned.current) return;
-                const chunk = rows.slice(offset, offset + vocabulary.chunkSize).map((cells)=>vocabulary.mapRow(cells, mapping));
-                const response = await authorizedFetch(user, vocabulary.route, {
-                    method: 'POST',
-                    headers: {
-                        'Content-Type': 'application/json'
-                    },
-                    body: JSON.stringify({
-                        hostId: createHostId,
-                        rows: chunk
-                    })
-                });
-                const payload = await response.json().catch(()=>({}));
-                if (!response.ok) {
-                    var _ref;
-                    return void enqueueSnackbar((_ref = payload == null ? void 0 : payload.error) != null ? _ref : 'The import could not continue.', {
-                        variant: 'warning',
-                        allowDuplicate: true
-                    });
-                }
-                total = vocabulary.mergeResults(total, payload, offset);
-                setResult(total);
-                setProgress({
-                    sent: Math.min(offset + chunk.length, rows.length),
-                    total: rows.length
-                });
-            }
-            enqueueSnackbar('Import finished', {
-                variant: 'success',
-                persist: false
-            });
-        } catch (unused) {
-            enqueueSnackbar('The import could not continue.', {
-                variant: 'warning',
-                allowDuplicate: true
-            });
-        } finally{
-            setBusy(false);
-        }
-    }, [
-        busy,
-        rows,
-        requiredMapped,
-        mapping,
-        user,
-        createHostId,
-        enqueueSnackbar,
-        vocabulary
-    ]);
-    const handleDownloadSkipped = useCallback(()=>{
-        if (!(result == null ? void 0 : result.skipped.length)) return;
-        downloadTextFile(vocabulary.skippedFileName, 'text/csv', vocabulary.skippedCsv(columns, result.skipped.map((entry)=>{
-            var _rows_entry_index;
-            return {
-                cells: (_rows_entry_index = rows[entry.index]) != null ? _rows_entry_index : [],
-                reason: entry.reason
-            };
-        })));
-    }, [
-        result,
-        columns,
-        rows,
-        vocabulary
-    ]);
-    const finished = !!result && !busy;
-    return /*#__PURE__*/ _jsx(NavigationDrawerComponent, {
-        open: open,
-        anchor: "right",
-        variant: "temporary",
-        onClose: handleClose,
-        AppBarProps: {
-            color: 'surface'
-        },
-        appBarLeft: /*#__PURE__*/ _jsxs(_Fragment, {
-            children: [
-                /*#__PURE__*/ _jsxs(IconButton, {
-                    color: "inherit",
-                    edge: "start",
-                    onClick: handleClose,
-                    sx: {
-                        mr: 2
-                    },
-                    children: [
-                        /*#__PURE__*/ _jsx(MdiIcon, {
-                            path: ICON_VARIANT_CLOSE.path
-                        }),
-                        /*#__PURE__*/ _jsx(SrOnly, {
-                            children: 'close drawer'
-                        })
-                    ]
-                }),
-                /*#__PURE__*/ _jsx(Typography, {
-                    variant: "h6",
-                    component: "div",
-                    children: vocabulary.title
-                }),
-                /*#__PURE__*/ _jsx(HelpTip, _extends({}, vocabulary.help))
-            ]
-        }),
-        appBarRight: /*#__PURE__*/ _jsx(Button, {
-            variant: "outlined",
-            color: "inherit",
-            onClick: handleClose,
-            children: finished ? 'Done' : 'Cancel'
-        }),
-        children: /*#__PURE__*/ _jsx(Container, {
-            gutterY: true,
-            children: /*#__PURE__*/ _jsx(Stack, {
-                spacing: 2,
-                children: result ? /*#__PURE__*/ _jsx(ImportResultPanel, {
-                    result: result,
-                    progress: progress,
-                    busy: busy,
-                    vocabulary: vocabulary,
-                    onDownloadSkipped: handleDownloadSkipped,
-                    onAnother: reset
-                }) : /*#__PURE__*/ _jsxs(_Fragment, {
-                    children: [
-                        /*#__PURE__*/ _jsx(CrmSitePicker, {
-                            hostId: hostId,
-                            disabled: busy,
-                            helperText: vocabulary.sitePickerHelperText
-                        }),
-                        /*#__PURE__*/ _jsx(Typography, {
-                            variant: "body2",
-                            color: "text.secondary",
-                            children: vocabulary.intro
-                        }),
-                        /*#__PURE__*/ _jsxs(Stack, {
-                            direction: "row",
-                            spacing: 1,
-                            sx: {
-                                alignItems: 'center',
-                                flexWrap: 'wrap',
-                                rowGap: 1
-                            },
-                            children: [
-                                /*#__PURE__*/ _jsxs(Button, {
-                                    variant: "outlined",
-                                    component: "label",
-                                    disabled: busy,
-                                    children: [
-                                        'Choose file',
-                                        /*#__PURE__*/ _jsx("input", {
-                                            type: "file",
-                                            accept: ".csv,text/csv",
-                                            hidden: true,
-                                            onChange: (event)=>{
-                                                var _event_target_files;
-                                                void handleFile((_event_target_files = event.target.files) == null ? void 0 : _event_target_files[0]);
-                                                event.target.value = '';
-                                            }
-                                        })
-                                    ]
-                                }),
-                                /*#__PURE__*/ _jsx(Button, {
-                                    size: "small",
-                                    disabled: busy,
-                                    onClick: ()=>downloadTextFile(vocabulary.templateFileName, 'text/csv', vocabulary.templateCsv()),
-                                    children: 'Download template'
-                                }),
-                                fileName ? /*#__PURE__*/ _jsx(Chip, {
-                                    size: "small",
-                                    variant: "outlined",
-                                    label: fileName
-                                }) : null,
-                                rows.length ? /*#__PURE__*/ _jsx(Typography, {
-                                    variant: "body2",
-                                    color: "text.secondary",
-                                    children: `${rows.length.toLocaleString()} rows`
-                                }) : null
-                            ]
-                        }),
-                        overCeiling > 0 ? /*#__PURE__*/ _jsx(Alert, {
-                            severity: "warning",
-                            children: `This file has ${(rows.length + overCeiling).toLocaleString()} ` + `rows. Only the first ${vocabulary.maxRows.toLocaleString()} ` + 'are imported — split the file and import the rest ' + 'separately.'
-                        }) : null,
-                        columns.length ? /*#__PURE__*/ _jsx(ImportMappingTable, {
-                            columns: columns,
-                            sample: (_rows_ = rows[0]) != null ? _rows_ : [],
-                            mapping: mapping,
-                            vocabulary: vocabulary,
-                            onMap: handleMap
-                        }) : null,
-                        columns.length && MappingSlot && vocabulary.collection ? /*#__PURE__*/ _jsx(MappingSlot, {
-                            slot: "importMapping",
-                            hostId: hostId,
-                            orgId: orgId != null ? orgId : undefined,
-                            collection: vocabulary.collection,
-                            columns: shapedColumns,
-                            mapping: mapping,
-                            proposeMapping: (proposed)=>proposeMapping(proposed)
-                        }) : null,
-                        columns.length > 0 && !requiredMapped ? /*#__PURE__*/ _jsx(Alert, {
-                            severity: "warning",
-                            children: vocabulary.requiredWarning
-                        }) : null,
-                        columns.length > 0 && requiredMapped ? rowsNotice : null,
-                        columns.length > 0 && requiredMapped ? /*#__PURE__*/ _jsx(ImportPreviewTable, {
-                            targets: mappedTargets,
-                            preview: preview,
-                            total: rows.length,
-                            unusable: unusableRows,
-                            vocabulary: vocabulary
-                        }) : null,
-                        /*#__PURE__*/ _jsx(Stack, {
-                            direction: "row",
-                            spacing: 1,
-                            sx: {
-                                justifyContent: 'flex-end'
-                            },
-                            children: /*#__PURE__*/ _jsx(Button, {
-                                variant: "contained",
-                                // Held until the capturing site is known.
-                                disabled: busy || !rows.length || !requiredMapped || !createHostId,
-                                onClick: ()=>void handleImport(),
-                                children: rows.length ? `Import ${rows.length.toLocaleString()} rows` : 'Import'
-                            })
-                        })
-                    ]
-                })
-            })
-        })
-    });
-}
-CsvImportDrawer.displayName = 'CsvImportDrawer';
-/**
- * WHICH COLUMN IS WHICH.
- *
- * One row per column in the file: its header, the first row's value under
- * it so the operator can tell "Title" the job from "Title" the honorific,
- * and a select naming where it goes. The proposal came from the alias
- * table; every row of this table is the operator's to overrule.
- */ function ImportMappingTable(props) {
-    const { columns, sample, mapping, vocabulary, onMap } = props;
-    return /*#__PURE__*/ _jsxs(Stack, {
-        spacing: 1,
-        children: [
-            /*#__PURE__*/ _jsx(Typography, {
-                variant: "subtitle2",
-                children: 'Columns'
-            }),
-            /*#__PURE__*/ _jsxs(ScrollTable, {
-                size: "small",
-                children: [
-                    /*#__PURE__*/ _jsx(TableHead, {
-                        children: /*#__PURE__*/ _jsxs(TableRow, {
-                            children: [
-                                /*#__PURE__*/ _jsx(TableCell, {
-                                    children: 'Column'
-                                }),
-                                /*#__PURE__*/ _jsx(TableCell, {
-                                    children: 'First row'
-                                }),
-                                /*#__PURE__*/ _jsx(TableCell, {
-                                    children: 'Imports as'
-                                })
-                            ]
-                        })
-                    }),
-                    /*#__PURE__*/ _jsx(TableBody, {
-                        children: columns.map((column, index)=>{
-                            var _sample_index, _mapping_index, _vocabulary_customFields;
-                            return /*#__PURE__*/ _jsxs(TableRow, {
-                                children: [
-                                    /*#__PURE__*/ _jsx(TableCell, {
-                                        children: column || `Column ${index + 1}`
-                                    }),
-                                    /*#__PURE__*/ _jsx(TableCell, {
-                                        children: /*#__PURE__*/ _jsx(Typography, {
-                                            variant: "body2",
-                                            color: "text.secondary",
-                                            noWrap: true,
-                                            children: String((_sample_index = sample[index]) != null ? _sample_index : '')
-                                        })
-                                    }),
-                                    /*#__PURE__*/ _jsx(TableCell, {
-                                        children: /*#__PURE__*/ _jsxs(TextField, {
-                                            select: true,
-                                            size: "small",
-                                            value: (_mapping_index = mapping[index]) != null ? _mapping_index : SKIP_TARGET,
-                                            onChange: (event)=>onMap(index, event.target.value),
-                                            sx: {
-                                                minWidth: 220
-                                            },
-                                            children: [
-                                                /*#__PURE__*/ _jsx(MenuItem, {
-                                                    value: SKIP_TARGET,
-                                                    children: 'Do not import'
-                                                }),
-                                                vocabulary.fields.map((field)=>/*#__PURE__*/ _jsx(MenuItem, {
-                                                        value: field,
-                                                        children: vocabulary.fieldLabels[field]
-                                                    }, field)),
-                                                ((_vocabulary_customFields = vocabulary.customFields) != null ? _vocabulary_customFields : []).map((field)=>/*#__PURE__*/ _jsx(MenuItem, {
-                                                        value: customImportTarget(field.key),
-                                                        children: `${field.label} (custom)`
-                                                    }, field.key))
-                                            ]
-                                        })
-                                    })
-                                ]
-                            }, `${column}-${index}`);
-                        })
-                    })
-                ]
-            })
-        ]
-    });
-}
-/**
- * The first rows, as the mapping reads them.
- *
- * Verbatim cell values under the fields they were mapped to — not the
- * normalized ones, because normalization is the server's and a preview that
- * showed a cleaned phone number would be promising a result the route may
- * refuse. What it does say is how many rows have no usable required cell,
- * since that is the one refusal the operator can fix before sending.
- */ function ImportPreviewTable(props) {
-    const { targets, preview, total, unusable, vocabulary } = props;
-    const cell = (row, target)=>{
-        var _row_target;
-        const customKey = customImportTargetKey(target);
-        if (customKey) {
-            var _ref;
-            var _row_custom;
-            return String((_ref = (_row_custom = row['custom']) == null ? void 0 : _row_custom[customKey]) != null ? _ref : '');
-        }
-        return String((_row_target = row[target]) != null ? _row_target : '');
-    };
-    return /*#__PURE__*/ _jsxs(Stack, {
-        spacing: 1,
-        children: [
-            /*#__PURE__*/ _jsx(Typography, {
-                variant: "subtitle2",
-                children: `Preview — first ${Math.min(preview.length, vocabulary.previewRows)} of ${total.toLocaleString()}`
-            }),
-            unusable > 0 ? /*#__PURE__*/ _jsx(Alert, {
-                severity: "info",
-                children: vocabulary.unusableNotice(unusable, total)
-            }) : null,
-            /*#__PURE__*/ _jsx(Box, {
-                children: /*#__PURE__*/ _jsxs(ScrollTable, {
-                    size: "small",
-                    children: [
-                        /*#__PURE__*/ _jsx(TableHead, {
-                            children: /*#__PURE__*/ _jsx(TableRow, {
-                                children: targets.map((target)=>/*#__PURE__*/ _jsx(TableCell, {
-                                        children: targetLabel(target, vocabulary)
-                                    }, target))
-                            })
-                        }),
-                        /*#__PURE__*/ _jsx(TableBody, {
-                            children: preview.map((row, index)=>/*#__PURE__*/ _jsx(TableRow, {
-                                    children: targets.map((target)=>/*#__PURE__*/ _jsx(TableCell, {
-                                            children: /*#__PURE__*/ _jsx(Typography, {
-                                                variant: "body2",
-                                                noWrap: true,
-                                                sx: {
-                                                    maxWidth: 240
-                                                },
-                                                children: cell(row, target)
-                                            })
-                                        }, target))
-                                }, index))
-                        })
-                    ]
-                })
-            })
-        ]
-    });
-}
-/** How far the run has got, and what it did. */ function ImportResultPanel(props) {
-    var _ref, _ref1;
-    const { result, progress, busy, vocabulary, onDownloadSkipped, onAnother } = props;
-    const percent = (progress == null ? void 0 : progress.total) ? Math.min(progress.sent / progress.total * 100, 100) : 0;
-    const skippedByReason = useMemo(()=>{
-        const counts = {};
-        for (const entry of result.skipped){
-            var _counts_entry_reason;
-            counts[entry.reason] = ((_counts_entry_reason = counts[entry.reason]) != null ? _counts_entry_reason : 0) + 1;
-        }
-        return Object.entries(counts);
-    }, [
-        result.skipped
-    ]);
-    const droppedFields = Object.entries(result.dropped).filter(([, count])=>count > 0);
-    return /*#__PURE__*/ _jsxs(Stack, {
-        spacing: 2,
-        children: [
-            /*#__PURE__*/ _jsx(Typography, {
-                variant: "body2",
-                color: "text.secondary",
-                children: busy ? `${((_ref = progress == null ? void 0 : progress.sent) != null ? _ref : 0).toLocaleString()} of ${((_ref1 = progress == null ? void 0 : progress.total) != null ? _ref1 : 0).toLocaleString()} rows sent.` : `Finished. ${result.created.toLocaleString()} added, ` + `${result.merged.toLocaleString()} updated, ` + `${result.skipped.length.toLocaleString()} skipped.`
-            }),
-            /*#__PURE__*/ _jsx(LinearProgress, {
-                variant: "determinate",
-                value: percent,
-                sx: {
-                    borderRadius: 1
-                }
-            }),
-            skippedByReason.length ? /*#__PURE__*/ _jsxs(ScrollTable, {
-                size: "small",
-                children: [
-                    /*#__PURE__*/ _jsx(TableHead, {
-                        children: /*#__PURE__*/ _jsxs(TableRow, {
-                            children: [
-                                /*#__PURE__*/ _jsx(TableCell, {
-                                    children: 'Skipped'
-                                }),
-                                /*#__PURE__*/ _jsx(TableCell, {
-                                    align: "right",
-                                    children: 'Rows'
-                                })
-                            ]
-                        })
-                    }),
-                    /*#__PURE__*/ _jsx(TableBody, {
-                        children: skippedByReason.map(([reason, count])=>{
-                            var _vocabulary_skipLabels_reason;
-                            return /*#__PURE__*/ _jsxs(TableRow, {
-                                children: [
-                                    /*#__PURE__*/ _jsx(TableCell, {
-                                        children: (_vocabulary_skipLabels_reason = vocabulary.skipLabels[reason]) != null ? _vocabulary_skipLabels_reason : reason
-                                    }),
-                                    /*#__PURE__*/ _jsx(TableCell, {
-                                        align: "right",
-                                        children: count
-                                    })
-                                ]
-                            }, reason);
-                        })
-                    })
-                ]
-            }) : null,
-            droppedFields.length ? /*#__PURE__*/ _jsxs(Alert, {
-                severity: "info",
-                children: [
-                    /*#__PURE__*/ _jsx(AlertTitle, {
-                        children: 'Some values could not be read'
-                    }),
-                    'The rows were imported without them: ' + droppedFields.map(([field, count])=>`${droppedFieldLabel(field, vocabulary)} (${count})`).join(', ') + '.'
-                ]
-            }) : null,
-            result.ownersUnresolved.length ? /*#__PURE__*/ _jsx(Alert, {
-                severity: "info",
-                children: 'No team member has these owner addresses, so those rows ' + `have no owner: ${result.ownersUnresolved.slice(0, 5).join(', ')}` + (result.ownersUnresolved.length > 5 ? ` and ${result.ownersUnresolved.length - 5} more.` : '.')
-            }) : null,
-            importNoMailServerSentence(result.noMailServer) ? /*#__PURE__*/ _jsx(Alert, {
-                severity: "warning",
-                children: importNoMailServerSentence(result.noMailServer)
-            }) : null,
-            vocabulary.resultExtras == null ? void 0 : vocabulary.resultExtras.call(vocabulary, result),
-            /*#__PURE__*/ _jsxs(Stack, {
-                direction: "row",
-                spacing: 1,
-                sx: {
-                    justifyContent: 'flex-end'
-                },
-                children: [
-                    result.skipped.length ? /*#__PURE__*/ _jsx(Button, {
-                        variant: "outlined",
-                        onClick: onDownloadSkipped,
-                        children: 'Download skipped rows'
-                    }) : null,
-                    !busy ? /*#__PURE__*/ _jsx(Button, {
-                        variant: "outlined",
-                        onClick: onAnother,
-                        children: 'Import another file'
-                    }) : null
-                ]
-            })
-        ]
-    });
-}
-/**
- * An "Import CSV" button that mounts its drawer only once it has been
- * opened, so the list pays nothing — no hooks, no listeners — for a
- * feature the operator has not reached for.
- */ export function CsvImportButton(props) {
-    const { label = 'Import CSV', children } = props;
-    const [open, setOpen] = useState(false);
-    const [mounted, setMounted] = useState(false);
-    const handleOpen = useCallback(()=>{
-        setMounted(true);
-        setOpen(true);
-    }, []);
-    const handleClose = useCallback(()=>setOpen(false), []);
-    return /*#__PURE__*/ _jsxs(_Fragment, {
-        children: [
-            /*#__PURE__*/ _jsx(Button, {
-                size: "small",
-                onClick: handleOpen,
-                children: label
-            }),
-            mounted ? children(open, handleClose) : null
-        ]
-    });
-}
-CsvImportButton.displayName = 'CsvImportButton';
-export default CsvImportDrawer;
-
-//# sourceMappingURL=csv-import-drawer.js.map