Merge branch 'master' into hogql-test-account-filters

.github/actions/run-backend-tests/action.yml

@@ -145,7 +145,6 @@ runs:
           run: echo "PYTEST_ARGS=--snapshot-update" >> $GITHUB_ENV # We can only update snapshots within the PostHog org
 
         # Tests
-
         - name: Run FOSS tests
           if: ${{ inputs.segment == 'FOSS' }}
           env:

.github/workflows/container-images-cd.yml

@@ -107,7 +107,7 @@ jobs:
                   message: |
                       {
                         "image_tag": "${{ steps.build.outputs.digest }}"
-                      }                      
+                      }
 
             - name: Check for changes in plugins directory
               id: check_changes_plugins

ee/clickhouse/views/groups.py

@@ -12,14 +12,10 @@
 from ee.clickhouse.queries.related_actors_query import RelatedActorsQuery
 from posthog.api.documentation import extend_schema
 from posthog.api.routing import TeamAndOrgViewSetMixin
-from posthog.auth import SharingAccessTokenAuthentication
 from posthog.clickhouse.kafka_engine import trim_quotes_expr
 from posthog.client import sync_execute
 from posthog.models.group import Group
 from posthog.models.group_type_mapping import GroupTypeMapping
-from posthog.permissions import (
-    SharingTokenPermission,
-)
 
 
 class GroupTypeSerializer(serializers.ModelSerializer):
@@ -35,14 +31,6 @@ class ClickhouseGroupsTypesView(TeamAndOrgViewSetMixin, mixins.ListModelMixin, v
     pagination_class = None
     sharing_enabled_actions = ["list"]
 
-    def get_permissions(self):
-        if isinstance(self.request.successful_authenticator, SharingAccessTokenAuthentication):
-            return [SharingTokenPermission()]
-        return super().get_permissions()
-
-    def get_authenticators(self):
-        return [SharingAccessTokenAuthentication(), *super().get_authenticators()]
-
     @action(detail=False, methods=["PATCH"], name="Update group types metadata")
     def update_metadata(self, request: request.Request, *args, **kwargs):
         for row in cast(List[Dict], request.data):

ee/clickhouse/views/test/test_clickhouse_groups.py

@@ -434,6 +434,26 @@ def test_cannot_list_group_types_of_another_org(self):
             self.permission_denied_response("You don't have access to the project."),
         )
 
+    def test_cannot_list_group_types_of_another_org_with_sharing_token(self):
+        sharing_configuration = SharingConfiguration.objects.create(team=self.team, enabled=True)
+
+        other_org = Organization.objects.create(name="other org")
+        other_team = Team.objects.create(organization=other_org, name="other project")
+
+        GroupTypeMapping.objects.create(team=other_team, group_type="organization", group_type_index=0)
+        GroupTypeMapping.objects.create(team=other_team, group_type="playlist", group_type_index=1)
+        GroupTypeMapping.objects.create(team=other_team, group_type="another", group_type_index=2)
+
+        response = self.client.get(
+            f"/api/projects/{other_team.id}/groups_types/?sharing_access_token={sharing_configuration.access_token}"
+        )
+
+        self.assertEqual(response.status_code, 403, response.json())
+        self.assertEqual(
+            response.json(),
+            self.permission_denied_response("You do not have permission to perform this action."),
+        )
+
     def test_can_list_group_types_of_another_org_with_sharing_access_token(self):
         other_org = Organization.objects.create(name="other org")
         other_team = Team.objects.create(organization=other_org, name="other project")

frontend/src/exporter/Exporter.scss

@@ -1,9 +1,7 @@
 @import '../styles/mixins';
 
 body.ExporterBody {
-    &.posthog-3000 {
-        overflow: initial;
-    }
+    overflow: initial;
 }
 
 .Exporter {

frontend/src/initKea.ts

@@ -114,7 +114,8 @@ export function initKea({ routerHistory, routerLocation, beforePlugins }: InitKe
         waitForPlugin,
     ]
 
-    if (window.JS_KEA_VERBOSE_LOGGING) {
+    // To enable logging, run localStorage.setItem("debug", true) in the console
+    if (window.JS_KEA_VERBOSE_LOGGING || ('localStorage' in window && window.localStorage.getItem('debug'))) {
         plugins.push(loggerPlugin)
     }
 

frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.stories.tsx → frontend/src/layout/FeaturePreviews/FeaturePreviews.stories.tsx

@@ -4,8 +4,8 @@ import { EarlyAccessFeature } from 'posthog-js'
 
 import { setFeatureFlags, useStorybookMocks } from '~/mocks/browser'
 
+import { FeaturePreviews } from './FeaturePreviews'
 import { CONSTRAINED_PREVIEWS } from './featurePreviewsLogic'
-import { FeaturePreviewsModal as FeaturePreviewsModalComponent } from './FeaturePreviewsModal'
 
 interface StoryProps {
     earlyAccessFeatures: EarlyAccessFeature[]
@@ -14,7 +14,7 @@ interface StoryProps {
 
 type Story = StoryObj<(props: StoryProps) => JSX.Element>
 const meta: Meta<(props: StoryProps) => JSX.Element> = {
-    title: 'Layout/Feature Previews Modal',
+    title: 'Layout/Feature Previews',
     parameters: {
         layout: 'fullscreen',
         viewMode: 'story',
@@ -33,8 +33,8 @@ const Template: StoryFn<StoryProps> = ({ earlyAccessFeatures, enabledFeatureFlag
     setFeatureFlags(enabledFeatureFlags)
 
     return (
-        <div className="bg-default p-2">
-            <FeaturePreviewsModalComponent inline />
+        <div className="w-160 p-4 border rounded mx-auto my-2">
+            <FeaturePreviews />
         </div>
     )
 }

frontend/src/layout/FeaturePreviews/FeaturePreviewsModal.tsx → frontend/src/layout/FeaturePreviews/FeaturePreviews.tsx

@@ -1,42 +1,11 @@
-import { LemonButton, LemonDivider, LemonModal, LemonSwitch, LemonTextArea, Link } from '@posthog/lemon-ui'
+import { LemonButton, LemonDivider, LemonSwitch, LemonTextArea, Link } from '@posthog/lemon-ui'
 import clsx from 'clsx'
 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({
-    inline,
-}: {
-    /** @deprecated This is only for Storybook. */
-    inline?: boolean
-}): JSX.Element | null {
-    const { featurePreviewsModalVisible } = useValues(featurePreviewsLogic)
-    const { hideFeaturePreviewsModal, loadEarlyAccessFeatures } = useActions(featurePreviewsLogic)
-    const { sidePanelAvailable } = useValues(sidePanelStateLogic)
-
-    useLayoutEffect(() => loadEarlyAccessFeatures(), [])
-
-    if (sidePanelAvailable) {
-        return null
-    }
-
-    return (
-        <LemonModal
-            isOpen={inline || featurePreviewsModalVisible}
-            onClose={hideFeaturePreviewsModal}
-            title="Feature previews"
-            description="Get early access to these upcoming features. Let us know what you think!"
-            width={528}
-            inline={inline}
-        >
-            <FeaturePreviews />
-        </LemonModal>
-    )
-}
-
 export function FeaturePreviews(): JSX.Element {
     const { earlyAccessFeatures, rawEarlyAccessFeaturesLoading } = useValues(featurePreviewsLogic)
     const { loadEarlyAccessFeatures } = useActions(featurePreviewsLogic)

frontend/src/layout/FeaturePreviews/featurePreviewsLogic.tsx

@@ -1,6 +1,5 @@
 import { actions, connect, kea, listeners, path, reducers, selectors } from 'kea'
 import { loaders } from 'kea-loaders'
-import { actionToUrl, router, urlToAction } from 'kea-router'
 import { supportLogic } from 'lib/components/Support/supportLogic'
 import { FeatureFlagKey } from 'lib/constants'
 import { featureFlagLogic } from 'lib/logic/featureFlagLogic'
@@ -24,8 +23,6 @@ export const featurePreviewsLogic = kea<featurePreviewsLogicType>([
         actions: [supportLogic, ['submitZendeskTicket']],
     }),
     actions({
-        showFeaturePreviewsModal: true,
-        hideFeaturePreviewsModal: true,
         updateEarlyAccessFeatureEnrollment: (flagKey: string, enabled: boolean) => ({ flagKey, enabled }),
         beginEarlyAccessFeatureFeedback: (flagKey: string) => ({ flagKey }),
         cancelEarlyAccessFeatureFeedback: true,
@@ -67,17 +64,9 @@ export const featurePreviewsLogic = kea<featurePreviewsLogicType>([
         ],
     })),
     reducers({
-        featurePreviewsModalVisible: [
-            false,
-            {
-                showFeaturePreviewsModal: () => true,
-                hideFeaturePreviewsModal: () => false,
-            },
-        ],
         activeFeedbackFlagKey: {
             beginEarlyAccessFeatureFeedback: (_, { flagKey }) => flagKey,
             cancelEarlyAccessFeatureFeedback: () => null,
-            hideFeaturePreviewsModal: () => null,
         },
     }),
     listeners(() => ({
@@ -111,25 +100,4 @@ export const featurePreviewsLogic = kea<featurePreviewsLogicType>([
                     }),
         ],
     }),
-    urlToAction(({ actions }) => ({
-        '*': (_, _search, hashParams) => {
-            if (hashParams['panel'] === 'feature-previews') {
-                actions.showFeaturePreviewsModal()
-            }
-        },
-    })),
-    actionToUrl(() => {
-        return {
-            showFeaturePreviewsModal: () => {
-                const hashParams = router.values.hashParams
-                hashParams['panel'] = 'feature-previews'
-                return [router.values.location.pathname, router.values.searchParams, hashParams]
-            },
-            hideFeaturePreviewsModal: () => {
-                const hashParams = router.values.hashParams
-                delete hashParams['panel']
-                return [router.values.location.pathname, router.values.searchParams, hashParams]
-            },
-        }
-    }),
 ])

frontend/src/layout/GlobalModals.tsx

@@ -12,7 +12,6 @@ import { InviteModal } from 'scenes/settings/organization/InviteModal'
 import { UpgradeModal } from 'scenes/UpgradeModal'
 import { userLogic } from 'scenes/userLogic'
 
-import { FeaturePreviewsModal } from './FeaturePreviews'
 import type { globalModalsLogicType } from './GlobalModalsType'
 
 export const globalModalsLogic = kea<globalModalsLogicType>([
@@ -53,7 +52,6 @@ export function GlobalModals(): JSX.Element {
             <InviteModal isOpen={isInviteModalShown} onClose={hideInviteModal} />
             <CreateOrganizationModal isVisible={isCreateOrganizationModalShown} onClose={hideCreateOrganizationModal} />
             <CreateProjectModal isVisible={isCreateProjectModalShown} onClose={hideCreateProjectModal} />
-            <FeaturePreviewsModal />
             <UpgradeModal />
 
             {user && user.organization?.enforce_2fa && !user.is_2fa_enabled && (

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

@@ -62,7 +62,7 @@ export function Navigation({
                     {children}
                 </div>
             </main>
-            {!mobileLayout && <SidePanel />}
+            <SidePanel />
             <CommandBar />
         </div>
     )

frontend/src/layout/navigation-3000/components/KeyboardShortcut.scss

@@ -8,21 +8,17 @@
     justify-content: center;
     min-width: 1.25rem;
     height: 1.25rem;
-    padding: 0 0.1875rem;
+    padding: 0.125rem 0.25rem;
+    font-size: 0.75rem;
     color: var(--default);
     text-transform: capitalize;
     user-select: none;
     background: var(--accent-3000);
+    border-color: var(--secondary-3000-button-border-hover);
     border-width: 1px;
+    border-bottom-width: 2px;
     border-radius: 0.25rem;
 
-    .posthog-3000 & {
-        padding: 0.125rem 0.25rem;
-        font-size: 0.75rem;
-        border-color: var(--secondary-3000-button-border-hover);
-        border-bottom-width: 2px;
-    }
-
     .KeyboardShortcut--muted > & {
         color: var(--muted);
         background: none;

frontend/src/layout/navigation-3000/sidepanel/SidePanel.tsx

@@ -1,7 +1,7 @@
 import './SidePanel.scss'
 
 import { IconEllipsis, IconFeatures, IconGear, IconInfo, IconNotebook, IconSupport } from '@posthog/icons'
-import { LemonButton, LemonMenu, LemonMenuItems } from '@posthog/lemon-ui'
+import { LemonButton, LemonMenu, LemonMenuItems, LemonModal } from '@posthog/lemon-ui'
 import clsx from 'clsx'
 import { useActions, useValues } from 'kea'
 import { Resizer } from 'lib/components/Resizer/Resizer'
@@ -22,11 +22,15 @@ import { SidePanelSupport } from './panels/SidePanelSupport'
 import { sidePanelLogic } from './sidePanelLogic'
 import { sidePanelStateLogic } from './sidePanelStateLogic'
 
-export const SIDE_PANEL_TABS: Record<SidePanelTab, { label: string; Icon: any; Content: any }> = {
+export const SIDE_PANEL_TABS: Record<
+    SidePanelTab,
+    { label: string; Icon: any; Content: any; noModalSupport?: boolean }
+> = {
     [SidePanelTab.Notebooks]: {
         label: 'Notebooks',
         Icon: IconNotebook,
         Content: NotebookPanel,
+        noModalSupport: true,
     },
     [SidePanelTab.Support]: {
         label: 'Support',
@@ -37,6 +41,7 @@ export const SIDE_PANEL_TABS: Record<SidePanelTab, { label: string; Icon: any; C
         label: 'Docs',
         Icon: IconInfo,
         Content: SidePanelDocs,
+        noModalSupport: true,
     },
 
     [SidePanelTab.Activation]: {
@@ -70,14 +75,15 @@ export const SIDE_PANEL_TABS: Record<SidePanelTab, { label: string; Icon: any; C
         label: 'System status',
         Icon: SidePanelStatusIcon,
         Content: SidePanelStatus,
+        noModalSupport: true,
     },
 }
 
 const DEFAULT_WIDTH = 512
 
 export function SidePanel(): JSX.Element | null {
     const { visibleTabs, extraTabs } = useValues(sidePanelLogic)
-    const { selectedTab, sidePanelOpen } = useValues(sidePanelStateLogic)
+    const { selectedTab, sidePanelOpen, modalMode } = useValues(sidePanelStateLogic)
     const { openSidePanel, closeSidePanel, setSidePanelAvailable } = useActions(sidePanelStateLogic)
 
     const activeTab = sidePanelOpen && selectedTab
@@ -129,6 +135,21 @@ export function SidePanel(): JSX.Element | null {
           ]
         : undefined
 
+    if (modalMode) {
+        const supportsModal = activeTab ? !SIDE_PANEL_TABS[activeTab]?.noModalSupport : true
+        return (
+            <LemonModal
+                simple
+                isOpen={!!PanelConent && supportsModal}
+                onClose={closeSidePanel}
+                hideCloseButton
+                width="40rem"
+            >
+                {PanelConent ? <PanelConent /> : null}
+            </LemonModal>
+        )
+    }
+
     return (
         <div
             className={clsx(
@@ -156,6 +177,7 @@ export function SidePanel(): JSX.Element | null {
                                         activeTab === tab ? closeSidePanel() : openSidePanel(tab as SidePanelTab)
                                     }
                                     data-attr={`sidepanel-tab-${tab}`}
+                                    data-ph-capture-attribute-state-before-click={activeTab === tab ? 'open' : 'closed'}
                                     active={activeTab === tab}
                                     type="secondary"
                                     status="alt"