diff --git a/.github/workflows/ci-e2e.yml b/.github/workflows/ci-e2e.yml index f97a6f4bb85cc..ca6ad9d5dcfa0 100644 --- a/.github/workflows/ci-e2e.yml +++ b/.github/workflows/ci-e2e.yml @@ -171,7 +171,7 @@ jobs: if: needs.changes.outputs.shouldTriggerCypress == 'true' uses: depot/pull-action@v1 with: - build-id: ${{ needs.container.outputs.build-id }} # TODO: Use unit-build-id when the Unit image works + build-id: ${{ needs.container.outputs.unit-build-id }} tags: ${{ needs.container.outputs.tag }} - name: Write .env # This step intentionally has no if, so that GH always considers the action as having run @@ -196,6 +196,7 @@ jobs: OBJECT_STORAGE_ACCESS_KEY_ID=object_storage_root_user OBJECT_STORAGE_SECRET_ACCESS_KEY=object_storage_root_password GITHUB_ACTION_RUN_URL="${{ github.server_url }}/${{ github.repository }}/actions/runs/${{ github.run_id }}" + CELERY_METRICS_PORT=8999 EOT - name: Start PostHog diff --git a/frontend/__snapshots__/exporter-exporter--funnel-time-to-convert-insight.png b/frontend/__snapshots__/exporter-exporter--funnel-time-to-convert-insight.png index e97ac272bc3b5..132f11783c137 100644 Binary files a/frontend/__snapshots__/exporter-exporter--funnel-time-to-convert-insight.png and b/frontend/__snapshots__/exporter-exporter--funnel-time-to-convert-insight.png differ diff --git a/frontend/__snapshots__/posthog-3000-navigation--navigation-base.png b/frontend/__snapshots__/posthog-3000-navigation--navigation-base.png index bbe83bd44e310..f481f17b769a5 100644 Binary files a/frontend/__snapshots__/posthog-3000-navigation--navigation-base.png and b/frontend/__snapshots__/posthog-3000-navigation--navigation-base.png differ diff --git a/frontend/__snapshots__/scenes-app-apps--installed.png b/frontend/__snapshots__/scenes-app-apps--installed.png index ca7fff9f98e95..31d7de616c9c1 100644 Binary files a/frontend/__snapshots__/scenes-app-apps--installed.png and b/frontend/__snapshots__/scenes-app-apps--installed.png differ diff --git a/frontend/__snapshots__/scenes-app-surveys--new-survey-targeting-section.png b/frontend/__snapshots__/scenes-app-surveys--new-survey-targeting-section.png index 5fe3b4623c231..99f004ff819fd 100644 Binary files a/frontend/__snapshots__/scenes-app-surveys--new-survey-targeting-section.png and b/frontend/__snapshots__/scenes-app-surveys--new-survey-targeting-section.png differ diff --git a/frontend/src/exporter/Exporter.scss b/frontend/src/exporter/Exporter.scss index 0493c0f1eeb17..ff33d1000546f 100644 --- a/frontend/src/exporter/Exporter.scss +++ b/frontend/src/exporter/Exporter.scss @@ -1,5 +1,11 @@ @import '../styles/mixins'; +body.ExporterBody { + &.posthog-3000 { + overflow: initial; + } +} + .Exporter { display: flex; flex-direction: column; diff --git a/frontend/src/exporter/Exporter.tsx b/frontend/src/exporter/Exporter.tsx index 0ba873c570fe1..dbc43c689b9fe 100644 --- a/frontend/src/exporter/Exporter.tsx +++ b/frontend/src/exporter/Exporter.tsx @@ -3,6 +3,7 @@ import './Exporter.scss' import clsx from 'clsx' import { useValues } from 'kea' +import { use3000Body } from 'lib/hooks/use3000Body' import { useResizeObserver } from 'lib/hooks/useResizeObserver' import { Link } from 'lib/lemon-ui/Link' import { useEffect } from 'react' @@ -33,6 +34,8 @@ export function Exporter(props: ExportedData): JSX.Element { window.parent?.postMessage({ event: 'posthog:dimensions', name: window.name, height, width }, '*') }, [height, width]) + use3000Body() + return (
+ - - - - {% include "head.html" %} - {% if add_og_tags %} - - - - - - - - {% endif %} - - - -
- + + + + {% include "head.html" %} {% if add_og_tags %} + + + + + + + + {% endif %} + + + +
+ diff --git a/frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.tsx b/frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.tsx index 5899f59b82d47..0a2667b2fd14a 100644 --- a/frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.tsx +++ b/frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.tsx @@ -4,6 +4,7 @@ import { useActions, useAsyncActions, useValues } from 'kea' import { SpinnerOverlay } from 'lib/lemon-ui/Spinner' import { useLayoutEffect, useState } from 'react' +import { sidePanelStateLogic } from '../navigation-3000/sidepanel/sidePanelStateLogic' import { EnrichedEarlyAccessFeature, featurePreviewsLogic } from './featurePreviewsLogic' export function FeaturePreviewsModal({ @@ -11,13 +12,17 @@ export function FeaturePreviewsModal({ }: { /** @deprecated This is only for Storybook. */ inline?: boolean -}): JSX.Element { - const { featurePreviewsModalVisible, earlyAccessFeatures, rawEarlyAccessFeaturesLoading } = - useValues(featurePreviewsLogic) +}): JSX.Element | null { + const { featurePreviewsModalVisible } = useValues(featurePreviewsLogic) const { hideFeaturePreviewsModal, loadEarlyAccessFeatures } = useActions(featurePreviewsLogic) + const { sidePanelAvailable } = useValues(sidePanelStateLogic) useLayoutEffect(() => loadEarlyAccessFeatures(), []) + if (sidePanelAvailable) { + return null + } + return ( -
- {earlyAccessFeatures.map((feature, i) => { - if (!feature.flagKey) { - return false - } - return ( -
- {i > 0 && } - -
- ) - })} - {rawEarlyAccessFeaturesLoading ? ( - - ) : earlyAccessFeatures.length === 0 ? ( - - No feature previews currently available. -
- Check back later! - - ) : null} -
+ ) } +export function FeaturePreviews(): JSX.Element { + const { earlyAccessFeatures, rawEarlyAccessFeaturesLoading } = useValues(featurePreviewsLogic) + const { loadEarlyAccessFeatures } = useActions(featurePreviewsLogic) + + useLayoutEffect(() => loadEarlyAccessFeatures(), []) + + return ( +
+ {earlyAccessFeatures.map((feature, i) => { + if (!feature.flagKey) { + return false + } + return ( +
+ {i > 0 && } + +
+ ) + })} + {rawEarlyAccessFeaturesLoading ? ( + + ) : earlyAccessFeatures.length === 0 ? ( + + No feature previews currently available. +
+ Check back later! + + ) : null} +
+ ) +} + function FeaturePreview({ feature }: { feature: EnrichedEarlyAccessFeature }): JSX.Element { const { activeFeedbackFlagKey, activeFeedbackFlagKeyLoading } = useValues(featurePreviewsLogic) const { beginEarlyAccessFeatureFeedback, cancelEarlyAccessFeatureFeedback, updateEarlyAccessFeatureEnrollment } = @@ -80,18 +96,9 @@ function FeaturePreview({ feature }: { feature: EnrichedEarlyAccessFeature }): J

{description || No description.}

- { - if (!isFeedbackActive) { - beginEarlyAccessFeatureFeedback(flagKey) - } else { - cancelEarlyAccessFeatureFeedback() - setFeedback('') - } - }} - > - {!isFeedbackActive ? 'Give' : 'Cancel'} feedback - + {!isFeedbackActive ? ( + beginEarlyAccessFeatureFeedback(flagKey)}>Give feedback + ) : null} {documentationUrl && ( <> {' • '} @@ -119,19 +126,31 @@ function FeaturePreview({ feature }: { feature: EnrichedEarlyAccessFeature }): J } }} /> - { - void submitEarlyAccessFeatureFeedback(feedback).then(() => { +
+ { + cancelEarlyAccessFeatureFeedback() setFeedback('') - }) - }} - loading={activeFeedbackFlagKeyLoading} - fullWidth - center - > - Submit feedback - + }} + > + Cancel + + + { + void submitEarlyAccessFeatureFeedback(feedback).then(() => { + setFeedback('') + }) + }} + loading={activeFeedbackFlagKeyLoading} + className="flex-1" + center + > + Submit feedback + +
)} diff --git a/frontend/src/layout/navigation-3000/components/Navbar.tsx b/frontend/src/layout/navigation-3000/components/Navbar.tsx index c356f209e5684..d74ba8e029fab 100644 --- a/frontend/src/layout/navigation-3000/components/Navbar.tsx +++ b/frontend/src/layout/navigation-3000/components/Navbar.tsx @@ -1,4 +1,4 @@ -import { IconAsterisk, IconDay, IconGear, IconNight, IconSearch } from '@posthog/icons' +import { IconAsterisk, IconDay, IconGear, IconNight, IconSearch, IconToolbar } from '@posthog/icons' import { LemonBadge } from '@posthog/lemon-ui' import clsx from 'clsx' import { useActions, useValues } from 'kea' @@ -93,6 +93,12 @@ export function Navbar(): JSX.Element { onClick={toggleSearchBar} keyboardShortcut={{ command: true, k: true }} /> + } + identifier={Scene.ToolbarLaunch} + title="Toolbar" + to={urls.toolbarLaunch()} + /> } identifier="theme-button" @@ -113,7 +119,7 @@ export function Navbar(): JSX.Element { } identifier={Scene.Settings} - title="Project settings" + title="Settings" to={urls.settings('project')} /> diff --git a/frontend/src/layout/navigation-3000/navigationLogic.tsx b/frontend/src/layout/navigation-3000/navigationLogic.tsx index 859da6313baf7..2b1579e7f2816 100644 --- a/frontend/src/layout/navigation-3000/navigationLogic.tsx +++ b/frontend/src/layout/navigation-3000/navigationLogic.tsx @@ -1,8 +1,8 @@ import { - IconApps, IconChat, IconDashboard, IconDatabase, + IconDecisionTree, IconGraph, IconHome, IconLive, @@ -14,7 +14,6 @@ import { IconServer, IconTestTube, IconToggle, - IconToolbar, } from '@posthog/icons' import { lemonToast } from '@posthog/lemon-ui' import { captureException } from '@sentry/react' @@ -37,7 +36,6 @@ import { experimentsSidebarLogic } from './sidebars/experiments' import { featureFlagsSidebarLogic } from './sidebars/featureFlags' import { insightsSidebarLogic } from './sidebars/insights' import { personsAndGroupsSidebarLogic } from './sidebars/personsAndGroups' -import { toolbarSidebarLogic } from './sidebars/toolbar' import { BasicListItem, ExtendedListItem, NavbarItem, SidebarNavbarItem } from './types' /** Multi-segment item keys are joined using this separator for easy comparisons. */ @@ -376,26 +374,12 @@ export const navigation3000Logic = kea([ tag: 'beta' as const, } : null, - { - identifier: Scene.DataWarehouse, - label: 'Data warehouse', - icon: , - to: urls.dataWarehouse(), - featureFlag: FEATURE_FLAGS.DATA_WAREHOUSE, - tag: 'beta' as const, - }, { identifier: Scene.Replay, label: 'Session replay', icon: , to: urls.replay(), }, - { - identifier: Scene.Surveys, - label: 'Surveys', - icon: , - to: urls.surveys(), - }, { identifier: Scene.FeatureFlags, label: 'Feature flags', @@ -410,28 +394,33 @@ export const navigation3000Logic = kea([ logic: isUsingSidebar ? experimentsSidebarLogic : undefined, to: isUsingSidebar ? undefined : urls.experiments(), }, + { + identifier: Scene.Surveys, + label: 'Surveys', + icon: , + to: urls.surveys(), + }, { identifier: Scene.EarlyAccessFeatures, label: 'Early access features', icon: , to: urls.earlyAccessFeatures(), }, - ].filter(isNotNil), - [ { - identifier: Scene.Apps, - label: 'Apps', - icon: , - to: urls.projectApps(), + identifier: Scene.DataWarehouse, + label: 'Data warehouse', + icon: , + to: urls.dataWarehouse(), + featureFlag: FEATURE_FLAGS.DATA_WAREHOUSE, + tag: 'beta' as const, }, { - identifier: Scene.ToolbarLaunch, - label: 'Toolbar', - icon: , - logic: isUsingSidebar ? toolbarSidebarLogic : undefined, - to: isUsingSidebar ? undefined : urls.toolbarLaunch(), + identifier: Scene.Apps, + label: 'Data pipeline', + icon: , + to: urls.projectApps(), }, - ], + ].filter(isNotNil), ] }, ], diff --git a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx index 55542da65ce43..5831d4a32aee7 100644 --- a/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx +++ b/frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx @@ -1,6 +1,6 @@ import './SidePanel.scss' -import { IconGear, IconInfo, IconNotebook, IconSupport } from '@posthog/icons' +import { IconFeatures, IconGear, IconInfo, IconNotebook, IconSupport } from '@posthog/icons' import { LemonButton } from '@posthog/lemon-ui' import clsx from 'clsx' import { useActions, useValues } from 'kea' @@ -13,6 +13,7 @@ import { SidePanelTab } from '~/types' import { SidePanelActivation, SidePanelActivationIcon } from './panels/SidePanelActivation' import { SidePanelDocs } from './panels/SidePanelDocs' +import { SidePanelFeaturePreviews } from './panels/SidePanelFeaturePreviews' import { SidePanelSettings } from './panels/SidePanelSettings' import { SidePanelSupport } from './panels/SidePanelSupport' import { sidePanelLogic } from './sidePanelLogic' @@ -45,6 +46,11 @@ export const SidePanelTabs: Record diff --git a/frontend/src/layout/navigation-3000/sidepanel/panels/SidePanelDocs.tsx b/frontend/src/layout/navigation-3000/sidepanel/panels/SidePanelDocs.tsx index edb6723ca71d4..97996e828271f 100644 --- a/frontend/src/layout/navigation-3000/sidepanel/panels/SidePanelDocs.tsx +++ b/frontend/src/layout/navigation-3000/sidepanel/panels/SidePanelDocs.tsx @@ -145,7 +145,7 @@ export const SidePanelDocs = (): JSX.Element => { Open in new tab -
+