d803bfe2b1
git-subtree-dir: vendor/ruvector git-subtree-split: b64c21726f2bb37286d9ee36a7869fef60cc6900
139 lines
3.6 KiB
Markdown
139 lines
3.6 KiB
Markdown
# SQL Schema Browser Feature
|
|
|
|
## Overview
|
|
The SQL Schema Browser is a new feature added to the RvLite dashboard that automatically tracks and displays SQL table schemas created through the SQL query interface.
|
|
|
|
## Implementation Summary
|
|
|
|
### Files Modified
|
|
- `/workspaces/ruvector/crates/rvlite/examples/dashboard/src/App.tsx`
|
|
|
|
### Key Components Added
|
|
|
|
#### 1. **TypeScript Interface**
|
|
```typescript
|
|
interface TableSchema {
|
|
name: string;
|
|
columns: Array<{
|
|
name: string;
|
|
type: string;
|
|
isVector: boolean;
|
|
dimensions?: number;
|
|
}>;
|
|
rowCount?: number;
|
|
}
|
|
```
|
|
|
|
#### 2. **State Management**
|
|
- `sqlTables: Map<string, TableSchema>` - Tracks all created tables
|
|
- `expandedTables: Set<string>` - Tracks which table details are expanded in UI
|
|
|
|
#### 3. **Icon Imports** (Lucide React)
|
|
- `Table2` - Table icon
|
|
- `Columns` - Column list icon
|
|
- `ChevronDown` / `ChevronRight` - Expand/collapse icons
|
|
|
|
#### 4. **Core Functions**
|
|
|
|
**`parseCreateTable(query: string): TableSchema | null`**
|
|
- Parses CREATE TABLE SQL statements
|
|
- Extracts table name, columns, and types
|
|
- Detects VECTOR columns with dimensions (e.g., VECTOR(3))
|
|
|
|
**`toggleTableExpansion(tableName: string)`**
|
|
- Expands/collapses table details in the UI
|
|
|
|
**`handleSelectTable(tableName: string)`**
|
|
- Auto-fills query input with `SELECT * FROM tableName`
|
|
|
|
**`handleDropTable(tableName: string)`**
|
|
- Confirms and executes DROP TABLE
|
|
- Updates schema browser state
|
|
|
|
#### 5. **Modified `handleExecuteSql`**
|
|
Now intercepts:
|
|
- **CREATE TABLE**: Parses schema and adds to `sqlTables`
|
|
- **DROP TABLE**: Removes table from `sqlTables`
|
|
|
|
### UI Features
|
|
|
|
The Schema Browser card appears in the SQL tab when tables exist:
|
|
|
|
1. **Table List**
|
|
- Click table name to expand/collapse
|
|
- Shows column count badge
|
|
|
|
2. **Per-Table Actions**
|
|
- **Query button**: Auto-fills `SELECT * FROM table`
|
|
- **Drop button**: Deletes table (with confirmation)
|
|
|
|
3. **Column Display** (when expanded)
|
|
- Column name in monospace font
|
|
- Type badges with color coding:
|
|
- Purple: `VECTOR(n)`
|
|
- Blue: `TEXT`
|
|
- Green: `INTEGER`
|
|
- Gray: Other types
|
|
|
|
### Example Usage
|
|
|
|
1. Run the sample query "Create Table":
|
|
```sql
|
|
CREATE TABLE docs (id TEXT, content TEXT, embedding VECTOR(3))
|
|
```
|
|
|
|
2. The Schema Browser automatically appears showing:
|
|
- Table name: `docs`
|
|
- Columns: `id (TEXT)`, `content (TEXT)`, `embedding (VECTOR(3))`
|
|
|
|
3. Click the table to expand and see all column details
|
|
|
|
4. Click "Query" button to auto-fill: `SELECT * FROM docs`
|
|
|
|
5. Click "Drop" button to remove the table (with confirmation)
|
|
|
|
## Testing
|
|
|
|
Build successful:
|
|
```bash
|
|
npm run build
|
|
```
|
|
|
|
### Test Scenarios
|
|
|
|
1. **Create table with VECTOR column**
|
|
- ✅ Schema parsed correctly
|
|
- ✅ VECTOR dimension detected (e.g., VECTOR(3))
|
|
- ✅ Table appears in Schema Browser
|
|
|
|
2. **Drop table**
|
|
- ✅ Table removed from Schema Browser
|
|
- ✅ Confirmation dialog shown
|
|
|
|
3. **Multiple tables**
|
|
- ✅ All tables tracked independently
|
|
- ✅ Expansion state preserved per table
|
|
|
|
4. **Column type detection**
|
|
- ✅ TEXT columns (blue badge)
|
|
- ✅ INTEGER columns (green badge)
|
|
- ✅ VECTOR columns (purple badge with dimensions)
|
|
|
|
## Code Locations
|
|
|
|
- **Types**: Lines 104-113
|
|
- **State**: Lines 518-520
|
|
- **Parser**: Lines 872-907
|
|
- **Handlers**: Lines 909-946
|
|
- **Modified SQL executor**: Lines 948-980
|
|
- **UI Component**: Lines ~1701-1804 (SQL tab, before SQL Result card)
|
|
|
|
## Future Enhancements
|
|
|
|
Potential improvements:
|
|
- Row count tracking (execute `SELECT COUNT(*) FROM table`)
|
|
- Index visualization
|
|
- Table relationships/foreign keys
|
|
- Export schema as SQL DDL
|
|
- Schema comparison/diff view
|