fix(notebooks): bind logic for hogql insights (#25623)

PostHog · Oct 17, 2024 · cb1b316 · cb1b316
1 parent b3b38cd
commit cb1b316
Show file tree

Hide file tree

Showing 2 changed files with 39 additions and 17 deletions.
diff --git a/cypress/e2e/notebooks-insights.ts b/cypress/e2e/notebooks-insights.ts
@@ -0,0 +1,18 @@
+import { insight, savedInsights } from '../productAnalytics'
+
+describe('Notebooks', () => {
+    beforeEach(() => {
+        cy.clickNavMenu('notebooks')
+        cy.location('pathname').should('include', '/notebooks')
+    })
+    ;['SQL', 'TRENDS', 'FUNNELS', 'RETENTION', 'PATHS', 'STICKINESS', 'LIFECYCLE'].forEach((insightType) => {
+        it(`Can add a ${insightType} insight`, () => {
+            savedInsights.createNewInsightOfType(insightType)
+            insight.editName(`${insightType} Insight`)
+            insight.save()
+            cy.get('[data-attr="notebooks-add-button"]').click()
+            cy.get('[data-attr="notebooks-select-button-create"]').click()
+            cy.get('.ErrorBoundary').should('not.exist')
+        })
+    })
+})
diff --git a/frontend/src/scenes/notebooks/Nodes/NotebookNodeQuery.tsx b/frontend/src/scenes/notebooks/Nodes/NotebookNodeQuery.tsx
@@ -2,7 +2,7 @@ import { Query } from '~/queries/Query/Query'
 import { DataTableNode, InsightQueryNode, InsightVizNode, NodeKind, QuerySchema } from '~/queries/schema'
 import { createPostHogWidgetNode } from 'scenes/notebooks/Nodes/NodeWrapper'
 import { InsightLogicProps, InsightShortId, NotebookNodeType } from '~/types'
-import { useActions, useMountedLogic, useValues } from 'kea'
+import { BindLogic, useActions, useMountedLogic, useValues } from 'kea'
 import { useEffect, useMemo } from 'react'
 import { notebookNodeLogic } from './notebookNodeLogic'
 import { NotebookNodeProps, NotebookNodeAttributeProperties } from '../Notebook/utils'
@@ -35,9 +35,11 @@ const Component = ({
     const { expanded } = useValues(nodeLogic)
     const { setTitlePlaceholder } = useActions(nodeLogic)
     const summarizeInsight = useSummarizeInsight()
-    const { insightName } = useValues(
-        insightLogic({ dashboardItemId: query.kind === NodeKind.SavedInsightNode ? query.shortId : 'new' })
-    )
+
+    const insightLogicProps = {
+        dashboardItemId: query.kind === NodeKind.SavedInsightNode ? query.shortId : ('new' as const),
+    }
+    const { insightName } = useValues(insightLogic(insightLogicProps))
 
     useEffect(() => {
         let title = 'Query'
@@ -96,19 +98,21 @@ const Component = ({
 
     return (
         <div className="flex flex-1 flex-col h-full">
-            <Query
-                // use separate keys for the settings and visualization to avoid conflicts with insightProps
-                uniqueKey={nodeId + '-component'}
-                query={modifiedQuery}
-                setQuery={(t) => {
-                    updateAttributes({
-                        query: {
-                            ...attributes.query,
-                            source: (t as DataTableNode | InsightVizNode).source,
-                        } as QuerySchema,
-                    })
-                }}
-            />
+            <BindLogic logic={insightLogic} props={insightLogicProps}>
+                <Query
+                    // use separate keys for the settings and visualization to avoid conflicts with insightProps
+                    uniqueKey={nodeId + '-component'}
+                    query={modifiedQuery}
+                    setQuery={(t) => {
+                        updateAttributes({
+                            query: {
+                                ...attributes.query,
+                                source: (t as DataTableNode | InsightVizNode).source,
+                            } as QuerySchema,
+                        })
+                    }}
+                />
+            </BindLogic>
         </div>
     )
 }