@rebasepro/admin 0.13.0 → 0.13.1-canary.g06dbe5b

package/src/components/index.ts

@@ -1,6 +1,9 @@
 export type { EntityViewBindingProps } from "./EntityViewBinding";
 export { EntityViewBinding } from "./EntityViewBinding";
 
+export type { EntityDisplayHeaderProps } from "./EntityDisplayHeader";
+export { EntityDisplayHeader, HEADER_DISPLAY_ROLES } from "./EntityDisplayHeader";
+
 export * from "./DetailViewBinding";
 
 export type { SelectionProps } from "./ReferenceTable/SelectionTableBinding";

package/src/data_export/export/ExportCollectionAction.tsx

@@ -29,9 +29,26 @@ import {
     Tooltip
 } from "@rebasepro/ui";
 import { downloadEntitiesExport } from "./export";
+import { fetchAllEntitiesForExport, MAX_EXPORT_ROWS } from "./fetch_export_data";
 
 const DOCS_LIMIT = 500;
 
+/**
+ * Additional-field builders run per row and may do I/O, so a `Promise.all` over
+ * the whole export is one request per row all at once. That was bounded only by
+ * the 50-row cap the export used to have; now that the read is paginated, it is
+ * bounded here instead.
+ */
+const ADDITIONAL_FIELDS_CONCURRENCY = 50;
+
+async function mapInChunks<T, R>(items: T[], fn: (item: T) => Promise<R>, chunkSize = ADDITIONAL_FIELDS_CONCURRENCY): Promise<R[]> {
+    const results: R[] = [];
+    for (let i = 0; i < items.length; i += chunkSize) {
+        results.push(...await Promise.all(items.slice(i, i + chunkSize).map(fn)));
+    }
+    return results;
+}
+
 export function ExportCollectionAction<M extends Record<string, unknown>, USER extends User>({
     collection,
     path,
@@ -59,6 +76,11 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
     const context = useAdminContext<USER>();
     const dataClient = useData();
 
+    // Said before the download starts, not discovered halfway through it: the
+    // walk refuses rather than writing a short file, so the dialog has to name
+    // the ceiling it is about to hit.
+    const tooManyToExport = collectionEntitiesCount !== undefined && collectionEntitiesCount > MAX_EXPORT_ROWS;
+
     const canExport = !exportAllowed || exportAllowed({
         collectionEntitiesCount: collectionEntitiesCount ?? 0,
         path,
@@ -67,6 +89,7 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
 
     const [dataLoading, setDataLoading] = React.useState<boolean>(false);
     const [dataLoadingError, setDataLoadingError] = React.useState<Error | undefined>();
+    const [progress, setProgress] = React.useState<{ loaded: number, total?: number }>({ loaded: 0 });
 
     const [open, setOpen] = React.useState(false);
 
@@ -84,7 +107,7 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
         const additionalFields = collection.additionalFields;
 
         const resolvedExportColumnsValues: Record<string, any>[] = additionalExportFields
-            ? await Promise.all(entities.map(async (entity) => {
+            ? await mapInChunks(entities, async (entity) => {
                 return (await Promise.all(additionalExportFields.map(async (column) => {
                     return {
                         [column.key]: await column.builder({
@@ -94,11 +117,11 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
                     };
                 }))).reduce((a, b) => ({ ...a,
 ...b }), {});
-            }))
+            })
             : [];
 
         const resolvedColumnsValues: Record<string, any>[] = additionalFields
-            ? await Promise.all(entities.map(async (entity) => {
+            ? await mapInChunks(entities, async (entity) => {
                 return (await Promise.all(additionalFields
                     .map(async (field) => {
                         if (!field.value)
@@ -111,64 +134,74 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
                         };
                     }))).reduce((a, b) => ({ ...a,
 ...b }), {});
-            }))
+            })
             : [];
         return [...resolvedExportColumnsValues, ...resolvedColumnsValues];
     }, [exportConfig?.additionalFields]);
 
     const doDownload = useCallback(async (collection: AdminCollection<M>,
-        exportConfig: ExportConfig<any> | undefined) => {
+        exportConfig: ExportConfig<any> | undefined): Promise<boolean> => {
 
         onAnalyticsEvent?.("export_collection", {
             collection: collection.slug
         });
         setDataLoading(true);
-        dataClient.collection(path).find({})
-            .then(async (res) => {
-                const data = res.data as Entity<M>[];
-                setDataLoadingError(undefined);
-                const additionalData = await fetchAdditionalFields(data);
-                const additionalHeaders = [
-                    ...exportConfig?.additionalFields?.map(column => column.key) ?? [],
-                    ...collection.additionalFields?.map(field => field.key) ?? []
-                ];
-
-                const dataWithDefaults = includeUndefinedValues
-                    ? data.map(entity => {
-                        const defaultValues = getDefaultValuesFor(collection.properties);
-                        return {
-                            ...entity,
-                            values: { ...defaultValues,
+        setDataLoadingError(undefined);
+        setProgress({ loaded: 0 });
+        try {
+            // Paginated, not `find({})`: an absent limit resolves to 50 rows
+            // server-side, so the export used to be the first page of the
+            // collection under a filename that read like all of it.
+            const data = await fetchAllEntitiesForExport<M>({
+                accessor: dataClient.collection(path) as { find: (params?: any) => Promise<any> },
+                onProgress: (loaded, total) => setProgress({ loaded,
+                    total })
+            });
+            const additionalData = await fetchAdditionalFields(data);
+            const additionalHeaders = [
+                ...exportConfig?.additionalFields?.map(column => column.key) ?? [],
+                ...collection.additionalFields?.map(field => field.key) ?? []
+            ];
+
+            const defaultValues = includeUndefinedValues ? getDefaultValuesFor(collection.properties) : undefined;
+            const dataWithDefaults = defaultValues
+                ? data.map(entity => ({
+                    ...entity,
+                    values: { ...defaultValues,
 ...entity.values }
-                        };
-                    })
-                    : data;
-                downloadEntitiesExport({
-                    data: dataWithDefaults,
-                    additionalData,
-                    properties: collection.properties,
-                    propertiesOrder: collection.propertiesOrder,
-                    name: collection.name,
-                    flattenArrays,
-                    additionalHeaders,
-                    exportType,
-                    dateExportType
-                });
-                onAnalyticsEvent?.("export_collection_success", {
-                    collection: collection.slug
-                });
-            })
-            .catch((e) => {
-                console.error("Error loading export data", e);
-                setDataLoadingError(e);
-            })
-            .finally(() => setDataLoading(false));
+                }))
+                : data;
+            downloadEntitiesExport({
+                data: dataWithDefaults,
+                additionalData,
+                properties: collection.properties,
+                propertiesOrder: collection.propertiesOrder,
+                name: collection.name,
+                flattenArrays,
+                additionalHeaders,
+                exportType,
+                dateExportType
+            });
+            onAnalyticsEvent?.("export_collection_success", {
+                collection: collection.slug
+            });
+            return true;
+        } catch (e) {
+            console.error("Error loading export data", e);
+            setDataLoadingError(e as Error);
+            return false;
+        } finally {
+            setDataLoading(false);
+        }
 
     }, [onAnalyticsEvent, dataClient, path, fetchAdditionalFields, includeUndefinedValues, flattenArrays, exportType, dateExportType]);
 
     const onOkClicked = useCallback(() => {
-        doDownload(collection, exportConfig);
-        handleClose();
+        // The dialog stays open until the walk finishes: it is the only place a
+        // multi-page export reports progress, or reports that it failed.
+        doDownload(collection, exportConfig).then((downloaded) => {
+            if (downloaded) handleClose();
+        });
     }, [doDownload, collection, exportConfig, handleClose]);
 
     return <>
@@ -194,13 +227,23 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
 
                 <div>{t("download_table_csv")}</div>
 
-                {collectionEntitiesCount !== undefined && collectionEntitiesCount > DOCS_LIMIT &&
+                {collectionEntitiesCount !== undefined && collectionEntitiesCount > DOCS_LIMIT && !tooManyToExport &&
                     <Alert color={"warning"}>
                         <div>
                             {t("large_number_of_documents", { count: collectionEntitiesCount.toString() })}
                         </div>
                     </Alert>}
 
+                {tooManyToExport &&
+                    <Alert color={"error"}>
+                        <div>
+                            {t("too_many_documents_to_export", {
+                                count: (collectionEntitiesCount ?? 0).toString(),
+                                limit: MAX_EXPORT_ROWS.toString()
+                            })}
+                        </div>
+                    </Alert>}
+
                 <div className={"flex flex-row gap-4"}>
                     <div className={"p-4 flex flex-col"}>
                         <RadioGroup value={exportType} onValueChange={(v) => setExportType(v as "csv" | "json")}>
@@ -242,6 +285,10 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
                     onValueChange={setIncludeUndefinedValues}
                     label={t("include_undefined_values")}/>
 
+                {dataLoadingError && <Alert color={"error"}>
+                    <div>{dataLoadingError.message}</div>
+                </Alert>}
+
                 {!canExport && notAllowedView}
 
             </DialogContent>
@@ -250,13 +297,19 @@ export function ExportCollectionAction<M extends Record<string, unknown>, USER e
 
                 {dataLoading && <CircularProgress size={"smallest"}/>}
 
+                {dataLoading && <Label>
+                    {progress.total !== undefined
+                        ? `${progress.loaded} / ${progress.total}`
+                        : `${progress.loaded}`}
+                </Label>}
+
                 <Button onClick={handleClose}
                     variant={"text"}>
                     {t("cancel")}
                 </Button>
 
                 <Button onClick={onOkClicked}
-                    disabled={dataLoading || !canExport}>
+                    disabled={dataLoading || !canExport || tooManyToExport}>
                     {t("download")}
                 </Button>
 

package/src/data_export/export/export.ts

@@ -154,6 +154,24 @@ function getHeaders(property: Property, propertyKey: string, prefix = ""): Heade
     }
 }
 
+/**
+ * Read whatever a `date` column actually arrived as into a `Date`.
+ *
+ * The driver/WebSocket path revives `{ __type: "date" }` into a `Date`; the REST
+ * path — which is the one the admin is on — leaves an ISO string, and an epoch
+ * number is what a re-imported export carries. Returns `undefined` for anything
+ * that is not a date, so the caller can pass the raw value through.
+ */
+function toExportableDate(inputValue: unknown): Date | undefined {
+    if (inputValue instanceof Date) return Number.isNaN(inputValue.getTime()) ? undefined : inputValue;
+    if (typeof inputValue === "number" && Number.isFinite(inputValue)) return new Date(inputValue);
+    if (typeof inputValue === "string" && inputValue.trim() !== "") {
+        const parsed = new Date(inputValue);
+        return Number.isNaN(parsed.getTime()) ? undefined : parsed;
+    }
+    return undefined;
+}
+
 function processValueForExport(inputValue: unknown,
     property: Property,
     exportType: "csv" | "json",
@@ -181,8 +199,17 @@ function processValueForExport(inputValue: unknown,
     } else if (property.type === "reference" && inputValue && typeof inputValue === "object" && "isEntityReference" in inputValue && typeof (inputValue as EntityReference).isEntityReference === "function" && (inputValue as EntityReference).isEntityReference()) {
         const ref = inputValue ? inputValue as EntityReference : undefined;
         value = ref ? ref.fullPath : null;
-    } else if (property.type === "date" && inputValue instanceof Date) {
-        value = inputValue ? (dateExportType === "timestamp" ? inputValue.getTime() : inputValue.toISOString()) : null;
+    } else if (property.type === "date") {
+        // Not `instanceof Date`: the admin reads over REST, and the REST row
+        // pipeline hands dates back as the database wrote them — a string. That
+        // made this branch dead on every live export, so both radio options
+        // produced identical files. Normalise here, where the declared type says
+        // the column is a date, and leave anything unparseable untouched rather
+        // than exporting an invalid date as `null`.
+        const date = toExportableDate(inputValue);
+        value = date
+            ? (dateExportType === "timestamp" ? date.getTime() : date.toISOString())
+            : inputValue;
     } else {
         value = inputValue;
     }
@@ -209,15 +236,40 @@ function processValuesForExport<M extends Record<string, unknown>>
 ...updatedValues };
 }
 
-function entryToCSVRow(entry: unknown[]) {
+/**
+ * Characters that make a spreadsheet read a cell as a formula rather than text.
+ *
+ * Quoting is CSV *escaping* and is not enough: Excel, LibreOffice Calc and
+ * Sheets strip the CSV quoting at parse time and then evaluate a cell whose
+ * first character is one of these — `=HYPERLINK(…)` exfiltrates neighbouring
+ * cells on click, `=cmd|'…'!A0` is worse.
+ */
+const FORMULA_TRIGGERS = ["=", "+", "-", "@", "\t", "\r"];
+
+/**
+ * Neutralise a cell that a spreadsheet would otherwise evaluate, by prefixing a
+ * single quote — the standard OWASP mitigation. The apostrophe is consumed by
+ * the spreadsheet as "treat the rest as text", so the value reads back intact.
+ */
+export function escapeCsvFormula(value: string): string {
+    const first = value.charAt(0);
+    if (!FORMULA_TRIGGERS.includes(first)) return value;
+    // A signed number is not a formula, and prefixing it would turn every
+    // negative amount in the file into text. `-1+1` is still neutralised,
+    // because it is not a number.
+    if ((first === "-" || first === "+") && value.trim() !== "" && Number.isFinite(Number(value))) return value;
+    return "'" + value;
+}
+
+function toCSVCell(v: unknown): string {
+    if (v === null || v === undefined) return "";
+    const s = Array.isArray(v) ? JSON.stringify(v) : String(v);
+    return "\"" + escapeCsvFormula(s).replaceAll("\"", "\"\"") + "\"";
+}
+
+export function entryToCSVRow(entry: unknown[]) {
     return entry
-        .map((v: unknown) => {
-            if (v === null || v === undefined) return "";
-            if (Array.isArray(v))
-                return "\"" + JSON.stringify(v).replaceAll("\"", "\"\"") + "\"";
-            const s = String(v);
-            return "\"" + s.replaceAll("\"", "\"\"") + "\"";
-        })
+        .map(toCSVCell)
         .join(",") + "\r\n";
 }
 
@@ -236,12 +288,7 @@ export function downloadDataAsCsv(data: object[], name: string) {
     const headers = Object.keys(data[0]);
     const csvContent = [
         headers.join(","),
-        ...data.map(row => headers.map(header => {
-            const value = (row as Record<string, unknown>)[header];
-            if (value === null || value === undefined) return "";
-            if (Array.isArray(value)) return `"${JSON.stringify(value).replace(/"/g, '""')}"`;
-            return `"${String(value).replace(/"/g, '""')}"`;
-        }).join(","))
+        ...data.map(row => headers.map(header => toCSVCell((row as Record<string, unknown>)[header])).join(","))
     ].join("\r\n");
 
     downloadBlob([csvContent], `${name}.csv`, "text/csv");

package/src/data_export/export/fetch_export_data.ts

@@ -0,0 +1,90 @@
+import { Entity, FindParams, FindResponse } from "@rebasepro/types";
+
+/**
+ * Rows asked for per request.
+ *
+ * Kept at or below the server's `MAX_LIST_LIMIT`, which is now the largest page
+ * a read will serve *and refuses* anything larger — it used to clamp silently,
+ * and asking for 100 000 while receiving 1 000 looked exactly like a collection
+ * with 1 000 rows in it. The walk still never trusts the page size it asked for:
+ * it advances by the rows it was actually handed.
+ */
+export const EXPORT_PAGE_SIZE = 500;
+
+/**
+ * Most rows one browser-side export will materialise.
+ *
+ * Everything here is built in memory and handed to a Blob, so there is a
+ * ceiling whether or not it is named. Naming it means going over it **throws**
+ * instead of writing a short file that reads like the whole collection.
+ */
+export const MAX_EXPORT_ROWS = 100_000;
+
+export interface FetchAllForExportParams<M extends Record<string, unknown>> {
+    /** The collection accessor to read through — `dataClient.collection(path)`. */
+    accessor: { find(params?: FindParams<M>): Promise<FindResponse<M>> };
+    /** Query to export. The window (`limit` / `offset` / `page`) is owned by the walk. */
+    params?: Omit<FindParams<M>, "limit" | "offset" | "page">;
+    pageSize?: number;
+    maxRows?: number;
+    /** Called after every page with the rows so far, and the total when the server reports one. */
+    onProgress?: (loaded: number, total: number | undefined) => void;
+}
+
+/**
+ * Read **every** row matching a query, one page at a time.
+ *
+ * `find({})` sends no `limit`, and an absent limit is resolved server-side to
+ * `DEFAULT_LIST_LIMIT` — 50 rows. The export used to hand those 50 rows back as
+ * `<collection>.csv` with nothing saying it was a sample, next to a dialog
+ * warning that the collection had 100 000 documents.
+ *
+ * Termination is driven by the server's `meta.hasMore` where it is reported and
+ * by an empty page otherwise — never by comparing a page's length against the
+ * requested limit, since a final page that happens to be exactly full is
+ * indistinguishable that way and a walk that stops there drops rows.
+ *
+ * @throws When more than `maxRows` rows match. A truncated export is worse than
+ * no export: it is indistinguishable from a complete one.
+ */
+export async function fetchAllEntitiesForExport<M extends Record<string, unknown>>({
+    accessor,
+    params,
+    pageSize = EXPORT_PAGE_SIZE,
+    maxRows = MAX_EXPORT_ROWS,
+    onProgress
+}: FetchAllForExportParams<M>): Promise<Entity<M>[]> {
+
+    const rows: Entity<M>[] = [];
+    let offset = 0;
+
+    for (;;) {
+        const res = await accessor.find({
+            ...params,
+            limit: pageSize,
+            offset
+        } as FindParams<M>);
+
+        const page = res?.data ?? [];
+        rows.push(...page);
+        onProgress?.(rows.length, res?.meta?.total);
+
+        if (rows.length > maxRows) {
+            throw new Error(
+                `This export would contain more than ${maxRows.toLocaleString()} rows, which is more than the ` +
+                "browser can build in one file. Filter the collection down, or export it from the server."
+            );
+        }
+
+        // An empty page ends the walk whatever the metadata says, so a server
+        // that keeps answering `hasMore` cannot spin forever.
+        if (page.length === 0) break;
+        if (res?.meta && !res.meta.hasMore) break;
+
+        // By rows received, not by `pageSize`: a server whose ceiling is lower
+        // than the page we asked for would otherwise skip everything it clamped.
+        offset += page.length;
+    }
+
+    return rows;
+}

package/src/data_export/export/index.ts

@@ -1,3 +1,4 @@
 export * from "./export";
+export * from "./fetch_export_data";
 export * from "./BasicExportAction";
 export * from "./ExportCollectionAction";

package/src/data_import/components/ImportSaveInProgress.tsx

@@ -1,10 +1,9 @@
 import { useData } from "@rebasepro/app";
-import { Entity } from "@rebasepro/types";
-import { RebaseData } from "@rebasepro/types";
 import { Button, CenteredView, CircularProgress, Typography } from "@rebasepro/ui";
 import { useEffect, useRef, useState } from "react";
 import { ImportConfig } from "../types";
 import type { AdminCollection } from "@rebasepro/admin-types";
+import { IMPORT_BATCH_SIZE, ImportSaveError, saveImportedEntities } from "../utils/save_entities";
 
 export function ImportSaveInProgress<C extends AdminCollection<any>>
     ({
@@ -20,11 +19,16 @@ export function ImportSaveInProgress<C extends AdminCollection<any>>
             onImportSuccess: (collection: C) => void
         }) {
 
-    const [errorSaving, setErrorSaving] = useState<Error | undefined>(undefined);
+    const [errorSaving, setErrorSaving] = useState<ImportSaveError | undefined>(undefined);
     const dataClient = useData();
 
     const savingRef = useRef<boolean>(false);
 
+    // Rows confirmed as written. A retry resumes here rather than re-sending
+    // rows that now exist and conflicting on its first batch, forever.
+    const committedRef = useRef<number>(0);
+    const bulkUnsupportedRef = useRef<{ current: boolean }>({ current: false });
+
     const [processedEntities, setProcessedEntities] = useState<number>(0);
 
     function save() {
@@ -33,20 +37,29 @@ export function ImportSaveInProgress<C extends AdminCollection<any>>
             return;
 
         savingRef.current = true;
+        setErrorSaving(undefined);
 
-        saveDataBatch(
+        saveImportedEntities(
             dataClient,
-            collection,
             path,
             importConfig.entities,
-            0,
-            25,
-            setProcessedEntities
+            {
+                offset: committedRef.current,
+                batchSize: IMPORT_BATCH_SIZE,
+                onBatchCommitted: (written) => {
+                    committedRef.current = written;
+                    setProcessedEntities(written);
+                },
+                bulkUnsupported: bulkUnsupportedRef.current
+            }
         ).then(() => {
             onImportSuccess(collection);
             savingRef.current = false;
         }).catch((e) => {
-            setErrorSaving(e);
+            const error = e as ImportSaveError;
+            committedRef.current = error.committed ?? committedRef.current;
+            setProcessedEntities(committedRef.current);
+            setErrorSaving(error);
             savingRef.current = false;
         });
     }
@@ -56,6 +69,10 @@ export function ImportSaveInProgress<C extends AdminCollection<any>>
     }, []);
 
     if (errorSaving) {
+        const total = importConfig.entities.length;
+        const failedRows = errorSaving.failedTo - errorSaving.failedFrom > 1
+            ? `rows ${errorSaving.failedFrom + 1}–${errorSaving.failedTo}`
+            : `row ${errorSaving.failedFrom + 1}`;
         return (
             <CenteredView className={"flex flex-col gap-4 items-center"}>
                 <Typography variant={"h6"}>
@@ -65,10 +82,18 @@ export function ImportSaveInProgress<C extends AdminCollection<any>>
                 <Typography variant={"body2"} color={"error"}>
                     {errorSaving.message}
                 </Typography>
+
+                <Typography variant={"body2"}>
+                    {errorSaving.committed} of {total} rows were imported.
+                    The import stopped on {failedRows}, which {errorSaving.failedTo - errorSaving.failedFrom > 1 ? "were" : "was"} not written.
+                </Typography>
+
                 <Button
                     onClick={save}
                 >
-                    Retry
+                    {errorSaving.committed > 0
+                        ? `Retry from row ${errorSaving.committed + 1}`
+                        : "Retry"}
                 </Button>
             </CenteredView>
         );
@@ -94,29 +119,3 @@ export function ImportSaveInProgress<C extends AdminCollection<any>>
     );
 
 }
-
-function saveDataBatch(dataClient: RebaseData,
-    collection: AdminCollection,
-    path: string,
-    data: Partial<Entity<any>>[],
-    offset = 0,
-    batchSize = 25,
-    onProgressUpdate: (progress: number) => void): Promise<void> {
-
-    console.debug("Saving imported data", offset, batchSize);
-
-    const batch = data.slice(offset, offset + batchSize);
-    return Promise.all(batch.map(d =>
-        dataClient.collection(path).create(
-            d.values,
-            d.id
-        )))
-        .then(() => {
-            if (offset + batchSize < data.length) {
-                onProgressUpdate(offset + batchSize);
-                return saveDataBatch(dataClient, collection, path, data, offset + batchSize, batchSize, onProgressUpdate);
-            }
-            onProgressUpdate(data.length);
-            return Promise.resolve();
-        });
-}

package/src/data_import/import/ImportCollectionAction.tsx

@@ -35,7 +35,7 @@ import { DataNewPropertiesMapping } from "../components/DataNewPropertiesMapping
 import { ImportFileUpload } from "../components/ImportFileUpload";
 import { ImportSaveInProgress } from "../components/ImportSaveInProgress";
 import { ImportConfig } from "../types";
-import { slugify } from "@rebasepro/utils";
+import { isPrototypePollutingKey, slugify } from "@rebasepro/utils";
 
 type ImportState = "initial" | "mapping" | "preview" | "import_data_saving";
 
@@ -400,7 +400,15 @@ export function ImportDataPreview<M extends Record<string, unknown>>({
     return <CollectionTableBinding
         title={<div>
             <Typography variant={"subtitle2"}>Imported data preview</Typography>
-            <Typography variant={"caption"}>Entities with the same id will be overwritten</Typography>
+            {/* Conditional because it is only true when a column was chosen as
+                the id: without one, every row is created and nothing can be
+                overwritten. With one, the import asks for an upsert — which it
+                did not, back when this sentence was unconditional and false. */}
+            <Typography variant={"caption"}>
+                {importConfig.idColumn
+                    ? "Entities with the same id will be overwritten"
+                    : "All rows will be imported as new entities"}
+            </Typography>
         </div>}
         tableController={{
             data: importConfig.entities,
@@ -421,6 +429,9 @@ function buildHeadersMappingFromData(objArr: object[], properties?: Properties)
     const headersMapping: Record<string, string> = {};
     objArr.filter(Boolean).forEach((obj) => {
         Object.keys(obj).forEach((key) => {
+            // The keys are the uploaded file's header row; `headersMapping[key] = …`
+            // is the same setter the import pipeline refuses elsewhere.
+            if (isPrototypePollutingKey(key)) return;
             const child = (obj as Record<string, unknown>)[key];
             if (child != null && typeof child === "object" && !Array.isArray(child)) {
                 const childProperty = properties?.[key];