diff --git a/frontend/src/scenes/insights/InsightTooltip/InsightTooltip.tsx b/frontend/src/scenes/insights/InsightTooltip/InsightTooltip.tsx index 93d7fa2653e4d..8025d203d7d5e 100644 --- a/frontend/src/scenes/insights/InsightTooltip/InsightTooltip.tsx +++ b/frontend/src/scenes/insights/InsightTooltip/InsightTooltip.tsx @@ -54,14 +54,12 @@ function renderDatumToTableCell( // Value can be undefined if the datum's series doesn't have ANY value for the breakdown value being rendered return (
- { - color && ( - // eslint-disable-next-line react/forbid-dom-props - - ● - - ) /* eslint-disable-line react/forbid-dom-props */ - } + {color && ( + // eslint-disable-next-line react/forbid-dom-props + + ● + + )} {datumValue !== undefined ? formatAggregationValue(datumMathProperty, datumValue, renderCount, formatPropertyValueForDisplay) : '–'} @@ -156,7 +154,7 @@ export function InsightTooltip({ seriesColumnData?.count, formatPropertyValueForDisplay, renderCount, - seriesColumnData.color + seriesColumnData?.color ) }, }) diff --git a/frontend/src/scenes/insights/InsightTooltip/insightTooltipUtils.tsx b/frontend/src/scenes/insights/InsightTooltip/insightTooltipUtils.tsx index 387a00ad9fd84..6794d6a112827 100644 --- a/frontend/src/scenes/insights/InsightTooltip/insightTooltipUtils.tsx +++ b/frontend/src/scenes/insights/InsightTooltip/insightTooltipUtils.tsx @@ -128,6 +128,9 @@ export function invertDataSource(seriesData: SeriesDatum[]): InvertedSeriesDatum const datumKey = `${s.breakdown_value}-${s.compare_label}` if (datumKey in flattenedData) { flattenedData[datumKey].seriesData.push(s) + flattenedData[datumKey].seriesData = flattenedData[datumKey].seriesData.sort( + (a, b) => (b.action?.order ?? b.dataIndex) - (a.action?.order ?? a.dataIndex) + ) } else { flattenedData[datumKey] = { id: datumKey,