diff --git a/frontend/src/lib/constants.tsx b/frontend/src/lib/constants.tsx
index dd8a0a11f120e..e3102f59b9b73 100644
--- a/frontend/src/lib/constants.tsx
+++ b/frontend/src/lib/constants.tsx
@@ -232,4 +232,5 @@ export const WEBHOOK_SERVICES: Record<string, string> = {
 export const FEATURE_FLAGS: Record<string, string> = {
     INGESTION_GRID: 'ingestion-grid-exp-3',
     PROJECT_HOME: 'project-home-exp-5',
+    QUERY_UX_V2: '4050-query-ui-optB',
 }
diff --git a/frontend/src/scenes/dashboard/DashboardItem.tsx b/frontend/src/scenes/dashboard/DashboardItem.tsx
index 5a9b3d93afe1b..290e9416b8661 100644
--- a/frontend/src/scenes/dashboard/DashboardItem.tsx
+++ b/frontend/src/scenes/dashboard/DashboardItem.tsx
@@ -128,12 +128,8 @@ export const displayMap: Record<DisplayedType, DisplayProps> = {
         link: ({ id, dashboard, name, filters }: DashboardItemType): string => {
             return combineUrl(
                 `/insights`,
-                {
-                    insight: ViewType.FUNNELS,
-                    fromDashboardItem: { id: id, name: name, dashboard: dashboard },
-                    ...filters,
-                },
-                {}
+                { insight: ViewType.FUNNELS, ...filters },
+                { fromItem: id, fromItemName: name, fromDashboard: dashboard }
             ).url
         },
     },
diff --git a/frontend/src/scenes/insights/ActionFilter/ActionFilter.scss b/frontend/src/scenes/insights/ActionFilter/ActionFilter.scss
index 2f88fb70464b6..b96bdc6053914 100644
--- a/frontend/src/scenes/insights/ActionFilter/ActionFilter.scss
+++ b/frontend/src/scenes/insights/ActionFilter/ActionFilter.scss
@@ -17,3 +17,12 @@
         margin-top: 0;
     }
 }
+
+.add-action-event-button {
+    &.new-ui {
+        border-color: $border_dark;
+        color: $primary;
+        padding-left: $default_spacing * 2.5;
+        padding-right: $default_spacing * 2.5;
+    }
+}
diff --git a/frontend/src/scenes/insights/ActionFilter/ActionFilter.tsx b/frontend/src/scenes/insights/ActionFilter/ActionFilter.tsx
index 4800e2911c80e..b1f89e6b80ac0 100644
--- a/frontend/src/scenes/insights/ActionFilter/ActionFilter.tsx
+++ b/frontend/src/scenes/insights/ActionFilter/ActionFilter.tsx
@@ -9,6 +9,8 @@ import { alphabet } from 'lib/utils'
 import posthog from 'posthog-js'
 import { ActionFilter as ActionFilterType, FilterType, Optional } from '~/types'
 import { SortableContainer, SortableActionFilterRow } from './Sortable'
+import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
+import { FEATURE_FLAGS } from 'lib/constants'
 
 export interface ActionFilterProps {
     setFilters: (filters: FilterType) => void
@@ -41,6 +43,8 @@ export function ActionFilter({
 }: ActionFilterProps): JSX.Element {
     const logic = entityFilterLogic({ setFilters, filters, typeKey })
 
+    const { featureFlags } = useValues(featureFlagLogic)
+
     const { localFilters } = useValues(logic)
     const { addFilter, setLocalFilters } = useActions(logic)
 
@@ -101,12 +105,13 @@ export function ActionFilter({
             {!singleFilter && (
                 <div className="mt">
                     <Button
-                        type="primary"
+                        type={featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? 'dashed' : 'primary'}
                         onClick={() => addFilter()}
                         style={{ marginTop: '0.5rem' }}
                         data-attr="add-action-event-button"
                         icon={<PlusCircleOutlined />}
                         disabled={disabled}
+                        className={`add-action-event-button${featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? ' new-ui' : ''}`}
                     >
                         {buttonCopy || 'Action or event'}
                     </Button>
diff --git a/frontend/src/scenes/insights/InsightTabs/FunnelTab/FunnelTab.tsx b/frontend/src/scenes/insights/InsightTabs/FunnelTab/FunnelTab.tsx
index be2bf647fc2d2..030ca99deca38 100644
--- a/frontend/src/scenes/insights/InsightTabs/FunnelTab/FunnelTab.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/FunnelTab/FunnelTab.tsx
@@ -11,8 +11,14 @@ import { useState } from 'react'
 import { SaveModal } from '../../SaveModal'
 import { funnelCommandLogic } from './funnelCommandLogic'
 import { TestAccountFilter } from 'scenes/insights/TestAccountFilter'
+import { BaseTabProps } from 'scenes/insights/Insights'
+import { InsightTitle } from '../InsightTitle'
 
-export function FunnelTab(): JSX.Element {
+interface FunnelTabProps extends BaseTabProps {
+    newUI: boolean
+}
+
+export function FunnelTab({ annotationsToCreate, newUI }: FunnelTabProps): JSX.Element {
     useMountedLogic(funnelCommandLogic)
     const { isStepsEmpty, filters, stepsWithCount } = useValues(funnelLogic())
     const { loadResults, clearFunnel, setFilters, saveFunnelInsight } = useActions(funnelLogic())
@@ -28,6 +34,11 @@ export function FunnelTab(): JSX.Element {
 
     return (
         <div data-attr="funnel-tab">
+            {newUI && (
+                <Row>
+                    <InsightTitle annotations={annotationsToCreate} filters={filters} />
+                </Row>
+            )}
             <form
                 onSubmit={(e): void => {
                     e.preventDefault()
diff --git a/frontend/src/scenes/insights/InsightTabs/InsightTitle.tsx b/frontend/src/scenes/insights/InsightTabs/InsightTitle.tsx
new file mode 100644
index 0000000000000..87a7fea840e44
--- /dev/null
+++ b/frontend/src/scenes/insights/InsightTabs/InsightTitle.tsx
@@ -0,0 +1,37 @@
+import { Button } from 'antd'
+import { SaveToDashboard } from 'lib/components/SaveToDashboard/SaveToDashboard'
+import React, { useState } from 'react'
+import { SaveOutlined, DashboardOutlined } from '@ant-design/icons'
+import { FilterType } from '~/types'
+import { router } from 'kea-router'
+
+export interface InsightTitleProps {
+    filters: FilterType
+    annotations: any[] // TODO: Type properly
+}
+
+export function InsightTitle({ annotations, filters }: InsightTitleProps): JSX.Element {
+    const [{ fromItemName, fromDashboard }] = useState(router.values.hashParams)
+    return (
+        <>
+            <h3 className="l3" style={{ display: 'flex', alignItems: 'center' }}>
+                {fromDashboard && (
+                    <DashboardOutlined
+                        style={{ color: 'var(--warning)', marginRight: 4 }}
+                        title="Insight saved on dashboard"
+                    />
+                )}
+                {fromItemName || 'Unsaved query'}{' '}
+                <SaveToDashboard
+                    displayComponent={<Button type="link" size="small" icon={<SaveOutlined />} />}
+                    item={{
+                        entity: {
+                            filters,
+                            annotations,
+                        },
+                    }}
+                />
+            </h3>
+        </>
+    )
+}
diff --git a/frontend/src/scenes/insights/InsightTabs/PathTab.tsx b/frontend/src/scenes/insights/InsightTabs/PathTab.tsx
index 8ed176826618c..c32185ef7eb3c 100644
--- a/frontend/src/scenes/insights/InsightTabs/PathTab.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/PathTab.tsx
@@ -15,10 +15,12 @@ import { TestAccountFilter } from '../TestAccountFilter'
 import { eventDefinitionsLogic } from 'scenes/events/eventDefinitionsLogic'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
 import { PathTabHorizontal } from './PathTabHorizontal'
+import { FEATURE_FLAGS } from 'lib/constants'
+import { BaseTabProps } from '../Insights'
 
-export function PathTab(): JSX.Element {
+export function PathTab(props: BaseTabProps): JSX.Element {
     const { featureFlags } = useValues(featureFlagLogic)
-    return featureFlags['4050-query-ui-optB'] ? <PathTabHorizontal /> : <DefaultPathTab />
+    return featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? <PathTabHorizontal {...props} /> : <DefaultPathTab />
 }
 
 function DefaultPathTab(): JSX.Element {
diff --git a/frontend/src/scenes/insights/InsightTabs/PathTabHorizontal.tsx b/frontend/src/scenes/insights/InsightTabs/PathTabHorizontal.tsx
index 2383538d83c4e..28377d7da73ef 100644
--- a/frontend/src/scenes/insights/InsightTabs/PathTabHorizontal.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/PathTabHorizontal.tsx
@@ -14,8 +14,10 @@ import { PropertyValue } from 'lib/components/PropertyFilters'
 import { TestAccountFilter } from '../TestAccountFilter'
 import { eventDefinitionsLogic } from 'scenes/events/eventDefinitionsLogic'
 import useBreakpoint from 'antd/lib/grid/hooks/useBreakpoint'
+import { BaseTabProps } from '../Insights'
+import { InsightTitle } from './InsightTitle'
 
-export function PathTabHorizontal(): JSX.Element {
+export function PathTabHorizontal({ annotationsToCreate }: BaseTabProps): JSX.Element {
     const { customEventNames } = useValues(eventDefinitionsLogic)
     const { filter, filtersLoading } = useValues(pathsLogic({ dashboardItemId: null }))
     const { setFilter } = useActions(pathsLogic({ dashboardItemId: null }))
@@ -26,6 +28,9 @@ export function PathTabHorizontal(): JSX.Element {
     return (
         <Row gutter={16}>
             <Col md={16} xs={24}>
+                <Row>
+                    <InsightTitle annotations={annotationsToCreate} filters={filter} />
+                </Row>
                 <Row gutter={8} align="middle" className="mt">
                     <Col>Showing paths from</Col>
                     <Col>
diff --git a/frontend/src/scenes/insights/InsightTabs/RetentionTab.scss b/frontend/src/scenes/insights/InsightTabs/RetentionTab.scss
index a213eebfdc734..8fa6b6b1de5bb 100644
--- a/frontend/src/scenes/insights/InsightTabs/RetentionTab.scss
+++ b/frontend/src/scenes/insights/InsightTabs/RetentionTab.scss
@@ -1,13 +1,16 @@
 @import '~/vars';
 
 .retention-tab {
-    .ant-btn {
+    .btn-retention-dropdown {
         display: flex;
     }
 
-    .svg-fix {
+    .dropdown-indicator {
         color: $text_muted;
         padding-left: 4px;
+        margin-top: 2px;
+        color: #bdbdbd;
+        margin-right: -6px;
         svg {
             height: 10px;
             width: 10px;
diff --git a/frontend/src/scenes/insights/InsightTabs/RetentionTab.tsx b/frontend/src/scenes/insights/InsightTabs/RetentionTab.tsx
index 80a11f5283a0e..554a84e062804 100644
--- a/frontend/src/scenes/insights/InsightTabs/RetentionTab.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/RetentionTab.tsx
@@ -23,12 +23,14 @@ import { PropertyKeyInfo } from 'lib/components/PropertyKeyInfo'
 import './RetentionTab.scss'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
 import { RetentionTabHorizontal } from './RetentionTabHorizontal'
+import { FEATURE_FLAGS } from 'lib/constants'
+import { BaseTabProps } from '../Insights'
 
 const DatePicker = generatePicker<dayjs.Dayjs>(dayjsGenerateConfig)
 
-export function RetentionTab(): JSX.Element {
+export function RetentionTab(props: BaseTabProps): JSX.Element {
     const { featureFlags } = useValues(featureFlagLogic)
-    return featureFlags['4050-query-ui-optB'] ? <RetentionTabHorizontal /> : <DefaultRetentionTab />
+    return featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? <RetentionTabHorizontal {...props} /> : <DefaultRetentionTab />
 }
 
 function DefaultRetentionTab(): JSX.Element {
@@ -99,9 +101,10 @@ function DefaultRetentionTab(): JSX.Element {
                     data-attr="retention-action"
                     onClick={(): void => setOpen(!open)}
                     style={{ marginRight: 8, marginBottom: 8 }}
+                    className="btn-retention-dropdown"
                 >
                     <PropertyKeyInfo value={selectedCohortizingEvent} />
-                    <DownOutlined className="text-muted svg-fix" style={{ marginRight: '-6px' }} />
+                    <DownOutlined className="dropdown-indicator" />
                 </Button>
                 <Select
                     value={retentionOptions[filters.retention_type]}
@@ -139,9 +142,10 @@ function DefaultRetentionTab(): JSX.Element {
                 ref={returningNode}
                 data-attr="retention-returning-action"
                 onClick={(): void => setReturningOpen(!returningOpen)}
+                className="btn-retention-dropdown"
             >
                 <PropertyKeyInfo value={selectedRetainingEvent} />
-                <DownOutlined className="text-muted svg-fix" style={{ marginRight: '-6px' }} />
+                <DownOutlined className="dropdown-indicator" />
             </Button>
             <ActionFilterDropdown
                 open={returningOpen}
diff --git a/frontend/src/scenes/insights/InsightTabs/RetentionTabHorizontal.tsx b/frontend/src/scenes/insights/InsightTabs/RetentionTabHorizontal.tsx
index 0f426fbbd429f..a676494d33ee4 100644
--- a/frontend/src/scenes/insights/InsightTabs/RetentionTabHorizontal.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/RetentionTabHorizontal.tsx
@@ -15,8 +15,10 @@ import './RetentionTab.scss'
 import { RETENTION_FIRST_TIME, RETENTION_RECURRING } from 'lib/constants'
 import useBreakpoint from 'antd/lib/grid/hooks/useBreakpoint'
 import { IconExternalLink } from 'lib/components/icons'
+import { BaseTabProps } from '../Insights'
+import { InsightTitle } from './InsightTitle'
 
-export function RetentionTabHorizontal(): JSX.Element {
+export function RetentionTabHorizontal({ annotationsToCreate }: BaseTabProps): JSX.Element {
     const node = useRef<HTMLElement>(null)
     const returningNode = useRef<HTMLElement>(null)
     const [open, setOpen] = useState<boolean>(false)
@@ -79,17 +81,22 @@ export function RetentionTabHorizontal(): JSX.Element {
         <div data-attr="retention-tab" className="retention-tab">
             <Row gutter={16}>
                 <Col md={16} xs={24}>
-                    <Row gutter={8} align="middle" className="mt">
+                    <Row>
+                        <InsightTitle annotations={annotationsToCreate} filters={filters} />
+                    </Row>
+                    <Row gutter={8} align="middle">
                         <Col>
                             Showing <b>Unique users</b> who did
                         </Col>
                         <Col>
-                            <Button ref={node} data-attr="retention-action" onClick={() => setOpen(!open)}>
+                            <Button
+                                className="btn-retention-dropdown"
+                                ref={node}
+                                data-attr="retention-action"
+                                onClick={() => setOpen(!open)}
+                            >
                                 <PropertyKeyInfo value={selectedCohortizingEvent} disablePopover />
-                                <DownOutlined
-                                    className="svg-fix"
-                                    style={{ marginRight: '-6px', marginTop: 2, color: '#bdbdbd', fontSize: '1.3em' }}
-                                />
+                                <DownOutlined className="dropdown-indicator" />
                             </Button>
                             <ActionFilterDropdown
                                 open={open}
@@ -138,12 +145,10 @@ export function RetentionTabHorizontal(): JSX.Element {
                                 ref={returningNode}
                                 data-attr="retention-returning-action"
                                 onClick={(): void => setReturningOpen(!returningOpen)}
+                                className="btn-retention-dropdown"
                             >
                                 <PropertyKeyInfo value={selectedRetainingEvent} disablePopover />
-                                <DownOutlined
-                                    className="svg-fix"
-                                    style={{ marginRight: '-6px', marginTop: 2, color: '#bdbdbd', fontSize: '1.3em' }}
-                                />
+                                <DownOutlined className="dropdown-indicator" />
                             </Button>
                             <ActionFilterDropdown
                                 open={returningOpen}
diff --git a/frontend/src/scenes/insights/InsightTabs/SessionTab.tsx b/frontend/src/scenes/insights/InsightTabs/SessionTab.tsx
index 81b0d31f7d680..d6d4e26c30d8a 100644
--- a/frontend/src/scenes/insights/InsightTabs/SessionTab.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/SessionTab.tsx
@@ -11,10 +11,12 @@ import { InfoCircleOutlined } from '@ant-design/icons'
 import { TestAccountFilter } from '../TestAccountFilter'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
 import { SessionTabHorizontal } from './SessionTabHorizontal'
+import { FEATURE_FLAGS } from 'lib/constants'
+import { BaseTabProps } from '../Insights'
 
-export function SessionTab(): JSX.Element {
+export function SessionTab(props: BaseTabProps): JSX.Element {
     const { featureFlags } = useValues(featureFlagLogic)
-    return featureFlags['4050-query-ui-optB'] ? <SessionTabHorizontal /> : <DefaultSessionTab />
+    return featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? <SessionTabHorizontal {...props} /> : <DefaultSessionTab />
 }
 
 function DefaultSessionTab(): JSX.Element {
diff --git a/frontend/src/scenes/insights/InsightTabs/SessionTabHorizontal.tsx b/frontend/src/scenes/insights/InsightTabs/SessionTabHorizontal.tsx
index bb4c372d61a52..e18af4d00c7ee 100644
--- a/frontend/src/scenes/insights/InsightTabs/SessionTabHorizontal.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/SessionTabHorizontal.tsx
@@ -9,8 +9,10 @@ import { FilterType } from '~/types'
 import { Col, Row, Skeleton } from 'antd'
 import { TestAccountFilter } from '../TestAccountFilter'
 import useBreakpoint from 'antd/lib/grid/hooks/useBreakpoint'
+import { BaseTabProps } from '../Insights'
+import { InsightTitle } from './InsightTitle'
 
-export function SessionTabHorizontal(): JSX.Element {
+export function SessionTabHorizontal({ annotationsToCreate }: BaseTabProps): JSX.Element {
     const { filters, filtersLoading } = useValues(trendsLogic({ dashboardItemId: null, view: ViewType.SESSIONS }))
     const { setFilters } = useActions(trendsLogic({ dashboardItemId: null, view: ViewType.SESSIONS }))
 
@@ -20,7 +22,10 @@ export function SessionTabHorizontal(): JSX.Element {
     return (
         <Row gutter={16}>
             <Col md={16} xs={24}>
-                <Row gutter={8} align="middle" className="mt mb">
+                <Row>
+                    <InsightTitle annotations={annotationsToCreate} filters={filters} />
+                </Row>
+                <Row gutter={8} align="middle" className="mb">
                     <Col>Showing</Col>
                     <Col>
                         <SessionFilter value={filters.session} onChange={(v: string) => setFilters({ session: v })} />
diff --git a/frontend/src/scenes/insights/InsightTabs/TrendTab/Formula.tsx b/frontend/src/scenes/insights/InsightTabs/TrendTab/Formula.tsx
index fcadf8810d515..6abbfaf09888e 100644
--- a/frontend/src/scenes/insights/InsightTabs/TrendTab/Formula.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/TrendTab/Formula.tsx
@@ -6,10 +6,14 @@ export function Formula({
     filters,
     onChange,
     onFocus,
+    autoFocus,
+    allowClear = true,
 }: {
     filters: Partial<FilterType>
     onChange: (formula: string) => void
-    onFocus: (hasFocus: boolean, localFormula: string) => void
+    onFocus?: (hasFocus: boolean, localFormula: string) => void
+    autoFocus?: boolean
+    allowClear?: boolean
 }): JSX.Element {
     const [value, setValue] = useState(filters.formula)
     useEffect(() => {
@@ -19,7 +23,8 @@ export function Formula({
         <div style={{ maxWidth: 300 }}>
             <Input.Search
                 placeholder="e.g. (A + B)/(A - B) * 100"
-                allowClear
+                allowClear={allowClear}
+                autoFocus={autoFocus}
                 value={value}
                 onChange={(e) => {
                     let value = e.target.value.toLocaleUpperCase()
@@ -30,8 +35,8 @@ export function Formula({
                         .join('')
                     setValue(value)
                 }}
-                onFocus={() => onFocus(true, value)}
-                onBlur={() => !filters.formula && onFocus(false, value)}
+                onFocus={() => onFocus && onFocus(true, value)}
+                onBlur={() => !filters.formula && onFocus && onFocus(false, value)}
                 enterButton="Apply"
                 onSearch={onChange}
             />
diff --git a/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTab.tsx b/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTab.tsx
index f44096172ce63..0c1d8656996ef 100644
--- a/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTab.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTab.tsx
@@ -15,15 +15,16 @@ import { TestAccountFilter } from 'scenes/insights/TestAccountFilter'
 import { preflightLogic } from 'scenes/PreflightCheck/logic'
 import './TrendTab.scss'
 import { TrendTabHorizontal } from './TrendTabHorizontal'
+import { FEATURE_FLAGS } from 'lib/constants'
+import { BaseTabProps } from 'scenes/insights/Insights'
 
-export interface TrendTabProps {
+export interface TrendTabProps extends BaseTabProps {
     view: string
-    annotationsToCreate: any[] // TODO: Type properly
 }
 
 export function TrendTab(props: TrendTabProps): JSX.Element {
     const { featureFlags } = useValues(featureFlagLogic)
-    return featureFlags['4050-query-ui-optB'] ? <TrendTabHorizontal {...props} /> : <DefaultTrendTab {...props} />
+    return featureFlags[FEATURE_FLAGS.QUERY_UX_V2] ? <TrendTabHorizontal {...props} /> : <DefaultTrendTab {...props} />
 }
 
 function DefaultTrendTab({ view }: TrendTabProps): JSX.Element {
diff --git a/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTabHorizontal.tsx b/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTabHorizontal.tsx
index 717a244fd8252..bec7c55f193f1 100644
--- a/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTabHorizontal.tsx
+++ b/frontend/src/scenes/insights/InsightTabs/TrendTab/TrendTabHorizontal.tsx
@@ -5,7 +5,7 @@ import { ActionFilter } from '../../ActionFilter/ActionFilter'
 import { Tooltip, Row, Skeleton, Checkbox, Col, Button } from 'antd'
 import { BreakdownFilter } from '../../BreakdownFilter'
 import { CloseButton } from 'lib/components/CloseButton'
-import { InfoCircleOutlined, SaveOutlined } from '@ant-design/icons'
+import { InfoCircleOutlined } from '@ant-design/icons'
 import { trendsLogic } from '../../../trends/trendsLogic'
 import { ViewType } from '../../insightLogic'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
@@ -14,9 +14,9 @@ import { Formula } from './Formula'
 import { TestAccountFilter } from 'scenes/insights/TestAccountFilter'
 import { preflightLogic } from 'scenes/PreflightCheck/logic'
 import './TrendTab.scss'
-import { SaveToDashboard } from 'lib/components/SaveToDashboard/SaveToDashboard'
 import { TrendTabProps } from './TrendTab'
 import useBreakpoint from 'antd/lib/grid/hooks/useBreakpoint'
+import { InsightTitle } from '../InsightTitle'
 
 export function TrendTabHorizontal({ view, annotationsToCreate }: TrendTabProps): JSX.Element {
     const { filters, filtersLoading } = useValues(trendsLogic({ dashboardItemId: null, view }))
@@ -33,23 +33,17 @@ export function TrendTabHorizontal({ view, annotationsToCreate }: TrendTabProps)
     ]
     const screens = useBreakpoint()
     const isSmallScreen = screens.xs || (screens.sm && !screens.md)
+    const formulaAvailable =
+        (!filters.insight || filters.insight === ViewType.TRENDS) &&
+        featureFlags['3275-formulas'] &&
+        preflight?.ee_enabled
+    const formulaEnabled = (filters.events?.length || 0) + (filters.actions?.length || 0) > 1
 
     return (
         <>
             <Row gutter={16}>
                 <Col md={16} xs={24}>
-                    <h3 className="l3" style={{ display: 'flex', alignItems: 'center' }}>
-                        Unsaved query{' '}
-                        <SaveToDashboard
-                            displayComponent={<Button type="link" size="small" icon={<SaveOutlined />} />}
-                            item={{
-                                entity: {
-                                    filters: filters,
-                                    annotations: annotationsToCreate,
-                                },
-                            }}
-                        />
-                    </h3>
+                    <InsightTitle annotations={annotationsToCreate} filters={filters} />
                     {filtersLoading ? (
                         <Skeleton active />
                     ) : (
@@ -92,31 +86,61 @@ export function TrendTabHorizontal({ view, annotationsToCreate }: TrendTabProps)
                             )}
                         </>
                     )}
-                    <h4 className="secondary">Global Filters</h4>
-                    {filtersLoading ? (
-                        <Skeleton active paragraph={{ rows: 2 }} />
-                    ) : (
+                    {filters.insight !== ViewType.LIFECYCLE && (
                         <>
-                            <PropertyFilters pageKey="trends-filters" />
-                            <TestAccountFilter filters={filters} onChange={setFilters} />
-                            {(!filters.insight || filters.insight === ViewType.TRENDS) &&
-                                featureFlags['3275-formulas'] &&
-                                preflight?.ee_enabled && (
-                                    <>
-                                        <hr />
-                                        <h4 className="secondary">Formula</h4>
-                                        <Formula
-                                            filters={filters}
-                                            onFocus={(hasFocus, localFormula) =>
-                                                setIsUsingFormulas(hasFocus ? true : localFormula ? true : false)
-                                            }
-                                            onChange={(formula: string): void => {
-                                                setIsUsingFormulas(formula ? true : false)
-                                                setFilters({ formula })
-                                            }}
-                                        />
-                                    </>
-                                )}
+                            <h4 className="secondary">Global Filters</h4>
+                            {filtersLoading ? (
+                                <Skeleton active paragraph={{ rows: 2 }} />
+                            ) : (
+                                <>
+                                    <PropertyFilters pageKey="trends-filters" />
+                                    <TestAccountFilter filters={filters} onChange={setFilters} />
+                                    {formulaAvailable && (
+                                        <>
+                                            <hr />
+                                            <h4 className="secondary">Formula</h4>
+                                            {isUsingFormulas ? (
+                                                <Row align="middle" gutter={4}>
+                                                    <Col>
+                                                        <CloseButton
+                                                            onClick={() => {
+                                                                setIsUsingFormulas(false)
+                                                                setFilters({ formula: undefined })
+                                                            }}
+                                                        />
+                                                    </Col>
+                                                    <Col>
+                                                        <Formula
+                                                            filters={filters}
+                                                            onChange={(formula: string): void => {
+                                                                setFilters({ formula })
+                                                            }}
+                                                            autoFocus
+                                                            allowClear={false}
+                                                        />
+                                                    </Col>
+                                                </Row>
+                                            ) : (
+                                                <Tooltip
+                                                    title={
+                                                        !formulaEnabled
+                                                            ? 'Please add at least two graph series to use formulas'
+                                                            : undefined
+                                                    }
+                                                >
+                                                    <Button
+                                                        shape="round"
+                                                        onClick={() => setIsUsingFormulas(true)}
+                                                        disabled={!formulaEnabled}
+                                                    >
+                                                        Add formula
+                                                    </Button>
+                                                </Tooltip>
+                                            )}
+                                        </>
+                                    )}
+                                </>
+                            )}
                         </>
                     )}
                     {filters.insight !== ViewType.LIFECYCLE && filters.insight !== ViewType.STICKINESS && (
diff --git a/frontend/src/scenes/insights/Insights.tsx b/frontend/src/scenes/insights/Insights.tsx
index d5ab247c65352..35c88601b43c1 100644
--- a/frontend/src/scenes/insights/Insights.tsx
+++ b/frontend/src/scenes/insights/Insights.tsx
@@ -6,7 +6,7 @@ import dayjs from 'dayjs'
 import relativeTime from 'dayjs/plugin/relativeTime'
 
 import { Tabs, Row, Col, Card, Button, Tooltip } from 'antd'
-import { ACTIONS_LINE_GRAPH_LINEAR, ACTIONS_LINE_GRAPH_CUMULATIVE, FUNNEL_VIZ } from 'lib/constants'
+import { ACTIONS_LINE_GRAPH_LINEAR, ACTIONS_LINE_GRAPH_CUMULATIVE, FUNNEL_VIZ, FEATURE_FLAGS } from 'lib/constants'
 import { annotationsLogic } from '~/lib/components/Annotations'
 import { router } from 'kea-router'
 
@@ -34,6 +34,11 @@ import { HotKeys } from '~/types'
 import { useKeyboardHotkeys } from 'lib/hooks/useKeyboardHotkeys'
 import { eventUsageLogic } from 'lib/utils/eventUsageLogic'
 import { InsightDisplayConfig } from './InsightTabs/InsightDisplayConfig'
+import { PageHeader } from 'lib/components/PageHeader'
+
+export interface BaseTabProps {
+    annotationsToCreate: any[] // TODO: Type properly
+}
 
 dayjs.extend(relativeTime)
 const { TabPane } = Tabs
@@ -58,7 +63,8 @@ export function Insights(): JSX.Element {
 
     const { loadResults } = useActions(logicFromInsight(activeView, { dashboardItemId: null, filters: allFilters }))
 
-    const horizontalUI = featureFlags['4050-query-ui-optB'] && activeView !== ViewType.FUNNELS
+    const newUI = featureFlags[FEATURE_FLAGS.QUERY_UX_V2]
+    const horizontalUI = newUI && activeView !== ViewType.FUNNELS
 
     const handleHotkeyNavigation = (view: ViewType, hotkey: HotKeys): void => {
         setActiveView(view)
@@ -95,6 +101,7 @@ export function Insights(): JSX.Element {
 
     return (
         <div className={`insights-page${horizontalUI ? ' horizontal-ui' : ''}`}>
+            {newUI && <PageHeader title="Insights" />}
             <Row justify="space-between" align="middle" className="top-bar">
                 <Tabs
                     activeKey={activeView}
@@ -242,10 +249,18 @@ export function Insights(): JSX.Element {
                                                     annotationsToCreate={annotationsToCreate}
                                                 />
                                             ),
-                                            [`${ViewType.SESSIONS}`]: <SessionTab />,
-                                            [`${ViewType.FUNNELS}`]: <FunnelTab />,
-                                            [`${ViewType.RETENTION}`]: <RetentionTab />,
-                                            [`${ViewType.PATHS}`]: <PathTab />,
+                                            [`${ViewType.SESSIONS}`]: (
+                                                <SessionTab annotationsToCreate={annotationsToCreate} />
+                                            ),
+                                            [`${ViewType.FUNNELS}`]: (
+                                                <FunnelTab annotationsToCreate={annotationsToCreate} newUI={newUI} />
+                                            ),
+                                            [`${ViewType.RETENTION}`]: (
+                                                <RetentionTab annotationsToCreate={annotationsToCreate} />
+                                            ),
+                                            [`${ViewType.PATHS}`]: (
+                                                <PathTab annotationsToCreate={annotationsToCreate} />
+                                            ),
                                         }[activeView]
                                     }
                                 </div>