Skip to content

Commit

Permalink
wip
Browse files Browse the repository at this point in the history
  • Loading branch information
@jurajmajerik
jurajmajerik committed Dec 26, 2024
1 parent a9706de commit a15cd8d
Show file tree
Hide file tree
Showing 9 changed files with 128 additions and 118 deletions.
4 changes: 4 additions & 0 deletions frontend/src/scenes/experiments/Experiments.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,7 @@ import { Experiment, ExperimentsTabs, ProductKey, ProgressStatus } from '~/types
import { experimentsLogic, getExperimentStatus } from './experimentsLogic'
import { StatusTag } from './ExperimentView/components'
import { Holdouts } from './Holdouts'
import { SavedMetrics } from './SavedMetrics/SavedMetrics'

export const scene: SceneExport = {
component: Experiments,
Expand Down Expand Up @@ -211,11 +212,14 @@ export function Experiments(): JSX.Element {
{ key: ExperimentsTabs.Yours, label: 'Your experiments' },
{ key: ExperimentsTabs.Archived, label: 'Archived experiments' },
{ key: ExperimentsTabs.Holdouts, label: 'Holdout groups' },
{ key: ExperimentsTabs.SavedMetrics, label: 'Saved metrics' },
]}
/>

{tab === ExperimentsTabs.Holdouts ? (
<Holdouts />
) : tab === ExperimentsTabs.SavedMetrics ? (
<SavedMetrics />
) : (
<>
{tab === ExperimentsTabs.Archived ? (
Expand Down
63 changes: 35 additions & 28 deletions frontend/src/scenes/experiments/SavedMetrics/SavedFunnelsMetricForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,17 +3,14 @@ import { LemonInput } from '@posthog/lemon-ui'
import { useActions, useValues } from 'kea'
import { TaxonomicFilterGroupType } from 'lib/components/TaxonomicFilter/types'
import { TestAccountFilterSwitch } from 'lib/components/TestAccountFiltersSwitch'
import { EXPERIMENT_DEFAULT_DURATION } from 'lib/constants'
import { LemonBanner } from 'lib/lemon-ui/LemonBanner'
import { ActionFilter } from 'scenes/insights/filters/ActionFilter/ActionFilter'
import { MathAvailability } from 'scenes/insights/filters/ActionFilter/ActionFilterRow/ActionFilterRow'
import { getHogQLValue } from 'scenes/insights/filters/AggregationSelect'
import { teamLogic } from 'scenes/teamLogic'

import { actionsAndEventsToSeries } from '~/queries/nodes/InsightQuery/utils/filtersToQueryNode'
import { queryNodeToFilter } from '~/queries/nodes/InsightQuery/utils/queryNodeToFilter'
import { Query } from '~/queries/Query/Query'
import { ExperimentFunnelsQuery, NodeKind } from '~/queries/schema'
import { ExperimentFunnelsQuery } from '~/queries/schema'
import { BreakdownAttributionType, FilterType } from '~/types'

import {
Expand All @@ -36,6 +33,12 @@ export function SavedFunnelsMetricForm(): JSX.Element {
actionsTaxonomicGroupTypes: [TaxonomicFilterGroupType.Events, TaxonomicFilterGroupType.Actions],
}

if (!savedMetric?.query) {
return <></>
}

const savedMetricQuery = savedMetric.query as ExperimentFunnelsQuery

return (
<>
<div className="mb-4">
Expand All @@ -52,18 +55,22 @@ export function SavedFunnelsMetricForm(): JSX.Element {
</div>
<ActionFilter
bordered
filters={queryNodeToFilter(savedMetric.query.funnels_query)}
filters={queryNodeToFilter(savedMetricQuery.funnels_query)}
setFilters={({ actions, events, data_warehouse }: Partial<FilterType>): void => {
if (!savedMetric?.query) {
return
}

const series = actionsAndEventsToSeries(
{ actions, events, data_warehouse } as any,
true,
MathAvailability.None
)
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
series,
},
},
Expand All @@ -81,33 +88,33 @@ export function SavedFunnelsMetricForm(): JSX.Element {
<div className="mt-4 space-y-4">
<FunnelAggregationSelect
value={getHogQLValue(
savedMetric.query.funnels_query.aggregation_group_type_index ?? undefined,
savedMetric.query.funnels_query.funnelsFilter?.funnelAggregateByHogQL ?? undefined
savedMetricQuery.funnels_query.aggregation_group_type_index ?? undefined,
savedMetricQuery.funnels_query.funnelsFilter?.funnelAggregateByHogQL ?? undefined
)}
onChange={(value) => {
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
aggregation_group_type_index: value,
},
},
})
}}
/>
<FunnelConversionWindowFilter
funnelWindowInterval={savedMetric.query.funnels_query?.funnelsFilter?.funnelWindowInterval}
funnelWindowIntervalUnit={savedMetric.query.funnels_query?.funnelsFilter?.funnelWindowIntervalUnit}
funnelWindowInterval={savedMetricQuery.funnels_query?.funnelsFilter?.funnelWindowInterval}
funnelWindowIntervalUnit={savedMetricQuery.funnels_query?.funnelsFilter?.funnelWindowIntervalUnit}
onFunnelWindowIntervalChange={(funnelWindowInterval) => {
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
// funnelWindowInterval: funnelWindowInterval,
funnelsFilter: {
...savedMetric.query.funnels_query.funnelsFilter,
...savedMetricQuery.funnels_query.funnelsFilter,
funnelWindowInterval: funnelWindowInterval,
},
},
Expand All @@ -117,11 +124,11 @@ export function SavedFunnelsMetricForm(): JSX.Element {
onFunnelWindowIntervalUnitChange={(funnelWindowIntervalUnit) => {
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
funnelsFilter: {
...savedMetric.query.funnels_query.funnelsFilter,
...savedMetricQuery.funnels_query.funnelsFilter,
funnelWindowIntervalUnit: funnelWindowIntervalUnit || undefined,
},
},
Expand All @@ -132,9 +139,9 @@ export function SavedFunnelsMetricForm(): JSX.Element {
<FunnelAttributionSelect
value={(() => {
const breakdownAttributionType =
savedMetric.query.funnels_query?.funnelsFilter?.breakdownAttributionType
savedMetricQuery.funnels_query?.funnelsFilter?.breakdownAttributionType
const breakdownAttributionValue =
savedMetric.query.funnels_query?.funnelsFilter?.breakdownAttributionValue
savedMetricQuery.funnels_query?.funnelsFilter?.breakdownAttributionValue

const currentValue: BreakdownAttributionType | `${BreakdownAttributionType.Step}/${number}` =
!breakdownAttributionType
Expand All @@ -149,11 +156,11 @@ export function SavedFunnelsMetricForm(): JSX.Element {
const [breakdownAttributionType, breakdownAttributionValue] = (value || '').split('/')
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
funnelsFilter: {
...savedMetric.query.funnels_query.funnelsFilter,
...savedMetricQuery.funnels_query.funnelsFilter,
breakdownAttributionType: breakdownAttributionType as BreakdownAttributionType,
breakdownAttributionValue: breakdownAttributionValue
? parseInt(breakdownAttributionValue)
Expand All @@ -163,19 +170,19 @@ export function SavedFunnelsMetricForm(): JSX.Element {
},
})
}}
stepsLength={savedMetric.query.funnels_query?.series?.length}
stepsLength={savedMetricQuery.funnels_query?.series?.length}
/>
<TestAccountFilterSwitch
checked={(() => {
const val = savedMetric.query.funnels_query?.filterTestAccounts
const val = savedMetricQuery.funnels_query?.filterTestAccounts
return hasFilters ? !!val : false
})()}
onChange={(checked: boolean) => {
setSavedMetric({
query: {
...savedMetric.query,
...savedMetricQuery,
funnels_query: {
...savedMetric.query.funnels_query,
...savedMetricQuery.funnels_query,
filterTestAccounts: checked,
},
},
Expand Down
9 changes: 5 additions & 4 deletions frontend/src/scenes/experiments/SavedMetrics/SavedMetric.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,12 +1,13 @@
import { IconCheckCircle } from '@posthog/icons'
import { LemonButton } from '@posthog/lemon-ui'
import { useActions, useValues } from 'kea'
import { useState } from 'react'
import { SceneExport } from 'scenes/sceneTypes'

import { getDefaultFunnelsMetric, getDefaultTrendsMetric } from '../experimentLogic'
import { SavedFunnelsMetricForm } from './SavedFunnelsMetricForm'
import { savedMetricLogic } from './savedMetricLogic'
import { SavedTrendsMetricForm } from './SavedTrendsMetricForm'
import { SavedFunnelsMetricForm } from './SavedFunnelsMetricForm'
import { getDefaultTrendsMetric, getDefaultFunnelsMetric } from '../experimentLogic'
import { LemonButton } from '@posthog/lemon-ui'
import { SceneExport } from 'kea'

type MetricType = 'trends' | 'funnels'

Expand Down
27 changes: 5 additions & 22 deletions frontend/src/scenes/experiments/SavedMetrics/SavedMetrics.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,28 +1,11 @@
import { IconPencil, IconTrash } from '@posthog/icons'
import {
LemonBanner,
LemonButton,
LemonDialog,
LemonDivider,
LemonInput,
LemonLabel,
LemonModal,
LemonTable,
LemonTableColumns,
Link,
} from '@posthog/lemon-ui'
import { useActions, useValues } from 'kea'
import { LemonSlider } from 'lib/lemon-ui/LemonSlider'
import { useState } from 'react'

import { Holdout, holdoutsLogic, NEW_HOLDOUT } from '../holdoutsLogic'
import { LemonButton, LemonTable, LemonTableColumns } from '@posthog/lemon-ui'
import { useValues } from 'kea'
import { router } from 'kea-router'
import { SceneExport } from 'scenes/sceneTypes'
import { experimentsLogic } from '../experimentsLogic'
import { urls } from 'scenes/urls'
import { PageHeader } from 'lib/components/PageHeader'
import { SavedMetricLogicProps, savedMetricsLogic } from './savedMetricsLogic'

import { SavedMetric } from './savedMetricLogic'
import { router } from 'kea-router'
import { savedMetricsLogic } from './savedMetricsLogic'

export const scene: SceneExport = {
component: SavedMetrics,
Expand Down
Loading

0 comments on commit a15cd8d

Please sign in to comment.