From bbe003dcc2027d66eeae7a8a17cece1ad5d5b20b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Thomas=20Obermu=CC=88ller?= <thomas.obermueller@gmail.com>
Date: Tue, 6 Aug 2024 09:55:43 +0200
Subject: [PATCH] actions

---
 .../data-management/actions/ActionsTable.tsx  | 52 ++++++++-----------
 1 file changed, 22 insertions(+), 30 deletions(-)

diff --git a/frontend/src/scenes/data-management/actions/ActionsTable.tsx b/frontend/src/scenes/data-management/actions/ActionsTable.tsx
index a0164fad09672..9bb24e85a09a6 100644
--- a/frontend/src/scenes/data-management/actions/ActionsTable.tsx
+++ b/frontend/src/scenes/data-management/actions/ActionsTable.tsx
@@ -1,7 +1,6 @@
 import { IconCheckCircle } from '@posthog/icons'
 import { LemonInput, LemonSegmentedButton } from '@posthog/lemon-ui'
 import { useActions, useValues } from 'kea'
-import { combineUrl } from 'kea-router'
 import api from 'lib/api'
 import { ObjectTags } from 'lib/components/ObjectTags/ObjectTags'
 import { ProductIntroduction } from 'lib/components/ProductIntroduction/ProductIntroduction'
@@ -19,15 +18,8 @@ import { actionsLogic } from 'scenes/actions/actionsLogic'
 import { userLogic } from 'scenes/userLogic'
 
 import { actionsModel } from '~/models/actionsModel'
-import {
-    ActionType,
-    AvailableFeature,
-    ChartDisplayType,
-    FilterLogicalOperator,
-    InsightType,
-    ProductKey,
-    ReplayTabs,
-} from '~/types'
+import { InsightVizNode, NodeKind } from '~/queries/schema'
+import { ActionType, AvailableFeature, ChartDisplayType, FilterLogicalOperator, ProductKey, ReplayTabs } from '~/types'
 
 import { NewActionButton } from '../../actions/NewActionButton'
 import { teamLogic } from '../../teamLogic'
@@ -44,6 +36,25 @@ export function ActionsTable(): JSX.Element {
     const { hasAvailableFeature } = useValues(userLogic)
     const { updateHasSeenProductIntroFor } = useActions(userLogic)
 
+    const tryInInsightsUrl = (action: ActionType): string => {
+        const query: InsightVizNode = {
+            kind: NodeKind.InsightVizNode,
+            source: {
+                kind: NodeKind.TrendsQuery,
+                series: [
+                    {
+                        id: action.id,
+                        name: action.name || undefined,
+                        kind: NodeKind.ActionsNode,
+                    },
+                ],
+                interval: 'day',
+                trendsFilter: { display: ChartDisplayType.ActionsLineGraph },
+            },
+        }
+        return urls.insightNew(undefined, undefined, query)
+    }
+
     const columns: LemonTableColumns<ActionType> = [
         {
             title: 'Name',
@@ -183,26 +194,7 @@ export function ActionsTable(): JSX.Element {
                                 >
                                     View recordings
                                 </LemonButton>
-                                <LemonButton
-                                    to={
-                                        combineUrl(
-                                            urls.insightNew({
-                                                insight: InsightType.TRENDS,
-                                                interval: 'day',
-                                                display: ChartDisplayType.ActionsLineGraph,
-                                                actions: [
-                                                    {
-                                                        id: action.id,
-                                                        name: action.name,
-                                                        type: 'actions',
-                                                        order: 0,
-                                                    },
-                                                ],
-                                            })
-                                        ).url
-                                    }
-                                    fullWidth
-                                >
+                                <LemonButton to={tryInInsightsUrl(action)} fullWidth>
                                     Try out in Insights
                                 </LemonButton>
                                 <LemonDivider />