d803bfe2b1
git-subtree-dir: vendor/ruvector git-subtree-split: b64c21726f2bb37286d9ee36a7869fef60cc6900
180 lines
4.1 KiB
Markdown
180 lines
4.1 KiB
Markdown
# Bulk Vector Import - Quick Reference Card
|
|
|
|
## 🚀 30-Second Integration
|
|
|
|
```bash
|
|
# 1. Run script
|
|
./apply-bulk-import.sh
|
|
|
|
# 2. Add functions (copy sections 4-8 from bulk-import-code.tsx)
|
|
# Paste after line ~850 in App.tsx
|
|
|
|
# 3. Add button (copy section 9 from bulk-import-code.tsx)
|
|
# Paste after line ~1956 in App.tsx
|
|
|
|
# 4. Add modal (copy section 10 from bulk-import-code.tsx)
|
|
# Paste after line ~2296 in App.tsx
|
|
|
|
# 5. Test
|
|
npm run dev
|
|
```
|
|
|
|
## 📝 What to Add Where
|
|
|
|
| What | Where | Lines | Section |
|
|
|------|-------|-------|---------|
|
|
| FileSpreadsheet icon | Line ~78 | 1 | 1 |
|
|
| Modal hook | Line ~527 | 1 | 2 |
|
|
| State variables | Line ~539 | 5 | 3 |
|
|
| CSV parser | Line ~850 | 45 | 4 |
|
|
| JSON parser | Line ~890 | 30 | 5 |
|
|
| Preview handler | Line ~920 | 15 | 6 |
|
|
| Import handler | Line ~935 | 55 | 7 |
|
|
| File handler | Line ~990 | 20 | 8 |
|
|
| Button | Line ~1964 | 4 | 9 |
|
|
| Modal | Line ~2306 | 155 | 10 |
|
|
|
|
## 📂 File Guide
|
|
|
|
| File | Purpose | When to Use |
|
|
|------|---------|-------------|
|
|
| INTEGRATION_GUIDE.md | Step-by-step instructions | First time integration |
|
|
| bulk-import-code.tsx | Copy-paste code | Actually coding |
|
|
| VISUAL_INTEGRATION_MAP.md | Diagrams & structure | Understanding flow |
|
|
| IMPLEMENTATION_SUMMARY.md | Feature overview | Before starting |
|
|
| sample-bulk-import.csv | Test CSV | Testing CSV import |
|
|
| sample-bulk-import.json | Test JSON | Testing JSON import |
|
|
|
|
## 🎯 Code Sections (bulk-import-code.tsx)
|
|
|
|
| Section | What | Lines |
|
|
|---------|------|-------|
|
|
| 1 | Icon import | 1 |
|
|
| 2 | Modal hook | 1 |
|
|
| 3 | State (5 vars) | 5 |
|
|
| 4 | CSV parser | 45 |
|
|
| 5 | JSON parser | 30 |
|
|
| 6 | Preview handler | 15 |
|
|
| 7 | Import handler | 55 |
|
|
| 8 | File handler | 20 |
|
|
| 9 | Button | 4 |
|
|
| 10 | Modal | 155 |
|
|
|
|
## 🧪 Testing Checklist
|
|
|
|
- [ ] CSV upload works
|
|
- [ ] JSON upload works
|
|
- [ ] Preview shows 5 vectors
|
|
- [ ] Progress bar appears
|
|
- [ ] Success message logged
|
|
- [ ] Vector count updates
|
|
- [ ] Modal auto-closes
|
|
- [ ] Error handling works
|
|
|
|
## 🔧 Common Issues
|
|
|
|
| Problem | Solution |
|
|
|---------|----------|
|
|
| Button not visible | Add icon import (Section 1) |
|
|
| Modal won't open | Add hook (Section 2) |
|
|
| Preview fails | Add parsers (Sections 4-5) |
|
|
| Import fails | Add handler (Section 7) |
|
|
|
|
## 📊 CSV Format
|
|
|
|
```csv
|
|
id,embedding,metadata
|
|
vec1,"[1.0,2.0,3.0]","{\"key\":\"value\"}"
|
|
```
|
|
|
|
## 📋 JSON Format
|
|
|
|
```json
|
|
[
|
|
{ "id": "vec1", "embedding": [1.0, 2.0, 3.0], "metadata": {} }
|
|
]
|
|
```
|
|
|
|
## ⚡ State Variables
|
|
|
|
```typescript
|
|
bulkImportData: string // Raw text
|
|
bulkImportFormat: 'csv' | 'json' // Format type
|
|
bulkImportPreview: Vector[] // Preview data
|
|
bulkImportProgress: {current, total, errors}
|
|
isBulkImporting: boolean // In progress
|
|
```
|
|
|
|
## 🔄 Functions
|
|
|
|
```typescript
|
|
parseCsvVectors(text) → Vector[]
|
|
parseJsonVectors(text) → Vector[]
|
|
handleGeneratePreview() → void
|
|
handleBulkImport() → Promise<void>
|
|
handleBulkImportFileUpload() → void
|
|
```
|
|
|
|
## 🎨 UI Components
|
|
|
|
```typescript
|
|
Button: Bulk Import Vectors (Quick Actions)
|
|
Modal: Bulk Import Modal (After Import Modal)
|
|
├─ Format Selector
|
|
├─ File Upload
|
|
├─ Preview Button
|
|
├─ Format Guide
|
|
├─ Data Textarea
|
|
├─ Preview Panel
|
|
└─ Progress Indicator
|
|
```
|
|
|
|
## 📏 Line Numbers
|
|
|
|
```
|
|
~78 : Icon import
|
|
~527 : Modal hook
|
|
~539 : State variables
|
|
~850 : Functions start
|
|
~1964 : Button location
|
|
~2306 : Modal location
|
|
```
|
|
|
|
## 🎯 Integration Order
|
|
|
|
1. ✅ Icon (1 line)
|
|
2. ✅ Hook (1 line)
|
|
3. ✅ State (5 lines)
|
|
4. ✅ Functions (5 functions, ~165 lines)
|
|
5. ✅ Button (4 lines)
|
|
6. ✅ Modal (155 lines)
|
|
|
|
**Total: ~331 lines**
|
|
|
|
## 🚦 Status After Integration
|
|
|
|
| Feature | Status |
|
|
|---------|--------|
|
|
| CSV import | ✅ Working |
|
|
| JSON import | ✅ Working |
|
|
| File upload | ✅ Working |
|
|
| Preview | ✅ Working |
|
|
| Progress | ✅ Working |
|
|
| Errors | ✅ Handled |
|
|
| Theme | ✅ Dark |
|
|
| Tests | ⏳ Pending |
|
|
|
|
## 📞 Help
|
|
|
|
- Integration: `INTEGRATION_GUIDE.md`
|
|
- Code: `bulk-import-code.tsx`
|
|
- Visual: `VISUAL_INTEGRATION_MAP.md`
|
|
- Overview: `IMPLEMENTATION_SUMMARY.md`
|
|
|
|
---
|
|
|
|
**Quick Copy-Paste**:
|
|
```bash
|
|
cat docs/bulk-import-code.tsx
|
|
```
|