Import / Export
React hook for importing and exporting vector data with progress tracking, preview, and cancellation.
Import / Export Hook
See it in action
Try the Knowledge Base block for a working demo of these hooks — its Data tab runs Pinecone/CSV/JSONL import and export against a live in-browser corpus.
useImportExport
Import vectors from Pinecone, ChromaDB, CSV, or JSONL, and export to CSV or JSONL — with progress tracking, preview, and cancellation.
import { useImportExport } from '@localmode/react';
import { createVectorDB } from '@localmode/core';
import { transformers } from '@localmode/transformers';
const db = await createVectorDB({ name: 'docs', dimensions: 384 });
const model = transformers.embedding('Xenova/bge-small-en-v1.5');
function DataMigrator() {
const {
importData, parsePreview, exportCSV, exportJSONL,
isImporting, isParsing, isExporting,
progress, stats, parseResult, error,
cancel, reset,
} = useImportExport({ db, model });
const handleFile = async (e: React.ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0];
if (!file) return;
const content = await file.text();
// Preview first
await parsePreview({ content });
};
const handleImport = async (content: string) => {
await importData({ content, format: 'pinecone' });
};
return (
<div>
<input type="file" onChange={handleFile} accept=".json,.csv,.jsonl" />
{isParsing && <p>Parsing...</p>}
{parseResult && <p>Found {parseResult.records.length} records ({parseResult.format})</p>}
{isImporting && progress && (
<p>Importing: {progress.completed}/{progress.total}</p>
)}
{stats && <p>Imported {stats.imported}, skipped {stats.skipped}, failed {stats.failed}</p>}
<button onClick={exportCSV} disabled={isExporting}>Export CSV</button>
<button onClick={exportJSONL} disabled={isExporting}>Export JSONL</button>
{isImporting && <button onClick={cancel}>Cancel</button>}
{error && <p className="text-error">{error.message}</p>}
</div>
);
}Options
Prop
Type
Return Value
Prop
Type
Supported Formats
| Format | Detection | Description |
|---|---|---|
'pinecone' | vectors key in JSON | Pinecone export format ({ id, values, metadata }) |
'chroma' | ids + embeddings arrays | ChromaDB export format (parallel arrays) |
'csv' | Comma-separated with headers | CSV with id, vector, text, metadata columns |
'jsonl' | One JSON object per line | JSON Lines with id, vector/embedding, text, metadata |
Format is auto-detected if omitted. Pass format explicitly if auto-detection produces wrong results.
Re-embedding Text-Only Records
When importing records that have text but no vectors (e.g., a CSV with only id and text columns), pass an embeddingModel to compute vectors automatically:
const { importData } = useImportExport({
db,
model: transformers.embedding('Xenova/bge-small-en-v1.5'),
});
// Records without vectors will be embedded using the model
await importData({ content: csvWithTextOnly });For full import/export API reference including importFrom(), parseExternalFormat(), exportToCSV(), format specifications, and error handling, see the Core Import/Export guide.
Blocks
| App | Description | Links |
|---|---|---|
| Knowledge Base (Semantic Search) | Export and import vector indexes with useImportExport | Live block · Source |
| Knowledge Base (Data Migrator) | Migrate vectors between formats with useImportExport | Live block · Source |