diff --git a/frontend/src/queries/nodes/DataTable/InsightActorsQueryOptions.tsx b/frontend/src/queries/nodes/DataTable/InsightActorsQueryOptions.tsx index baea476ae3f20..a375cb2b44354 100644 --- a/frontend/src/queries/nodes/DataTable/InsightActorsQueryOptions.tsx +++ b/frontend/src/queries/nodes/DataTable/InsightActorsQueryOptions.tsx @@ -21,7 +21,7 @@ export function InsightActorsQueryOptions({ setQuery, query }: InsightActorsQuer return query && insightActorsQueryOptions ? ( <> - {cleanedInsightActorsQueryOptions(insightActorsQueryOptions).map(([key, options]) => ( + {cleanedInsightActorsQueryOptions(insightActorsQueryOptions, query).map(([key, options]) => (
+ cleanedInsightActorsQueryOptions(insightActorsQueryOptions, query).map(([key, options]) => key === 'breakdowns' ? ( options.map(({ values }, index) => (
diff --git a/frontend/src/scenes/trends/persons-modal/persons-modal-utils.tsx b/frontend/src/scenes/trends/persons-modal/persons-modal-utils.tsx index b19bb684257f6..37ba520909133 100644 --- a/frontend/src/scenes/trends/persons-modal/persons-modal-utils.tsx +++ b/frontend/src/scenes/trends/persons-modal/persons-modal-utils.tsx @@ -1,8 +1,10 @@ import { PropertyKeyInfo } from 'lib/components/PropertyKeyInfo' import { TaxonomicFilterGroupType } from 'lib/components/TaxonomicFilter/types' +import { getCoreFilterDefinition } from 'lib/taxonomy' import { pluralize } from 'lib/utils' -import { InsightActorsQueryOptionsResponse } from '~/queries/schema' +import { InsightActorsQuery, InsightActorsQueryOptionsResponse } from '~/queries/schema' +import { isTrendsQuery } from '~/queries/utils' import { StepOrderValue } from '~/types' export const funnelTitle = (props: { @@ -53,9 +55,29 @@ export const pathsTitle = (props: { mode: pathModes; label: string }): React.Rea } export const cleanedInsightActorsQueryOptions = ( - insightActorsQueryOptions: InsightActorsQueryOptionsResponse | null + insightActorsQueryOptions: InsightActorsQueryOptionsResponse | null, + query: InsightActorsQuery ): [string, any[]][] => { - return Object.entries(insightActorsQueryOptions ?? {}).filter(([, value]) => { + const cleanedOptions = Object.entries(insightActorsQueryOptions ?? {}).filter(([, value]) => { return Array.isArray(value) && !!value.length }) + const source = query?.source + const seriesNames = isTrendsQuery(source) ? source.series.map((s: any) => s.custom_name) : [] + const cleanedOptionsWithAdjustedSeriesNames: [string, any[]][] = cleanedOptions.map(([key, value]) => { + if (key === 'series') { + return [ + key, + value.map((v: any, index: number) => ({ + ...v, + label: + seriesNames[index] ?? + getCoreFilterDefinition(v.label, TaxonomicFilterGroupType.Events)?.label ?? + v.label, + })), + ] + } + return [key, value] + }) + + return cleanedOptionsWithAdjustedSeriesNames }