diff --git a/frontend/src/queries/nodes/InsightViz/Breakdown.tsx b/frontend/src/queries/nodes/InsightViz/Breakdown.tsx
index 2ad63cdd1488e..c66ba5e5cd904 100644
--- a/frontend/src/queries/nodes/InsightViz/Breakdown.tsx
+++ b/frontend/src/queries/nodes/InsightViz/Breakdown.tsx
@@ -5,7 +5,9 @@ import { insightVizDataLogic } from 'scenes/insights/insightVizDataLogic'
import { EditorFilterProps } from '~/types'
export function Breakdown({ insightProps }: EditorFilterProps): JSX.Element {
- const { breakdownFilter, display, isTrends } = useValues(insightVizDataLogic(insightProps))
+ const { breakdownFilter, display, isTrends, isSingleSeries, isDataWarehouseSeries } = useValues(
+ insightVizDataLogic(insightProps)
+ )
const { updateBreakdownFilter, updateDisplay } = useActions(insightVizDataLogic(insightProps))
return (
@@ -16,6 +18,11 @@ export function Breakdown({ insightProps }: EditorFilterProps): JSX.Element {
isTrends={isTrends}
updateBreakdownFilter={updateBreakdownFilter}
updateDisplay={updateDisplay}
+ disabledReason={
+ !isSingleSeries && isDataWarehouseSeries
+ ? 'Breakdowns are not allowed for multiple series types'
+ : undefined
+ }
/>
)
}
diff --git a/frontend/src/queries/nodes/InsightViz/PropertyGroupFilters/PropertyGroupFilters.tsx b/frontend/src/queries/nodes/InsightViz/PropertyGroupFilters/PropertyGroupFilters.tsx
index b924ba3232cc9..ffae45880111d 100644
--- a/frontend/src/queries/nodes/InsightViz/PropertyGroupFilters/PropertyGroupFilters.tsx
+++ b/frontend/src/queries/nodes/InsightViz/PropertyGroupFilters/PropertyGroupFilters.tsx
@@ -47,7 +47,9 @@ export function PropertyGroupFilters({
} = useActions(propertyGroupFilterLogic(logicProps))
const showHeader = propertyGroupFilter.type && propertyGroupFilter.values.length > 1
- const disabledReason = isDataWarehouseSeries ? 'Cannot add filter groups to data warehouse series' : undefined
+ const disabledReason = isDataWarehouseSeries
+ ? 'Cannot add filter groups to data warehouse series. Use individual series filters'
+ : undefined
return (
{propertyGroupFilter.values && (
diff --git a/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownButton.tsx b/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownButton.tsx
index 90c3694e89fd8..7b1ddbc90c3a1 100644
--- a/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownButton.tsx
+++ b/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownButton.tsx
@@ -7,7 +7,11 @@ import { useState } from 'react'
import { taxonomicBreakdownFilterLogic } from './taxonomicBreakdownFilterLogic'
import { TaxonomicBreakdownPopover } from './TaxonomicBreakdownPopover'
-export function TaxonomicBreakdownButton(): JSX.Element {
+interface TaxonomicBreakdownButtonProps {
+ disabledReason?: string
+}
+
+export function TaxonomicBreakdownButton({ disabledReason }: TaxonomicBreakdownButtonProps): JSX.Element {
const [open, setOpen] = useState(false)
const { taxonomicBreakdownType } = useValues(taxonomicBreakdownFilterLogic)
@@ -20,6 +24,7 @@ export function TaxonomicBreakdownButton(): JSX.Element {
data-attr="add-breakdown-button"
onClick={() => setOpen(!open)}
sideIcon={null}
+ disabledReason={disabledReason}
>
{taxonomicBreakdownType === TaxonomicFilterGroupType.CohortsWithAllUsers
? 'Add cohort'
diff --git a/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownFilter.tsx b/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownFilter.tsx
index b9f04e806f15b..a6b1b69744db6 100644
--- a/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownFilter.tsx
+++ b/frontend/src/scenes/insights/filters/BreakdownFilter/TaxonomicBreakdownFilter.tsx
@@ -12,6 +12,7 @@ export interface TaxonomicBreakdownFilterProps {
breakdownFilter?: BreakdownFilter | null
display?: ChartDisplayType | null
isTrends: boolean
+ disabledReason?: string
updateBreakdownFilter: (breakdownFilter: BreakdownFilter) => void
updateDisplay: (display: ChartDisplayType | undefined) => void
}
@@ -21,6 +22,7 @@ export function TaxonomicBreakdownFilter({
breakdownFilter,
display,
isTrends,
+ disabledReason,
updateBreakdownFilter,
updateDisplay,
}: TaxonomicBreakdownFilterProps): JSX.Element {
@@ -47,7 +49,7 @@ export function TaxonomicBreakdownFilter({
{tags}
- {!hasNonCohortBreakdown && }
+ {!hasNonCohortBreakdown && }
)