Merge branch 'master' into dw-data-warehouse-experiment-filtering

PostHog · Mar 22, 2024 · 35f90c1 · 35f90c1
2 parents 72e82ea + 5ae6b30
commit 35f90c1
Show file tree

Hide file tree

Showing 44 changed files with 1,026 additions and 338 deletions.
diff --git a/.github/workflows/ci-backend-depot.yml b/.github/workflows/ci-backend-depot.yml
@@ -5,15 +5,7 @@
 name: Backend CI (depot)
 
 on:
-    push:
-        branches:
-            - master
     pull_request:
-    workflow_dispatch:
-        inputs:
-            clickhouseServerVersion:
-                description: ClickHouse server version. Leave blank for default
-                type: string
 
 concurrency:
     group: ${{ github.workflow }}-${{ github.head_ref || github.run_id }}
@@ -41,7 +33,7 @@ jobs:
     changes:
         runs-on: depot-ubuntu-latest-4
         timeout-minutes: 5
-        if: github.repository == 'PostHog/posthog'
+        if: ${{ contains(github.event.pull_request.labels.*.name, 'test-depot') }}
         name: Determine need to run backend checks
         # Set job outputs to values from filter step
         outputs:

diff --git a/.github/workflows/ci-e2e-depot.yml b/.github/workflows/ci-e2e-depot.yml
@@ -16,7 +16,7 @@ jobs:
     changes:
         runs-on: depot-ubuntu-latest-4
         timeout-minutes: 5
-        if: github.repository == 'PostHog/posthog'
+        if: ${{ contains(github.event.pull_request.labels.*.name, 'test-depot') }}
         name: Determine need to run E2E checks
         # Set job outputs to values from filter step
         outputs:

diff --git a/frontend/src/lib/components/DefinitionPopover/DefinitionPopoverContents.tsx b/frontend/src/lib/components/DefinitionPopover/DefinitionPopoverContents.tsx
@@ -111,8 +111,16 @@ function DefinitionView({ group }: { group: TaxonomicFilterGroup }): JSX.Element
     } = useValues(definitionPopoverLogic)
 
     const { setLocalDefinition } = useActions(definitionPopoverLogic)
+    const { selectedItemMeta } = useValues(taxonomicFilterLogic)
     const { selectItem } = useActions(taxonomicFilterLogic)
 
+    // Use effect here to make definition view stateful. TaxonomicFilterLogic won't mount within definitionPopoverLogic
+    useEffect(() => {
+        if (selectedItemMeta && definition.name == selectedItemMeta.id) {
+            setLocalDefinition(selectedItemMeta)
+        }
+    }, [definition])
+
     if (!definition) {
         return <></>
     }
@@ -280,6 +288,7 @@ function DefinitionView({ group }: { group: TaxonomicFilterGroup }): JSX.Element
             value: column.key,
         }))
         const itemValue = localDefinition ? group?.getValue?.(localDefinition) : null
+
         return (
             <form className="definition-popover-data-warehouse-schema-form">
                 <div className="flex flex-col justify-between gap-4">

diff --git a/frontend/src/lib/components/TaxonomicFilter/InfiniteList.tsx b/frontend/src/lib/components/TaxonomicFilter/InfiniteList.tsx
@@ -173,7 +173,6 @@ export function InfiniteList({ popupAnchorElement }: InfiniteListProps): JSX.Ele
     const { mouseInteractionsEnabled, activeTab, searchQuery, value, groupType, eventNames } =
         useValues(taxonomicFilterLogic)
     const { selectItem } = useActions(taxonomicFilterLogic)
-
     const {
         isLoading,
         results,

diff --git a/frontend/src/lib/components/TaxonomicFilter/TaxonomicFilter.tsx b/frontend/src/lib/components/TaxonomicFilter/TaxonomicFilter.tsx
@@ -21,6 +21,7 @@ export function TaxonomicFilter({
     taxonomicFilterLogicKey: taxonomicFilterLogicKeyInput,
     groupType,
     value,
+    filter,
     onChange,
     onClose,
     taxonomicGroupTypes,
@@ -48,6 +49,7 @@ export function TaxonomicFilter({
         taxonomicFilterLogicKey,
         groupType,
         value,
+        filter,
         onChange,
         taxonomicGroupTypes,
         optionsFromProp,

diff --git a/frontend/src/lib/components/TaxonomicFilter/taxonomicFilterLogic.tsx b/frontend/src/lib/components/TaxonomicFilter/taxonomicFilterLogic.tsx
@@ -141,6 +141,7 @@ export const taxonomicFilterLogic = kea<taxonomicFilterLogicType>([
         ],
     })),
     selectors({
+        selectedItemMeta: [() => [(_, props) => props.filter], (filter) => filter],
         taxonomicFilterLogicKey: [
             (_, p) => [p.taxonomicFilterLogicKey],
             (taxonomicFilterLogicKey) => taxonomicFilterLogicKey,
@@ -218,7 +219,7 @@ export const taxonomicFilterLogic = kea<taxonomicFilterLogicType>([
                         logic: dataWarehouseSceneLogic,
                         value: 'externalTables',
                         getName: (table: DataWarehouseTableType) => table.name,
-                        getValue: (table: DataWarehouseTableType) => table.id,
+                        getValue: (table: DataWarehouseTableType) => table.name,
                         getPopoverHeader: () => 'Data Warehouse Table',
                         getIcon: () => <IconServer />,
                     },

diff --git a/frontend/src/lib/components/TaxonomicFilter/types.ts b/frontend/src/lib/components/TaxonomicFilter/types.ts
@@ -1,6 +1,7 @@
 import Fuse from 'fuse.js'
 import { BuiltLogic, LogicWrapper } from 'kea'
 import { DataWarehouseTableType } from 'scenes/data-warehouse/types'
+import { LocalFilter } from 'scenes/insights/filters/ActionFilter/entityFilterLogic'
 
 import { AnyDataNode, DatabaseSchemaQueryResponseField } from '~/queries/schema'
 import {
@@ -22,6 +23,7 @@ export interface TaxonomicFilterProps {
     value?: TaxonomicFilterValue
     onChange?: (group: TaxonomicFilterGroup, value: TaxonomicFilterValue, item: any) => void
     onClose?: () => void
+    filter?: LocalFilter
     taxonomicGroupTypes: TaxonomicFilterGroupType[]
     taxonomicFilterLogicKey?: string
     optionsFromProp?: Partial<Record<TaxonomicFilterGroupType, SimpleOption[]>>

diff --git a/frontend/src/lib/components/TaxonomicPopover/TaxonomicPopover.tsx b/frontend/src/lib/components/TaxonomicPopover/TaxonomicPopover.tsx
@@ -4,6 +4,7 @@ import { TaxonomicFilterGroupType, TaxonomicFilterValue } from 'lib/components/T
 import { LemonButton, LemonButtonProps } from 'lib/lemon-ui/LemonButton'
 import { LemonDropdown } from 'lib/lemon-ui/LemonDropdown'
 import { useEffect, useState } from 'react'
+import { LocalFilter } from 'scenes/insights/filters/ActionFilter/entityFilterLogic'
 
 import { AnyDataNode, DatabaseSchemaQueryResponseField } from '~/queries/schema'
 
@@ -13,6 +14,7 @@ export interface TaxonomicPopoverProps<ValueType extends TaxonomicFilterValue =
     value?: ValueType
     onChange: (value: ValueType, groupType: TaxonomicFilterGroupType, item: any) => void
 
+    filter?: LocalFilter
     groupTypes?: TaxonomicFilterGroupType[]
     renderValue?: (value: ValueType) => JSX.Element | null
     eventNames?: string[]
@@ -41,6 +43,7 @@ export function TaxonomicStringPopover(props: TaxonomicPopoverProps<string>): JS
 export function TaxonomicPopover<ValueType extends TaxonomicFilterValue = TaxonomicFilterValue>({
     groupType,
     value,
+    filter,
     onChange,
     renderValue,
     groupTypes,
@@ -81,6 +84,7 @@ export function TaxonomicPopover<ValueType extends TaxonomicFilterValue = Taxono
                 <TaxonomicFilter
                     groupType={groupType}
                     value={value}
+                    filter={filter}
                     onChange={({ type }, payload, item) => {
                         onChange?.(payload as ValueType, type, item)
                         setVisible(false)

diff --git a/frontend/src/queries/query.ts b/frontend/src/queries/query.ts
@@ -220,7 +220,13 @@ export async function query<N extends DataNode = DataNode>(
                 (hogQLInsightsFunnelsFlagEnabled && isFunnelsQuery(queryNode))
             ) {
                 if (hogQLInsightsLiveCompareEnabled) {
-                    const legacyFunction = legacyUrl ? fetchLegacyUrl : fetchLegacyInsights
+                    const legacyFunction = (): any => {
+                        try {
+                            return legacyUrl ? fetchLegacyUrl : fetchLegacyInsights
+                        } catch (e) {
+                            console.error('Error fetching legacy insights', e)
+                        }
+                    }
                     let legacyResponse: any
                     ;[response, legacyResponse] = await Promise.all([
                         executeQuery(queryNode, methodOptions, refresh, queryId),

diff --git a/frontend/src/scenes/batch_exports/BatchExportEditForm.tsx b/frontend/src/scenes/batch_exports/BatchExportEditForm.tsx
@@ -375,17 +375,21 @@ export function BatchExportsEditFields({
                         </LemonField>
 
                         <LemonField name="has_self_signed_cert">
-                            <LemonCheckbox
-                                bordered
-                                label={
-                                    <span className="flex items-center gap-2">
-                                        Does your Postgres instance have a self-signed SSL certificate?
-                                        <Tooltip title="In most cases, Heroku and RDS users should check this.">
-                                            <IconInfo className=" text-lg text-muted-alt" />
-                                        </Tooltip>
-                                    </span>
-                                }
-                            />
+                            {({ value, onChange }) => (
+                                <LemonCheckbox
+                                    bordered
+                                    label={
+                                        <span className="flex items-center gap-2">
+                                            Does your Postgres instance have a self-signed SSL certificate?
+                                            <Tooltip title="In most cases, Heroku and RDS users should check this.">
+                                                <IconInfo className=" text-lg text-muted-alt" />
+                                            </Tooltip>
+                                        </span>
+                                    }
+                                    checked={!!value}
+                                    onChange={onChange}
+                                />
+                            )}
                         </LemonField>
 
                         <LemonField name="exclude_events" label="Events to exclude" className="flex-1">

diff --git a/frontend/src/scenes/data-warehouse/ViewLinkModal.tsx b/frontend/src/scenes/data-warehouse/ViewLinkModal.tsx
@@ -1,6 +1,6 @@
 import './ViewLinkModal.scss'
 
-import { IconTrash } from '@posthog/icons'
+import { IconCollapse, IconExpand, IconTrash } from '@posthog/icons'
 import {
     LemonButton,
     LemonDivider,
@@ -35,7 +35,7 @@ export function ViewLinkModal(): JSX.Element {
             }
             isOpen={isJoinTableModalOpen}
             onClose={toggleJoinTableModal}
-            width={600}
+            width={700}
         >
             <ViewLinkForm />
         </LemonModal>
@@ -57,6 +57,7 @@ export function ViewLinkForm(): JSX.Element {
         selectedJoiningKey,
         sourceIsUsingHogQLExpression,
         joiningIsUsingHogQLExpression,
+        isViewLinkSubmitting,
     } = useValues(viewLinkLogic)
     const {
         selectJoiningTable,
@@ -66,12 +67,13 @@ export function ViewLinkForm(): JSX.Element {
         selectSourceKey,
         selectJoiningKey,
     } = useActions(viewLinkLogic)
+    const [advancedSettingsExpanded, setAdvancedSettingsExpanded] = useState(false)
 
     return (
         <Form logic={viewLinkLogic} formKey="viewLink" enableFormOnSubmit>
             <div className="flex flex-col w-full justify-between items-center">
                 <div className="flex flex-row w-full justify-between">
-                    <div className={isNewJoin ? 'w-50' : 'flex flex-col'}>
+                    <div className={isNewJoin ? 'w-60' : 'flex flex-col'}>
                         <span className="l4">Source Table</span>
                         {isNewJoin ? (
                             <Field name="source_table_name">
@@ -86,7 +88,7 @@ export function ViewLinkForm(): JSX.Element {
                             selectedSourceTableName ?? ''
                         )}
                     </div>
-                    <div className="w-50">
+                    <div className="w-60">
                         <span className="l4">Joining Table</span>
                         <Field name="joining_table_name">
                             <LemonSelect
@@ -98,8 +100,8 @@ export function ViewLinkForm(): JSX.Element {
                         </Field>
                     </div>
                 </div>
-                <div className="mt-3 flex flex-row justify-between items-center w-full">
-                    <div className="w-50">
+                <div className="mt-4 flex flex-row justify-between items-center w-full">
+                    <div className="w-60">
                         <span className="l4">Source Table Key</span>
                         <Field name="source_table_key">
                             <>
@@ -124,7 +126,7 @@ export function ViewLinkForm(): JSX.Element {
                     <div className="mt-5">
                         <IconSwapHoriz />
                     </div>
-                    <div className="w-50">
+                    <div className="w-60">
                         <span className="l4">Joining Table Key</span>
                         <Field name="joining_table_key">
                             <>
@@ -148,8 +150,22 @@ export function ViewLinkForm(): JSX.Element {
                     </div>
                 </div>
                 {sqlCodeSnippet && (
-                    <>
+                    <div className="w-full mt-2">
                         <LemonDivider className="mt-4 mb-4" />
+                        <LemonButton
+                            fullWidth
+                            onClick={() => setAdvancedSettingsExpanded(!advancedSettingsExpanded)}
+                            sideIcon={advancedSettingsExpanded ? <IconCollapse /> : <IconExpand />}
+                        >
+                            <div>
+                                <h3 className="l4 mt-2">Advanced settings</h3>
+                                <div className="text-muted mb-2 font-medium">Customize how the fields are accessed</div>
+                            </div>
+                        </LemonButton>
+                    </div>
+                )}
+                {sqlCodeSnippet && advancedSettingsExpanded && (
+                    <>
                         <div className="mt-3 flex flex-row justify-between items-center w-full">
                             <div className="w-full">
                                 <span className="l4">Field Name</span>
@@ -185,7 +201,7 @@ export function ViewLinkForm(): JSX.Element {
                 <LemonButton className="mr-3" type="secondary" onClick={toggleJoinTableModal}>
                     Close
                 </LemonButton>
-                <LemonButton type="primary" htmlType="submit">
+                <LemonButton type="primary" htmlType="submit" loading={isViewLinkSubmitting}>
                     Save
                 </LemonButton>
             </div>

diff --git a/frontend/src/scenes/insights/filters/ActionFilter/ActionFilterRow/ActionFilterRow.tsx b/frontend/src/scenes/insights/filters/ActionFilter/ActionFilterRow/ActionFilterRow.tsx
@@ -228,6 +228,7 @@ export function ActionFilterRow({
             fullWidth
             groupType={filter.type as TaxonomicFilterGroupType}
             value={getValue(value, filter)}
+            filter={filter}
             onChange={(changedValue, taxonomicGroupType, item) => {
                 const groupType = taxonomicFilterGroupTypeToEntityType(taxonomicGroupType)
                 if (groupType === EntityTypes.DATA_WAREHOUSE) {

diff --git a/frontend/src/scenes/insights/views/InsightsTable/InsightsTable.tsx b/frontend/src/scenes/insights/views/InsightsTable/InsightsTable.tsx
@@ -3,6 +3,7 @@ import './InsightsTable.scss'
 import { useActions, useValues } from 'kea'
 import { getSeriesColor } from 'lib/colors'
 import { LemonTable, LemonTableColumn } from 'lib/lemon-ui/LemonTable'
+import { compare as compareFn } from 'natural-orderby'
 import { insightLogic } from 'scenes/insights/insightLogic'
 import { insightSceneLogic } from 'scenes/insights/insightSceneLogic'
 import { isTrendsFilter } from 'scenes/insights/sharedUtils'
@@ -157,7 +158,7 @@ export function InsightsTable({
                 }
                 const labelA = formatItemBreakdownLabel(a)
                 const labelB = formatItemBreakdownLabel(b)
-                return labelA.localeCompare(labelB)
+                return compareFn()(labelA, labelB)
             },
         })
         if (isTrends && display === ChartDisplayType.WorldMap) {

diff --git a/mypy-baseline.txt b/mypy-baseline.txt
@@ -346,20 +346,12 @@ posthog/hogql_queries/sessions_timeline_query_runner.py:0: error: Statement is u
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_histogram_bin_count"  [union-attr]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown"  [union-attr]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Argument 1 to "parse_expr" has incompatible type "str | float | list[str | float] | Any | None"; expected "str"  [arg-type]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown"  [union-attr]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Argument 1 to "parse_expr" has incompatible type "str | float | list[str | float] | Any | None"; expected "str"  [arg-type]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Statement is unreachable  [unreachable]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Argument "exprs" to "Or" has incompatible type "list[CompareOperation]"; expected "list[Expr]"  [arg-type]
 posthog/hogql_queries/insights/trends/breakdown.py:0: note: "List" is invariant -- see https://mypy.readthedocs.io/en/stable/common_issues.html#variance
 posthog/hogql_queries/insights/trends/breakdown.py:0: note: Consider using "Sequence" instead, which is covariant
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Incompatible types in assignment (expression has type "float", variable has type "int")  [assignment]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Incompatible types in assignment (expression has type "float", variable has type "int")  [assignment]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Incompatible types in assignment (expression has type "str", variable has type "int")  [assignment]
-posthog/hogql_queries/insights/trends/breakdown.py:0: error: Incompatible types in assignment (expression has type "str", variable has type "int")  [assignment]
+posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
+posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown"  [union-attr]
+posthog/hogql_queries/insights/trends/breakdown.py:0: error: Argument 1 to "parse_expr" has incompatible type "str | float | list[str | float] | Any | None"; expected "str"  [arg-type]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown_type"  [union-attr]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Item "None" of "BreakdownFilter | None" has no attribute "breakdown"  [union-attr]
 posthog/hogql_queries/insights/trends/breakdown.py:0: error: Argument "breakdown_field" to "get_properties_chain" has incompatible type "str | float | list[str | float] | Any | None"; expected "str"  [arg-type]

diff --git a/package.json b/package.json
@@ -140,6 +140,7 @@
         "maplibre-gl": "^3.5.1",
         "md5": "^2.3.0",
         "monaco-editor": "^0.39.0",
+        "natural-orderby": "^3.0.2",
         "papaparse": "^5.4.1",
         "pmtiles": "^2.11.0",
         "postcss": "^8.4.31",

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml