feat(app): show RED metrics on the trace search results view - #2826
Draft
alex-fedotyev wants to merge 4 commits into
Draft
feat(app): show RED metrics on the trace search results view#2826alex-fedotyev wants to merge 4 commits into
alex-fedotyev wants to merge 4 commits into
Conversation
For a trace source in results mode, replace the single count histogram above the results table with a Throughput / Errors / Duration trio: - Throughput counts spans, Errors toggles between rate (avg of the error boolean, as a percent) and volume (countIf error), and Duration shows Avg / p95 / p99 over the source's millisecond duration expression. - The three charts are DBTimeCharts under a shared sync scope, so hovering one shows a synced cursor on all three, and each is a dashboard-tile card. - A RED/Heatmap switch in the search stats row flips the area to the same duration heatmap tile the dashboard renders. Each chart is built from the same base config the histogram uses, so they honor the active WHERE filter and time range. Logs and session sources are unchanged. The aggregation builders live in a pure module with unit tests. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
🦋 Changeset detectedLatest commit: 575ea72 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 PR replaces the trace-search histogram with synchronized throughput, error, and duration charts, while retaining the existing histogram for other source types.
Confidence Score: 5/5The PR appears safe to merge. No blocking failure remains; the prior count-based error aggregation issue is fixed by aggregating total and error counts separately and deriving the displayed ratio from those bucket-level aliases.
|
| Filename | Overview |
|---|---|
| packages/app/src/DBSearchPage.tsx | Selects the RED or duration-heatmap presentation for eligible trace sources while retaining the existing histogram fallback. |
| packages/app/src/components/Search/TraceRedMetricsChart.tsx | Composes synchronized RED charts, display controls, duration formatting, and the heatmap alternative. |
| packages/app/src/components/Search/traceRedMetrics.ts | Builds throughput, error, and duration configurations using raw MV-compatible aggregations and a computed error-rate column. |
| packages/app/src/components/DBTimeChart.tsx | Forwards compact x-axis and capped y-axis options to the shared chart renderer. |
| packages/app/src/HDXMultiSeriesTimeChart.tsx | Implements edge-anchored compact ticks and capped auto-scaling for narrow percentage charts. |
| packages/app/src/components/Search/tests/traceRedMetrics.test.ts | Covers the RED aggregation builders, including the count-based error-rate fix and raw-duration aggregation. |
Reviews (4): Last reviewed commit: "fix(app): cap RED error-rate y-axis at 1..." | Re-trigger Greptile
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
Contributor
E2E Test Results✅ All tests passed • 205 passed • 1 skipped • 804s
Tests ran across 3 shards in parallel. |
Address review feedback on the aggregation forms: - Error rate now aggregates count() and countIf(error) separately and divides them in a post-aggregation column (the two counts hidden via hiddenSeries), instead of avg() over a status boolean. This lets AggregatingMergeTree materialized views satisfy the query. - Duration aggregates the raw Duration column and converts the unit at display via getTraceDurationNumberFormat (from the source's durationPrecision), instead of dividing to milliseconds in SQL. Same values, adaptive units, and MV-friendly. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- Error rate guards the empty-bucket 0/0 (which became NaN and blew up the auto-scaled y-axis, showing up to 400% even with no errors) and caps at 100%. It also reads with one decimal so sub-1% rates are not all '0%'. - Add an opt-in compactXAxisLabels to DBTimeChart / HDXMultiSeriesTimeChart that anchors the first and last x-axis labels inward, so the edge time labels are not clipped on the narrow side-by-side RED tiles. Default off, so every other chart is unchanged. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
- The error-rate data is already bounded to [0,1], but recharts' default auto-domain turns a flat/zero series into a nonsense 0-400% scale. Add an opt-in yAxisMaxDomain to DBTimeChart / HDXMultiSeriesTimeChart that caps the upper bound (1 = 100%) while still auto-scaling to smaller values, and use it on the rate chart. A no-error range now shows 0-100%; a ~5% range still zooms to ~5%. - Nudge the compact x-axis tick offset up so labels sit closer to the axis (extra gap crept in with the edge-anchor change). Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
alex-fedotyev
marked this pull request as ready for review
August 6, 2026 16:15
alex-fedotyev
marked this pull request as draft
August 6, 2026 17:08
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.
Summary
Trace search shows a single count histogram above the results. For trace sources in results mode, this replaces it with RED metrics:
countIf(error) / count(), rendered as a percent line) and volume (countIf(error), bars).Every aggregation is over a raw column (
count,countIf,quantile/avgof the duration expression), so AggregatingMergeTree materialized views can satisfy the queries; ratio and unit conversion happen at the display layer or in a post-aggregation column.The three charts are
DBTimeCharts under a shared sync scope, so hovering one shows a synced cursor on all three at the same timestamp, and each renders as a dashboard-tile card. A RED/Heatmap switch in the search stats row flips the area to the same duration heatmap tile the dashboard renders.Each chart is built from the same base config the histogram uses (in a small pure module,
traceRedMetrics.ts), so they honor the active WHERE filter and selected time range. Logs and session sources keep the existing histogram.This reuses existing building blocks (
DBTimeChart,SegmentedControl, the chart-sync context,DBHeatmapChart+toHeatmapChartConfig, and the tile card header); no new chart or control primitives.Screenshots
Verified in both light and dark themes.
Test plan
traceRedMetrics.test.ts); those plus the existingDBSearchPagesuites pass underjest.tsc --noEmitandeslintare clean.DBTimeChart.Notes
minorchangeset.