From bb3f9ff6cb077efad6a03651e414e433cf848b97 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Thomas=20Obermu=CC=88ller?= Date: Sun, 29 Oct 2023 08:12:23 +0100 Subject: [PATCH] replace intervalFilterLogic with insightVizDataLogic --- .../IntervalFilter/IntervalFilter.tsx | 10 ++-- .../IntervalFilter/intervalFilterLogic.ts | 55 ------------------- .../scenes/insights/insightVizDataLogic.ts | 28 ++++++++++ 3 files changed, 33 insertions(+), 60 deletions(-) delete mode 100644 frontend/src/lib/components/IntervalFilter/intervalFilterLogic.ts diff --git a/frontend/src/lib/components/IntervalFilter/IntervalFilter.tsx b/frontend/src/lib/components/IntervalFilter/IntervalFilter.tsx index 2a0b327000aa2..26658b9e79f23 100644 --- a/frontend/src/lib/components/IntervalFilter/IntervalFilter.tsx +++ b/frontend/src/lib/components/IntervalFilter/IntervalFilter.tsx @@ -3,6 +3,8 @@ import { useActions, useValues } from 'kea' import { IntervalType } from '~/types' import { insightLogic } from 'scenes/insights/insightLogic' import { LemonSelect } from '@posthog/lemon-ui' +import { insightVizDataLogic } from 'scenes/insights/insightVizDataLogic' +import { InsightQueryNode } from '~/queries/schema' interface IntervalFilterProps { disabled?: boolean @@ -10,8 +12,8 @@ interface IntervalFilterProps { export function IntervalFilter({ disabled }: IntervalFilterProps): JSX.Element { const { insightProps } = useValues(insightLogic) - const { interval, enabledIntervals } = useValues(intervalFilterLogic(insightProps)) - const { setInterval } = useActions(intervalFilterLogic(insightProps)) + const { interval, enabledIntervals } = useValues(insightVizDataLogic(insightProps)) + const { updateQuerySource } = useActions(insightVizDataLogic(insightProps)) return ( <> @@ -24,9 +26,7 @@ export function IntervalFilter({ disabled }: IntervalFilterProps): JSX.Element { value={interval || 'day'} dropdownMatchSelectWidth={false} onChange={(value) => { - if (value) { - setInterval(String(value) as IntervalType) - } + updateQuerySource({ interval: value } as Partial) }} data-attr="interval-filter" options={Object.entries(enabledIntervals).map(([value, { label, disabledReason }]) => ({ diff --git a/frontend/src/lib/components/IntervalFilter/intervalFilterLogic.ts b/frontend/src/lib/components/IntervalFilter/intervalFilterLogic.ts deleted file mode 100644 index 8c3ed25e72253..0000000000000 --- a/frontend/src/lib/components/IntervalFilter/intervalFilterLogic.ts +++ /dev/null @@ -1,55 +0,0 @@ -import { kea } from 'kea' -import type { intervalFilterLogicType } from './intervalFilterLogicType' -import { IntervalKeyType, Intervals, intervals } from 'lib/components/IntervalFilter/intervals' -import { BaseMathType, InsightLogicProps } from '~/types' -import { keyForInsightLogicProps } from 'scenes/insights/sharedUtils' -import { InsightQueryNode } from '~/queries/schema' -import { insightVizDataLogic } from 'scenes/insights/insightVizDataLogic' - -export const intervalFilterLogic = kea({ - props: {} as InsightLogicProps, - key: keyForInsightLogicProps('new'), - path: (key) => ['lib', 'components', 'IntervalFilter', 'intervalFilterLogic', key], - connect: (props: InsightLogicProps) => ({ - actions: [insightVizDataLogic(props), ['updateQuerySource']], - values: [insightVizDataLogic(props), ['interval', 'querySource', 'activeUsersMath']], - }), - actions: () => ({ - setInterval: (interval: IntervalKeyType) => ({ interval }), - }), - selectors: () => ({ - enabledIntervals: [ - (s) => [s.activeUsersMath], - (activeUsersMath) => { - const enabledIntervals: Intervals = { ...intervals } - - if (activeUsersMath) { - // Disallow grouping by hour for WAUs/MAUs as it's an expensive query that produces a view that's not useful for users - enabledIntervals.hour = { - ...enabledIntervals.hour, - disabledReason: - 'Grouping by hour is not supported on insights with weekly or monthly active users series.', - } - - // Disallow grouping by month for WAUs as the resulting view is misleading to users - if (activeUsersMath === BaseMathType.WeeklyActiveUsers) { - enabledIntervals.month = { - ...enabledIntervals.month, - disabledReason: - 'Grouping by month is not supported on insights with weekly active users series.', - } - } - } - - return enabledIntervals - }, - ], - }), - listeners: ({ values, actions }) => ({ - setInterval: ({ interval }) => { - if (values.interval !== interval) { - actions.updateQuerySource({ interval } as Partial) - } - }, - }), -}) diff --git a/frontend/src/scenes/insights/insightVizDataLogic.ts b/frontend/src/scenes/insights/insightVizDataLogic.ts index b85f0dd12ef16..15c364aa883c8 100644 --- a/frontend/src/scenes/insights/insightVizDataLogic.ts +++ b/frontend/src/scenes/insights/insightVizDataLogic.ts @@ -41,6 +41,7 @@ import { getShowValueOnSeries, } from '~/queries/nodes/InsightViz/utils' import { DISPLAY_TYPES_WITHOUT_LEGEND } from 'lib/components/InsightLegend/utils' +import { intervals } from 'lib/components/IntervalFilter/intervals' import { insightDataLogic, queryFromKind } from 'scenes/insights/insightDataLogic' import { sceneLogic } from 'scenes/sceneLogic' @@ -195,6 +196,33 @@ export const insightVizDataLogic = kea([ (series): BaseMathType.MonthlyActiveUsers | BaseMathType.WeeklyActiveUsers | null => getActiveUsersMath(series), ], + enabledIntervals: [ + (s) => [s.activeUsersMath], + (activeUsersMath) => { + console.debug('enabledIntervals', activeUsersMath) + const enabledIntervals: Intervals = { ...intervals } + + if (activeUsersMath) { + // Disallow grouping by hour for WAUs/MAUs as it's an expensive query that produces a view that's not useful for users + enabledIntervals.hour = { + ...enabledIntervals.hour, + disabledReason: + 'Grouping by hour is not supported on insights with weekly or monthly active users series.', + } + + // Disallow grouping by month for WAUs as the resulting view is misleading to users + if (activeUsersMath === BaseMathType.WeeklyActiveUsers) { + enabledIntervals.month = { + ...enabledIntervals.month, + disabledReason: + 'Grouping by month is not supported on insights with weekly active users series.', + } + } + } + + return enabledIntervals + }, + ], erroredQueryId: [ (s) => [s.insightDataError],