CSV Import: ignore divider field

plugins/csv-import/src/routes/FieldMapper.tsx

@@ -3,6 +3,7 @@ import { framer } from "framer-plugin"
 import { useCallback, useEffect, useMemo, useState } from "react"
 import { FieldMapperRow, type FieldMappingItem } from "../components/FieldMapperRow"
 import { labelByFieldType } from "../utils/fieldLabels"
+import { getDataFields } from "../utils/filterFields"
 import { isTypeCompatible } from "../utils/typeCompatibility"
 import { inferFieldsFromCSV } from "../utils/typeInference"
 import type { VirtualFieldType } from "../utils/virtualTypes"
@@ -48,7 +49,8 @@ export function FieldMapper({ collection, csvRecords, onSubmit }: FieldMapperPro
     useEffect(() => {
         async function loadFields() {
             try {
-                const fields = await collection.getFields()
+                const allFields = await collection.getFields()
+                const fields = getDataFields(allFields)
                 setExistingFields(fields)
 
                 const inferredFields = inferFieldsFromCSV(csvRecords)

plugins/csv-import/src/utils/filterFields.ts

@@ -0,0 +1,9 @@
+import type { Field } from "framer-plugin"
+
+/**
+ * Filters out field types that can't store data (dividers are visual separators, unsupported fields are not usable for
+ * import).
+ */
+export function getDataFields(fields: Field[]): Field[] {
+    return fields.filter(field => field.type !== "divider" && field.type !== "unsupported")
+}

plugins/csv-import/src/utils/prepareImportPayload.ts

@@ -9,6 +9,7 @@ import {
 } from "framer-plugin"
 import type { FieldMappingItem } from "../components/FieldMapperRow"
 import { assert } from "./assert"
+import { getDataFields } from "./filterFields"
 import type { CSVRecord } from "./parseCSV"
 
 /** Error when importing fails, internal to `RecordImporter` */
@@ -194,7 +195,8 @@ export async function prepareImportPayload(opts: ProcessRecordsWithFieldMappingO
     }
 
     const existingItems = await opts.collection.getItems()
-    const fields = await opts.collection.getFields()
+    const allFields = await opts.collection.getFields()
+    const fields = getDataFields(allFields)
 
     const result: ImportPayload = {
         warnings: {