Bolt prompt to build a CSV import/export feature
CSV import is mostly failure handling, wrong columns, bad dates, half-finished files, and this prompt makes Bolt build the unglamorous parts first: streaming parse, a mapping step, and an errors.csv for rejected rows. Export comes out matching what import accepts, which the round-trip acceptance test at the end enforces.
Last updated
Add CSV import and export for {{resource}} records to this Bolt project.
Import is a three-step modal launched from an Import button on the {{resource}} list:
1. Upload: drag and drop or file picker, .csv only, files over 5 MB rejected with a clear message before parsing. Parse in the browser with PapaParse in streaming mode so the preview pane never freezes on big files.
2. Map columns: show the first five rows in a table, with a dropdown per CSV column mapping it to a {{resource}} field or Skip. Auto-match by header name, case-insensitive. If a required field is unmapped, disable Next and say which one.
3. Validate and commit: run every row through the same validation the normal create form uses. Show counts of valid and invalid rows, offer a downloadable errors.csv containing only the failed rows plus a reason column, then import valid rows in batches of 100 with a progress bar. Cancel between batches keeps rows already written.
Import rules: trim cells, treat empty strings as null, accept dates as either YYYY-MM-DD or DD/MM/YYYY and report which format was detected, and resolve duplicates by natural key with one Skip or Overwrite choice applied to the whole file.
Export: a button honoring the list's current filters, served as GET /api/{{resource}}/export.csv from the Node server with a Content-Disposition header, values escaped per RFC 4180, and any cell starting with =, +, -, or @ prefixed with a single quote to block spreadsheet formula injection.
Acceptance: round-trip it, export the seed data, re-import that same file, and finish with zero invalid rows and zero duplicates created.Customize it
Runs in your browser. Nothing you type here is sent anywhere.
Add CSV import and export for users records to this Bolt project. Import is a three-step modal launched from an Import button on the users list: 1. Upload: drag and drop or file picker, .csv only, files over 5 MB rejected with a clear message before parsing. Parse in the browser with PapaParse in streaming mode so the preview pane never freezes on big files. 2. Map columns: show the first five rows in a table, with a dropdown per CSV column mapping it to a users field or Skip. Auto-match by header name, case-insensitive. If a required field is unmapped, disable Next and say which one. 3. Validate and commit: run every row through the same validation the normal create form uses. Show counts of valid and invalid rows, offer a downloadable errors.csv containing only the failed rows plus a reason column, then import valid rows in batches of 100 with a progress bar. Cancel between batches keeps rows already written. Import rules: trim cells, treat empty strings as null, accept dates as either YYYY-MM-DD or DD/MM/YYYY and report which format was detected, and resolve duplicates by natural key with one Skip or Overwrite choice applied to the whole file. Export: a button honoring the list's current filters, served as GET /api/users/export.csv from the Node server with a Content-Disposition header, values escaped per RFC 4180, and any cell starting with =, +, -, or @ prefixed with a single quote to block spreadsheet formula injection. Acceptance: round-trip it, export the seed data, re-import that same file, and finish with zero invalid rows and zero duplicates created.
Same task in other tools
Questions about this prompt
Why parse in the browser instead of uploading the raw file to the server?
Streaming with PapaParse in the client gives instant preview and mapping without holding a large file in the WebContainer's memory, and validation errors surface before any network write happens. The server only ever receives clean, batched, validated rows, which keeps the API small and the failure modes visible.
My CSV headers never match my field names. Does mapping handle that?
Yes, the mapping step is the point of contact. Auto-match covers case differences, everything else you assign from the dropdowns, and unmapped optional columns are skipped rather than blocking. If your files consistently use the same odd headers, tell Bolt to add those aliases to the auto-match list.
Excel mangles my exported file on open. What is happening?
Two usual causes. Leading zeros and long numbers get reformatted, which is Excel behavior you can only document around. Formula-looking cells are the dangerous one, and the export already prefixes cells starting with =, +, -, or @, so if that escaping was removed for cosmetic reasons, restore it.