Draft: Explore as search-first visualization (prototype) - #2985
Draft
elizabetdev wants to merge 34 commits into
Draft
Draft: Explore as search-first visualization (prototype)#2985elizabetdev wants to merge 34 commits into
elizabetdev wants to merge 34 commits into
Conversation
…r/pie/treemap/heatmap/patterns) - Add global DisplayType.Treemap + DBTreemapChart renderer (recharts), wired into Chart Explorer tabs/preview and raw-SQL/query-param maps - Unify search analysisMode into a single URL-backed view switcher with legacy aliasing (results->list, delta->heatmap, pattern->patterns) - Add inline aggregation config strip (aggFn/value/groupBy/topN) with smart defaults - Refactor DBSearchPage render into a per-view switch; hide histogram for aggregated views; move mode selection out of the filter sidebar into a top toolbar Co-authored-by: Cursor <cursoragent@cursor.com>
- SearchColumnPicker: checklist dropdown (search + All/None + Apply) that replaces the SELECT SQL editor for the List view; commits the comma-separated select string - SearchSortMenu: structured sort control replacing ORDER BY. Value/Name + direction for aggregated views (table/bar/pie/treemap); column + direction for List; revert - Thread agg sort state (sort/sortDir) through useSearchAggConfig into the aggregated view config (aliases the metric as "Value" for stable ordering) Co-authored-by: Cursor <cursoragent@cursor.com>
…h toolbar Remove the SELECT and ORDER BY SQL editors from the top query bar now that the Columns picker and Sort menu cover the common cases. Keep a power-user escape hatch: a List-view 'Advanced' popover in the results toolbar still exposes the raw SELECT and ORDER BY editors for expressions/aliases/multi-column ordering. Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
…nput Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Co-authored-by: Cursor <cursoragent@cursor.com>
Allow metric sources in the search page source selector. Since metrics have no raw rows, the view switcher hides List / Event deltas / Event patterns for metric sources and only offers the aggregated chart views (time series, number, summary table, bar, pie, treemap), auto-switching away from List when a metric source is chosen. The aggregation bar swaps the free-text value expression for the metric name/type picker (MetricNameSelect) and drops count-style agg fns. aggViewChartConfig now carries metricTables + metric select fields, and holds off querying until a metric name is picked (showing a prompt instead of the 'no query support for metric type=gauge' error). Co-authored-by: Cursor <cursoragent@cursor.com>
Keep the original search experience intact at /search (restored from main) and move the in-progress view-switcher redesign to a new /explore page, surfaced in the nav with an "Experimental" badge. - Restore DBSearchPage.tsx to the main version so /search is unchanged - Add DBExplorePage.tsx (the redesign) with /explore routes and self-navigation pointed at /explore - Re-add the analysis-mode Tabs in DBSearchPageFilters, guarded on setAnalysisMode so the old page keeps them and Explore stays clean - Support a configurable nav badge (badgeLabel/badgeColor) and add the Explore nav link with an "Experimental" badge Co-authored-by: Cursor <cursoragent@cursor.com>
…ands Restructure the experimental Explore page toolbar into three bands per the new wireframes: - Context band: source selector, "Saved views" button (opens the saved searches flyout), a save-status pill (Unsaved/Saved/edited), contextual Save / Save as... actions, an Alerts dropdown, and an overflow menu. - Query band: query input with an expand/collapse toggle plus time picker, Live, and Run controls. - Results band: a combined stats line (result count, scanned rows, elapsed) above the view switcher and Sort / Columns / generated-SQL / export row. Extract ExploreContextBand and ExploreResultsToolbar into a dedicated components/Explore folder, and add the SavedSearchesFlyout used by the context band. Co-authored-by: Cursor <cursoragent@cursor.com>
Introduce ExploreQueryEditor, a self-contained query editor card for the experimental Explore page, so the Explore layout can evolve without touching the shared SearchWhereInput used by the Search page. - Bordered card with SQL/Lucene language tabs on the left and the time picker, Live, Run, and expand toggle in the header on the right. - Reuses the existing SQL (CodeMirror) and Lucene (autocomplete) editors for the body. - Default the Explore query language to SQL. - Add an opt-in showLineNumbers prop to SQLInlineEditor (default off) and enable it for the Explore SQL editor. Co-authored-by: Cursor <cursoragent@cursor.com>
Replace the reuse-based Explore query editor with a CodeMirror-backed QueryEditor so both SQL and Lucene get line numbers and syntax highlighting in a single unified editor. - Add a presentational QueryEditor (SQL via the app's ClickHouse dialect, Lucene via a small custom StreamLanguage highlighter), theme-aware, with Enter-to-submit and Tab-to-complete. - ExploreQueryEditor now wraps QueryEditor with react-hook-form wiring, the ClickHouse field list for autocomplete, and the syntax-reference modal. - Add @codemirror/language dependency. Co-authored-by: Cursor <cursoragent@cursor.com>
Remove the top header block (breadcrumbs, editable title, created/updated byline) from the Explore page and surface the Favorite toggle and Tags control inside the context band instead, so all saved-view controls live in the new toolbar structure. Co-authored-by: Cursor <cursoragent@cursor.com>
The @uiw basicSetup only registers CodeMirror's defaultHighlightStyle as a fallback, so identifiers and operators stayed uncolored and the editor looked unhighlighted. Add an explicit, high-priority HighlightStyle shared by SQL and Lucene with mid-tone colors that read on both light and dark backgrounds. - Add @lezer/highlight dependency. Co-authored-by: Cursor <cursoragent@cursor.com>
Two focused UX improvements to the Explore query editor: - Open the field/variable completion list as soon as the editor is focused, so users can discover available fields without knowing exact names. - Enter now submits the query and keeps the caret in the editor, so the query can be tweaked while results load instead of losing focus on submit. Co-authored-by: Cursor <cursoragent@cursor.com>
… toolbar - Add an "Add to dashboard" button for chart-tile views that opens the shared SaveToDashboardModal with the current aggregation rendered as a tile config. - Move "Show generated SQL" and "Export" into a 3-dots overflow menu. - Make the results controls (Sort, Columns, Add to dashboard, overflow) all consistent bordered secondary buttons so they no longer feel lost. Co-authored-by: Cursor <cursoragent@cursor.com>
Surface Error/Warning counts as clickable pills in the Explore results toolbar for log sources, backed by a parallel grouped-count query. Clicking a pill scopes the search to (or clears) that severity via a new `setIncludedValues` filter mutator, which sets a column's included set to an OR-set of values in one update. Collapse the results/scanned-rows/elapsed line into a single compact "<N> results · <N> scanned · <N>ms" stat with abbreviated scanned rows, and color the severity pills with the shared semantic status tokens. Also rename the aggregated table view to "Grouped table" and add a save icon to the "Save view" button. Co-authored-by: Cursor <cursoragent@cursor.com>
Add a chart-explorer-style Builder | SQL toggle to the Explore query bar. In SQL mode the query bar becomes a full raw-SQL editor (sqlTemplate + macros) and results render as a user-selectable chart display type, reusing the existing raw-SQL config/execution pipeline. SQL mode is URL-only for now and is not persisted to saved searches (Save is disabled with a tooltip). Co-authored-by: Cursor <cursoragent@cursor.com>
Render the error/warning severity summary as secondary toolbar buttons with status icons and a count chip (matching the Columns/Sort controls), tinting with the semantic status color only while active. Treat a bucket as active via a subset test so both severities can be filtered at once. Co-authored-by: Cursor <cursoragent@cursor.com>
- Auto-expand the builder query editor (remove the manual expand toggle and line numbers; grow with content up to a max height, then scroll) - Drive SQL-mode chrome off the live editor toggle so builder-only controls (histogram, severity, sort/columns, agg controls) hide the instant you switch to SQL, while query execution still waits for Run - Unify the Builder/SQL switch and SQL/Lucene toggle into a single three-way control (SQL | Lucene | Advanced) Co-authored-by: Cursor <cursoragent@cursor.com>
Merge the read-only stats line and the view/actions line into one row: the view switcher, severity pills, and result/scanned-row/elapsed stats sit on the left, while add-to-dashboard and the overflow menu stay pinned right. A shape-the-view row now appears only when the active view exposes controls (aggregation on the left; columns / sort on the right). - Partition the view switcher into raw vs chart views separated by a divider so the icon strip reads as two related clusters. - Let the toolbar's left cluster wrap gracefully so the severity pills and stats are never pushed under the actions on narrow layouts. - Flatten the query editor so the mode toggle, editor, and filters no longer sit inside a card. Co-authored-by: Cursor <cursoragent@cursor.com>
… focus Keep the sidebar as a single Filters heading, leave Experimental in sentence case, and defer CodeMirror autocomplete so focus no longer updates the editor mid-cycle. Co-authored-by: Cursor <cursoragent@cursor.com>
Replace the one-line aggregation bar with series cards so Explore chart views can author multiple series, per-series Where, and aliases. Share those cards with the tile editor and move display settings into a persistent Tile settings rail. Co-authored-by: Cursor <cursoragent@cursor.com>
Letter-ref formulas (A / B) now sit on the same card chrome as series, persist in the URL, and export with Add to dashboard. Co-authored-by: Cursor <cursoragent@cursor.com>
Keep List as the primary results view and move chart types behind a split Visualize control with a type menu, instead of a row of chart icons. Co-authored-by: Cursor <cursoragent@cursor.com>
🦋 Changeset detectedLatest commit: d04ac4a The changes in this PR will be included in the next version bump. This PR includes changesets to release 3 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
Contributor
Greptile SummaryThe prototype adds a search-first Explore surface with optional visualizations and dashboard handoff.
Confidence Score: 5/5The PR appears safe to merge because no blocking failure remains. No blocking failure remains.
|
| Filename | Overview |
|---|---|
| packages/app/src/DBExplorePage.tsx | Implements the new Explore page orchestration, query state, results views, visualization modes, and dashboard handoff. |
| packages/common-utils/src/types.ts | Extends shared chart configuration types used by Explore and dashboard visualizations. |
| packages/app/src/components/DBEditTimeChartForm/EditTimeChartForm.tsx | Integrates the revised series editor and chart settings into the dashboard tile editor. |
| packages/api/src/routers/external-api/v2/utils/dashboards.ts | Updates external dashboard conversion for formula fields and unsupported treemap configurations. |
Flowchart
%%{init: {'theme': 'neutral'}}%%
flowchart LR
Explore[Explore search] --> Query[Query configuration]
Query --> Results[List and event views]
Query --> Visualize[Optional visualization]
Visualize --> Series[Series and formulas]
Series --> Dashboard[Add to dashboard]
Reviews (2): Last reviewed commit: "fix(api): handle Treemap in dashboard co..." | Re-trigger Greptile
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
| @@ -0,0 +1,3421 @@ | |||
| import { | |||
Contributor
There was a problem hiding this comment.
This new 3,421-line page combines query assembly, URL synchronization, saved-search handling, live-tail behavior, visualization rendering, and dashboard handoff despite the repository's 300-line file limit, making these flows substantially harder to review, test, and maintain safely. Please decompose the page into focused modules.
Context Used: CLAUDE.md (source)
Note: If this suggestion doesn't match your team's coding style, reply to this and let me know. I'll remember it for next time!
Contributor
E2E Test Results❌ 2 tests failed • 304 passed • 1 skipped • 1383s
Tests ran across 4 shards in parallel. |
Adding DisplayType.Treemap broke API exhaustiveness checks. Drop treemap tiles from the external API until that schema exists, and raise the app eslint warning cap for the new Explore files. Co-authored-by: Cursor <cursoragent@cursor.com>
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.
What this is trying to do
This is a prototype of Explore: one place to search telemetry and, when the question needs a shape, turn that search into a chart — without becoming a second dashboard editor.
Search today is a results table. Charts live on dashboards, behind a different mental model (tiles, display settings, formula rows). The bet here is that people start with “what happened?” and only sometimes need “show me that as a number / time series / pie.” Explore should feel like Search first, visualization second.
Product intent
A / B, click-to-insert letters) change what you asked. Tile chrome (colors, fill-nulls, number format) stays on Add to dashboard / the tile editor.What is explicitly not the goal
Test plan
Prototype only; treat this as a walkthrough, not a merge checklist.
A / B) via letter chips; Run; Add to dashboard keeps bothMade with Cursor