fix(insights): show series custom name in in-chart legend#66203
fix(insights): show series custom name in in-chart legend#66203slshults wants to merge 5 commits into
Conversation
The configurable in-chart (quill) legend rendered each series' raw event or action name, ignoring the user's custom rename. The series label was built via humanizeSeriesLabel(r.label), which knows nothing about action.custom_name. Route the label through a shared resolver (getTrendsSeriesDisplayLabel) that returns the custom name when set, formats breakdown values, and falls back to the humanized event name. Threaded into the trends line, trends bar, and stickiness line/bar transforms via an optional getLabel callback so the MCP path (which lacks the cohort/breakdown deps) is unchanged. Generated-By: PostHog Code Task-Id: 2f37eafc-015c-4936-b6b3-0601f94bd546
|
Reviews (1): Last reviewed commit: "fix(insights): show series custom name i..." | Re-trigger Greptile |
|
Size Change: +392 kB (+0.61%) Total Size: 64.4 MB 📦 View Changed
ℹ️ View Unchanged
|
There was a problem hiding this comment.
Pull request overview
Fixes a regression in the Quill in-chart legend for insights trends/stickiness charts where renamed series (custom names) weren’t reflected in the legend, by introducing a shared label resolver and threading an optional getLabel callback through the relevant chart transforms.
Changes:
- Added
getTrendsSeriesDisplayLabelto resolve series labels with correct precedence (breakdown value first, then custom name, then humanized fallback). - Extended trends/stickiness transform builders to accept an optional
getLabelcallback and used it for main series + moving average labels. - Added a focused unit test suite covering the intended label precedence, including a breakdown regression sentinel.
Reviewed changes
Copilot reviewed 9 out of 9 changed files in this pull request and generated 1 comment.
Show a summary per file
| File | Description |
|---|---|
| products/product_analytics/frontend/insights/trends/TrendsLineChart/TrendsLineChart.tsx | Injects a getLabel callback so the Quill legend uses custom/breakdown-aware series labels. |
| products/product_analytics/frontend/insights/trends/TrendsLineChart/trendsChartTransforms.ts | Adds optional getLabel plumbing and applies it to main series labels + moving average label text. |
| products/product_analytics/frontend/insights/trends/TrendsBarChart/trendsBarChartTransforms.ts | Adds optional getLabel plumbing for bar-series labels. |
| products/product_analytics/frontend/insights/trends/TrendsBarChart/TrendsBarChart.tsx | Wires getTrendsSeriesDisplayLabel into bar chart series labels via getLabel. |
| products/product_analytics/frontend/insights/trends/shared/getTrendsSeriesDisplayLabel.ts | New shared helper implementing correct display-label precedence for trends series. |
| products/product_analytics/frontend/insights/trends/shared/getTrendsSeriesDisplayLabel.test.ts | New parameterized unit tests guarding custom-name + breakdown label precedence. |
| products/product_analytics/frontend/insights/stickiness/StickinessLineChart/StickinessLineChart.tsx | Wires getTrendsSeriesDisplayLabel into stickiness line chart series labels via getLabel. |
| products/product_analytics/frontend/insights/stickiness/StickinessLineChart/stickinessChartTransforms.ts | Adds optional getLabel plumbing for stickiness-series labels. |
| products/product_analytics/frontend/insights/stickiness/StickinessBarChart/StickinessBarChart.tsx | Wires getTrendsSeriesDisplayLabel into stickiness bar chart series labels via getLabel. |
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Addresses Copilot review: FormatPropertyValueForDisplayFunction, BreakdownFilter, and CohortType are used only in type positions. Generated-By: PostHog Code Task-Id: 2f37eafc-015c-4936-b6b3-0601f94bd546
The quill in-chart legend defaulted unset positions to 'bottom', moving every existing insight's legend from its long-standing right-side spot down below the chart the moment the flag turned on. Restore 'right' as the default so legends land where users expect; explicitly chosen positions are unaffected (the fallback only applies when unset). Covers trends line/bar + stickiness (useInsightsLegendConfig), lifecycle + funnel (buildBaseLegendConfig), and the position dropdown's displayed default (LegendOptionsFilter). Generated-By: PostHog Code Task-Id: 2f37eafc-015c-4936-b6b3-0601f94bd546
|
✅ Visual changes approved by steven — baseline updated in 8 changed. |
Follows the default flip from bottom to right in InsightDisplayConfig's position select. Generated-By: PostHog Code Task-Id: 2f37eafc-015c-4936-b6b3-0601f94bd546
|
🎭 Playwright report · View test results → ❌ 1 failed test:
These issues are not necessarily caused by your changes. |
8 updated Run: f9c28345-e92d-41a7-b7d7-062de9bbcac4
Problem
Two regressions from the recently shipped in-chart "quill" legend for insights (behind
product-analytics-quill-legend), both reported the day it went out:bottom, so every existing insight's legend jumped from its long-standing right-side spot down below the chart the moment the flag turned on — across all chart types, account-wide.Changes
Custom names. Root cause: the chart transforms set each series'
labelviahumanizeSeriesLabel(r.label), wherer.labelis the raw backend name. The custom rename lives onr.action.custom_name, which that helper knows nothing about. The correct resolver —getDisplayNameFromEntityFilterfromscenes/insights/utils— is already used everywhere else (the legacy side legend, the bar-aggregated category axis).getTrendsSeriesDisplayLabel— custom name wins, breakdown series format their value viaformatBreakdownLabel, otherwise the humanized event name. The breakdown guard runs first becauseaction(and itscustom_name) is shared across a series' breakdown bands; resolving by action there would collapse every band onto one label.getLabelcallback through the trends line, trends bar, and stickiness line/bar transforms, defaulting to the previoushumanizeSeriesLabel(r.label). The MCP visualizer shares these transforms but lacks the cohort/breakdown deps, so leavinggetLabelunset keeps its output byte-for-byte unchanged.Default position. Flipped the unset-position default from
bottomtorightso legends land where users expect. Explicitly chosen positions are unaffected — the fallback only applies when no position is set, and since the feature shipped the same day almost nobody has deliberately picked one. Covers all chart types: trends line/bar + stickiness (useInsightsLegendConfig), lifecycle + funnel (buildBaseLegendConfig), and the position dropdown's displayed default (LegendOptionsFilter).How did you test this code?
I'm an agent (PostHog Code). Automated:
getTrendsSeriesDisplayLabel.test.ts— covers custom-name precedence, humanized-event fallback, raw action name, formula-row (null action) fallback, and a breakdown-precedence case. The breakdown case is a genuine regression sentinel: it passes only because the breakdown guard runs before the custom-name branch (reorder them and it fails with the custom name).The human driver separately verified in the running app (with the feature flag enabled) that custom names now render correctly in the in-chart legend.
Automatic notifications
🤖 Agent context
Autonomy: Human-driven (agent-assisted) — Steven (@slshults) directed the work and verified the fix in the UI.
Built with PostHog Code (Claude Opus). Investigation fanned out to an exploration subagent to locate the legend-rendering path; the diff was reviewed twice by the
code-revieweragent (both approved). The/writing-testsskill was invoked to gate the new test against the value bar before adding it. Copilot flagged one type-only-import nit, which was addressed.Key decisions: used the
getLabel-callback seam (matching the existing pie-chart pattern) rather than widening the shared transform's looseTrendsResultLike.actiontype or importingscenes/insights/utilsinto the transform — keeps the dependency-heavy label logic at the component layer and leaves the MCP path provably untouched. Scope was deliberately extended from the line chart to all quill-legend chart types since they share the identical root cause. The default-position fix was added to the same PR because it's the same feature's same-day regression.Created with PostHog Code