Drill-XXXX: Refactor User Interface#3037
Draft
cgivre wants to merge 136 commits intoapache:masterfrom
Draft
Conversation
cgivre
changed the title
cgivre
added
enhancement
![github-advanced-security[bot]](https://avatars.githubusercontent.com/in/57789?s=60&v=4){kind=small}
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/SqlLabSpaServlet.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/SqlLabSpaServlet.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/DashboardResources.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/DashboardResources.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/resources/webapp/src/pages/DashboardViewPage.tsx
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/resources/webapp/src/pages/DashboardViewPage.tsx
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/resources/webapp/src/pages/DashboardViewPage.tsx
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/DashboardResources.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/resources/webapp/src/components/results/ResultsGrid.tsx
Fixed
Show fixed
Hide fixed
cgivre
force-pushed
the
feature/sqllab-react-ui
branch
from
080ba0b to
36af30f
Compare
exec/java-exec/src/main/resources/webapp/src/components/notebook/NotebookPanel.tsx
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/resources/webapp/src/components/notebook/NotebookPanel.tsx
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/ResultCacheService.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/ResultCacheService.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/ResultCacheService.java
Fixed
Show fixed
Hide fixed
exec/java-exec/src/main/java/org/apache/drill/exec/server/rest/ResultCacheService.java
Fixed
Show fixed
Hide fixed
cgivre
force-pushed
the
feature/sqllab-react-ui
branch
from
53da641 to
33fb68e
Compare
…script for OpenDataDE data - Created process-zipcodes.py script that downloads all 50 state ZIP code files from OpenDataDE repo - Updated GeoMapRegistry with 50 state-level ZIP code entries (multiSelectAllowed: true) - Changed 'us-zipcodes' to 'US ZIP Codes (All)' for merged national data - State entries grouped under 'US ZIP Codes (by State)' for better UI organization - Each state entry includes proper center/zoom for that state's bounds - Script will create merged us-zipcodes.json (committed to git) + state files (git-ignored)
- Updated ColumnMapper to detect multi-select-enabled scopes (state ZIP codes) - Switch between single-select and multi-select UI dynamically - Store multi-selections in mapScopes array - Updated ChartPreview.tsx to handle both mapScope and mapScopes - When multiple state ZIP codes selected, automatically use all-states us-zipcodes map - Data filtering happens naturally - only selected states' ZIP codes will have values - Added debug logging showing number of selected states
The buildGroupedOptions function was missing 'US ZIP Codes (by State)' in the groups list, so the 50 state-level ZIP code options weren't appearing in the Geographic Scope selector dropdown. Now they'll be visible and selectable.
- Replaced old DC-only us-zipcodes.json with merged file from OpenDataDE - File contains 4,388 ZIP codes from successfully downloaded states - Size: 105.2 MB (committed to git for all users) - Individual state files excluded from git (can be regenerated locally) - Updated .gitignore to allow merged file but exclude individual state files
- Increase curl timeout from 30 seconds to 300 seconds (5 minutes) - All GeoJSON files minified (removes whitespace, ~50-70% size reduction) - Vite will auto-gzip for serving (~80-90% additional compression) - Better status messages during download - Should now successfully download all 50 states instead of timing out
- Implement coordinate reduction in simplify_geometry() - Keep every 3rd coordinate (reduces points by ~67%) - Maintains visual accuracy for choropleth maps - Combined with minification and gzip compression: - Individual state files: ~100-300 KB each (vs 3-13 MB before) - Merged file: ~10-15 MB (vs 105 MB before) - With gzip served by Vite: ~1-3 MB per state, ~2-5 MB merged
…rged all-states - Load individual state files (1-3 MB each) instead of merged file (100+ MB) - When user selects multiple states, show first state's map + filter data naturally - Reduces memory usage by 95% while maintaining full functionality - Users can visualize data from any state(s) with fast, responsive performance - Added UI hint recommending state-specific selection for best performance - If user has data from multiple states, filter query to those states first
- When metric values are NaN (undefined, null, or non-numeric), treat as 0 - Prevents missing data from breaking the visualization - Shows zero values on map for regions with no data instead of being blank
- Replace 384 MB us-zipcodes.json with 91 MB us-zipcodes.topojson - Enables GitHub compatibility (under 100 MB limit) - Add topojson-client package for client-side conversion - Update fetchGeoJson to detect and convert TopoJSON to GeoJSON for ECharts - Update .gitignore to track .topojson instead of .geojson - Update process-zipcodes.py to generate both formats - Successfully downloaded all 50 US states (32,936 total ZIP codes) Compression results: - Original GeoJSON with simplification: 384 MB - TopoJSON with mapshaper: 91 MB (76% reduction) - Individual state files: 1-26 MB each (not committed)
cgivre
force-pushed
the
feature/sqllab-react-ui
branch
from
33fb68e to
34bfc23
Compare
Add visualization-level and dashboard panel-level configuration for choropleth map starting zoom and center coordinates. Priority order: panel config > visualization config > map defaults. Changes: - ChartPreview.tsx: Read choroplethZoom/choroplethCenter from config.chartOptions with fallback to mapDef - ColumnMapper.tsx: Add Starting Zoom and Starting Center controls for choropleth charts - DashboardPanelCard.tsx: Merge panel-level overrides into visualization config; add map settings Popover in edit mode Co-Authored-By: Claude Haiku 4.5 <noreply@anthropic.com>
Enable users to drag/zoom the choropleth map in the visualization builder preview and capture the current zoom level and center coordinates as the default starting view. Changes: - ChartPreview.tsx: Convert to forwardRef to expose ECharts instance - ColumnMapper.tsx: Add 'Capture current map view' button for choropleth visualizations - VisualizationBuilder.tsx: Create echartsRef and captureMapView callback, pass to ColumnMapper
Add a link to the Manage Data Sources page in the admin dropdown menu for easier access to data source configuration.
Use eslint disable directives for explicit any types needed for ReactECharts ref compatibility.
Rename dashboard parameter from :id to :dashboardId to prevent shadowing the parent project :id parameter. This fixes the 404 error when navigating to project dashboards.
When a user creates a new tab in a project, the effect that loads the project's first saved query was running on every activeTabId change. This caused new tabs to be populated with the saved query instead of remaining empty. The fix adds a Set to track which projects have already had their initial saved query loaded, ensuring this effect runs only once per project rather than on every tab change.
When duplicating a tab, all tab properties should be copied to the new tab. Previously, lock state (isLocked, lockReason, lockType) and visualization IDs (vizIds) were not being copied, causing them to be lost when duplicating a tab.
Explicitly initialize vizIds and isLocked fields when creating tabs to ensure they have consistent default values from the start.
- Added 'Sort Direction' UI control to bigNumber chart when 'Order By' is set - Added sort direction controls to bar, heatmap, boxplot, waterfall charts - Added sort direction controls to pie, funnel, treemap charts with dimensions - Updated SQL transformation functions to apply sort direction to ORDER BY clause - Default sort direction is ascending for categorical charts, descending for metric charts This allows users to control whether categorical data sorts A→Z or Z→A, and whether metric values sort numerically ascending or descending.
…visualization - Number Format control: Default, Comma separator, Compact (1K, 2.5M), Percentage - Custom Label field: Add text label after metric (e.g., 'Users', 'Revenue') - Sparkline Data Points limit: Reduce number of points shown for performance The number formatter supports: - Default: Shows raw number - Comma: 1,234,567 format - Compact: 1.2M, 3.4K, etc. - Percentage: Converts to percentage format (45.3%) When showing many data points, sparkline can be limited to sample data evenly, improving rendering performance with large datasets.
…into expandable groups - Added Currency option with 10 common currency symbols (USD, EUR, GBP, JPY, etc.) - Reorganized metric visualization settings into three expandable Collapse groups: * 📊 Number Display: Format, Currency, Custom Label * 📈 Sparkline & Trend: Show options and data point limit * 🔤 Sorting: Sort direction (only shown when Order By is configured) This makes the metric visualization configuration cleaner and more organized, especially useful as more options are added in the future.
The Sort Direction control for metric visualization now appears in the main configuration section right after the Order By field, making it easier to discover and configure sorting together with the order by column selection.
Allow AI Q&A panels to see visualization data from all dashboard tabs, not just the current tab. Previously, when allPanels was filtered to visiblePanels (tab-filtered), AI panels could only access data from their own tab.
Add the SQL query and increase sample rows in dashboard data context. This allows the AI to understand the data structure and provide better answers by seeing the actual queries driving each visualization.
Add instruction to AI to provide concise 1-2 sentence answers focused on directly answering the question, appropriate for dashboard context.
…e queries Clarify that AI should analyze the provided dashboard data directly and not suggest writing new queries or exploring the database. This prevents the AI from defaulting to generic query suggestions.
Backend changes: - Strengthen dashboard Q&A system prompt to explicitly prohibit tool use and require direct answers using only provided data Frontend changes: - Make frontend instruction even more explicit - Add clear button to chat history (appears when messages exist)
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
DRILL-XXXX: Refactor User Interface
Description
This PR refactors Drill's UI and refactors the Query view, adds visualizations and dashboards and in general makes Drill much more user friendly.
Documentation
(Please describe user-visible changes similar to what should appear in the Drill documentation.)
Testing
(Please describe how this PR has been tested.)