diff --git a/frontend/src/queries/Query/Query.tsx b/frontend/src/queries/Query/Query.tsx index 1e85d2aef5a..93cf6f1697a 100644 --- a/frontend/src/queries/Query/Query.tsx +++ b/frontend/src/queries/Query/Query.tsx @@ -47,6 +47,8 @@ export function Query(props: QueryProps): JSX.Element { } } + console.log('Query', query) + let component if (isLegacyQuery(query)) { component = diff --git a/frontend/src/scenes/insights/Insight.tsx b/frontend/src/scenes/insights/Insight.tsx index babe84e1975..f682579c123 100644 --- a/frontend/src/scenes/insights/Insight.tsx +++ b/frontend/src/scenes/insights/Insight.tsx @@ -13,6 +13,9 @@ import { EditorFilters } from './EditorFilters/EditorFilters' import clsx from 'clsx' import { Query } from '~/queries/Query/Query' import { InsightPageHeader } from 'scenes/insights/InsightPageHeader' +import { QueryEditor } from '~/queries/QueryEditor/QueryEditor' +import { LemonDivider } from 'lib/lemon-ui/LemonDivider' +import { isInsightVizNode } from '~/queries/utils' export interface InsightSceneProps { insightId: InsightShortId | 'new' @@ -29,27 +32,15 @@ export function Insight({ insightId }: InsightSceneProps): JSX.Element { insightLoading, filtersKnown, filters, - insight, isUsingDataExploration, erroredQueryId, isFilterBasedInsight, - isQueryBasedInsight, } = useValues(logic) const { reportInsightViewedForRecentInsights, abortAnyRunningQuery, loadResults } = useActions(logic) // insightDataLogic - const { query: insightVizQuery } = useValues(insightDataLogic(insightProps)) - const { setQuery: insighVizSetQuery } = useActions(insightDataLogic(insightProps)) - - // TODO - separate presentation of insight with viz query from insight with query - let query = insightVizQuery - let setQuery = insighVizSetQuery - if (!!insight.query && isQueryBasedInsight) { - query = insight.query - setQuery = () => { - // don't support editing non-insight viz queries _yet_ - } - } + const { query } = useValues(insightDataLogic(insightProps)) + const { setQuery } = useActions(insightDataLogic(insightProps)) // other logics useMountedLogic(insightCommandLogic(insightProps)) @@ -78,6 +69,8 @@ export function Insight({ insightId }: InsightSceneProps): JSX.Element { return } + const showQueryEditorPanel = insightMode === ItemMode.Edit && !!query && !isInsightVizNode(query) + const insightScene = (
@@ -85,7 +78,20 @@ export function Insight({ insightId }: InsightSceneProps): JSX.Element { {insightMode === ItemMode.Edit && } {isUsingDataExploration ? ( - + <> + {showQueryEditorPanel ? ( + <> + setQuery(JSON.parse(stringQuery))} + /> +
+ +
+ + ) : null} + + ) : ( <>
([ return } - const querySource = (query as InsightVizNode).source - if (isLifecycleQuery(querySource)) { - const filters = queryNodeToFilter(querySource) - actions.setFilters(filters) + if (isInsightVizNode(query)) { + const querySource = (query as InsightVizNode).source + if (isLifecycleQuery(querySource)) { + const filters = queryNodeToFilter(querySource) + actions.setFilters(filters) - if (querySource.lifecycleFilter?.toggledLifecycles !== values.trendsLifecycles) { - actions.setTrendsLifecycles( - querySource.lifecycleFilter?.toggledLifecycles - ? querySource.lifecycleFilter.toggledLifecycles - : ['new', 'resurrecting', 'returning', 'dormant'] - ) + if (querySource.lifecycleFilter?.toggledLifecycles !== values.trendsLifecycles) { + actions.setTrendsLifecycles( + querySource.lifecycleFilter?.toggledLifecycles + ? querySource.lifecycleFilter.toggledLifecycles + : ['new', 'resurrecting', 'returning', 'dormant'] + ) + } } } },