Drill-XXXX: Refactor User Interface#3037
Draft
cgivre wants to merge 150 commits into
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}
cgivre
force-pushed
the
feature/sqllab-react-ui
branch
from
080ba0b to
36af30f
Compare
cgivre
force-pushed
the
feature/sqllab-react-ui
branch
from
53da641 to
33fb68e
Compare
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)
Schedules previously had no owner field and no ownership checks, so any authenticated user could list, read, update, delete, run, and view snapshots for every other user's scheduled queries. Scheduled queries also ran as a hard-coded "anonymous" user, ignoring the owner's identity under impersonation. - Add an owner field to QueryScheduleModel, stamped on create and preserved across updates. - Gate every per-id endpoint with an admin-or-owner check; filter the list endpoint to the caller's own schedules unless the caller is admin. Legacy schedules with a null owner are treated as admin-only. - Run scheduled query execution (both the background loop and the manual "Run Now" trigger) under the schedule owner's identity by threading the owner through executeQueryWithTimeout and executePersistentQuery, and building the WebUserConnection with the owner's username. Falls back to "anonymous" only for legacy null-owner schedules.
The Spotlight rewrite widened the palette to search projects, saved queries, visualizations, and dashboards — and updated the placeholder text accordingly. The test still expected the old 'Search projects...' placeholder and didn't mock the three new API modules, so the calls to getSavedQueries / getVisualizations / getDashboards triggered real network requests in jsdom. Updated the placeholder assertion to match the new copy (regex-based for robustness to typographic punctuation) and added vi.mock entries for the three additional API modules.
- Format button on the viz inline SQL editor (uses sqlglot via /api/v1/transpile/format) - Add-to-dashboard modal on viz detail (existing or new dashboard) - Warning glyph on dashboard panels whose query no longer returns columns the chart config references; reuses utils/vizColumnDeps
The schema tree was hidden as a tab next to Prospector in the right rail. This wires up a generic LeftRail surface (collapsible, resizable, persisted width) and registers a global Browse Data drawer that opens on ⌘B / from the toolbar when a page hasn't claimed the left rail. - AppChromeContext: new leftRail registration field + collapsed state - LeftRail component mirrors RightInspector but anchored to the opposite edge, single-slot (no tabs) - BrowseDataDrawer: ⌘B-reachable schema browser for non-SQL-Lab pages - AppShell: ⌘B contextually toggles whichever surface fits - Toolbar: new "Browse data" button next to the Inspector toggle - Auto-collapse below 1100px; mobile-friendly overlay below 768px
SchemaExplorer gains an onOpenInNewTab callback. Double-clicking a table-, file-, dir- or sheet-level node now generates a SELECT-statement (with the columns enumerated when cached, * otherwise) and opens it in a fresh editor tab named after the table. - SQL Lab feeds the callback into the existing pendingQueryRef pattern so the new tab gets seeded as soon as it's active - The global Browse Data drawer hands off via React Router state on /query; SqlLabPage picks it up on mount and clears the state so back/refresh doesn't replay - Single-click and drag-to-insert behavior preserved
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
3 participants
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.)