Merge branch 'master' into project-name-sync

cypress/e2e/surveys.cy.ts

@@ -100,7 +100,7 @@ describe('Surveys', () => {
         cy.get('[data-attr=prop-val]').click({ force: true })
         cy.get('[data-attr=prop-val-0]').click({ force: true })
 
-        cy.get('[data-attr="rollout-percentage"]').type('100')
+        cy.get('[data-attr="rollout-percentage"]').click().type('100')
 
         // save
         cy.get('[data-attr="save-survey"]').eq(0).click()
@@ -202,7 +202,7 @@ describe('Surveys', () => {
         cy.get('[data-attr="prop-filter-person_properties-0"]').click()
         cy.get('[data-attr=prop-val]').click({ force: true })
         cy.get('[data-attr=prop-val-0]').click({ force: true })
-        cy.get('[data-attr="rollout-percentage"]').type('100')
+        cy.get('[data-attr="rollout-percentage"]').click().type('100')
 
         cy.get('[data-attr=save-survey]').first().click()
 

cypress/wait.py

@@ -17,8 +17,8 @@ def main():
                 print("PostHog is alive! Proceeding")
                 continue
             else:
-                # recieved not 200 from PostHog, but service is up
-                print("Found status %d" % (r.status,))
+                # received not 200 from PostHog, but service is up
+                print(f"Found status {r.status:d}")
                 with open("cypress/screenshots/curl.html", "wb") as f:
                     f.write(r.read)  # type: ignore
                 print("PostHog is still booting. Sleeping for 1 second")

frontend/src/initKea.ts

@@ -64,7 +64,7 @@ export const loggerPlugin: () => KeaPlugin = () => ({
 export function initKea({ routerHistory, routerLocation, beforePlugins }: InitKeaProps = {}): void {
     const plugins = [
         ...(beforePlugins || []),
-        localStoragePlugin,
+        localStoragePlugin(),
         windowValuesPlugin({ window: window }),
         routerPlugin({
             history: routerHistory,

frontend/src/layout/navigation-3000/components/Navbar.tsx

@@ -59,7 +59,7 @@ export function Navbar(): JSX.Element {
                                                     ? () => {
                                                           if (
                                                               activeNavbarItemId === item.identifier &&
-                                                              isSidebarShown
+                                                              !isSidebarShown
                                                           ) {
                                                               hideSidebar()
                                                           } else {

frontend/src/layout/navigation-3000/navigationLogic.tsx

@@ -512,7 +512,7 @@ export const navigation3000Logic = kea<navigation3000LogicType>([
                         featureFlags[FEATURE_FLAGS.SQL_EDITOR]
                             ? {
                                   identifier: Scene.SQLEditor,
-                                  label: 'Data warehouse',
+                                  label: 'Data warehouse 3000',
                                   icon: <IconServer />,
                                   to: urls.sqlEditor(),
                                   logic: editorSidebarLogic,

frontend/src/lib/constants.tsx

@@ -228,7 +228,6 @@ export const FEATURE_FLAGS = {
     AI_SURVEY_RESPONSE_SUMMARY: 'ai-survey-response-summary', // owner: @pauldambra
     CUSTOM_CHANNEL_TYPE_RULES: 'custom-channel-type-rules', // owner: @robbie-c #team-web-analytics
     SELF_SERVE_CREDIT_OVERRIDE: 'self-serve-credit-override', // owner: @zach
-    EXPERIMENTS_MIGRATION_DISABLE_UI: 'experiments-migration-disable-ui', // owner: @jurajmajerik #team-experiments
     CUSTOM_CSS_THEMES: 'custom-css-themes', // owner: @daibhin
     EXPERIMENTS_MULTIPLE_METRICS: 'experiments-multiple-metrics', // owner: @jurajmajerik #team-experiments
     WEB_ANALYTICS_WARN_CUSTOM_EVENT_NO_SESSION: 'web-analytics-warn-custom-event-no-session', // owner: @robbie-c #team-web-analytics

frontend/src/lib/lemon-ui/LemonInputSelect/LemonInputSelect.tsx

@@ -249,22 +249,25 @@ export function LemonInputSelect({
     }
 
     const _onBlur = (): void => {
-        // We need to add a delay as a click could be in the popover or the input wrapper which refocuses
-        setTimeout(() => {
-            if (popoverFocusRef.current) {
-                popoverFocusRef.current = false
-                inputRef.current?.focus()
-                _onFocus()
-                return
-            }
-            if (allowCustomValues && inputValue.trim() && !values.includes(inputValue)) {
+        const hasSelectedAutofilledValue = selectedIndex > 0
+        const hasCustomValue =
+            !hasSelectedAutofilledValue && allowCustomValues && inputValue.trim() && !values.includes(inputValue)
+        if (popoverFocusRef.current) {
+            popoverFocusRef.current = false
+            inputRef.current?.focus()
+            _onFocus()
+            if (hasCustomValue) {
                 _onActionItem(inputValue.trim(), null)
-            } else {
-                setInputValue('')
             }
-            setShowPopover(false)
-            onBlur?.()
-        }, 100)
+            return
+        }
+        if (hasCustomValue) {
+            _onActionItem(inputValue.trim(), null)
+        } else {
+            setInputValue('')
+        }
+        setShowPopover(false)
+        onBlur?.()
     }
 
     const _onFocus = (): void => {

frontend/src/lib/lemon-ui/Tooltip/Tooltip.tsx

@@ -32,6 +32,7 @@ export interface TooltipProps {
     placement?: Placement
     className?: string
     visible?: boolean
+    interactive?: boolean
 }
 
 export function Tooltip({
@@ -42,14 +43,16 @@ export function Tooltip({
     offset = 8,
     arrowOffset,
     delayMs = 500,
-    closeDelayMs = 0, // Set this to some delay to ensure the content stays open when hovered
+    closeDelayMs = 100, // Slight delay to ensure smooth transition
+    interactive = false,
     visible: controlledOpen,
 }: TooltipProps): JSX.Element {
     const [uncontrolledOpen, setUncontrolledOpen] = useState(false)
+    const [isHoveringTooltip, setIsHoveringTooltip] = useState(false) // Track tooltip hover state
     const caretRef = useRef(null)
     const floatingContainer = useFloatingContainer()
 
-    const open = controlledOpen ?? uncontrolledOpen
+    const open = controlledOpen ?? (uncontrolledOpen || isHoveringTooltip)
 
     const { context, refs } = useFloating({
         placement,
@@ -116,7 +119,10 @@ export function Tooltip({
                         className="Tooltip max-w-sm"
                         // eslint-disable-next-line react/forbid-dom-props
                         style={{ ...context.floatingStyles }}
-                        {...getFloatingProps()}
+                        {...getFloatingProps({
+                            onMouseEnter: () => interactive && setIsHoveringTooltip(true), // Keep tooltip open
+                            onMouseLeave: () => interactive && setIsHoveringTooltip(false), // Allow closing
+                        })}
                     >
                         <div
                             className={clsx(

frontend/src/queries/nodes/DataNode/dataNodeLogic.ts

@@ -198,7 +198,6 @@ export const dataNodeLogic = kea<dataNodeLogicType>([
                     const methodOptions: ApiMethodOptions = {
                         signal: cache.abortController.signal,
                     }
-
                     try {
                         const response = await concurrencyController.run({
                             debugTag: query.kind,

frontend/src/queries/nodes/DataTable/queryFeatures.ts

@@ -9,7 +9,6 @@ import {
     isWebGoalsQuery,
     isWebOverviewQuery,
     isWebStatsTableQuery,
-    isWebTopClicksQuery,
 } from '~/queries/utils'
 
 export enum QueryFeature {
@@ -62,7 +61,6 @@ export function getQueryFeatures(query: Node): Set<QueryFeature> {
 
     if (
         isWebOverviewQuery(query) ||
-        isWebTopClicksQuery(query) ||
         isWebExternalClicksQuery(query) ||
         isWebStatsTableQuery(query) ||
         isWebGoalsQuery(query)

frontend/src/queries/nodes/DataVisualization/Components/Variables/variablesLogic.ts

@@ -5,6 +5,7 @@ import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
 import { getVariablesFromQuery, haveVariablesOrFiltersChanged } from 'scenes/insights/utils/queryUtils'
 
 import { DataVisualizationNode, HogQLVariable } from '~/queries/schema'
+import { DashboardType } from '~/types'
 
 import { dataVisualizationLogic } from '../../dataVisualizationLogic'
 import { Variable, VariableType } from '../../types'
@@ -15,6 +16,8 @@ export interface VariablesLogicProps {
     key: string
     /** Disable any changes to the query */
     readOnly: boolean
+    /** Dashboard ID for the current dashboard if we're viewing one */
+    dashboardId?: DashboardType['id']
 }
 
 const convertValueToCorrectType = (value: string, type: VariableType): number | string | boolean => {
@@ -37,7 +40,7 @@ export const variablesLogic = kea<variablesLogicType>([
         actions: [dataVisualizationLogic, ['setQuery', 'loadData'], variableDataLogic, ['getVariables']],
         values: [
             dataVisualizationLogic,
-            ['query', 'dashboardId'],
+            ['query'],
             variableDataLogic,
             ['variables', 'variablesLoading'],
             featureFlagLogic,
@@ -124,7 +127,7 @@ export const variablesLogic = kea<variablesLogicType>([
             },
         ],
         showVariablesBar: [
-            (state) => [state.dashboardId],
+            () => [(_, props) => props.dashboardId],
             (dashboardId) => {
                 return !dashboardId
             },

frontend/src/queries/nodes/DataVisualization/DataVisualization.tsx

@@ -46,7 +46,7 @@ import { variablesLogic } from './Components/Variables/variablesLogic'
 import { dataVisualizationLogic, DataVisualizationLogicProps } from './dataVisualizationLogic'
 import { displayLogic } from './displayLogic'
 
-interface DataTableVisualizationProps {
+export interface DataTableVisualizationProps {
     uniqueKey?: string | number
     query: DataVisualizationNode
     setQuery: (query: DataVisualizationNode) => void
@@ -112,7 +112,11 @@ export function DataTableVisualization({
                 <BindLogic logic={displayLogic} props={{ key: dataVisualizationLogicProps.key }}>
                     <BindLogic
                         logic={variablesLogic}
-                        props={{ key: dataVisualizationLogicProps.key, readOnly: readOnly ?? false }}
+                        props={{
+                            key: dataVisualizationLogicProps.key,
+                            readOnly: readOnly ?? false,
+                            dashboardId: insightProps.dashboardId,
+                        }}
                     >
                         <BindLogic logic={variableModalLogic} props={{ key: dataVisualizationLogicProps.key }}>
                             <InternalDataTableVisualization

frontend/src/queries/nodes/DataVisualization/dataVisualizationLogic.ts

@@ -580,9 +580,10 @@ export const dataVisualizationLogic = kea<dataVisualizationLogicType>([
             },
         ],
         presetChartHeight: [
-            (state) => [state.dashboardId],
-            (dashboardId) => {
-                return !dashboardId
+            (state, props) => [props.key, state.dashboardId],
+            (key, dashboardId) => {
+                // Key for SQL editor based visiaulizations
+                return !key.includes('SQLEditorScene') && !dashboardId
             },
         ],
         sourceFeatures: [(_, props) => [props.query], (query): Set<QueryFeature> => getQueryFeatures(query.source)],