From c6c3b12c4075f3b2fc8f011f4781d8ac0b05a1a6 Mon Sep 17 00:00:00 2001
From: Eric Duong <eric@posthog.com>
Date: Fri, 28 Jun 2024 13:24:35 -0400
Subject: [PATCH] fix(hogql): pass parameter and use logic directly (#23338)

---
 .../queries/nodes/HogQLQuery/HogQLQueryEditor.tsx |  9 ++++-----
 .../nodes/HogQLQuery/hogQLQueryEditorLogic.tsx    | 15 ++-------------
 2 files changed, 6 insertions(+), 18 deletions(-)

diff --git a/frontend/src/queries/nodes/HogQLQuery/HogQLQueryEditor.tsx b/frontend/src/queries/nodes/HogQLQuery/HogQLQueryEditor.tsx
index 0bd34bc1763d0..ad7174d52325a 100644
--- a/frontend/src/queries/nodes/HogQLQuery/HogQLQueryEditor.tsx
+++ b/frontend/src/queries/nodes/HogQLQuery/HogQLQueryEditor.tsx
@@ -2,7 +2,7 @@ import { Monaco } from '@monaco-editor/react'
 import { IconInfo, IconMagicWand } from '@posthog/icons'
 import { LemonInput, Link } from '@posthog/lemon-ui'
 import clsx from 'clsx'
-import { useActions, useMountedLogic, useValues } from 'kea'
+import { useActions, useValues } from 'kea'
 import { FlaggedFeature } from 'lib/components/FlaggedFeature'
 import { FEATURE_FLAGS } from 'lib/constants'
 import { LemonBanner } from 'lib/lemon-ui/LemonBanner'
@@ -52,18 +52,17 @@ export function HogQLQueryEditor(props: HogQLQueryEditorProps): JSX.Element {
         monaco,
     }
     const logic = hogQLQueryEditorLogic(hogQLQueryEditorLogicProps)
-    const { queryInput, hasErrors, error, prompt, aiAvailable, promptError, promptLoading, isValidView } =
-        useValues(logic)
+    const { queryInput, prompt, aiAvailable, promptError, promptLoading } = useValues(logic)
     const { setQueryInput, saveQuery, setPrompt, draftFromPrompt, saveAsView } = useActions(logic)
 
     const codeEditorKey = `hogQLQueryEditor/${key}`
     const codeEditorLogicProps = {
         key: codeEditorKey,
         query: queryInput,
-        language: 'hogql',
+        language: 'hogQL',
         metadataFilters: props.query.filters,
     }
-    useMountedLogic(codeEditorLogic(codeEditorLogicProps))
+    const { hasErrors, error, isValidView } = useValues(codeEditorLogic(codeEditorLogicProps))
 
     // Using useRef, not useState, as we don't want to reload the component when this changes.
     const monacoDisposables = useRef([] as IDisposable[])
diff --git a/frontend/src/queries/nodes/HogQLQuery/hogQLQueryEditorLogic.tsx b/frontend/src/queries/nodes/HogQLQuery/hogQLQueryEditorLogic.tsx
index b69366bce1a1a..0a4980027be12 100644
--- a/frontend/src/queries/nodes/HogQLQuery/hogQLQueryEditorLogic.tsx
+++ b/frontend/src/queries/nodes/HogQLQuery/hogQLQueryEditorLogic.tsx
@@ -4,7 +4,6 @@ import { actions, connect, kea, key, listeners, path, props, propsChanged, reduc
 import { combineUrl } from 'kea-router'
 import api from 'lib/api'
 import { LemonField } from 'lib/lemon-ui/LemonField'
-import { codeEditorLogic } from 'lib/monaco/codeEditorLogic'
 // Note: we can only import types and not values from monaco-editor, because otherwise some Monaco code breaks
 // auto reload in development. Specifically, on this line:
 // `export const suggestWidgetStatusbarMenu = new MenuId('suggestWidgetStatusBar')`
@@ -39,19 +38,9 @@ export const hogQLQueryEditorLogic = kea<hogQLQueryEditorLogicType>([
             actions.setQueryInput(props.query.query)
         }
     }),
-    connect((props: HogQLQueryEditorLogicProps) => ({
-        values: [
-            codeEditorLogic({
-                key: `hogQLQueryEditor/${key}`,
-                query: props.query.query,
-                language: 'hogql',
-                metadataFilters: props.query.filters,
-                metadataSource: props.metadataSource,
-            }),
-            ['hasErrors', 'error', 'isValidView'],
-        ],
+    connect({
         actions: [dataWarehouseViewsLogic, ['createDataWarehouseSavedQuery']],
-    })),
+    }),
     actions({
         saveQuery: true,
         setQueryInput: (queryInput: string) => ({ queryInput }),