Skip to content

Commit b7dca32

Browse files
committed
Implement column menus for ResultsGrid with comprehensive feature set
## Summary Add interactive column menus to the ResultsGrid component with 5 feature categories: 1. **Actions** - Hide/show columns, pin/unpin to left/right 2. **Statistics** - Calculate and display column stats (count, null count, distinct, min/max/avg) 3. **Filters** - Show top 10 values and data quality indicators 4. **Transform** - SQL transformations (UPPER, LOWER, TRIM, CAST, TRUNCATE, SUBSTRING) 5. **Export** - Copy to clipboard or export as CSV ## Architecture - **SQL Transformation Utility** (src/utils/sqlTransformations.ts): Regex-based transformation logic - Handles simple columns, table prefixes, backticks, and aliases - Safe column wrapping with SQL functions - Client-side statistics calculation - **ColumnMenu Component** (src/components/results/ColumnMenu.tsx): Custom menu with 5 tabs - Statistics calculation from displayed data - Column visibility and pinning controls - Top 10 values preview for quick data exploration - Text transformations and type casting options - **CustomHeader Component** (src/components/results/CustomHeader.tsx): AG Grid header integration - Menu button in column headers using Popover - Connects to ColumnMenu for user interactions - **ResultsGrid Updates** (src/components/results/ResultsGrid.tsx): - Column state persistence to localStorage - New toolbar buttons for column and sort management - Modal dialogs for managing column visibility and sort order - Event listeners for saving state on column changes - **SqlLabPage Handler** (src/pages/SqlLabPage.tsx): - handleTransformColumn callback that shows preview modal - Transformation confirmation before modifying SQL - Auto-executes query after transformation ## Features Implemented ✅ Column Actions (hide/show, pin/unpin) ✅ Column Statistics (count, nulls, distinct, min/max/avg, percentages) ✅ Data Quality Indicators (non-null %, uniqueness %) ✅ Quick Data Preview (top 10 values) ✅ SQL Transformations (UPPER, LOWER, TRIM, CAST, TRUNCATE, SUBSTRING) ✅ Export Functions (copy to clipboard, export as CSV) ✅ Column State Persistence (localStorage) ✅ Sort Management (view current sorts, clear all) ✅ Column Management (show/hide all columns) ## Technical Details - Regex-based SQL transformation instead of parser library (avoids 500KB+ dependency) - Statistics computed on displayed/paginated data (not full dataset) - AG Grid API integration for column visibility and pinning - localStorage for persisting column state across sessions - TypeScript interfaces for type safety - Ant Design components for consistent UI
1 parent a208f70 commit b7dca32

5 files changed

Lines changed: 1000 additions & 4 deletions

File tree

0 commit comments

Comments
 (0)